From 1cd3406e9469ae236f71740a061b3cea690fec88 Mon Sep 17 00:00:00 2001 From: zipg Date: Wed, 24 Jun 2026 14:08:58 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E9=A9=B1=E5=8A=A8=E7=AE=A1?= =?UTF-8?q?=E7=90=86=E4=B8=8E=E4=BE=A7=E8=BE=B9=E6=A0=8F=E5=B1=95=E5=BC=80?= =?UTF-8?q?=E7=9A=84=E5=89=8D=E5=8F=B0=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 修复标签页切换和侧边栏展开滚动 * chore: rerun ci --------- Co-authored-by: staff --- apps/desktop/src/App.vue | 1 + .../src/components/sidebar/ConnectionTree.vue | 37 +------------------ apps/desktop/src/composables/useFlatTree.ts | 22 ----------- packages/app-tests/useFlatTree.test.ts | 33 +---------------- 4 files changed, 4 insertions(+), 89 deletions(-) diff --git a/apps/desktop/src/App.vue b/apps/desktop/src/App.vue index 08b757ed94..c5634d3075 100644 --- a/apps/desktop/src/App.vue +++ b/apps/desktop/src/App.vue @@ -339,6 +339,7 @@ watch( ); } if (id) newQueryContextSource.value = "tab"; + if (id && showDriverStore.value) showDriverStore.value = false; selectedSql.value = ""; activeOutputView.value = "result"; if (id) queryStore.reloadEvictedTab(id); diff --git a/apps/desktop/src/components/sidebar/ConnectionTree.vue b/apps/desktop/src/components/sidebar/ConnectionTree.vue index 7bfe194acf..0ff6964718 100644 --- a/apps/desktop/src/components/sidebar/ConnectionTree.vue +++ b/apps/desktop/src/components/sidebar/ConnectionTree.vue @@ -13,7 +13,7 @@ import { usesTreeSchemaMode } from "@/lib/databaseFeatureSupport"; import { connectionUsesDatabaseObjectTreeMode, effectiveDatabaseTypeForConnection } from "@/lib/jdbcDialect"; import { activeTabSidebarTarget, findSidebarNodeForActiveTab, findSidebarNodeForTarget, findNodePathForTarget, scrollTopForSidebarNode, shouldScrollActiveSidebarSelection, type ActiveTabSidebarTarget } from "@/lib/sidebarActiveTabTarget"; import { findLoadedTableTargetForCandidate, queryContextTargetFromCandidate, queryCursorTableCandidate, type QueryCursorTableCandidate } from "@/lib/queryCursorTableTarget"; -import { SIDEBAR_TREE_ROW_HEIGHT, SIDEBAR_TREE_PRERENDER_COUNT, SIDEBAR_TREE_SCROLL_BUFFER, flattenTree, scrollTopForExpandedTreeNode, shouldAutoScrollExpandedTreeNode, shouldVirtualizeFlatTree, type FlatTreeNode } from "@/composables/useFlatTree"; +import { SIDEBAR_TREE_ROW_HEIGHT, SIDEBAR_TREE_PRERENDER_COUNT, SIDEBAR_TREE_SCROLL_BUFFER, flattenTree, shouldVirtualizeFlatTree, type FlatTreeNode } from "@/composables/useFlatTree"; import { sidebarTreeContextKey } from "@/lib/sidebarTreeContext"; import TreeItem from "./TreeItem.vue"; import { RecycleScroller } from "vue-virtual-scroller"; @@ -451,29 +451,6 @@ function onSearchToggle(node: TreeNode) { searchCollapsedIds.value = next; } -async function onNodeToggled(node: TreeNode, wasExpanded: boolean) { - if (wasExpanded || !node.isExpanded) return; - if (!shouldAutoScrollExpandedTreeNode(node.type)) return; - - await nextTick(); - - const expandedIndex = flatNodes.value.findIndex((item) => item.id === node.id); - const insertedRowCount = flattenTree([node]).length - 1; - const scroller = treeScrollerRef.value?.$el as HTMLElement | undefined; - if (!scroller || expandedIndex < 0 || insertedRowCount <= 0) return; - - const nextScrollTop = scrollTopForExpandedTreeNode({ - expandedIndex, - insertedRowCount, - currentScrollTop: scroller.scrollTop, - viewportHeight: scroller.clientHeight, - }); - - if (nextScrollTop !== scroller.scrollTop) { - scroller.scrollTop = nextScrollTop; - } -} - function currentTreeScroller(): HTMLElement | null { return ((useVirtualTree.value ? treeScrollerRef.value?.$el : plainTreeScrollerRef.value) as HTMLElement | undefined) ?? null; } @@ -630,16 +607,7 @@ defineExpose({ focusSearch, createNewGroup }); flow-mode >
@@ -651,7 +619,6 @@ defineExpose({ focusSearch, createNewGroup }); :drag-disabled="isFiltering" :pending-rename="pendingRenameGroupId === item.node.id" :highlighted="highlightedNodeId === item.id" - @node-toggled="onNodeToggled" @search-toggle="onSearchToggle" @rename-started="pendingRenameGroupId = null" /> diff --git a/apps/desktop/src/composables/useFlatTree.ts b/apps/desktop/src/composables/useFlatTree.ts index 5e3af8d401..47abdcc0af 100644 --- a/apps/desktop/src/composables/useFlatTree.ts +++ b/apps/desktop/src/composables/useFlatTree.ts @@ -29,25 +29,3 @@ export function flattenTree(nodes: TreeNode[]): FlatTreeNode[] { export function shouldVirtualizeFlatTree(count: number): boolean { return count > 0; } - -export function shouldAutoScrollExpandedTreeNode(type: TreeNodeType): boolean { - return type !== "connection" && type !== "connection-group"; -} - -export function scrollTopForExpandedTreeNode(options: { expandedIndex: number; insertedRowCount: number; currentScrollTop: number; viewportHeight: number; rowHeight?: number }): number { - const rowHeight = options.rowHeight ?? SIDEBAR_TREE_ROW_HEIGHT; - if (options.expandedIndex < 0 || options.insertedRowCount <= 0 || options.viewportHeight <= 0) { - return options.currentScrollTop; - } - - const visibleRowCapacity = Math.max(1, Math.floor(options.viewportHeight / rowHeight) - 1); - const rowsToReveal = Math.min(options.insertedRowCount, visibleRowCapacity); - const expandedContentBottom = (options.expandedIndex + 1 + rowsToReveal) * rowHeight; - const viewportBottom = options.currentScrollTop + options.viewportHeight; - - if (expandedContentBottom <= viewportBottom) { - return options.currentScrollTop; - } - - return Math.max(0, expandedContentBottom - options.viewportHeight); -} diff --git a/packages/app-tests/useFlatTree.test.ts b/packages/app-tests/useFlatTree.test.ts index d80ba46cf0..6d57c4857a 100644 --- a/packages/app-tests/useFlatTree.test.ts +++ b/packages/app-tests/useFlatTree.test.ts @@ -1,6 +1,6 @@ import { strict as assert } from "node:assert"; import { test } from "vitest"; -import { SIDEBAR_TREE_ROW_HEIGHT, SIDEBAR_TREE_PRERENDER_COUNT, SIDEBAR_TREE_SCROLL_BUFFER, flattenTree, scrollTopForExpandedTreeNode, shouldAutoScrollExpandedTreeNode, shouldVirtualizeFlatTree } from "../../apps/desktop/src/composables/useFlatTree.ts"; +import { SIDEBAR_TREE_ROW_HEIGHT, SIDEBAR_TREE_PRERENDER_COUNT, SIDEBAR_TREE_SCROLL_BUFFER, flattenTree, shouldVirtualizeFlatTree } from "../../apps/desktop/src/composables/useFlatTree.ts"; import type { TreeNode } from "../../apps/desktop/src/types/database.ts"; test("flattenTree preserves depth and node type for virtualized sidebar rows", () => { @@ -51,34 +51,3 @@ test("sidebar virtual tree keeps enough buffered rows for fast scrolling", () => test("sidebar virtual tree prerenders enough rows for the first frame", () => { assert.ok(SIDEBAR_TREE_PRERENDER_COUNT >= 40); }); - -test("sidebar keeps root connection expansion from changing scroll position", () => { - assert.equal(shouldAutoScrollExpandedTreeNode("connection"), false); - assert.equal(shouldAutoScrollExpandedTreeNode("connection-group"), false); - assert.equal(shouldAutoScrollExpandedTreeNode("database"), true); - assert.equal(shouldAutoScrollExpandedTreeNode("group-columns"), true); -}); - -test("expanded sidebar nodes scroll enough to reveal inserted rows", () => { - assert.equal( - scrollTopForExpandedTreeNode({ - expandedIndex: 20, - insertedRowCount: 2, - currentScrollTop: 15 * SIDEBAR_TREE_ROW_HEIGHT, - viewportHeight: 6 * SIDEBAR_TREE_ROW_HEIGHT, - }), - 17 * SIDEBAR_TREE_ROW_HEIGHT, - ); -}); - -test("expanded sidebar nodes keep scroll position when children are already visible", () => { - assert.equal( - scrollTopForExpandedTreeNode({ - expandedIndex: 4, - insertedRowCount: 2, - currentScrollTop: 0, - viewportHeight: 8 * SIDEBAR_TREE_ROW_HEIGHT, - }), - 0, - ); -});