Browse Source

fix: hide context menu on cell mousedown

Signed-off-by: mertmit <mertmit99@gmail.com>
pull/5918/head
mertmit 2 years ago
parent
commit
cecb30743a
  1. 9
      packages/nc-gui/components/smartsheet/Grid.vue
  2. 4
      packages/nc-gui/composables/useMultiSelect/index.ts

9
packages/nc-gui/components/smartsheet/Grid.vue

@ -97,6 +97,7 @@ const contextMenu = computed({
} }
}, },
}) })
const contextMenuClosing = ref(false)
const routeQuery = $computed(() => route.query as Record<string, string>) const routeQuery = $computed(() => route.query as Record<string, string>)
const contextMenuTarget = ref<{ row: number; col: number } | null>(null) const contextMenuTarget = ref<{ row: number; col: number } | null>(null)
@ -209,6 +210,7 @@ const {
data, data,
$$(editEnabled), $$(editEnabled),
isPkAvail, isPkAvail,
contextMenu,
clearCell, clearCell,
clearSelectedRangeOfCells, clearSelectedRangeOfCells,
makeEditable, makeEditable,
@ -479,7 +481,10 @@ defineExpose({
// reset context menu target on hide // reset context menu target on hide
watch(contextMenu, () => { watch(contextMenu, () => {
if (!contextMenu.value) { if (!contextMenu.value) {
contextMenuClosing.value = true
contextMenuTarget.value = null contextMenuTarget.value = null
} else {
contextMenuClosing.value = false
} }
}) })
@ -1115,7 +1120,7 @@ function addEmptyRow(row?: number) {
</div> </div>
</a-menu-item> </a-menu-item>
<a-menu-item v-if="data.some((r) => r.rowMeta.selected)" @click="deleteSelectedRows"> <a-menu-item v-if="!contextMenuClosing && data.some((r) => r.rowMeta.selected)" @click="deleteSelectedRows">
<div v-e="['a:row:delete-bulk']" class="nc-project-menu-item"> <div v-e="['a:row:delete-bulk']" class="nc-project-menu-item">
<!-- Delete Selected Rows --> <!-- Delete Selected Rows -->
{{ $t('activity.deleteSelectedRow') }} {{ $t('activity.deleteSelectedRow') }}
@ -1136,7 +1141,7 @@ function addEmptyRow(row?: number) {
</a-menu-item> </a-menu-item>
<!-- Clear cell --> <!-- Clear cell -->
<a-menu-item v-else @click="clearSelectedRangeOfCells()"> <a-menu-item v-else-if="contextMenuTarget" @click="clearSelectedRangeOfCells()">
<div v-e="['a:row:clear-range']" class="nc-project-menu-item">Clear Cells</div> <div v-e="['a:row:clear-range']" class="nc-project-menu-item">Clear Cells</div>
</a-menu-item> </a-menu-item>

4
packages/nc-gui/composables/useMultiSelect/index.ts

@ -1,4 +1,5 @@
import dayjs from 'dayjs' import dayjs from 'dayjs'
import type { Ref } from 'vue'
import type { MaybeRef } from '@vueuse/core' import type { MaybeRef } from '@vueuse/core'
import type { ColumnType, LinkToAnotherRecordType, TableType } from 'nocodb-sdk' import type { ColumnType, LinkToAnotherRecordType, TableType } from 'nocodb-sdk'
import { RelationTypes, UITypes, isSystemColumn, isVirtualCol } from 'nocodb-sdk' import { RelationTypes, UITypes, isSystemColumn, isVirtualCol } from 'nocodb-sdk'
@ -39,6 +40,7 @@ export function useMultiSelect(
data: MaybeRef<Row[]>, data: MaybeRef<Row[]>,
_editEnabled: MaybeRef<boolean>, _editEnabled: MaybeRef<boolean>,
isPkAvail: MaybeRef<boolean | undefined>, isPkAvail: MaybeRef<boolean | undefined>,
contextMenu: Ref<boolean>,
clearCell: Function, clearCell: Function,
clearSelectedRangeOfCells: Function, clearSelectedRangeOfCells: Function,
makeEditable: Function, makeEditable: Function,
@ -245,6 +247,8 @@ export function useMultiSelect(
isMouseDown = true isMouseDown = true
contextMenu.value = false
// if shift key is pressed, don't restart the selection // if shift key is pressed, don't restart the selection
if (event.shiftKey) return if (event.shiftKey) return

Loading…
Cancel
Save