From 60953e3382631f4be14f4baac1d13c97a3c34596 Mon Sep 17 00:00:00 2001 From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com> Date: Tue, 13 Feb 2024 06:22:10 +0000 Subject: [PATCH] refactor(nc-gui): table cell keyEventHandler function --- .../components/smartsheet/grid/Table.vue | 66 +++++++------------ 1 file changed, 23 insertions(+), 43 deletions(-) diff --git a/packages/nc-gui/components/smartsheet/grid/Table.vue b/packages/nc-gui/components/smartsheet/grid/Table.vue index 74efcc63c6..2885aab673 100644 --- a/packages/nc-gui/components/smartsheet/grid/Table.vue +++ b/packages/nc-gui/components/smartsheet/grid/Table.vue @@ -604,71 +604,36 @@ const { } else if (e.key === 'Tab') { if (e.shiftKey && activeCell.row === 0 && activeCell.col === 0 && !paginationDataRef.value?.isFirstPage) { e.preventDefault() - editEnabled.value = false - resetSelectedRange() - await changePage?.(paginationDataRef.value?.page! - 1) - await nextTick() - makeActive((paginationDataRef.value?.pageSize ?? 25) - 1, fields.value?.length - 1) - + await resetAndChangePage((paginationDataRef.value?.pageSize ?? 25) - 1, fields.value?.length - 1, -1) return true } else if (!e.shiftKey && activeCell.row === dataRef.value.length - 1 && activeCell.col === fields.value?.length - 1) { e.preventDefault() if (paginationDataRef.value?.isLastPage && isAddingEmptyRowAllowed.value) { addEmptyRow() - - resetSelectedRange() - - await nextTick() - makeActive(dataRef.value.length - 1, 0) - ;(document.querySelector('td.cell.active') as HTMLInputElement | HTMLTextAreaElement)?.scrollIntoView({ - behavior: 'smooth', - }) - + await resetAndChangePage(dataRef.value.length - 1, 0) return true } else if (!paginationDataRef.value?.isLastPage) { - await changePage?.(paginationDataRef.value?.page! + 1) - - await nextTick() - - makeActive(0, 0) + await resetAndChangePage(0, 0, 1) return true } } - } else if (!e.shiftKey && e.key === 'ArrowUp') { + } else if (!cmdOrCtrl && !e.shiftKey && e.key === 'ArrowUp') { if (activeCell.row === 0 && !paginationDataRef.value?.isFirstPage) { e.preventDefault() - - await changePage?.(paginationDataRef.value?.page! - 1) - - await nextTick() - - makeActive((paginationDataRef.value?.pageSize ?? 25) - 1, activeCell.col!) - + await resetAndChangePage((paginationDataRef.value?.pageSize ?? 25) - 1, activeCell.col!, -1) return true } - } else if (!e.shiftKey && e.key === 'ArrowDown') { + } else if (!cmdOrCtrl && !e.shiftKey && e.key === 'ArrowDown') { if (activeCell.row === dataRef.value.length - 1) { e.preventDefault() if (paginationDataRef.value?.isLastPage && isAddingEmptyRowAllowed.value) { addEmptyRow() - resetSelectedRange() - - makeActive(dataRef.value.length - 1, activeCell.col!) - - // await nextTick() - ;(document.querySelector('td.cell.active') as HTMLInputElement | HTMLTextAreaElement)?.scrollIntoView({ - behavior: 'smooth', - }) + await resetAndChangePage(dataRef.value.length - 1, activeCell.col!) return true } else if (!paginationDataRef.value?.isLastPage) { - await changePage?.(paginationDataRef.value?.page! + 1) - - await nextTick() - - makeActive(0, activeCell.col!) - + await resetAndChangePage(0, activeCell.col!, 1) return true } } @@ -1009,6 +974,21 @@ function scrollToCell(row?: number | null, col?: number | null) { } } +async function resetAndChangePage(row: number, col: number, pageChange?: number) { + clearSelectedRange() + + if (pageChange !== undefined) { + await changePage?.(paginationDataRef.value?.page! + pageChange) + await nextTick() + makeActive(row, col) + } else { + makeActive(row, col) + await nextTick() + } + + scrollToCell?.() +} + const saveOrUpdateRecords = async (args: { metaValue?: TableType; viewMetaValue?: ViewType; data?: any } = {}) => { let index = -1 for (const currentRow of args.data || dataRef.value) {