From 96b8ae94fdf3c461633b29ad119ca5ec7fd3fd53 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Fri, 16 May 2025 16:48:22 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=9D=E5=AD=98=E8=A1=A8=E6=A0=BC?=
 =?UTF-8?q?=E6=BB=9A=E5=8A=A8/=E5=B1=95=E5=BC=80=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E5=B9=B6=E6=89=A7=E8=A1=8C=E5=9B=9E=E8=B0=83=20=E7=94=A8?=
 =?UTF-8?q?=E4=BA=8E=E6=A0=91=E8=A1=A8=E5=9C=A8=E6=89=A7=E8=A1=8C=20?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E/=E7=BC=96=E8=BE=91/=E5=88=A0=E9=99=A4?=
 =?UTF-8?q?=E7=AD=89=E6=93=8D=E4=BD=9C=E5=90=8E=20=E4=BE=9D=E7=84=B6?=
 =?UTF-8?q?=E5=9C=A8=E5=BD=93=E5=89=8D=E4=BD=8D=E7=BD=AE(=E4=BD=93?=
 =?UTF-8?q?=E9=AA=8C=E4=BC=98=E5=8C=96)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                                  |  6 +++++
 apps/web-antd/package.json                    |  2 +-
 apps/web-antd/src/adapter/vxe-table.ts        | 23 +++++++++++++++++++
 apps/web-antd/src/views/system/menu/index.vue | 17 ++++++++++----
 4 files changed, 43 insertions(+), 5 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ca32d0aa..f093354d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,9 @@
+# 1.3.7
+
+**FEATURES**
+
+- 菜单管理(通用方法) 保存表格滚动/展开状态并执行回调 用于树表在执行 新增/编辑/删除等操作后 依然在当前位置(体验优化)
+
 # 1.3.6
 
 **BUG FIX**
diff --git a/apps/web-antd/package.json b/apps/web-antd/package.json
index d5d0c0d7..c055710e 100644
--- a/apps/web-antd/package.json
+++ b/apps/web-antd/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/web-antd",
-  "version": "1.3.6",
+  "version": "1.3.7",
   "homepage": "https://vben.pro",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/apps/web-antd/src/adapter/vxe-table.ts b/apps/web-antd/src/adapter/vxe-table.ts
index 592161af..5c222d42 100644
--- a/apps/web-antd/src/adapter/vxe-table.ts
+++ b/apps/web-antd/src/adapter/vxe-table.ts
@@ -1,4 +1,5 @@
 import type { VxeGridPropTypes } from '@vben/plugins/vxe-table';
+import type { MaybePromise } from '@vben/types';
 
 import { h } from 'vue';
 
@@ -133,3 +134,25 @@ export function addSortParams(
   params.orderByColumn = orderByColumn;
   params.isAsc = isAsc;
 }
+
+/**
+ * 保存表格滚动/展开状态并执行回调 用于树表在执行 新增/编辑/删除等操作后 依然在当前位置(体验优化)
+ *
+ * @param tableApi 表格api
+ * @param callback 回调
+ */
+export async function preserveTreeTableState(
+  tableApi: ReturnType<typeof useVbenVxeGrid>[1],
+  callback: () => MaybePromise<void>,
+) {
+  // 保存当前状态
+  const scrollState = tableApi.grid.getScroll();
+  const expandRecords = tableApi.grid.getTreeExpandRecords();
+
+  // 执行回调
+  await callback();
+
+  // 恢复状态
+  tableApi.grid.setTreeExpand(expandRecords, true);
+  tableApi.grid.scrollTo(scrollState.scrollLeft, scrollState.scrollTop);
+}
diff --git a/apps/web-antd/src/views/system/menu/index.vue b/apps/web-antd/src/views/system/menu/index.vue
index 83b583bb..9be81bcb 100644
--- a/apps/web-antd/src/views/system/menu/index.vue
+++ b/apps/web-antd/src/views/system/menu/index.vue
@@ -12,7 +12,7 @@ import { eachTree, getVxePopupContainer } from '@vben/utils';
 
 import { Popconfirm, Space } from 'ant-design-vue';
 
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { preserveTreeTableState, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { menuList, menuRemove } from '#/api/system/menu';
 
 import { columns, querySchema } from './data';
@@ -112,8 +112,17 @@ async function handleEdit(record: Menu) {
 }
 
 async function handleDelete(row: Menu) {
-  await menuRemove([row.menuId]);
-  await tableApi.query();
+  await preserveTreeTableState(tableApi, async () => {
+    await menuRemove([row.menuId]);
+    await tableApi.query();
+  });
+}
+
+/**
+ * 编辑/添加成功后刷新表格
+ */
+async function afterEditOrAdd() {
+  await preserveTreeTableState(tableApi, () => tableApi.query());
 }
 
 /**
@@ -189,7 +198,7 @@ const isAdmin = computed(() => {
         </Space>
       </template>
     </BasicTable>
-    <MenuDrawer @reload="tableApi.query()" />
+    <MenuDrawer @reload="afterEditOrAdd" />
   </Page>
   <Fallback v-else description="您没有菜单管理的访问权限" status="403" />
 </template>