From 49c20bef89746aca7437efe8663c89bf3eb8f32c Mon Sep 17 00:00:00 2001
From: Syngnat <yangguofeng919@gmail.com>
Date: Sun, 10 May 2026 12:41:08 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(data-grid):=20=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D=E5=BF=AB=E6=8D=B7=20WHERE=20=E8=87=AA=E5=8A=A8?=
 =?UTF-8?q?=E8=A1=A5=E5=85=A8=E5=9B=9E=E8=BD=A6=E8=A1=8C=E4=B8=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整快捷 WHERE 输入框 Enter 处理，避免抢占 AutoComplete 选中事件
- 方向键高亮建议项后回车优先选择字段
- 增加快捷 WHERE 回车行为回归测试
---
 frontend/src/components/DataGrid.tsx          | 23 +++++++++++-----
 .../src/utils/dataGridWhereFilter.test.ts     | 27 +++++++++++++++++++
 frontend/src/utils/dataGridWhereFilter.ts     | 20 ++++++++++++++
 3 files changed, 64 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/DataGrid.tsx b/frontend/src/components/DataGrid.tsx
index 1c48238..fe8b054 100644
--- a/frontend/src/components/DataGrid.tsx
+++ b/frontend/src/components/DataGrid.tsx
@@ -77,6 +77,7 @@ import {
     normalizeQuickWhereCondition,
     resolveWhereConditionSelectedValue,
     resolveWhereConditionSuggestions,
+    shouldApplyQuickWhereOnEnter,
     validateQuickWhereCondition,
 } from '../utils/dataGridWhereFilter';
 import {
@@ -2418,6 +2419,7 @@ const DataGrid: React.FC<DataGridProps> = ({
   const [filterConditions, setFilterConditions] = useState<GridFilterCondition[]>([]);
   const [nextFilterId, setNextFilterId] = useState(1);
   const [quickWhereDraft, setQuickWhereDraft] = useState(() => normalizeQuickWhereCondition(quickWhereCondition));
+  const [quickWhereSuggestionsOpen, setQuickWhereSuggestionsOpen] = useState(false);
   const filterPanelRef = useRef<HTMLDivElement | null>(null);
 
   useEffect(() => {
@@ -5638,6 +5640,21 @@ const DataGrid: React.FC<DataGridProps> = ({
                        value={quickWhereDraft}
                        options={quickWhereSuggestionOptions}
                        onChange={setQuickWhereDraft}
+                       onOpenChange={setQuickWhereSuggestionsOpen}
+                       onInputKeyDown={(event) => {
+                           if (!shouldApplyQuickWhereOnEnter({
+                               key: event.key,
+                               shiftKey: event.shiftKey,
+                               isComposing: Boolean((event.nativeEvent as any)?.isComposing),
+                               suggestionsOpen: quickWhereSuggestionsOpen,
+                               suggestionCount: quickWhereSuggestionOptions.length,
+                               activeSuggestionId: event.currentTarget.getAttribute('aria-activedescendant'),
+                           })) {
+                               return;
+                           }
+                           event.preventDefault();
+                           applyQuickWhereCondition();
+                       }}
                        onSelect={(value, option) => {
                            setQuickWhereDraft(resolveWhereConditionSelectedValue({
                                selectedValue: value,
@@ -5652,12 +5669,6 @@ const DataGrid: React.FC<DataGridProps> = ({
                            {...noAutoCapInputProps}
                            allowClear
                            placeholder={dbType === 'mongodb' ? '输入 MongoDB JSON 查询对象，例如 {"status":"A"}' : '输入 WHERE 后面的条件，例如 status = 1 AND name LIKE \'A%\''}
-                           onPressEnter={(event) => {
-                               if (!event.shiftKey) {
-                                   event.preventDefault();
-                                   applyQuickWhereCondition();
-                               }
-                           }}
                        />
                    </AutoComplete>
                    <Button size="small" type="primary" onClick={() => applyQuickWhereCondition()}>
diff --git a/frontend/src/utils/dataGridWhereFilter.test.ts b/frontend/src/utils/dataGridWhereFilter.test.ts
index d8771c3..706d95b 100644
--- a/frontend/src/utils/dataGridWhereFilter.test.ts
+++ b/frontend/src/utils/dataGridWhereFilter.test.ts
@@ -7,6 +7,7 @@ import {
   normalizeQuickWhereCondition,
   resolveWhereConditionSuggestions,
   resolveWhereConditionSelectedValue,
+  shouldApplyQuickWhereOnEnter,
   validateQuickWhereCondition,
 } from './dataGridWhereFilter';
 
@@ -110,4 +111,30 @@ describe('dataGridWhereFilter', () => {
       }),
     ).toBe('`username` = ');
   });
+
+  it('lets autocomplete consume enter while quick where suggestions are open', () => {
+    expect(shouldApplyQuickWhereOnEnter({
+      key: 'Enter',
+      suggestionsOpen: true,
+      suggestionCount: 1,
+      activeSuggestionId: 'quick-where-list-0',
+    })).toBe(false);
+    expect(shouldApplyQuickWhereOnEnter({
+      key: 'Enter',
+      suggestionsOpen: true,
+      suggestionCount: 1,
+    })).toBe(true);
+    expect(shouldApplyQuickWhereOnEnter({
+      key: 'Enter',
+      suggestionsOpen: false,
+      suggestionCount: 1,
+      activeSuggestionId: 'quick-where-list-0',
+    })).toBe(true);
+    expect(shouldApplyQuickWhereOnEnter({
+      key: 'Enter',
+      shiftKey: true,
+      suggestionsOpen: false,
+      suggestionCount: 0,
+    })).toBe(false);
+  });
 });
diff --git a/frontend/src/utils/dataGridWhereFilter.ts b/frontend/src/utils/dataGridWhereFilter.ts
index de44983..8c5436c 100644
--- a/frontend/src/utils/dataGridWhereFilter.ts
+++ b/frontend/src/utils/dataGridWhereFilter.ts
@@ -182,6 +182,26 @@ export const resolveWhereConditionSelectedValue = ({
   return applyWhereConditionSuggestion(String(currentInput ?? ''), insertTextValue);
 };
 
+export const shouldApplyQuickWhereOnEnter = ({
+  key,
+  shiftKey = false,
+  isComposing = false,
+  suggestionsOpen = false,
+  suggestionCount = 0,
+  activeSuggestionId = '',
+}: {
+  key: unknown;
+  shiftKey?: boolean;
+  isComposing?: boolean;
+  suggestionsOpen?: boolean;
+  suggestionCount?: number;
+  activeSuggestionId?: unknown;
+}): boolean => {
+  if (String(key || '') !== 'Enter') return false;
+  if (shiftKey || isComposing) return false;
+  return !(suggestionsOpen && suggestionCount > 0 && String(activeSuggestionId ?? '').trim());
+};
+
 export const resolveWhereConditionSuggestions = ({
   input,
   columnNames,