fix：修改样式 增加默认打开选中

src/views/statistics/RouteView.vue

@@ -1,16 +1,17 @@
 <template>
   <a-card :bordered="false">
     <a-layout id="components-layout-demo-custom-trigger" style="height: 100%">
-      <a-layout-sider theme="light" v-model="collapsed" :trigger="null" collapsible width="292px">
+      <a-layout-sider theme="light" v-model="collapsed" :trigger="null" collapsible width="320px">
         <div>
           <a-menu
             id="dddddd"
-            :default-selected-keys="['1']"
+            :defaultSelectedKeys="defaultSelectedKeys"
-            :default-open-keys="['2']"
+            :defaultOpenKeys="defaultOpenKeys"
             mode="inline"
             :inline-collapsed="collapsed"
             @openChange="onOpenChange"
             @click="menuClick"
+            :inlineIndent="13"
           >
             <!-- 菜单遍历的开始 -->
             <template v-for="(item, index) in menus">
@@ -18,7 +19,6 @@
               <a-menu-item v-if="!item.children" :key="item.path">
                 <span>{{ item.meta.title }}</span>
                 <div class="line"></div>
-                <div class="line-base"></div>
               </a-menu-item>
               <!-- 否则视为子菜单，传入菜单信息并且运用下面定义的函数式组件 -->
               <sub-menu v-else :key="item.path" :menu-info="item" :menu-index="index" />
@@ -43,7 +43,6 @@ const SubMenu = {
           <span slot="title" >
             <span>{{ menuInfo.meta.title }}</span>
             <div class="line"></div>
-            <div class="line-right"></div>
             <img src="@/assets/images/global/delete.png" alt="" />
           </span>
           <template v-for="item in menuInfo.children">
@@ -91,19 +90,19 @@ export default {
       // 展开的父菜单项
       openKeys: [],
       // 选中的子菜单项
-      defaultSelectedKeys: [this.$route.path],
+      defaultSelectedKeys: [],
+      defaultOpenKeys: [],
       rootSubmenuKeys: ['/istatistics/imsData', '/istatistics'],
     }
   },
   created() {
-    console.info(this.$store.getters.permissionList)
     var permissionList = this.$store.getters.permissionList
     permissionList.forEach((f) => {
       if (f.name === 'istatistics') {
         this.menus = f.children
       }
     })
-    console.info(this.menus)
+    this.initDefaultKeys(this.menus[0])
     // 将从缓存中取出openKeys
     const openKeys = window.sessionStorage.getItem('openKeys')
     if (openKeys) {
@@ -119,6 +118,20 @@ export default {
         path: key,
       })
     },
+    initDefaultKeys(data) {
+      this.defaultOpenKeys.push(data.path)
+      data.children.some((f) => {
+        if (f.children) {
+          // 第一个节点展开
+          this.defaultOpenKeys.push(f.path)
+          this.initDefaultKeys(f.children[0])
+        } else {
+          // 选中
+          this.defaultSelectedKeys.push(f.path)
+          return true;
+        }
+      })
+    },
     onOpenChange(openKeys) {
       // 将当前打开的父级菜单存入缓存中
       window.sessionStorage.setItem('openKeys', JSON.stringify(openKeys))
@@ -141,7 +154,7 @@ export default {
   }
 }
 .ant-menu {
-  width: 292px;
+  width: 320px;
   height: 939px;
   background-color: #022024;
   border: solid 1px #0c6a66;
@@ -200,9 +213,8 @@ export default {
   color: #ffffff !important;
   height: 50px;
   .line {
-    width: 92%;
+    width: 96%;
     height: 5px;
-    // background-color: #0cebc9;
     background-image: linear-gradient(
       to right,
       #0cebc9 70px,