no message

src/layout/components/Sidebar/Logo.vue

@@ -3,11 +3,11 @@
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
         <img v-if="logo" src="@/assets/login/geLi_logo2.png" class="sidebar-logo-2" />
-        <!-- <h1 v-else class="sidebar-title">{{ title }}</h1> -->
+        <h1 v-else class="sidebar-title">工单客服管理系统</h1>
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="/">
         <img v-if="logo" src="@/assets/login/geLi_logo2.png" class="sidebar-logo" />
-        <!-- <h1 class="sidebar-title">{{ title }}</h1> -->
+        <h1 class="sidebar-title">工单客服管理系统</h1>
       </router-link>
     </transition>
   </div>
@@ -63,7 +63,7 @@ export default {
       // margin-right: 12px;
     }
 
-    & .sidebar-logo-2{
+    & .sidebar-logo-2 {
       width: 32px;
       height: 32px;
       vertical-align: middle;

src/layout/components/Sidebar/index.vue

@@ -13,7 +13,7 @@
         mode="vertical"
       >
         <template v-for="route in routes">
-          <sidebar-item  v-if="route.status" :key="route.path" :item="route" />
+          <sidebar-item v-if="route.status" :key="route.path" :item="route" />
         </template>
       </el-menu>
     </el-scrollbar>

src/styles/sidebar.scss

@@ -91,6 +91,10 @@
       color: $subMenuActiveText !important;
     }
 
+    .el-submenu__title i {
+      color: $subMenuActiveText !important;
+    }
+
     & .nest-menu .el-submenu > .el-submenu__title,
     & .el-submenu .el-menu-item {
       min-width: $sideBarWidth !important;
@@ -100,6 +104,10 @@
         background-color: $subMenuHover !important;
       }
     }
+
+    .el-menu-item.is-active {
+      background-color: $menuActiveBg !important;
+    }
   }
 
   .hideSidebar {
@@ -234,3 +242,20 @@
     }
   }
 }
+.menu_module_fj .select::before {
+  content: '';
+  border-bottom: 2px solid $menuActiveBg !important;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  left: 0;
+}
+.menu_module_fj .item {
+  font-weight: bold;
+}
+.menu_module_fj .select {
+  position: relative;
+  color: $menuActiveBg !important;
+  border-bottom: none !important;
+}

src/styles/variables.scss

@@ -8,21 +8,23 @@
 
 // $subMenuBg:#1f2d3d;
 // $subMenuHover:#001528;
+
 $menuText: #ffffff;
-$menuActiveText: #409eff;
-$subMenuActiveText: #409eff; //https://github.com/ElemeFE/element/issues/12951
+$menuActiveText: #ffffff;
+$subMenuActiveText: #ffffff;
+$menuActiveBg: #3d8ffd;
 
-$menuBg: #001529;
-$menuHover: #000d18;
+$menuBg: #2261e0;
+$menuHover: #3d8ffd;
 
-$subMenuBg: #001529;
-$subMenuHover: #000d18;
+$subMenuBg: #2261e0;
+$subMenuHover: #3d8ffd;
 
 $sideBarWidth: 210px;
 
 // logo
 $logoText: #ffffff;
-$logoBg: #002140;
+$logoBg: #2261e0;
 
 // navbar
 $navbarBg: #ffffff;
@@ -32,7 +34,6 @@ $navbarActiveText: #ffffff;
 $min-width: 1280px;
 $min-height: 720px;
 
-
 // the :export directive is the magic sauce for webpack
 // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
 :export {