Browse Source

fix(nc-gui): single click now doesn't flag drag

pull/7611/head
DarkPhoenix2704 9 months ago
parent
commit
559eddae12
  1. 11
      packages/nc-gui/components/smartsheet/calendar/MonthView.vue
  2. 25
      packages/nc-gui/components/smartsheet/calendar/WeekView.vue

11
packages/nc-gui/components/smartsheet/calendar/MonthView.vue

@ -553,6 +553,7 @@ const dragStart = (event: MouseEvent, record: Row) => {
if (!isUIAllowed('dataEdit')) return if (!isUIAllowed('dataEdit')) return
if (resizeInProgress.value) return if (resizeInProgress.value) return
let target = event.target as HTMLElement let target = event.target as HTMLElement
isDragging.value = false
dragTimeout.value = setTimeout(() => { dragTimeout.value = setTimeout(() => {
while (!target.classList.contains('draggable-record')) { while (!target.classList.contains('draggable-record')) {
@ -577,6 +578,16 @@ const dragStart = (event: MouseEvent, record: Row) => {
document.addEventListener('mousemove', onDrag) document.addEventListener('mousemove', onDrag)
document.addEventListener('mouseup', stopDrag) document.addEventListener('mouseup', stopDrag)
}, 500) }, 500)
const onMouseUp = () => {
clearTimeout(dragTimeout.value)
document.removeEventListener('mouseup', onMouseUp)
if (!isDragging.value) {
emit('expand-record', record)
}
}
document.addEventListener('mouseup', onMouseUp)
} }
const dropEvent = (event: DragEvent) => { const dropEvent = (event: DragEvent) => {

25
packages/nc-gui/components/smartsheet/calendar/WeekView.vue

@ -2,6 +2,7 @@
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { UITypes } from 'nocodb-sdk' import { UITypes } from 'nocodb-sdk'
import type { Row } from '~/lib' import type { Row } from '~/lib'
import { ref } from '#imports'
const emits = defineEmits(['expand-record']) const emits = defineEmits(['expand-record'])
@ -211,6 +212,8 @@ const draggingId = ref<string | null>(null)
const resizeInProgress = ref(false) const resizeInProgress = ref(false)
const dragTimeout = ref(null)
const isDragging = ref(false) const isDragging = ref(false)
const dragRecord = ref<Row>() const dragRecord = ref<Row>()
@ -366,6 +369,8 @@ const onDrag = (event: MouseEvent) => {
const stopDrag = (event: MouseEvent) => { const stopDrag = (event: MouseEvent) => {
event.preventDefault() event.preventDefault()
clearTimeout(dragTimeout.value)
if (!isUIAllowed('dataEdit')) return if (!isUIAllowed('dataEdit')) return
if (!isDragging.value || !container.value || !dragRecord.value) return if (!isDragging.value || !container.value || !dragRecord.value) return
@ -441,7 +446,7 @@ const stopDrag = (event: MouseEvent) => {
if (dragElement.value) { if (dragElement.value) {
dragElement.value.style.boxShadow = 'none' dragElement.value.style.boxShadow = 'none'
dragElement.value.classList.remove('hide') dragElement.value.classList.remove('hide')
isDragging.value = false // isDragging.value = false
draggingId.value = null draggingId.value = null
dragElement.value = null dragElement.value = null
} }
@ -457,6 +462,10 @@ const dragStart = (event: MouseEvent, record: Row) => {
if (resizeInProgress.value) return if (resizeInProgress.value) return
let target = event.target as HTMLElement let target = event.target as HTMLElement
isDragging.value = false
dragTimeout.value = setTimeout(() => {
isDragging.value = true
while (!target.classList.contains('draggable-record')) { while (!target.classList.contains('draggable-record')) {
target = target.parentElement as HTMLElement target = target.parentElement as HTMLElement
} }
@ -478,11 +487,23 @@ const dragStart = (event: MouseEvent, record: Row) => {
document.addEventListener('mousemove', onDrag) document.addEventListener('mousemove', onDrag)
document.addEventListener('mouseup', stopDrag) document.addEventListener('mouseup', stopDrag)
}, 200)
const onMouseUp = () => {
clearTimeout(dragTimeout.value)
document.removeEventListener('mouseup', onMouseUp)
if (!isDragging.value) {
emit('expand-record', record)
}
}
document.addEventListener('mouseup', onMouseUp)
} }
const dropEvent = (event: DragEvent) => { const dropEvent = (event: DragEvent) => {
if (!isUIAllowed('dataEdit')) return if (!isUIAllowed('dataEdit')) return
event.preventDefault() event.preventDefault()
const data = event.dataTransfer?.getData('text/plain') const data = event.dataTransfer?.getData('text/plain')
if (data) { if (data) {
const { const {
@ -598,7 +619,7 @@ const dropEvent = (event: DragEvent) => {
: 'none', : 'none',
}" }"
class="absolute group draggable-record pointer-events-auto" class="absolute group draggable-record pointer-events-auto"
@mousedown.stop="dragStart($event, record)" @mousedown="dragStart($event, record)"
> >
<LazySmartsheetRow :row="record"> <LazySmartsheetRow :row="record">
<LazySmartsheetCalendarRecordCard <LazySmartsheetCalendarRecordCard

Loading…
Cancel
Save