Browse Source

左侧菜单改

mw_666 3 years ago
parent
commit
ae0bdc3c69
2 changed files with 28 additions and 21 deletions
  1. 17 19
      src/App.vue
  2. 11 2
      src/assets/styles/theme/light/light-jsc.less

+ 17 - 19
src/App.vue

@@ -249,32 +249,26 @@ l16.229-16.229l16.229,16.229l42.867-42.867C115.034,45.228,109.133,42.189,102.956
       <el-menu
         class="lightMenu"
         :class="$store.state.themeName === 'light' ? 'show' : 'hidden'"
-        default-active="2"
         :collapse="true"
         text-color="#ffffff"
         active-text-color="#6262a2"
         background-color="#36348e"
       >
-        <el-sub-menu index="1" title="菜单1">
+        <el-sub-menu :index="index" :title="item.text" v-for="(item , index) in menuData">
           <template #title>
-            <el-icon>
-              <SvgIcon svgid="svg-matrix" />
-            </el-icon>
+			  <router-link :to="item.path">
+				<el-icon>
+				  <SvgIcon :svgid="item.icon" />
+				</el-icon>
+			</router-link>
           </template>
-          <el-menu-item-group>
-            <template #title><span>Group One</span></template>
-            <el-menu-item index="1-1">item one</el-menu-item>
-            <el-menu-item index="1-2">item two</el-menu-item>
+          <el-menu-item-group v-for="(menu , idx) in item.children" :index="idx">
+			  <router-link :to="menu.path">
+				<el-menu-item :index="index+'-'+idx">{{menu.text}}</el-menu-item>
+			</router-link>
           </el-menu-item-group>
-          <el-menu-item-group title="Group Two">
-            <el-menu-item index="1-3">item three</el-menu-item>
-          </el-menu-item-group>
-          <el-sub-menu index="1-4">
-            <template #title><span>item four</span></template>
-            <el-menu-item index="1-4-1">item one</el-menu-item>
-          </el-sub-menu>
         </el-sub-menu>
-        <el-sub-menu index="2" title="菜单2">
+        <!-- <el-sub-menu index="2" title="菜单2">
           <template #title>
             <el-icon>
               <SvgIcon svgid="svg-matrix" />
@@ -292,7 +286,7 @@ l16.229-16.229l16.229,16.229l42.867-42.867C115.034,45.228,109.133,42.189,102.956
             <template #title><span>item four</span></template>
             <el-menu-item index="2-4-1">item one</el-menu-item>
           </el-sub-menu>
-        </el-sub-menu>
+        </el-sub-menu> -->
       </el-menu>
     </div>
     <div class="main-body">
@@ -339,6 +333,7 @@ export default {
       isLogined: true,
       showSisView: false,
       memuCloseTimeout: null,
+	  menuData:[]
     };
   },
 
@@ -403,7 +398,10 @@ export default {
     $route(res) {
       this.showSisView = res.fullPath === "/sisView";
     },
-    "$store.state.menuData"(res) {},
+    "$store.state.menuData"(res) {
+		console.log(res)
+		this.menuData = res;
+	},
   },
 };
 </script>

+ 11 - 2
src/assets/styles/theme/light/light-jsc.less

@@ -372,7 +372,16 @@
         color     : #fff;
         transition: @transition;
     }
-
+	
+	.el-popper.is-light.is-pure .el-menu--popup {
+	  padding:0;
+	}
+	
+	.el-popper.is-light{
+		background:transparent;
+		border:none;
+	}
+	
     .com-panel-3 {
         border    : 0;
         transition: @transition;
@@ -405,7 +414,7 @@
             transition: @transition;
         }
     }
-
+	
     background: rgb(220, 221, 223);
     transition: @transition;
 }