Pārlūkot izejas kodu

Merge branch 'fixicon'

ldong 4 mēneši atpakaļ
vecāks
revīzija
a4c4fcbcc1

BIN
src/assets/icons/menu/active-icon01.png


BIN
src/assets/icons/menu/active-icon02.png


BIN
src/assets/icons/menu/active-icon03.png


BIN
src/assets/icons/menu/active-icon04.png


BIN
src/assets/icons/menu/active-icon05.png


BIN
src/assets/icons/menu/active-icon06.png


BIN
src/assets/icons/menu/active-icon07.png


BIN
src/assets/icons/menu/active-icon08.png


BIN
src/assets/icons/menu/active-icon09.png


BIN
src/assets/icons/menu/active-icon10.png


BIN
src/assets/icons/menu/active-icon11.png


BIN
src/assets/icons/menu/active-icon12.png


BIN
src/assets/icons/menu/icon01.png


BIN
src/assets/icons/menu/icon02.png


BIN
src/assets/icons/menu/icon03.png


BIN
src/assets/icons/menu/icon04.png


BIN
src/assets/icons/menu/icon05.png


BIN
src/assets/icons/menu/icon06.png


BIN
src/assets/icons/menu/icon07.png


BIN
src/assets/icons/menu/icon08.png


BIN
src/assets/icons/menu/icon09.png


BIN
src/assets/icons/menu/icon10.png


BIN
src/assets/icons/menu/icon11.png


BIN
src/assets/icons/menu/icon12.png


BIN
src/assets/img/icons/home_sjjd.png


+ 91 - 30
src/views/Home.vue

@@ -1,8 +1,8 @@
 <template>
   <div id="containercon">
     <el-aside :width="isCollapse ? '70px' : '200px'" v-if="isHaveAside">
-      <div id="main_left">
-        <div class="logo_cont">
+      <div id="main_left" :style="{width:isCollapse ? '70px' : '200px'}">
+        <div class="logo_cont" :class="{'no-collapse':isCollapse}">
           <!-- 正常logo尺寸 -->
           <img class="logo" v-if="!isCollapse" :src="logoLarge" />
           <!-- 折叠侧边栏logo尺寸 -->
@@ -24,6 +24,8 @@
               unique-opened
               router
               class="el-menu-vertical-demo"
+              :style="{width:isCollapse ? '70px' : '200px'}"
+              :class="{'no-collapse-menu':isCollapse}"
               @select="handleselect"
               ref="expandmenu"
             >
@@ -45,20 +47,22 @@
                     @click="handleClickSubMenuItem(item, $event)"
                   >
                     <img
-                      :src="getMenuIcon(item)"
+                      :src="item.path === activePath?getActiveMenuIcon(item):getMenuIcon(item)"
                       alt=""
-                      style="width: 24px; height: 24px"
+                      style="width: 20px; height: 20px;margin-top: -2px;"
                     />
                     <span class="titleLetter" v-show="isCollapse">{{
                       isCollapse ? MenuLetterMap[item.name] || "" : ""
                     }}</span>
                     <span
+                      class="title-text"
                       style="
                         display: inline-block;
                         width: 96px;
                         text-align: left;
-                        font-size: 15px;
-                        margin-left: 20px;
+                        font-size: 16px;
+                        margin-left: 4px;
+                        color:#1D2129
                       "
                       >{{
                         $i18nt.locale === "zh" ? item.name : item.name_en
@@ -71,18 +75,20 @@
                     <img
                       :src="getMenuIcon(item)"
                       alt=""
-                      style="width: 24px; height: 24px"
+                      style="width: 20px; height: 20px;margin-top: 2px;"
                     />
                     <span class="titleLetter" v-show="isCollapse">{{
                       isCollapse ? MenuLetterMap[item.name] || "" : ""
                     }}</span>
                     <span
+                      class="title-text"
                       style="
                         display: inline-block;
                         width: 96px;
                         text-align: left;
-                        font-size: 15px;
-                        margin-left: 20px;
+                        font-size: 16px;
+                        margin-left: 8px;
+                        color:#1D2129
                       "
                       >{{
                         $i18nt.locale === "zh" ? item.name : item.name_en
@@ -105,7 +111,7 @@
                         }`"
                         @click="handleClickSubMenuItem(second, $event)"
                       >
-                        <svg
+                        <!-- <svg
                           t="1689672247666"
                           class="icon"
                           viewBox="0 0 1024 1024"
@@ -124,8 +130,8 @@
                                 : '#666'
                             "
                           ></path>
-                        </svg>
-                        <span style="margin-left: 15px"
+                        </svg> -->
+                        <span class="title-text" style="margin-left: 29px;color:#1D2129;font-size:16px;"
                           >{{
                             $i18nt.locale === "zh"
                               ? second.name
@@ -136,8 +142,8 @@
                     </el-menu-item>
                     <el-submenu v-else :index="second.MenuId" :key="second.MenuId">
                       <template slot="title">
-                        <span style="margin-left:-20px">
-                          <svg
+                        <span >
+                          <!-- <svg
                             t="1689672247666"
                             class="icon"
                             viewBox="0 0 1024 1024"
@@ -156,8 +162,8 @@
                                   : '#666'
                               "
                             ></path>
-                          </svg>
-                          <span style="margin-left: 10px">{{
+                          </svg> -->
+                          <span class="title-text" style="margin-left: 29px;font-size:16px;color:#1D2129">{{
                             $i18nt.locale === "zh"
                               ? second.name
                               : second.name_en
@@ -177,12 +183,14 @@
                           @click="handleClickSubMenuItem(third,$event)"
                         >
                           <span
+                            class="title-text"
                             style="
                               display: inline-block;
                               width: 96px;
                               text-align: left;
-                              font-size: 15px;
-                              margin-left:40px
+                              font-size: 16px;
+                              margin-left:40px;
+                              color:#1D2129
                             "
                             >{{
                               $i18nt.locale === "zh" ? third.name : third.name_en
@@ -587,6 +595,7 @@ export default {
     };
   },
   created() {
+    this.activePath=this.$route.path?this.$route.path.split('/')[1]:'home'
     //this.isInitialPwd(); //判断是否为初始密码
     this.Role = localStorage.getItem("Role") || "";
     this.RoleType = localStorage.getItem("RoleType") || "";
@@ -623,12 +632,31 @@ export default {
         ['语义分析', require('@/assets/icons/menu/icon06.png')],
         ['BI看板', require('@/assets/icons/menu/icon07.png')],
         ['研报管理', require('@/assets/icons/menu/icon08.png')],
+        ['审批管理', require('@/assets/icons/menu/icon12.png')],
         ['任务管理', require('@/assets/icons/menu/icon09.png')],
         ['AI问答', require('@/assets/icons/menu/icon11.png')],
         ['系统设置', require('@/assets/icons/menu/icon10.png')],
       ])
       return iconMap.get(item.name) || require('@/assets/icons/menu/icon01.png')
     },
+    // 获取激活状态图片
+    getActiveMenuIcon(item) {
+      const iconMap = new Map([
+        ['首页', require('@/assets/icons/menu/active-icon01.png')],
+        ['数据分析', require('@/assets/icons/menu/active-icon02.png')],
+        ['模型应用', require('@/assets/icons/menu/active-icon03.png')],
+        ['图表工具', require('@/assets/icons/menu/active-icon04.png')],
+        ['知识资源', require('@/assets/icons/menu/active-icon05.png')],
+        ['语义分析', require('@/assets/icons/menu/active-icon06.png')],
+        ['BI看板', require('@/assets/icons/menu/active-icon07.png')],
+        ['研报管理', require('@/assets/icons/menu/active-icon08.png')],
+        ['审批管理', require('@/assets/icons/menu/active-icon12.png')],
+        ['任务管理', require('@/assets/icons/menu/active-icon09.png')],
+        ['AI问答', require('@/assets/icons/menu/active-icon11.png')],
+        ['系统设置', require('@/assets/icons/menu/active-icon10.png')],
+      ])
+      return iconMap.get(item.name) || require('@/assets/icons/menu/active-icon01.png')
+    },
     
     // 跳转数据节点
     handleGoSJJD(){
@@ -1060,6 +1088,7 @@ export default {
   overflow: hidden;
   display: flex;
   .asider-cont {
+    // padding: 12px;
     &::-webkit-scrollbar {
       width: 0 !important;
     }
@@ -1079,31 +1108,35 @@ export default {
     top: 0;
     z-index: 99;
     .logo_cont {
-      height: 60px;
+      height: 56px;
       box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
       display: flex;
       align-items: center;
-      justify-content: center;
+      justify-content: flex-start;
+      padding-left: 16px;
       border-bottom: 1px solid #dcdfe6;
       .logo {
         width: 148px;
-        height: 38px;
+        height: 40px;
         display: block;
         overflow: hidden;
       }
       .logo_coll {
-        width: 45px;
-        height: 45px;
+        width: 40px;
+        height: 40px;
         display: block;
         overflow: hidden;
       }
     }
+    .no-collapse{
+      justify-content: center;
+      padding-left: 0;
+    }
     aside {
       text-align: center;
       z-index: 10;
       margin-left: -1px;
       .el-menu {
-        width: 200px;
         height: 100%;
         box-sizing: border-box;
         /* background: #323a58 !important; */
@@ -1129,26 +1162,43 @@ export default {
           margin-right: 6px;
         }
       }
+      .el-menu-item{
+        height: 40px;
+        line-height: 40px; 
+      }
       .el-submenu .el-menu-item {
+        height: 40px;
+        line-height: 40px;
         font-size: 15px;
         padding: 0 0 0 20px !important;
         text-align: left;
+        min-width: 176px;
       }
       .el-menu-item.is-active {
-        background: #ecf2fe !important;
+        background: #E3ECFF !important;
+        border-radius: 4px !important;
         color: $theme-color !important;
         a {
           color: $theme-color !important;
         }
+        .title-text{
+          color: $theme-color !important;
+        }
       }
       .el-submenu__title {
         //padding-left: 0 !important;
         display: flex;
         align-items: center;
+        height: 40px;
+        line-height: 40px;
+      }
+      .el-submenu__title,.el-submenu .el-menu-item,.el-menu-item{
+        margin-bottom: 4px;
+        padding: 0 12px !important;
       }
       .el-level-path {
         position: relative;
-        height: 56px;
+        height: 46px;
         display: flex;
         align-items: center;
         .titleLetter {
@@ -1168,10 +1218,16 @@ export default {
       .el-menu--collapse .el-submenu__title {
         padding-left: 20px !important;
       }
+      .el-menu--collapse {
+        .el-submenu__title,.el-menu-item{
+          padding-left: 25px !important;
+        }
+      }
     }
     .el-submenu__title:hover,
     .el-menu-item:hover {
-      background: #ecf2fe !important;
+      background: #EFF4FF !important;
+      border-radius: 4px !important;
     }
     .subItem {
       overflow: hidden;
@@ -1194,7 +1250,8 @@ export default {
       // width: 200px;
       // min-height: calc(100vh - 80px);
       color: #fff;
-      padding-bottom: 20px;
+      // padding-bottom: 20px;
+      padding: 12px 12px 20px;
       overflow: hidden;
       overflow-y: auto;
       border-right: none;
@@ -1203,8 +1260,12 @@ export default {
         color: #fdb863 !important;
       } */
     }
+    .no-collapse-menu{
+      padding: 0 0 20px !important;
+    }
     .el-submenu__title > i:nth-of-type(1) {
       color: #c0c4cc !important;
+      font-size: 16px;
     }
   }
   .left_section_logo {
@@ -1219,7 +1280,7 @@ export default {
     .main_right_top {
       // width: 100%;
       background: #fff;
-      height: 60px;
+      height: 56px;
       box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
       box-sizing: border-box;
       display: flex;
@@ -1377,7 +1438,7 @@ export default {
       //padding-top: 22px;
       left: 0;
       right: 0;
-      top: 68px; //应该是60px 但为了留出header的box-shadow多移了8px
+      top: 64px; //应该是60px 但为了留出header的box-shadow多移了8px
       bottom: 0;
       z-index: 100;
       /*修改滚动条样式*/