qdt-admin-layout 1.0.2 → 1.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qdt-admin-layout",
-  "version": "1.0.2",
+  "version": "1.0.6",
   "description": "基于element-ui的后台管理layout的管家婆改版",
   "main": "src/index.js",
   "module": "dist/esm/index.js",

package/src/component/ElMenu/sub.vue

@@ -92,7 +92,7 @@ export default {
                 {this.$slots.default.map((item) => {
                   return (
                     <ul
-                      style="display:inline-block;width:200px;vertical-align: top;margin:0;box-shadow: 0 0 black;border-radius:0px"
+                      style="display:inline-block;width:200px;vertical-align: top;margin:0;"
                       class={this.popupMenuClass}
                     >
                       {item}

package/src/component/Header/index.vue

@@ -25,7 +25,7 @@ export default {
         !appGetters.isMobile &&
         appGetters.showLogo &&
         (appGetters.navMode === "head" || appGetters.struct === "top-bottom");
-      return renderLogo && <Logo show-title />;
+      return renderLogo && <Logo />;
     },
     // 左侧汉堡包
     defaultHamburger() {

package/src/component/Layout/style.scss

@@ -28,11 +28,11 @@
   // 左右结构
   &.left-right {
     > header {
-      grid-column-start: 2;
+      grid-column-start: 1;
     }
 
     > aside {
-      grid-row-start: 1;
+      grid-row-start: 2;
 
       // 左右结构时，侧边栏z-index需大于顶栏
       // 上下结构时，侧边栏z-index需小于顶栏

package/src/component/NavMenu/index.vue

@@ -122,27 +122,25 @@ export default {
       const noContent =
         depth === 1 && this.collapse && this.mode === "vertical";
       return (
-        <div key="index">
-          <SubMenu
-            key={fullPath}
-            index={fullPath}
-            inline-indent={this.inlineIndent}
-            popper-class={this.themeClass}
-            popper-append-to-body
-          >
-            <template slot="title">
-              {depth == 1 && (
-                <div style="padding: 10% 0;">
-                  {this.renderMenuIcon(h, menu, depth)}
-                  <div>{menu.meta.title}</div>
-                </div>
-              )}
-
-              {!noContent && this.renderMenuContent(h, menu, depth)}
-            </template>
-            {children}
-          </SubMenu>
-        </div>
+        <SubMenu
+          key={fullPath}
+          index={fullPath}
+          inline-indent={this.inlineIndent}
+          popper-class={this.themeClass}
+          popper-append-to-body
+        >
+          <template slot="title">
+            {depth == 1 && (
+              <div style="padding: 10% 0;">
+                {this.renderMenuIcon(h, menu, depth)}
+                <div>{menu.meta.title}</div>
+              </div>
+            )}
+
+            {!noContent && this.renderMenuContent(h, menu, depth)}
+          </template>
+          {children}
+        </SubMenu>
       );
     },
     // 渲染有子级且需要显示父级的菜单
@@ -159,7 +157,9 @@ export default {
               style="font-weight:800;color:black"
               class="popover-menu__title"
             >
-              {this.renderMenuContent(h, x, depth)}
+              <div class="title-boder">
+                {this.renderMenuContent(h, x, depth)}
+              </div>
             </div>
             <div class="el-menu el-menu--inline">{childrens}</div>
           </div>

package/src/component/NavMenu/style.scss

@@ -1,7 +1,5 @@
 .menu-display {
   margin-left: 5px;
-  border-radius: 2px;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
   ul {
     border-left: 1px solid rgb(228, 231, 237);
   }
@@ -9,6 +7,11 @@
     border: none;
   }
 }
+.title-boder {
+  height: 38px;
+  border-bottom: 1px solid rgb(228, 231, 237);
+}
+
 .el-menu--collapse .el-submenu {
   height: 88px !important;
 }
@@ -19,7 +22,8 @@
   // 菜单图标
   .menu-icon {
     color: inherit;
-    font-size: 38px;
+    font-size: 34px;
+    margin-bottom: 5px;
   }
 
   // 子级菜单激活时，父级同样高亮
@@ -61,19 +65,29 @@
 //菜单hover时，左侧图标放大（弹出菜单的父级不放大）
 .el-menu-item:not(.popover-menu__title),
 .el-submenu__title {
-  > .menu-icon,
-  > .el-tooltip > .menu-icon {
+  .menu-icon {
     transition: transform 0.1s;
   }
 
   &:hover {
-    > .menu-icon,
-    > .el-tooltip > .menu-icon {
+    .menu-icon {
       transform: scale(1.2);
     }
   }
 }
 
+.el-menu--popup {
+  .popover-menu__title {
+    height: 40px !important;
+    line-height: 40px !important;
+    border: none;
+  }
+  .el-menu-item {
+    height: 40px !important;
+    line-height: 40px !important;
+  }
+}
+
 .el-menu-item,
 .el-submenu__title {
   text-overflow: ellipsis;
@@ -134,8 +148,8 @@
     // 顶级节点的高度以及hover时的下边框
     > .el-menu-item,
     > .el-submenu > .el-submenu__title {
-      height: $header-height;
-      line-height: $header-height;
+      height: 40px;
+      line-height: 40px;
 
       &:hover {
         border-bottom: 2px solid $--color-primary;