菜单对接

src/layout/layout-part/menus.vue

@@ -1,12 +1,7 @@
 <template>
   <div id="menus">
     <el-menu :default-active="activeMenu" active-text-color="#850000" @select="changeMenu">
-      <el-menu-item
-        v-for="(item, index) in menuList"
-        :key="index"
-        :index="item.path"
-        :style="`${activeMenu === item.path ? 'border-left:2px solid #850000' : ''}`"
-      >
+      <el-menu-item v-for="(item, index) in list" :key="index" :index="item.path" :style="`${activeMenu === item.path ? 'border-left:2px solid #850000' : ''}`">
         <span slot="title">{{ item.name }}</span>
       </el-menu-item>
     </el-menu>
@@ -22,8 +17,11 @@ export default {
   },
   data: () => ({
     activeMenu: '',
+    list: [],
   }),
-  created() {},
+  created() {
+    this.getMenu();
+  },
   mounted() {
     this.getPage();
   },
@@ -36,6 +34,35 @@ export default {
     },
   },
   methods: {
+    getMenu() {
+      let route = this.$route.path;
+      let menu = sessionStorage.getItem('menu');
+      if (menu) {
+        menu = JSON.parse(menu);
+        let res = menu.filter(fil => {
+          if (fil.path === route) return;
+          else {
+            let is_this = false;
+            if (fil.children) {
+              for (const item of fil.children) {
+                if (item.path === route) {
+                  is_this = true;
+                  break;
+                }
+              }
+            }
+            return is_this;
+          }
+        });
+        if (res.length > 0) {
+          let this_menu = res[0];
+          if (this_menu.children.length > 0) {
+            this_menu = this_menu.children;
+          }
+          this.$set(this, `list`, this_menu);
+        }
+      }
+    },
     changeMenu(val) {
       this.$router.push({ path: val });
       this.$set(this, `activeMenu`, val);

src/layout/layout-part/top-menu.vue

@@ -23,9 +23,9 @@
             <template slot="title">
               {{ item.name }}
             </template>
-            <el-menu-item v-for="(sub, subIndex) in item.children" :key="subIndex" :index="path">{{ sub.name }}</el-menu-item>
+            <el-menu-item v-for="(sub, subIndex) in item.children" :key="subIndex" :index="sub.path || '/'">{{ sub.name }}</el-menu-item>
           </el-submenu>
-          <el-menu-item v-else :index="item.path" :key="index">{{ item.name }}</el-menu-item>
+          <el-menu-item v-else :index="item.path || '/'" :key="index">{{ item.name }}</el-menu-item>
         </template>
       </el-menu>
     </el-col>
@@ -49,8 +49,10 @@ export default {
     ...mapActions(['menuOperation']),
     async loadMenu() {
       let menu = sessionStorage.getItem('menu');
-      if (menu) return;
-      else this.getMenu();
+      if (menu) {
+        this.$set(this, `menu`, JSON.parse(menu));
+        return;
+      } else this.getMenu();
     },
     async getMenu() {
       let site = '99991';
@@ -85,6 +87,7 @@ export default {
           if (index > -1) fMenu[index].children.push(item);
         });
         this.$set(this, `menu`, fMenu);
+        sessionStorage.setItem('menu', JSON.stringify(fMenu));
       }
     },
   },