From 35d5e90378fefa12ad83212be233168ef73f635d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E4=B8=AB=E8=AE=B2=E6=A2=B5?= Date: Mon, 6 Jul 2026 17:24:56 +0800 Subject: [PATCH] feat(settings): improve sidebar search MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增设置选项以启用/禁用数据库内的表搜索 - 更新相关组件以支持表搜索功能 - 添加多语言支持的描述信息 --- .../editor/EditorSettingsDialog.vue | 15 ++++++++ .../src/components/sidebar/ConnectionTree.vue | 20 ++++++++++- .../src/components/sidebar/TreeItem.vue | 35 +++++++++++++++++-- apps/desktop/src/i18n/locales/en.ts | 2 ++ apps/desktop/src/i18n/locales/es.ts | 2 ++ apps/desktop/src/i18n/locales/it.ts | 2 ++ apps/desktop/src/i18n/locales/ja.ts | 2 ++ apps/desktop/src/i18n/locales/pt-BR.ts | 2 ++ apps/desktop/src/i18n/locales/zh-CN.ts | 2 ++ apps/desktop/src/i18n/locales/zh-TW.ts | 2 ++ apps/desktop/src/stores/settingsStore.ts | 4 +++ packages/app-tests/settingsStore.test.ts | 8 +++++ .../sidebarTableSearchControl.test.ts | 20 +++++++++++ 13 files changed, 113 insertions(+), 3 deletions(-) diff --git a/apps/desktop/src/components/editor/EditorSettingsDialog.vue b/apps/desktop/src/components/editor/EditorSettingsDialog.vue index 9d715acd03..45e29c7a93 100644 --- a/apps/desktop/src/components/editor/EditorSettingsDialog.vue +++ b/apps/desktop/src/components/editor/EditorSettingsDialog.vue @@ -276,6 +276,7 @@ const editingShortcutId = ref(null); const editSidebarActivation = ref(settingsStore.editorSettings.sidebarActivation); const editSidebarObjectDisplay = ref(settingsStore.editorSettings.sidebarObjectDisplay); const sidebarObjectDisplayHelp = ref<"grouped" | "simple" | null>(null); +const editSidebarTableSearchEnabled = ref(settingsStore.editorSettings.sidebarTableSearchEnabled); const editAutoSelectActiveSidebarNode = ref(settingsStore.editorSettings.autoSelectActiveSidebarNode); const editOpenTabsRestoreMode = ref(settingsStore.editorSettings.openTabsRestoreMode); const editDisconnectTabHandlingMode = ref(settingsStore.editorSettings.disconnectTabHandlingMode); @@ -570,6 +571,7 @@ watch( sqlFormatterConfigValid.value = true; editSidebarActivation.value = settingsStore.editorSettings.sidebarActivation; editSidebarObjectDisplay.value = settingsStore.editorSettings.sidebarObjectDisplay; + editSidebarTableSearchEnabled.value = settingsStore.editorSettings.sidebarTableSearchEnabled; editAutoSelectActiveSidebarNode.value = settingsStore.editorSettings.autoSelectActiveSidebarNode; editOpenTabsRestoreMode.value = settingsStore.editorSettings.openTabsRestoreMode; editDisconnectTabHandlingMode.value = settingsStore.editorSettings.disconnectTabHandlingMode; @@ -661,6 +663,7 @@ function hasChanges(): boolean { JSON.stringify(editSqlFormatter.value) !== JSON.stringify(normalizeSqlFormatterSettings(settingsStore.editorSettings.sqlFormatter)) || editSidebarActivation.value !== settingsStore.editorSettings.sidebarActivation || editSidebarObjectDisplay.value !== settingsStore.editorSettings.sidebarObjectDisplay || + editSidebarTableSearchEnabled.value !== settingsStore.editorSettings.sidebarTableSearchEnabled || editAutoSelectActiveSidebarNode.value !== settingsStore.editorSettings.autoSelectActiveSidebarNode || editOpenTabsRestoreMode.value !== settingsStore.editorSettings.openTabsRestoreMode || editDisconnectTabHandlingMode.value !== settingsStore.editorSettings.disconnectTabHandlingMode || @@ -711,6 +714,7 @@ async function persistSettings() { sqlFormatter: normalizeSqlFormatterSettings(editSqlFormatter.value), sidebarActivation: editSidebarActivation.value, sidebarObjectDisplay: editSidebarObjectDisplay.value, + sidebarTableSearchEnabled: editSidebarTableSearchEnabled.value, autoSelectActiveSidebarNode: editAutoSelectActiveSidebarNode.value, openTabsRestoreMode: editOpenTabsRestoreMode.value, disconnectTabHandlingMode: editDisconnectTabHandlingMode.value, @@ -800,6 +804,7 @@ function resetDefaultsForTab(tab: SettingsCategory) { editSidebarTablePageSize.value = DEFAULT_SIDEBAR_TABLE_PAGE_SIZE; editSidebarActivation.value = DEFAULT_EDITOR_SETTINGS.sidebarActivation; editSidebarObjectDisplay.value = DEFAULT_EDITOR_SETTINGS.sidebarObjectDisplay; + editSidebarTableSearchEnabled.value = DEFAULT_EDITOR_SETTINGS.sidebarTableSearchEnabled; editAutoSelectActiveSidebarNode.value = DEFAULT_EDITOR_SETTINGS.autoSelectActiveSidebarNode; editOpenTabsRestoreMode.value = DEFAULT_EDITOR_SETTINGS.openTabsRestoreMode; editDisconnectTabHandlingMode.value = DEFAULT_EDITOR_SETTINGS.disconnectTabHandlingMode; @@ -870,6 +875,7 @@ function resetAllDefaults() { sqlFormatterConfigValid.value = true; editSidebarActivation.value = DEFAULT_EDITOR_SETTINGS.sidebarActivation; editSidebarObjectDisplay.value = DEFAULT_EDITOR_SETTINGS.sidebarObjectDisplay; + editSidebarTableSearchEnabled.value = DEFAULT_EDITOR_SETTINGS.sidebarTableSearchEnabled; editAutoSelectActiveSidebarNode.value = DEFAULT_EDITOR_SETTINGS.autoSelectActiveSidebarNode; editOpenTabsRestoreMode.value = DEFAULT_EDITOR_SETTINGS.openTabsRestoreMode; editDisconnectTabHandlingMode.value = DEFAULT_EDITOR_SETTINGS.disconnectTabHandlingMode; @@ -2854,6 +2860,15 @@ onUnmounted(cleanupPreviewEditor); +
+
+ + + {{ t("settings.sidebarTableSearchEnabledDescription") }} + +
+ +
diff --git a/apps/desktop/src/components/sidebar/ConnectionTree.vue b/apps/desktop/src/components/sidebar/ConnectionTree.vue index 6d90819bce..50710d2ba9 100644 --- a/apps/desktop/src/components/sidebar/ConnectionTree.vue +++ b/apps/desktop/src/components/sidebar/ConnectionTree.vue @@ -73,6 +73,24 @@ function refreshActiveSidebarTableSearches() { } } +watch( + () => settingsStore.editorSettings.sidebarTableSearchEnabled, + (enabled) => { + if (enabled) return; + const parentNodeIds = Object.keys(store.sidebarTableSearchQueries); + if (parentNodeIds.length === 0) return; + + for (const parentNodeId of parentNodeIds) { + window.clearTimeout(tableSearchTimers.get(parentNodeId)); + tableSearchTimers.delete(parentNodeId); + tableSearchFocusRestoreTokens.delete(parentNodeId); + store.setSidebarTableSearchQuery(parentNodeId, ""); + } + latestTableSearchInteractionParentId = null; + void Promise.all(parentNodeIds.map((parentNodeId) => store.refreshSidebarTableSearch(parentNodeId))).catch(() => {}); + }, +); + watch(deferredSearchQuery, (newQuery, oldQuery) => { store.sidebarSearchQuery = newQuery; const tasks: Promise[] = []; @@ -256,7 +274,7 @@ const filteredNodes = computed(() => { const flatNodes = computed(() => insertSidebarTableSearchControls(flattenTree(filteredNodes.value), { - enabled: !isFiltering.value, + enabled: settingsStore.editorSettings.sidebarTableSearchEnabled && !isFiltering.value, sidebarObjectDisplay: settingsStore.editorSettings.sidebarObjectDisplay, activeQueries: store.sidebarTableSearchQueries, }), diff --git a/apps/desktop/src/components/sidebar/TreeItem.vue b/apps/desktop/src/components/sidebar/TreeItem.vue index 63558f8031..787db9293c 100644 --- a/apps/desktop/src/components/sidebar/TreeItem.vue +++ b/apps/desktop/src/components/sidebar/TreeItem.vue @@ -3944,6 +3944,16 @@ const rowStyle = computed(() => { "--tree-connection-active-focus-bg": hexToRgba(color, 0.22), }; }); +const tableSearchStyle = computed(() => { + const color = connectionColor.value; + const rowBackgroundColor = color ? hexToRgba(color, isActiveConnectionScope.value ? 0.14 : 0.08) : "transparent"; + return { + paddingLeft: paddingLeft.value, + "--tree-table-search-row-bg": rowBackgroundColor, + "--tree-table-search-input-bg": color ? hexToRgba(color, isActiveConnectionScope.value ? 0.05 : 0.03) : "hsl(var(--background) / 0.56)", + "--tree-table-search-border": color ? hexToRgba(color, isActiveConnectionScope.value ? 0.12 : 0.08) : "hsl(var(--border) / 0.36)", + }; +}); function togglePin() { connectionStore.toggleTreeNodePin(props.node.id); @@ -4933,7 +4943,7 @@ function treeItemMenuItems(): ContextMenuItem[] {