菜单修改

src/layout/components/Sidebar/index.vue

 <template>
-  <div :class="{'has-logo':showLogo}">
+  <div :class="{ 'has-logo': showLogo }">
 
     <el-scrollbar wrap-class="scrollbar-wrapper">
-      <el-menu
+    <!-- <el-menu
         :default-active="activeMenu"
         :collapse="isCollapse"
         :background-color="variables.menuBg"
@@ -11,9 +11,17 @@
         :active-text-color="variables.menuActiveText"
         :collapse-transition="false"
         mode="vertical"
-      >
-        <sidebar-item v-for="(route,index) in permission_routes" :key="route.path+index" :item="route" :base-path="route.path" />
-      </el-menu>
+      > -->
+    <template v-for="(item, index) in permission_routes">
+      <div v-if="!item.hidden && item.meta" :class="$route.path == item.path ? 'newMenuList newmact' : 'newMenuList'"
+        @click="toPath(item.path)">
+        <!-- <sidebar-item  v-for="(route,index) in permission_routes"  :key="route.path+index" :item="route" :base-path="route.path" /> -->
+        <svg-icon v-if="item.meta" :icon-class=item.meta.icon
+          style="width: 44px;height: 44px;margin-bottom: 15px; margin-right: 0px !important" />
+        <div v-if="item.meta">{{ item.meta.title }}</div>
+      </div>
+    </template>
+    <!-- </el-menu> -->
   </el-scrollbar>
   </div>
 </template>
@@ -33,6 +41,7 @@ import themeHvariables from '@/styles/themeH/variables.scss'
 import themeIvariables from '@/styles/themeI/variables.scss'
 export default {
   components: { SidebarItem, Logo },
+
   computed: {
     ...mapGetters([
       'permission_routes',
@@ -69,13 +78,43 @@ export default {
         return themeGvariables
       } else if (localStorage.getItem('theme') === '8') {
         return themeHvariables
-      }else if (localStorage.getItem('theme') === '9') {
+      } else if (localStorage.getItem('theme') === '9') {
         return themeIvariables
       }
     },
     isCollapse() {
       return !this.sidebar.opened
     }
+  },
+  created() {
+    console.log("dsdas", this.permission_routes)
+    console.log("2213", this.$route.path)
+  },
+  methods: {
+    toPath(path) {
+      this.$router.push(path)
+    }
   }
 }
 </script>
+<style lang="scss">
+.newMenuList {
+  width: 140px;
+  padding-top: 24px;
+  height: 149px;
+  margin: 0 auto 20px;
+  font-size: 24px;
+  color: white;
+  text-align: center;
+  opacity: 0.2;
+  background: #225BDE;
+  box-shadow: 0 2px 2px 0 #ACB2C1;
+  border-radius: 20px;
+}
+
+.newmact {
+  background: linear-gradient(180deg, #679CF6 0%, #4072EE 100%) !important;
+  opacity: 1 !important;
+ 
+}
+</style>

src/layout/components/bdHeader.vue

@@ -156,7 +156,7 @@ export default {
 <style lang="scss" scoped>
 .navbar {
     height: 100px;
-    padding: 21px 0;
+    padding: 21px 15px;
     overflow: hidden;
     position: relative;
     background: #FFF !important;
@@ -191,7 +191,7 @@ export default {
         .change-sys {
             margin-left: 20px;
         }
-        margin-right: 74px;
+        // margin-right: 74px;
     }
 
     .title-status {

src/styles/themeI/common.scss

+body{
+  background-image: linear-gradient(180deg, #fff 0%, #C3D5FD 100%) !important;
+}
 //table区域样式
 .tablearea {
   width: 98%;
@@ -319,7 +322,9 @@
 .navbar {
   background-color: #fafafb !important;
 }
-
+.navbar .right-menu .avatar-container .avatar-wrapper{
+  color: #225BDE;
+}
 .app-main {
   // background-color: #fafafb !important;
   background: none !important

src/styles/themeI/sidebar.scss

@@ -16,7 +16,8 @@
     height: 100%;
     position: fixed;
     font-size: 0px;
-    top: 120px;
+    top: 100px;
+    padding-top: 40px;
     bottom: 0;
     left: 0;
     z-index: 1001;
@@ -292,7 +293,8 @@
     .el-menu-item {
       background-color: #171725 !important;
       color: #fff !important;
-
+      width: 140px !important;
+      height: 149px !important;
       &.is-active {
         color: #e7e7e7 !important;
       }

src/styles/themeI/variables.scss

@@ -84,10 +84,10 @@ $menuText:#fff;
 $menuActiveText:#fff;
 $subMenuActiveText:#fff; //https://github.com/ElemeFE/element/issues/12951
 
-$menuBg: #1d2b36;
+$menuBg: #FFF;
 $menuHover:#2288ff;
 
-$subMenuBg:#1A2229;
+$subMenuBg:#FFF;
 $subMenuHover:#1D2B36;
 
 $sideBarWidth: 13.25rem;