From efdf843d2fb44f721d24f6b5db96aa99de16149a Mon Sep 17 00:00:00 2001 From: t8y2 <1156263951@qq.com> Date: Mon, 18 May 2026 11:09:00 +0800 Subject: [PATCH] fix(grid): toggle context transpose view --- apps/desktop/src/components/grid/DataGrid.vue | 25 ++++++++++++------- apps/desktop/src/lib/dataGridTranspose.ts | 10 ++++++++ packages/app-tests/dataGridTranspose.test.ts | 18 +++++++++++++ 3 files changed, 44 insertions(+), 9 deletions(-) diff --git a/apps/desktop/src/components/grid/DataGrid.vue b/apps/desktop/src/components/grid/DataGrid.vue index 05cb6a2db..ae1dd247c 100644 --- a/apps/desktop/src/components/grid/DataGrid.vue +++ b/apps/desktop/src/components/grid/DataGrid.vue @@ -83,8 +83,8 @@ import { import { formatGridSqlLiteral } from "@/lib/dataGridSql"; import { buildTransposeRows, + nextContextTransposeState, nextTransposeState, - transposeAnchorRowIndex, transposeFieldWidth, transposeScrollLeftForRecord, visibleTransposeRecordWindow, @@ -2029,14 +2029,21 @@ function openTranspose(rowIndex: number) { function openContextTranspose() { if (!contextCell.value) return; - openTranspose( - transposeAnchorRowIndex({ - requestedRowIndex: contextCell.value.rowIndex, - rowIds: displayItems.value.map((item) => item.id), - selectedRowIds: selectedRowIds.value, - selectedRange: selectedRange.value, - }), - ); + const next = nextContextTransposeState({ + showTranspose: showTranspose.value, + transposeRowIndex: transposeRowIndex.value, + requestedRowIndex: contextCell.value.rowIndex, + rowIds: displayItems.value.map((item) => item.id), + selectedRowIds: selectedRowIds.value, + selectedRange: selectedRange.value, + }); + transposeRowIndex.value = next.transposeRowIndex; + showTranspose.value = next.showTranspose; + if (next.showTranspose) { + showCellDetail.value = false; + nextTick(updateTransposeViewport); + if (next.transposeRowIndex !== null) scrollTransposeRecordIntoView(next.transposeRowIndex); + } } function toggleTranspose(rowIndex: number) { diff --git a/apps/desktop/src/lib/dataGridTranspose.ts b/apps/desktop/src/lib/dataGridTranspose.ts index 5c495220c..7df364518 100644 --- a/apps/desktop/src/lib/dataGridTranspose.ts +++ b/apps/desktop/src/lib/dataGridTranspose.ts @@ -53,6 +53,11 @@ export interface TransposeAnchorOptions { selectedRange: TransposeSelectionRange | null; } +export interface ContextTransposeStateOptions extends TransposeAnchorOptions { + showTranspose: boolean; + transposeRowIndex: number | null; +} + export interface TransposeFieldWidthOptions { minWidth?: number; maxWidth?: number; @@ -79,6 +84,11 @@ export function nextTransposeState( return { showTranspose: true, transposeRowIndex: requestedRowIndex }; } +export function nextContextTransposeState(options: ContextTransposeStateOptions): DataGridTransposeState { + const anchorRowIndex = transposeAnchorRowIndex(options); + return nextTransposeState(options.showTranspose, options.transposeRowIndex, anchorRowIndex); +} + export function buildTransposeRows(options: BuildTransposeRowsOptions): Array> { return options.columns.map((column, columnIndex) => { return { diff --git a/packages/app-tests/dataGridTranspose.test.ts b/packages/app-tests/dataGridTranspose.test.ts index 57115a115..bbec7161c 100644 --- a/packages/app-tests/dataGridTranspose.test.ts +++ b/packages/app-tests/dataGridTranspose.test.ts @@ -2,6 +2,7 @@ import { strict as assert } from "node:assert"; import test from "node:test"; import { buildTransposeRows, + nextContextTransposeState, nextTransposeState, transposeAnchorRowIndex, transposeFieldWidth, @@ -30,6 +31,23 @@ test("row number double click closes transpose for the same row", () => { }); }); +test("context menu transpose closes when invoked for the current anchor row", () => { + assert.deepEqual( + nextContextTransposeState({ + showTranspose: true, + transposeRowIndex: 2, + requestedRowIndex: 3, + rowIds: [10, 11, 12, 13, 14], + selectedRowIds: new Set([12, 13]), + selectedRange: null, + }), + { + showTranspose: false, + transposeRowIndex: null, + }, + ); +}); + test("builds one virtualizable transpose row per field with all record values", () => { const rows = buildTransposeRows({ columns: ["id", "name", "notes"],