From 0012583bc0c8080904dd984d73b2c58bd9073622 Mon Sep 17 00:00:00 2001 From: yanfeiyong <2060201549@qq.com> Date: Fri, 16 May 2025 14:02:28 +0800 Subject: [PATCH] =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=A0=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/icons/svg/icon-degl.svg | 1 + src/assets/icons/svg/icon-dwgl-1.svg | 1 + src/assets/icons/svg/icon-rwgl-1.svg | 1 + src/assets/icons/svg/icon-rwgl.svg | 1 + src/assets/icons/svg/icon-zcgl-1.svg | 1 + src/assets/icons/svg/icon-zcgl.svg | 1 + src/assets/styles/sidebar.scss | 46 +- src/assets/styles/variables.module.scss | 2 +- src/layout/components/Sidebar/index.vue | 3 +- src/views/index.vue | 1084 +---------------------- 10 files changed, 38 insertions(+), 1103 deletions(-) create mode 100644 src/assets/icons/svg/icon-degl.svg create mode 100644 src/assets/icons/svg/icon-dwgl-1.svg create mode 100644 src/assets/icons/svg/icon-rwgl-1.svg create mode 100644 src/assets/icons/svg/icon-rwgl.svg create mode 100644 src/assets/icons/svg/icon-zcgl-1.svg create mode 100644 src/assets/icons/svg/icon-zcgl.svg diff --git a/src/assets/icons/svg/icon-degl.svg b/src/assets/icons/svg/icon-degl.svg new file mode 100644 index 0000000..8bc74c1 --- /dev/null +++ b/src/assets/icons/svg/icon-degl.svg @@ -0,0 +1 @@ +icon-degl \ No newline at end of file diff --git a/src/assets/icons/svg/icon-dwgl-1.svg b/src/assets/icons/svg/icon-dwgl-1.svg new file mode 100644 index 0000000..ee14752 --- /dev/null +++ b/src/assets/icons/svg/icon-dwgl-1.svg @@ -0,0 +1 @@ +icon-dwgl-1 \ No newline at end of file diff --git a/src/assets/icons/svg/icon-rwgl-1.svg b/src/assets/icons/svg/icon-rwgl-1.svg new file mode 100644 index 0000000..eac3fa5 --- /dev/null +++ b/src/assets/icons/svg/icon-rwgl-1.svg @@ -0,0 +1 @@ +icon-rwgl-1 \ No newline at end of file diff --git a/src/assets/icons/svg/icon-rwgl.svg b/src/assets/icons/svg/icon-rwgl.svg new file mode 100644 index 0000000..e91993a --- /dev/null +++ b/src/assets/icons/svg/icon-rwgl.svg @@ -0,0 +1 @@ +icon-rwgl \ No newline at end of file diff --git a/src/assets/icons/svg/icon-zcgl-1.svg b/src/assets/icons/svg/icon-zcgl-1.svg new file mode 100644 index 0000000..46df9e1 --- /dev/null +++ b/src/assets/icons/svg/icon-zcgl-1.svg @@ -0,0 +1 @@ +icon-zcgl-1 \ No newline at end of file diff --git a/src/assets/icons/svg/icon-zcgl.svg b/src/assets/icons/svg/icon-zcgl.svg new file mode 100644 index 0000000..9853144 --- /dev/null +++ b/src/assets/icons/svg/icon-zcgl.svg @@ -0,0 +1 @@ +icon-zcgl \ No newline at end of file diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss index 9a4c487..7f28b44 100644 --- a/src/assets/styles/sidebar.scss +++ b/src/assets/styles/sidebar.scss @@ -1,14 +1,13 @@ #app { - .main-container { min-height: 100%; - transition: margin-left .28s; + transition: margin-left 0.28s; margin-left: $base-sidebar-width; position: relative; } .sidebarHide { - margin-left: 0!important; + margin-left: 0 !important; } .sidebar-container { @@ -22,12 +21,13 @@ left: 0; z-index: 1001; overflow: hidden; - -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35); + -webkit-box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); // reset element-ui css .horizontal-collapse-transition { - transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out; + transition: 0s width ease-in-out, 0s padding-left ease-in-out, + 0s padding-right ease-in-out; } .scrollbar-wrapper { @@ -46,6 +46,17 @@ .el-scrollbar { height: calc(100% - 50px); } + .sever-TITLE { + text-align: center; + font-family: Alimama ShuHeiTi; + // font-weight: bold; + font-size: 20px; + color: #ffffff; + line-height: 30px; + overflow: hidden; + padding: 10px 10px 0 10px; + box-sizing: border-box; + } } .is-horizontal { @@ -68,7 +79,8 @@ width: 100% !important; } - .el-menu-item, .menu-title { + .el-menu-item, + .menu-title { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; @@ -90,7 +102,7 @@ color: $base-menu-color-active !important; } - & .nest-menu .el-sub-menu>.el-sub-menu__title, + & .nest-menu .el-sub-menu > .el-sub-menu__title, & .el-sub-menu .el-menu-item { min-width: $base-sidebar-width !important; @@ -99,7 +111,7 @@ } } - & .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title, + & .theme-dark .nest-menu .el-sub-menu > .el-sub-menu__title, & .theme-dark .el-sub-menu .el-menu-item { background-color: $base-sub-menu-background; @@ -134,27 +146,26 @@ .el-sub-menu { overflow: hidden; - &>.el-sub-menu__title { + & > .el-sub-menu__title { padding: 0 !important; .svg-icon { margin-left: 20px; } - } } .el-menu--collapse { .el-sub-menu { - &>.el-sub-menu__title { - &>span { + & > .el-sub-menu__title { + & > span { height: 0; width: 0; overflow: hidden; visibility: hidden; display: inline-block; } - &>i { + & > i { height: 0; width: 0; overflow: hidden; @@ -177,7 +188,7 @@ } .sidebar-container { - transition: transform .28s; + transition: transform 0.28s; width: $base-sidebar-width !important; } @@ -191,7 +202,6 @@ } .withoutAnimation { - .main-container, .sidebar-container { transition: none; @@ -201,13 +211,13 @@ // when menu collapsed .el-menu--vertical { - &>.el-menu { + & > .el-menu { .svg-icon { margin-right: 16px; } } - .nest-menu .el-sub-menu>.el-sub-menu__title, + .nest-menu .el-sub-menu > .el-sub-menu__title, .el-menu-item { &:hover { // you can use $sub-menuHover @@ -216,7 +226,7 @@ } // the scroll bar appears when the sub-menu is too long - >.el-menu--popup { + > .el-menu--popup { max-height: 100vh; overflow-y: auto; diff --git a/src/assets/styles/variables.module.scss b/src/assets/styles/variables.module.scss index 8764e13..6f3f547 100644 --- a/src/assets/styles/variables.module.scss +++ b/src/assets/styles/variables.module.scss @@ -21,7 +21,7 @@ $menuLightText: #303133; $menuLightActiveText: #409EFF; // 基础变量 -$base-sidebar-width: 200px; +$base-sidebar-width: 240px; $sideBarWidth: 200px; // 菜单暗色变量 diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue index 9acc406..92add79 100644 --- a/src/layout/components/Sidebar/index.vue +++ b/src/layout/components/Sidebar/index.vue @@ -1,6 +1,7 @@ +