首页细节调整

layouts/admin/AdminLayout.uvue

@@ -57,12 +57,14 @@
         @tab-close="onTabClose"
         @close-other="onCloseOther"
         @close-all="onCloseAll"
+        @refresh="onRefresh"
       />
 
       <!-- 内容展示区 (内部路由渲染) -->
       <view class="content-scroll">
         <view class="content-inner" :class="{ 'is-mobile': isMobile }">
-          <component :is="currentComponent" />
+          <component :is="currentComponent" v-if="!isPageLoading" />
+          <AdminPageLoading v-if="isPageLoading" />
         </view>
         <AdminFooter />
       </view>
@@ -77,6 +79,7 @@ import AdminSubSider from '@/layouts/admin/components/AdminSubSider.uvue'
 import AdminHeader from '@/layouts/admin/components/AdminHeader.uvue'
 import AdminTagsView from '@/layouts/admin/components/AdminTagsView.uvue'
 import AdminFooter from '@/layouts/admin/components/AdminFooter.uvue'
+import AdminPageLoading from '@/layouts/admin/components/AdminPageLoading.uvue'
 
 import { 
   getTopMenus, 
@@ -117,6 +120,9 @@ import { getComponent } from '@/layouts/admin/router/adminComponentMap.uts'
 const ASIDE_W = 70    
 const SUB_W = 200     
 
+// 页面加载状态
+const isPageLoading = ref(false)
+
 const hasNotification = ref<boolean>(false)
 
 /**
@@ -251,6 +257,12 @@ const currentComponent = computed<any>(() => {
 
 // 监听路由变化，同步状态 (处理从 Tabs 或外部跳转的情况)
 watch(() => activeRouteId.value, (newId) => {
+  // 触发页面加载动画
+  isPageLoading.value = true
+  setTimeout(() => {
+    isPageLoading.value = false
+  }, 400) // 给予足够的时间让异步组件加载
+  
   const route = findRouteById(newId)
   if (route && route.parentId) {
     // 同步一级菜单
@@ -399,7 +411,7 @@ onMounted(() => {
   flex-direction: row;
   width: 100%;
   min-height: 100vh;
-  background: #f5f7f9;
+  background: #f0f2f5;
   position: relative;
 }
 
@@ -443,7 +455,7 @@ onMounted(() => {
   flex-direction: column;
   min-height: 100vh;
   transition: margin-left 300ms ease;
-  background: #f5f7f9;
+  background: #f0f2f5;
   width: 100%;
 }
 
@@ -473,13 +485,15 @@ onMounted(() => {
   flex: 1;
   overflow-y: scroll;
   overflow-x: auto; /* 允许横向滚动，兼容极端窄屏 */
-  background: #f5f7f9;
+  background: #f0f2f5;
+  padding: 0;
 }
 
 .content-inner {
   min-height: calc(100vh - 120px);
-  padding: 12px 14px;
+  padding: 12px;
 }
+
 .content-inner.is-mobile {
   padding: 8px;
 }