fix: 布局组件升级调整

src/layouts/BasicLayout.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
 import {
   ProLayout,
-  WaterMark,
   getMenuData,
   clearMenuItem,
-  type MenuDataItem,
+  MenuDataItem,
 } from 'antdv-pro-layout';
 import RightContent from './components/RightContent.vue';
 import Tabs from './components/Tabs.vue';
@@ -12,26 +11,25 @@ import GlobalMask from '@/components/GlobalMask/index.vue';
 import { scriptUrl } from '@/assets/js/icon_font_8d5l8fzk5b87iudi';
 import {
   computed,
-  reactive,
-  watch,
+  nextTick,
   onMounted,
   onUnmounted,
-  nextTick,
+  reactive,
+  watch,
 } from 'vue';
+import { useRouter } from 'vue-router';
 import useLayoutStore from '@/store/modules/layout';
+import useAppStore from '@/store/modules/app';
 import useRouterStore from '@/store/modules/router';
 import useTabsStore from '@/store/modules/tabs';
-import useAlarmStore from '@/store/modules/alarm';
-import useAppStore from '@/store/modules/app';
-import { useRouter } from 'vue-router';
-import { MENU_PATH_INLINE } from '@/constants/menu-constants';
-const { proConfig, waterMarkContent } = useLayoutStore();
 import useI18n from '@/hooks/useI18n';
+import useAlarmStore from '@/store/modules/alarm';
 import { getServerTime } from '@/api';
+import { MENU_PATH_INLINE } from '@/constants/menu-constants';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
-
 import { parseDateToStr } from '@/utils/date-utils';
 import { parseUrlPath } from '@/plugins/file-static-url';
+const { proConfig, waterMarkContent } = useLayoutStore();
 const { t, currentLocale } = useI18n();
 const routerStore = useRouterStore();
 const tabsStore = useTabsStore();
@@ -39,7 +37,7 @@ const appStore = useAppStore();
 const router = useRouter();
 
 /**菜单面板 */
-let layoutState = reactive({
+const layoutState = reactive({
   collapsed: false, // 是否展开菜单面板
   openKeys: ['/'], // 打开菜单key
   selectedKeys: ['/index'], // 选中高亮菜单key
@@ -247,7 +245,7 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <WaterMark :content="waterMarkContent" :z-index="100">
+  <a-watermark :content="waterMarkContent" :z-index="100">
     <ProLayout
       v-model:collapsed="layoutState.collapsed"
       v-model:selectedKeys="layoutState.selectedKeys"
@@ -290,10 +288,10 @@ onUnmounted(() => {
         </RouterLink>
       </template>
 
-      <!--插槽-顶部左侧，只对side布局有效-->
+      <!--插槽-渲染顶部内容区域，仅布局side有效-->
       <template #headerContentRender></template>
 
-      <!--插槽-顶部右侧-->
+      <!--插槽-渲染顶部内容右端区域-->
       <template #headerContentRightRender>
         <RightContent />
       </template>
@@ -364,7 +362,7 @@ onUnmounted(() => {
 
     <!-- 全局遮罩 -->
     <GlobalMask />
-  </WaterMark>
+  </a-watermark>
 </template>
 
 <style lang="less" scoped>
@@ -413,6 +411,19 @@ onUnmounted(() => {
   }
 }
 
+.theme-light.theme-menu-light .app-name {
+  color: #141414 !important;
+}
+.theme-light.theme-menu-dark .app-name {
+  color: #fff !important;
+}
+.theme-dark.theme-menu-light .app-name {
+  color: #fff !important;
+}
+.theme-dark.theme-menu-dark .app-name {
+  color: #fff !important;
+}
+
 .footer {
   z-index: 16;
   margin: 0px;
@@ -427,6 +438,7 @@ onUnmounted(() => {
     flex-direction: row;
     flex-wrap: nowrap;
     justify-content: space-between;
+    align-items: center;
     padding: 4px 16px;
     background: #fff;
     box-shadow: 0 1px 4px #0015291f;
@@ -434,6 +446,10 @@ onUnmounted(() => {
     height: 32px;
   }
 
+  [data-theme='dark'] &-fixed {
+    background: #141414;
+  }
+
   & #serverTimeDom {
     color: inherit;
     opacity: 0.85;