Browse Source

修改一级菜单

lex-xin 4 years ago
parent
commit
51d45cea51

+ 1 - 1
src/App.vue

@@ -377,7 +377,7 @@ input[type="number"] {
     background-color: #F56C6C;
     border-radius: 50%;
     right: -10px;
-    top: 15px;
+    top: -4px;
   }
 }
 </style>

File diff suppressed because it is too large
+ 0 - 0
src/assets/images/base/base-bell.svg


+ 31 - 11
src/layout/components/Navbar.vue

@@ -32,7 +32,7 @@
       </el-popover>
     </div> -->
     <div class="right-menu">
-      <div class="msginfo" v-permission="'/journals'" @click="gotoRecode">
+      <div class="msginfo" v-permission="'/journal'" @click="gotoRecode">
         <img src="@/assets/images/base/base-bell.svg" />
         <!-- <div class="active"></div> -->
       </div>
@@ -62,6 +62,25 @@
           </el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
+
+      <div class="left-menu">
+        <i class="el-icon-location-information topIcon"></i>
+
+        <el-popover placement="top-start" width="300" trigger="hover">
+          <div class="popover-container">
+            <el-tag
+              class="navbar_tag"
+              type="info"
+              v-for="item in organNameList"
+              :key="item"
+              >{{ item }}</el-tag
+            >
+          </div>
+          <span slot="reference">{{
+            organName.length > 10 ? organName.substr(0, 10) + "..." : organName
+          }}</span>
+        </el-popover>
+      </div>
     </div>
     <el-dialog
       title="修改密码"
@@ -293,7 +312,7 @@ export default {
     padding: 0 15px;
     height: 57px;
     text-decoration: none;
-    color: #000;
+    color: #fff;
     font-size: 15px;
     transition: all .3s ease;
     span {
@@ -309,7 +328,7 @@ export default {
       }
     }
     &.active {
-      background-color: #F5F5F5;
+      background-color: #2C3246;
     }
   }
   .breadcrumb{
@@ -332,7 +351,7 @@ export default {
   height: 60px;
   overflow: hidden;
   position: relative;
-  background: #fff;
+  background: #363d55;
   box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.1);
   h2 {
     font-size: 18px;
@@ -358,16 +377,16 @@ export default {
   }
   .left-menu {
     line-height: 60px;
-    padding-left: 22px;
+    padding-right: 42px;
     font-size: 16px;
-    color: #444;
+    color: #fff;
     .topIcon {
       width: 20px;
       height: 25px;
     }
   }
   .right-menu {
-    min-width: 204px;
+    min-width: 154px;
     float: right;
     height: 100%;
     line-height: 60px;
@@ -382,7 +401,7 @@ export default {
       flex-direction: row;
       justify-content: flex-start;
       align-items: center;
-      margin-right: 34px;
+      margin-right: 20px;
       position: relative;
       cursor: pointer;
       img {
@@ -419,7 +438,7 @@ export default {
 
     .avatar-container {
       height: 60px;
-      margin-right: 42px;
+      margin-right: 12px;
       cursor: pointer;
 
       .avatar-wrapper {
@@ -429,10 +448,11 @@ export default {
         justify-content: flex-start;
         align-items: center;
         span {
-          margin-left: 15px;
+          margin-left: 8px;
           font-size: 14px;
           font-weight: 500;
-          color: rgba(68, 68, 68, 1);
+          // color: rgba(68, 68, 68, 1);
+          color: #fff;
         }
 
         .user-avatar {

+ 41 - 1
src/layout/components/Sidebar/SidebarMenuItem.vue

@@ -66,7 +66,7 @@ export default {
                 return this.activeTopMenu;
             }
             const route = this.$route;
-            /* 
+            /*
             const { meta, path } = route;
             if (meta.belongTopMenu) {
                 return meta.belongTopMenu;
@@ -79,7 +79,36 @@ export default {
             return this.resolvePathUrl(this.routes.path);
         }
     },
+    mounted() {
+        this.onlyOneChild = null;
+    },
     methods: {
+        hasOneShowingChild(children = [], parent) {
+            const showingChildren = children.filter((item) => {
+                if (item.hidden) {
+                return false;
+                } else  {
+                // Temp set(will be used if only has one showing child)
+                this.onlyOneChild = item;
+                return true;
+                }
+            });
+
+            // When there is only one child router, the child router is displayed by default
+
+            if (showingChildren.length === 1) {
+                // console.log(showingChildren[0].meta.title)
+                return true;
+            }
+
+            // Show parent if there are no child router to display
+            if (showingChildren.length === 0) {
+                this.onlyOneChild = { ...parent, path: "", noShowingChildren: true };
+                return true;
+            }
+
+            return false;
+        },
         menuIsShow(route) {
             let activeTopMenu = this.getBasePath;
             const { meta } = route;
@@ -96,15 +125,26 @@ export default {
                     return true;
                 }
             });
+            // console.log(showChildren)
             if (showChildren.length > 0) {
                 return true;
             }
             return false;
         },
+        // resolvePath(routePath) {
+        //     if (isExternal(routePath)) {
+        //         return routePath;
+        //     }
+        //     if (isExternal(this.basePath)) {
+        //         return this.basePath;
+        //     }
+        //     return path.resolve(this.basePath, routePath);
+        // },
         resolvePathUrl(routePath) {
             if (isExternal(routePath)) {
                 return routePath;
             }
+            // console.log(this.resolvePath, routePath)
             return path.resolve(this.resolvePath, routePath);
         }
     }

+ 1 - 1
src/layout/components/Sidebar/index.vue

@@ -73,7 +73,7 @@ export default {
     },
     getTopMenuActive() {
       let route = this.$route;
-      console.log(getBelongTopMenuPath(route))
+      // console.log(getBelongTopMenuPath(route))
       return getBelongTopMenuPath(route);
     }
   }

+ 1 - 0
src/router/index.js

@@ -423,6 +423,7 @@ export const asyncRoutes = {
   afterSchoolManagerWrap:()=>import('@/views/courseListManager'),
   //
   serverIndexManager:()=>import('@/views/courseListManager'),
+  reportFormCenter:()=>import('@/views/courseListManager'),
   // 乐器维护
   musicalManager:()=>import('@/views/musicalManager'),
   // 服务指标明细

+ 1 - 1
src/store/modules/app.js

@@ -51,7 +51,7 @@ const mutations = {
 const toggleDot = status => {
   const { indexErrData, remindMatterData } = status
   const dotStatus =  indexErrData || remindMatterData
-  const el = document.querySelector('.menu-wrapper a[href="#/main/main"] span')
+  const el = document.querySelector('.el-menu a[href="#/main/main"] span')
   if (el) {
     if (dotStatus) {
       el.classList.add('main-dot')

+ 5 - 0
src/styles/sidebar.scss

@@ -94,6 +94,11 @@
         background-color: $subMenuHover!important;
       }
     }
+    & .el-menu-item {
+      &:hover {
+        background-color: $subMenuHover!important;
+      }
+    }
   }
   .el-submenu .el-menu-item.is-active {
     background-color: $subMenuActiveBg!important;

+ 1 - 1
src/views/main/index.vue

@@ -86,7 +86,7 @@ export default {
     };
   },
   mounted(){
-    console.log(permission('/main/main/allData/826'))
+    // console.log(permission('/main/main/allData/826'))
 
   },
   computed: {

Some files were not shown because too many files changed in this diff