From 7b0bfad87705b9273c6379a7d4df76d4878f64ef Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Fri, 12 Sep 2025 14:20:31 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E8=8F=9C=E5=8D=95dra?=
 =?UTF-8?q?wer=E5=8A=A0=E8=BD=BD=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加全局loading状态
- 使用Skeleton组件展示加载效果
- 优化菜单数据和表单数据的加载顺序
- 调整模板，增加loading状态下的骨架屏显示
---
 .../src/views/system/menu/menu-drawer.vue        | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/apps/web-antd/src/views/system/menu/menu-drawer.vue b/apps/web-antd/src/views/system/menu/menu-drawer.vue
index fe5ca9b8..ddcd3f36 100644
--- a/apps/web-antd/src/views/system/menu/menu-drawer.vue
+++ b/apps/web-antd/src/views/system/menu/menu-drawer.vue
@@ -10,7 +10,7 @@ import {
   listToTree,
 } from '@vben/utils';
 
-import { Input } from 'ant-design-vue';
+import { Input, Skeleton } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter/form';
 import { menuAdd, menuInfo, menuList, menuUpdate } from '#/api/system/menu';
@@ -29,6 +29,7 @@ const isUpdate = ref(false);
 const title = computed(() => {
   return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
 });
+const loading = ref(false);
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -107,22 +108,26 @@ const [BasicDrawer, drawerApi] = useVbenDrawer({
       return null;
     }
     drawerApi.drawerLoading(true);
+    loading.value = true;
 
     const { id, update } = drawerApi.getData() as ModalProps;
     isUpdate.value = update;
 
-    // 加载菜单树选择
-    await setupMenuSelect();
     if (id) {
       await formApi.setFieldValue('parentId', id);
       if (update) {
-        const record = await menuInfo(id);
+        // 没有依赖关系 同时加载
+        const [record] = await Promise.all([menuInfo(id), setupMenuSelect()]);
         await formApi.setValues(record);
       }
+    } else {
+      // 加载菜单树选择
+      await setupMenuSelect();
     }
     await markInitialized();
 
     drawerApi.drawerLoading(false);
+    loading.value = false;
   },
 });
 
@@ -153,7 +158,8 @@ async function handleClosed() {
 
 <template>
   <BasicDrawer :title="title" class="w-[600px]">
-    <BasicForm>
+    <Skeleton active v-if="loading" />
+    <BasicForm v-show="!loading">
       <template #remark="slotProps">
         <div class="flex flex-col gap-2">
           <Input v-bind="slotProps" />