修改menu

src/main.js

@@ -29,6 +29,7 @@ if (store.state.auth.userInfo.permission !== undefined) {
     router,
   });
 }
+
 new Vue({
   router,
   store,
@@ -45,10 +46,30 @@ new Vue({
     },
   },
   methods: {
-    applyTheme(theme) {
+    async applyTheme(theme) {
       const themeFile = theme || this.$store.state.themes.theme;
       console.log(themeFile, "themeFile");
-      import(`./themes/${themeFile}.scss`);
+
+      // 动态加载新的主题样式
+      try {
+        // 动态导入 SCSS 文件
+        const theme = await import(`@/themes/${themeFile}.scss`);
+
+        // 移除之前的主题样式
+        let oldThemeStyle = document.getElementById("theme-style");
+        if (oldThemeStyle) {
+          oldThemeStyle.parentNode.removeChild(oldThemeStyle);
+        }
+
+        // 创建新的样式标签并插入到 head 中
+        const style = document.createElement("style");
+        style.id = "theme-style";
+        style.type = "text/css";
+        style.innerHTML = theme.default;
+        document.head.appendChild(style);
+      } catch (error) {
+        console.error("Failed to load theme", error);
+      }
     },
   },
   render: (h) => h(App),

src/views/home/components/Menu.vue

@@ -20,7 +20,6 @@
             color="#222"
           ></SvgIcons>
         </div>
-<<<<<<< HEAD
         <span
           v-if="!isCollapse"
           @click="
@@ -30,17 +29,8 @@
             )
           "
           :class="isCollapse ? 'stop-animation' : 'active-animation'"
+          >风机运行管理平台</span
         >
-          风机运行管理平台
-        </span>
-=======
-        <span v-if="!isCollapse" @click="
-          handleChangeMenuUrl(
-            { name: '驾驶舱', id: 1, path: 'cockpitManage', iconName: 'gps' },
-            `/home/cockpitManage?name=驾驶舱`
-          )
-          " :class="isCollapse ? 'stop-animation' : 'active-animation'">风机运行管理平台</span>
->>>>>>> origin/master
       </div>
     </div>
     <el-menu
@@ -57,61 +47,57 @@
       :unique-opened="true"
       :collapse="isCollapse"
     >
-      <div v-for="item in routerList" :key="item.id">
+      <template v-for="item in routerList">
         <el-submenu
+          v-if="item.children && item.children.length"
           :index="item.path"
-          v-if="item.children && item.children.length > 0"
         >
           <template slot="title">
-            <i class="el-icon-menu" v-if="isElPrefix(item.iconName)"></i>
-            <i v-else class="svnIcon"
-              ><svg-icon :icon-class="item.iconName"
-            /></i>
+            <i v-if="isElPrefix(item.iconName)" class="el-icon-menu"></i>
+            <i v-else class="svnIcon">
+              <svg-icon :icon-class="item.iconName" />
+            </i>
             <span>{{ item.name }}</span>
           </template>
           <el-menu-item
             v-for="child in item.children"
+            v-if="child.meta?.hidden === false"
             :key="child.id"
             :index="`/home/${item.path}/${child.path}?id=${child.id}&name=${child.name}`"
           >
-            <i class="el-icon-menu" v-if="isElPrefix(child.iconName)"></i>
-            <i v-else class="svnIcon"
-              ><svg-icon :icon-class="child.iconName"
-            /></i>
+            <i v-if="isElPrefix(child.iconName)" class="el-icon-menu"></i>
+            <i v-else class="svnIcon">
+              <svg-icon :icon-class="child.iconName" />
+            </i>
             <span>{{ child.name }}</span>
           </el-menu-item>
         </el-submenu>
         <el-menu-item
+          v-else-if="item.meta?.hidden === false"
           :key="item.id"
           :index="`/home/${item.path}?id=${item.id}&name=${item.name}`"
-          v-else
         >
-          <i class="el-icon-menu" v-if="isElPrefix(item.iconName)"></i>
-          <i v-else class="svnIcon"><svg-icon :icon-class="item.iconName" /></i>
+          <i v-if="isElPrefix(item.iconName)" class="el-icon-menu"></i>
+          <i v-else class="svnIcon">
+            <svg-icon :icon-class="item.iconName" />
+          </i>
           <span>{{ item.name }}</span>
         </el-menu-item>
-      </div>
+      </template>
     </el-menu>
     <div class="foldBox flexCenter">
-<<<<<<< HEAD
       <span
         v-show="isCollapse"
         class="el-icon-s-unfold icon"
-        @click="debouncedToggleCollapse(false)"
+        @click="isCollapse = false"
+        >展开</span
       >
-        展开
-      </span>
       <span
         v-show="!isCollapse"
         class="el-icon-s-fold icon"
-        @click="debouncedToggleCollapse(true)"
+        @click="isCollapse = true"
+        >收起</span
       >
-        收起
-      </span>
-=======
-      <span v-show="isCollapse" class="el-icon-s-unfold icon" @click="isCollapse = false">展开</span>
-      <span v-show="!isCollapse" class="el-icon-s-fold icon" @click="isCollapse = true">收起</span>
->>>>>>> origin/master
     </div>
   </el-aside>
 </template>
@@ -129,14 +115,20 @@ export default {
       keyObject: {},
       routerList: [
         {
-          id:1,
+          id: 1,
           path: "cockpitManage",
           name: "驾驶舱",
           iconName: "gps",
+          meta: {
+            hidden: false,
+          },
           children: [
             {
-              id:11,
+              id: 11,
               iconName: "gps",
+              meta: {
+                hidden: false,
+              },
               path: "electronic-map",
               name: "电子地图",
             },
@@ -150,7 +142,6 @@ export default {
       ...this.routerList,
       ...this.$store.state.auth.dynamicRouter,
     ];
-    console.log(this.routerList, "组件内dynamicRouter");
   },
   computed: {
     currentMenuIndex() {