用户左侧菜单请求0621

src/api/common.js

@@ -13,6 +13,7 @@ const uploadProcessBar = basePart + '/simulation/resource/common/minio/uploadPro
 const createMultipartUpload = basePart + '/simulation/resource/common/minio/createMultipartUpload'; // 分片上传-请求上传地址
 const completeMultipartUpload = basePart + '/simulation/resource/common/minio/completeMultipartUpload'; // 分片上传-文件合并地址
 
+const getMyMenuTree = '/simulation/resource/server/menu/getMyMenuTree';  //获取左侧菜单
 
 export default {
     single,
@@ -27,7 +28,9 @@ export default {
     uploadProcessBar,
 
     createMultipartUpload,
-    completeMultipartUpload
+    completeMultipartUpload,
+
+    getMyMenuTree
 }
 
 //10.15.12.74:7001/simulation/oauth/client/sign/single?code=1001&ticket=1001

src/views/index.vue

@@ -1,6 +1,6 @@
 <template>
     <div id="main" v-bind:class="{ fold: isFold }">
-        <page-menu @menuFold="menuFold" ref="menu"></page-menu>
+        <page-menu @menuFold="menuFold" :menuItems="menuItems" ref="menu"></page-menu>
         <bread-crumb></bread-crumb>
         <router-view class="mainBox" ref="curRouter"></router-view>
     </div>
@@ -20,12 +20,26 @@ export default {
     data() {
         return {
             isFold: false, // menu是否折叠
+            menuItems:[]
         };
     },
     methods: {
         menuFold(flag) {
             this.isFold = flag;
         },
+        getMenuItems(){
+            this.$axios({
+                method: "POST",
+                url: this.$api.common.getMyMenuTree,
+                data:{}
+            }).then(res => {
+                if (res.code == 200 && res.info) {
+                    this.menuItems = res.info
+                }else{
+                    this.$message.error(res.message || '获取用户菜单失败')
+                }
+            })
+        },
     },
     created() {
         let { code, ticket } = this.$route.query;
@@ -48,11 +62,15 @@ export default {
                     this.$nextTick(() => {
                         this.$refs.curRouter.init &&
                             this.$refs.curRouter.init();
+
+                        this.getMenuItems()
                     });
                 } else {
                     this.$message.error(res.message || "网络异常");
                 }
             });
+        }else{
+            this.getMenuItems()
         }
     },
 };

src/views/login.vue

@@ -80,6 +80,7 @@ export default {
                             );
                             localStorage.setItem("refreshToken", refreshToken);
                             localStorage.setItem("expiresTime", expiresTime);
+                            localStorage.setItem("username", this.form.username)
 
                             let tokenTimer = null;
                             let toExpiresTime =

src/views/page/pageMenu.vue

@@ -14,11 +14,12 @@
                 >
                     <b class="my-icon-home is"></b>
                 </li>
+                <!--
                 <li
                     @click="menuFoldHandle(1)"
                     v-bind:class="{ isOpened: opened === 'modelLibrary' }"
                 >
-                    <b class="my-icon-menuA"></b>
+                    <b class="my-icon-model"></b>
                 </li>
                 <li
                     @click="menuFoldHandle(1)"
@@ -38,18 +39,20 @@
                 >
                     <b class="my-icon-menuD"></b>
                 </li>
-                <!-- <li
-                    @click="menuFoldHandle(1)"
-                    v-bind:class="{ isOpened: opened === 'systemManagement' }"
-                >
-                    <b class="my-icon-menuE"></b>
-                </li>
                 <li
                     @click="menuFoldHandle(1)"
                     v-bind:class="{ isOpened: opened === 'systemManagement' }"
                 >
                     <b class="my-icon-menuF"></b>
-                </li> -->
+                </li> 
+                -->
+                <li 
+                    v-for="(item, i) in menuItems" :key="i"
+                    @click="menuFoldHandle(1)"
+                    :class="{ isOpened: opened === item.id }"
+                >
+                    <b :class="item.icon"></b>
+                </li>
             </ul>
 
             <div class="menuList" v-show="!menuFold">
@@ -67,9 +70,11 @@
                         <i class="my-icon-home"></i>
                         <span>首页</span>
                     </el-menu-item>
+                    
+                    <!--
                     <el-submenu :index="menus[1]">
                         <template slot="title">
-                            <i class="my-icon-menuA"></i>
+                            <i class="my-icon-model"></i>
                             <span>模型库</span>
                         </template>
                         <el-menu-item index="/sensorModel"
@@ -84,7 +89,7 @@
                     </el-submenu>
                     <el-submenu :index="menus[2]">
                         <template slot="title">
-                            <i class="my-icon-menuB"></i>
+                            <i class="my-icon-algo"></i>
                             <span>算法库</span>
                         </template>
                         <el-menu-item index="/algorithmsLibraryList"
@@ -96,7 +101,7 @@
                     </el-submenu>
                     <el-submenu :index="menus[3]">
                         <template slot="title">
-                            <i class="my-icon-menuC"></i>
+                            <i class="my-icon-scene"></i>
                             <span>场景库</span>
                         </template>
                         <el-menu-item index="/naturalDrivingScenarioList"
@@ -119,7 +124,7 @@
                     </el-submenu>
                     <el-submenu :index="menus[4]">
                         <template slot="title">
-                            <i class="my-icon-menuD"></i>
+                            <i class="my-icon-work"></i>
                             <span>工作管理</span>
                         </template>
                         <el-menu-item index="/manualRunProjectList"
@@ -128,7 +133,7 @@
                     </el-submenu>
                     <el-submenu :index="menus[5]">
                         <template slot="title">
-                            <i class="my-icon-menuF"></i>
+                            <i class="my-icon-system"></i>
                             <span>系统管理</span>
                         </template>
                         <el-menu-item index="/accountManagement"
@@ -137,9 +142,21 @@
                         <el-menu-item index="/parameterManagement"
                             >参数管理</el-menu-item
                         >    
-                        <el-menu-item index="clusteringManagement"
+                        <el-menu-item index="/clusteringManagement"
                             >集群管理</el-menu-item>
                     </el-submenu>
+                    -->
+
+                    <el-submenu v-for="(item, i) in menuItems" :index="item.id" :key="i">
+                        <template slot="title">
+                            <i :class="item.icon"></i>
+                            <span>{{item.name}}</span>  
+                        </template>
+                        <el-menu-item v-for="(item2, i2) in item.children" :index="item2.router" :key="i2">
+                            {{item2.name}}
+                        </el-menu-item>
+                    </el-submenu>
+
                 </el-menu>
             </div>
         </div>
@@ -151,12 +168,18 @@ import { mapState } from "vuex";
 
 export default {
     name: "pageMenu",
+    props:{
+        menuItems:{
+            type: Array,
+            default(){return []}
+        }
+    },
     data() {
         return {
             menuFold: false, // menu是否折叠
             opened: false,
             menus: [
-                "/mainPage",
+                "mainPage",
                 "modelLibrary",
                 "algorithmsLibrary",
                 "sceneLibrary",
@@ -165,7 +188,7 @@ export default {
             activeMenu: "mainPage", // 当前menu
             expiresTime: '',
             toExpiresTime: '',
-            tokenTimer: undefined   
+            tokenTimer: undefined,
         };
     },
     computed: {
@@ -195,6 +218,11 @@ export default {
             }
         }
     },
+    watch:{
+        activeMenu(newV){
+            console.log(newV)
+        }
+    },
     methods: {
         menuFoldHandle(val) {
             if (val) {
@@ -350,34 +378,6 @@ export default {
     }
 }
 
-.my-icon-home {
-    background: url("../../assets/common/image/menu/home.png") center no-repeat;
-}
-
-.my-icon-menuA {
-    background: url("../../assets/common/image/menu/menuA.png") center no-repeat;
-}
-
-.my-icon-menuB {
-    background: url("../../assets/common/image/menu/menuB.png") center no-repeat;
-}
-
-.my-icon-menuC {
-    background: url("../../assets/common/image/menu/menuC.png") center no-repeat;
-}
-
-.my-icon-menuD {
-    background: url("../../assets/common/image/menu/menuD.png") center no-repeat;
-}
-
-.my-icon-menuE {
-    background: url("../../assets/common/image/menu/menuE.png") center no-repeat;
-}
-
-.my-icon-menuF {
-    background: url("../../assets/common/image/menu/menuF.png") center no-repeat;
-}
-
 .menuFold {
     li {
         display: flex;
@@ -474,4 +474,32 @@ export default {
         bottom: 30px;
     }
 }
+
+.my-icon-home {
+    background: url("../../assets/common/image/menu/home.png") center no-repeat;
+}
+
+.my-icon-model {
+    background: url("../../assets/common/image/menu/menuA.png") center no-repeat;
+}
+
+.my-icon-algo {
+    background: url("../../assets/common/image/menu/menuB.png") center no-repeat;
+}
+
+.my-icon-scene {
+    background: url("../../assets/common/image/menu/menuC.png") center no-repeat;
+}
+
+.my-icon-work {
+    background: url("../../assets/common/image/menu/menuD.png") center no-repeat;
+}
+
+.my-icon-menuE {
+    background: url("../../assets/common/image/menu/menuE.png") center no-repeat;
+}
+
+.my-icon-system {
+    background: url("../../assets/common/image/menu/menuF.png") center no-repeat;
+}
 </style>