菜单样式

warehousing-system/project_web/src/components/Home.vue

@@ -109,55 +109,55 @@
 <script>
 export default {
   // 初始化函数
-  created() {
-    this.getMenuList();
+  created () {
+    this.getMenuList()
     // 设定模式选中按钮
-    this.defaultActive = window.sessionStorage.getItem("activeMenu");
+    this.defaultActive = window.sessionStorage.getItem('activeMenu')
   },
-  data() {
+  data () {
     return {
       menuList: [],
       menuIcon: {
-        1: "iconfont iconuser",
-        3: "iconfont iconshangpin",
-        5: "iconfont iconicon--copy",
-        7: "iconfont iconquanxian",
-        8: "iconfont iconziyuan",
+        1: 'iconfont iconuser',
+        3: 'iconfont iconshangpin',
+        5: 'iconfont iconicon--copy',
+        7: 'iconfont iconquanxian',
+        8: 'iconfont iconziyuan'
       },
       // 定义默认高亮
-      defaultActive: "",
-      user: "",
-    };
+      defaultActive: '',
+      user: ''
+    }
   },
   methods: {
-    logout() {
+    logout () {
       // 1.删除session中的记录
-      window.sessionStorage.clear();
+      window.sessionStorage.clear()
       // 2.要求跳转到用户登录页面
-      this.$router.push("/login");
+      this.$router.push('/login')
     },
-    async getMenuList() {
+    async getMenuList () {
       // 1.查询左侧菜单
-      const { data: result } = await this.$http.get("/rights/getRightsList");
-      if (result.status !== 200) return this.$message.error("获取权限列表失败");
-      this.menuList = result.data;
+      const { data: result } = await this.$http.get('/rights/getRightsList')
+      if (result.status !== 200) return this.$message.error('获取权限列表失败')
+      this.menuList = result.data
     },
     // 设定左侧折叠展开效果
-    collspseClick() {
-      this.isCollapse = !this.isCollapse;
+    collspseClick () {
+      this.isCollapse = !this.isCollapse
     },
-    defaultActiveMenu(activeMenu) {
+    defaultActiveMenu (activeMenu) {
       // 为了实现返回之后的选中效果,应该将数据保存到第三方中sessionStory
-      window.sessionStorage.setItem("activeMenu", activeMenu);
-      this.defaultActive = activeMenu;
-    },
+      window.sessionStorage.setItem('activeMenu', activeMenu)
+      this.defaultActive = activeMenu
+    }
   },
 
-  mounted() {
+  mounted () {
     // this.user = window.sessionStorage.getItem('token').substr(32)
-    this.user = "9a3860f0f2af471982e919657099913dddd";
-  },
-};
+    this.user = '9a3860f0f2af471982e919657099913dddd'
+  }
+}
 </script>
 
 <!-- 防止样式重叠 -->
@@ -182,7 +182,24 @@ export default {
      background-color: #087dba!important;
 }
 /deep/ .el-submenu__title i {
-     color: #fff; 
+     color: #fff;
+}
+
+/deep/ .el-submenu__title {
+  height: 40px !important;
+  line-height: 40px !important;
+  font-size: 15px!important;
+}
+
+/deep/ .el-submenu .el-menu-item {
+  height: 40px !important;
+  line-height: 40px !important;
+}
+
+/deep/ .el-menu-item {
+  height: 40px !important;
+  line-height: 40px !important;
+  font-size: 15px!important;
 }
 .el-aside {
   background-color: #55007f;
@@ -364,7 +381,7 @@ export default {
   .one-title{
     margin-top: 40px;
     .el-menu-item i {
-     color: #fff; 
+     color: #fff;
 }
   }
 }