perf: 同步完整版分支代码

src/plugins/element-plus/index.ts

@@ -41,29 +41,15 @@ import {
   ElTabPane,
   ElAvatar,
   ElEmpty,
+  ElCollapse,
+  ElCollapseItem,
   // 指令
   ElLoading,
   ElInfiniteScroll
 } from "element-plus";
 
-// https://element-plus.org/zh-CN/component/icon.html
-import {
-  Check,
-  Menu,
-  HomeFilled,
-  SetUp,
-  Edit,
-  Setting,
-  Lollipop,
-  Link,
-  Position,
-  Histogram,
-  RefreshRight,
-  ArrowDown,
-  Close,
-  CloseBold,
-  Bell
-} from "@element-plus/icons";
+// Directives
+const plugins = [ElLoading, ElInfiniteScroll];
 
 const components = [
   ElTag,
@@ -106,9 +92,31 @@ const components = [
   ElTabs,
   ElTabPane,
   ElAvatar,
-  ElEmpty
+  ElEmpty,
+  ElCollapse,
+  ElCollapseItem
 ];
-// icon
+
+// https://element-plus.org/zh-CN/component/icon.html
+import {
+  Check,
+  Menu,
+  HomeFilled,
+  SetUp,
+  Edit,
+  Setting,
+  Lollipop,
+  Link,
+  Position,
+  Histogram,
+  RefreshRight,
+  ArrowDown,
+  Close,
+  CloseBold,
+  Bell
+} from "@element-plus/icons-vue";
+
+// Icon
 export const iconComponents = [
   Check,
   Menu,
@@ -127,14 +135,17 @@ export const iconComponents = [
   Bell
 ];
 
-const plugins = [ElLoading, ElInfiniteScroll];
-
 export function useElementPlus(app: App) {
-  components.push(...iconComponents);
+  // 注册组件
   components.forEach((component: Component) => {
     app.component(component.name, component);
   });
+  // 注册指令
   plugins.forEach(plugin => {
     app.use(plugin);
   });
+  // 注册图标
+  iconComponents.forEach((component: Component) => {
+    app.component(component.name, component);
+  });
 }

src/style/sidebar.scss

@@ -124,6 +124,12 @@
       &:hover {
         color: $menuTitleHover !important;
       }
+
+      div,
+      span {
+        height: 50px;
+        line-height: 50px;
+      }
     }
 
     .submenu-title-noDropdown,
@@ -486,7 +492,7 @@
     > .el-sub-menu__title::before {
     position: absolute;
     top: 0;
-    left: 5px;
+    left: 0;
     width: 3px;
     height: 100%;
     background-color: $menuActiveBefore;
@@ -502,7 +508,6 @@
   .el-menu--collapse .is-active.submenu-title-noDropdown.outer-most::before {
     position: absolute;
     top: 0;
-    left: 5px;
     width: 3px;
     height: 100%;
     background-color: $menuActiveBefore;
@@ -564,6 +569,10 @@ body[layout="vertical"] {
   $sideBarWidth: 210px;
   @include merge-style($sideBarWidth);
 
+  .el-menu--collapse {
+    width: 54px;
+  }
+
   .sidebar-logo-container {
     background: $sidebarLogo;
   }
@@ -603,8 +612,6 @@ body[layout="vertical"] {
 
     /* 菜单折叠 */
     .el-menu--collapse {
-      margin-left: -5px;
-
       .el-sub-menu {
         & > .el-sub-menu__title {
           & > span {
@@ -617,6 +624,15 @@ body[layout="vertical"] {
         }
       }
 
+      /* 无子菜单 */
+      .el-menu-item [class^="el-icon"] {
+        right: 5px;
+      }
+
+      .el-sub-menu__title [class^="el-icon"] {
+        right: 2px;
+      }
+
       .submenu-title-noDropdown {
         background: transparent !important;
       }