From f9e93b356f4945abf002d5eccdbbe79441e91dbe Mon Sep 17 00:00:00 2001 From: zipg Date: Fri, 7 Aug 2026 13:43:55 +0800 Subject: [PATCH] feat(grid): enhance field search and filter interaction --- apps/desktop/src/components/grid/DataGrid.vue | 6 +- .../components/grid/DataGridFilterBuilder.vue | 9 +- .../components/grid/DataGridQueryControls.vue | 36 ++++++- .../__tests__/DataGridConditionEditor.spec.ts | 17 +++ .../grid/__tests__/DataGridSurfaces.spec.ts | 101 +++++++++++++++++- .../useDataGridConditionEditor.spec.ts | 58 ++++++++++ .../useDataGridFilterBuilder.spec.ts | 20 +++- .../composables/useDataGridConditionEditor.ts | 37 ++++--- .../composables/useDataGridFilterBuilder.ts | 9 +- 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/ko.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 + .../app/documentStoreProvider.filter.spec.ts | 10 ++ .../__tests__/dataGridColumnLookup.spec.ts | 20 ++++ .../sql/sqlCompletion.pinyin.spec.ts | 50 +++++++++ .../src/lib/app/documentStoreProvider.ts | 8 +- .../src/lib/dataGrid/dataGridColumnLookup.ts | 6 +- apps/desktop/src/lib/dataGrid/dataGridSql.ts | 2 +- apps/desktop/src/lib/sql/identifierSearch.ts | 82 ++++++++++++++ apps/desktop/src/lib/sql/sqlCompletion.ts | 10 +- crates/dbx-core/src/data_grid_sql.rs | 29 +++++ 26 files changed, 491 insertions(+), 35 deletions(-) create mode 100644 apps/desktop/src/lib/__tests__/app/documentStoreProvider.filter.spec.ts create mode 100644 apps/desktop/src/lib/__tests__/dataGridColumnLookup.spec.ts create mode 100644 apps/desktop/src/lib/sql/identifierSearch.ts diff --git a/apps/desktop/src/components/grid/DataGrid.vue b/apps/desktop/src/components/grid/DataGrid.vue index ddd959f20..bf2a2c997 100644 --- a/apps/desktop/src/components/grid/DataGrid.vue +++ b/apps/desktop/src/components/grid/DataGrid.vue @@ -720,7 +720,9 @@ const allFilterModeOptions: Array<{ value: FilterMode; labelKey: string }> = [ { value: "like", labelKey: "grid.filterBuilderContains" }, { value: "not-like", labelKey: "grid.filterBuilderNotContains" }, { value: "greater-than", labelKey: "grid.filterBuilderGreaterThan" }, + { value: "greater-than-or-equal", labelKey: "grid.filterBuilderGreaterThanOrEqual" }, { value: "less-than", labelKey: "grid.filterBuilderLessThan" }, + { value: "less-than-or-equal", labelKey: "grid.filterBuilderLessThanOrEqual" }, { value: "in", labelKey: "grid.filterBuilderIn" }, { value: "not-in", labelKey: "grid.filterBuilderNotIn" }, { value: "between", labelKey: "grid.filterBuilderBetween" }, @@ -1565,8 +1567,8 @@ watch( [structuredFilterRules, appliedStructuredWhereInput, serverColumnFilters], () => { const columns = filterBuilderColumnOptions.value; - if (columns.length > 0 && structuredFilterRules.value.some((rule) => !columns.includes(rule.columnName))) { - structuredFilterRules.value = structuredFilterRules.value.map((rule) => (columns.includes(rule.columnName) ? rule : { ...rule, columnName: columns[0] ?? "" })); + if (columns.length > 0 && structuredFilterRules.value.some((rule) => rule.columnName && !columns.includes(rule.columnName))) { + structuredFilterRules.value = structuredFilterRules.value.map((rule) => (!rule.columnName || columns.includes(rule.columnName) ? rule : { ...rule, columnName: columns[0] ?? "" })); return; } persistStructuredFilterState(); diff --git a/apps/desktop/src/components/grid/DataGridFilterBuilder.vue b/apps/desktop/src/components/grid/DataGridFilterBuilder.vue index fc2f8aa6a..bf14dc53c 100644 --- a/apps/desktop/src/components/grid/DataGridFilterBuilder.vue +++ b/apps/desktop/src/components/grid/DataGridFilterBuilder.vue @@ -134,6 +134,13 @@ async function handleColumnSelectOpen(rule: DataGridStructuredFilterRule, open: window.requestAnimationFrame(() => columnSearchInputs.get(rule.id)?.focus()); } +async function openFirstEmptyRuleColumnSearch() { + const rule = props.rules.find((item) => !item.columnName && !item.disabled); + if (rule) await handleColumnSelectOpen(rule, true); +} + +defineExpose({ openFirstEmptyRuleColumnSearch }); + function handleColumnCloseAutoFocus(id: string, event: Event) { if (pendingKeyboardAddFocus.delete(id)) { event.preventDefault(); @@ -263,7 +270,7 @@ function blurValueRule(id: string) {
-
+