From 0adc8411fa4d8d0571d944e83ea89946bbf4fe0e Mon Sep 17 00:00:00 2001
From: Syngnat <yangguofeng919@gmail.com>
Date: Thu, 19 Mar 2026 08:59:49 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(data-grid/table-designer/abo?=
 =?UTF-8?q?ut):=20=E4=BF=AE=E5=A4=8D=E7=A9=BA=E8=A1=A8=E6=A8=AA=E5=90=91?=
 =?UTF-8?q?=E6=BB=9A=E5=8A=A8=E3=80=81=E7=B4=A2=E5=BC=95=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E5=9B=9E=E6=98=BE=E5=8F=8A=E5=85=B3=E4=BA=8E=E5=BC=B9=E7=AA=97?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E9=97=B4=E8=B7=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 空表滚动：虚拟模式下空数据表缺少 virtual-holder 元素时，回退到直接滚动表头实现横向滚动
- 索引回显：修复修改索引后再次编辑时被删除的字段仍然显示的问题，selectedIndex 随 groupedIndexes 同步更新
- 按钮间距：关于弹窗 footer 增加 flex-wrap 和 gap，解决关闭按钮与上方操作按钮行重叠
- refs #258
---
 frontend/package.json.md5                 |  2 +-
 frontend/src/App.tsx                      |  2 +-
 frontend/src/components/DataGrid.tsx      | 26 ++++++++++++++++++-----
 frontend/src/components/TableDesigner.tsx |  8 ++++++-
 4 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/frontend/package.json.md5 b/frontend/package.json.md5
index a7661c0..0f8f4fe 100755
--- a/frontend/package.json.md5
+++ b/frontend/package.json.md5
@@ -1 +1 @@
-d0f9366af59a6367ad3c7e2d4185ead4
\ No newline at end of file
+5b8157374dae5f9340e31b2d0bd2c00e
\ No newline at end of file
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 2c38879..9ebf4e4 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1641,7 +1641,7 @@ function App() {
             title={renderUtilityModalTitle(<InfoCircleOutlined />, '关于 GoNavi', '查看版本信息、仓库地址、更新状态与下载入口。')}
             open={isAboutOpen}
             onCancel={() => setIsAboutOpen(false)}
-            styles={{ content: utilityModalShellStyle, header: { background: 'transparent', borderBottom: 'none', paddingBottom: 8 }, body: { paddingTop: 8 }, footer: { background: 'transparent', borderTop: 'none', paddingTop: 10 } }}
+            styles={{ content: utilityModalShellStyle, header: { background: 'transparent', borderBottom: 'none', paddingBottom: 8 }, body: { paddingTop: 8 }, footer: { background: 'transparent', borderTop: 'none', paddingTop: 10, display: 'flex', flexWrap: 'wrap', gap: 10, justifyContent: 'flex-end' } }}
             footer={[
                 canShowProgressEntry ? (
                     <Button key="progress" icon={<DownloadOutlined />} onClick={showUpdateDownloadProgress}>下载进度</Button>
diff --git a/frontend/src/components/DataGrid.tsx b/frontend/src/components/DataGrid.tsx
index b4b10bb..49c66cf 100644
--- a/frontend/src/components/DataGrid.tsx
+++ b/frontend/src/components/DataGrid.tsx
@@ -3900,12 +3900,28 @@ const DataGrid: React.FC<DataGridProps> = ({
       // 虚拟表格路径：通过合成 WheelEvent 驱动 rc-virtual-list 内部状态，
       // rc-table 自动同步 header scrollLeft。
       if (enableVirtual && tableContainer instanceof HTMLElement) {
-          applyVirtualHorizontalOffset(tableContainer, externalScroll.scrollLeft);
-          // WheelEvent 经 rc-virtual-list 处理后状态异步更新，延迟同步 ref
-          requestAnimationFrame(() => {
-              lastTableScrollLeftRef.current = readVirtualHorizontalOffset(tableContainer);
+          const applied = applyVirtualHorizontalOffset(tableContainer, externalScroll.scrollLeft);
+          if (applied) {
+              // WheelEvent 经 rc-virtual-list 处理后状态异步更新，延迟同步 ref
+              requestAnimationFrame(() => {
+                  lastTableScrollLeftRef.current = readVirtualHorizontalOffset(tableContainer);
+                  horizontalSyncSourceRef.current = '';
+              });
+              return;
+          }
+          // 空数据回退：virtual-holder 不存在时，直接滚动表头
+          const headerEl = tableContainer.querySelector('.ant-table-header') as HTMLElement | null;
+          const contentEl = tableContainer.querySelector('.ant-table-content') as HTMLElement | null;
+          const fallbackTargets = [headerEl, contentEl].filter((el): el is HTMLElement => el instanceof HTMLElement && el.scrollWidth > el.clientWidth + 1);
+          if (fallbackTargets.length > 0) {
+              fallbackTargets.forEach((target) => {
+                  target.scrollLeft = externalScroll.scrollLeft;
+              });
+              lastTableScrollLeftRef.current = externalScroll.scrollLeft;
               horizontalSyncSourceRef.current = '';
-          });
+              return;
+          }
+          horizontalSyncSourceRef.current = '';
           return;
       }
       // 非虚拟表格路径：依赖 liveTargets 进行 scrollLeft 同步
diff --git a/frontend/src/components/TableDesigner.tsx b/frontend/src/components/TableDesigner.tsx
index 04b98fc..00e963b 100644
--- a/frontend/src/components/TableDesigner.tsx
+++ b/frontend/src/components/TableDesigner.tsx
@@ -1162,8 +1162,14 @@ ${selectedTrigger.statement}`;
 
   useEffect(() => {
       if (!selectedIndex) return;
-      if (!groupedIndexes.some(idx => idx.key === selectedIndex.key)) {
+      const freshIndex = groupedIndexes.find(idx => idx.key === selectedIndex.key);
+      if (!freshIndex) {
           setSelectedIndex(null);
+          return;
+      }
+      // 索引仍存在但内容可能已变（如字段列表），同步为最新对象
+      if (freshIndex !== selectedIndex) {
+          setSelectedIndex(freshIndex);
       }
   }, [groupedIndexes, selectedIndex]);