From ccd7b3c5b24fa115a732ea915e2e586de717ea1c Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期一, 26 九月 2022 21:39:43 +0800 Subject: [PATCH] 完成logo管理 --- src/views/layout/components/Menu/index.vue | 170 ++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 115 insertions(+), 55 deletions(-) diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue index 422737c..c97376b 100644 --- a/src/views/layout/components/Menu/index.vue +++ b/src/views/layout/components/Menu/index.vue @@ -5,12 +5,12 @@ <h2 class="siderbar-title">閬傛槍鎵ф硶骞冲彴</h2> <el-scrollbar> <!-- 璺敱 --> - <el-menu router class="el-menu-vertical" :default-active="$route.path" > + <el-menu router class="el-menu-vertical" :default-active="$route.path"> <!-- 绯荤粺璁剧疆妯″潡 --> <el-submenu index="/home/system" class="firstMenu"> - <template slot="title" class="firstSpan"> + <template slot="title"> <!-- <i class="el-icon-reading"></i> --> - <span slot="prefix" class="icon-padding fisrtSpan"> + <span slot="prefix" class="icon-padding fisrtSpan"> <svg-icon icon-class="system"></svg-icon> </span> <span class="fisrtSpan">绯荤粺璁剧疆</span> @@ -21,40 +21,45 @@ <span class="secondSpan">鍩烘湰璁剧疆</span> </template> <!-- 鐢ㄦ埛绠$悊 --> - <el-submenu index="/home/system/base/user" class="thirdMenu"> + <el-menu-item index="/home/system/user">鐢ㄦ埛绠$悊</el-menu-item> + <!-- <el-submenu index="/home/system/base/user" class="thirdMenu"> <template slot="title"> <span class="thirdSpan">鐢ㄦ埛绠$悊</span> </template> <el-menu-item index="/home/system/user">鐢ㄦ埛鍒楄〃</el-menu-item> - </el-submenu> + </el-submenu> --> <!-- 瑙掕壊绠$悊 --> - <el-submenu index="/home/system/base/role" class="thirdMenu"> + <el-menu-item index="/home/system/role">瑙掕壊绠$悊</el-menu-item> + <!-- <el-submenu index="/home/system/base/role" class="thirdMenu"> <template slot="title"> <span class="thirdSpan">瑙掕壊绠$悊</span> </template> <el-menu-item index="/home/system/role">瑙掕壊绠$悊鍒楄〃</el-menu-item> - </el-submenu> + </el-submenu> --> <!-- 鏉冮檺绠$悊 --> - <el-submenu index="/home/system/base/authority" class="thirdMenu"> + <el-menu-item index="/home/system/authority">鏉冮檺绠$悊</el-menu-item> + <!-- <el-submenu index="/home/system/base/authority" class="thirdMenu"> <template slot="title"> <span class="thirdSpan">鏉冮檺绠$悊</span> </template> <el-menu-item index="/home/system/authority">璁剧疆鏉冮檺</el-menu-item> - </el-submenu> + </el-submenu> --> <!-- 閮ㄩ棬绠$悊 --> - <el-submenu index="/home/system/base/department" class="thirdMenu"> + <el-menu-item index="/home/system/department">閮ㄩ棬绠$悊</el-menu-item> + <!-- <el-submenu index="/home/system/base/department" class="thirdMenu"> <template slot="title"> <span class="thirdSpan">閮ㄩ棬绠$悊</span> </template> <el-menu-item index="/home/system/department">閮ㄩ棬绠$悊</el-menu-item> - </el-submenu> + </el-submenu> --> </el-submenu> <!-- 骞冲彴璁剧疆 --> - <el-submenu index="/home/article/add" class="secondMenu"> + <el-submenu index="/home/operate/add" class="secondMenu"> <template slot="title"> - <span class="secondSpan">骞冲彴璁剧疆</span> + <span class="secondSpan">闂ㄦ埛绠$悊</span> </template> - <el-menu-item index="/home/system/portalSetting">闂ㄦ埛璁剧疆</el-menu-item> + <el-menu-item index="/home/system/mySetting">鑷畾涔夎彍鍗�</el-menu-item> + <el-menu-item index="/home/system/portalSetting">logo绠$悊</el-menu-item> <el-menu-item index="/home/system/otherInterface">绗笁鏂规帴鍙g鐞�</el-menu-item> </el-submenu> </el-submenu> @@ -66,17 +71,49 @@ </span> <span class="fisrtSpan">杩愯惀绠$悊</span> </template> - <el-menu-item index="/home/article/add">鎵ф硶绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">璋冨害绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">搴楅摵绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">杞﹁締绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">鍥剧墖绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">瑙嗛绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">娑堟伅绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">瀹℃牳绠$悊</el-menu-item> - <el-menu-item index="/home/article/add">鐭俊绠$悊</el-menu-item> - <el-menu-item index="/home/article">绠楁硶妯″瀷绠$悊</el-menu-item> - <el-menu-item index="/home/article">鏃ュ織绠$悊</el-menu-item> + <el-submenu index="/home/operate/baseSetting" class="secondMenu"> + <template slot="title"> + <span class="secondSpan">鍩虹璁剧疆</span> + </template> + <el-menu-item index="/home/operate/baseSetting/violation">杩濊浜嬮」璁剧疆</el-menu-item> + <el-menu-item index="/home/operate/baseSetting/illegalBuild">杩濆缓浜嬮」璁剧疆</el-menu-item> + <el-menu-item index="/home/operate/baseSetting/threepack">闂ㄥ墠涓夊寘璁剧疆</el-menu-item> + </el-submenu> + <el-submenu index="/home/operate/disposal" class="secondMenu"> + <template slot="title"> + <span class="secondSpan">浜嬮」澶勭悊绠$悊</span> + </template> + <el-menu-item index="/home/operate/casepool/pool">妗堜欢姹�</el-menu-item> + <el-menu-item index="/home/operate/casepool/escalation">涓婃姤绠$悊</el-menu-item> + <el-menu-item index="/home/operate/casepool/dispatch">璋冨害绠$悊</el-menu-item> + <!-- <el-menu-item index="/home/operate/casepool">鍐嶅涔犵鐞�</el-menu-item> --> + <el-menu-item index="/home/operate/casepool/notDeal">鏆備笉澶勭悊</el-menu-item> + </el-submenu> + <el-menu-item index="/home/operate/myWait">鎴戠殑寰呭姙</el-menu-item> + <el-submenu index="/home/operate/rectification" class="secondMenu"> + <template slot="title"> + <span class="secondSpan">涓撻」鏁存不</span> + </template> + <el-menu-item index="/home/operate/rectification/taskList">浠诲姟鍒楄〃</el-menu-item> + <el-menu-item index="/home/operate/rectification/surveyList">鏅煡鍒楄〃</el-menu-item> + <el-menu-item index="/home/operate/rectification/renovationList">鏁存不鍒楄〃</el-menu-item> + </el-submenu> + <el-menu-item index="/home/operate/lawEnforcement">宸℃煡鎵ф硶</el-menu-item> + <el-menu-item index="/home/operate/dasds">妗堝嵎鏌ヨ</el-menu-item> + <el-submenu index="/home/operate/fivepack" class="secondMenu"> + <template slot="title"> + <span class="secondSpan">闂ㄥ墠浜斿寘澶勭疆绠$悊</span> + </template> + <el-menu-item index="/home/operate/fivepack/threepackage">闂ㄥ墠涓夊寘</el-menu-item> + <el-menu-item index="/home/operate/fivepack/shop">搴楅摵绠$悊</el-menu-item> + </el-submenu> + <el-menu-item index="/home/operate/dasdas">绠楁硶妯″瀷绠$悊</el-menu-item> + <el-menu-item index="/home/operate/dasdas">杞﹁締绠$悊</el-menu-item> + <el-menu-item index="/home/operate">鍥剧墖绠$悊</el-menu-item> + <el-menu-item index="/home/operate">瑙嗛绠$悊</el-menu-item> + <el-menu-item index="/home/operate">娑堟伅绠$悊</el-menu-item> + <el-menu-item index="/home/operate">鐭俊绠$悊</el-menu-item> + <el-menu-item index="/home/operate">鏃ュ織绠$悊</el-menu-item> </el-submenu> <!-- 瑙嗛宸℃煡妯″潡 --> <el-submenu index="/home/video" class="firstMenu"> @@ -96,11 +133,11 @@ </span> <span class="fisrtSpan">娌圭儫淇℃伅鏌ヨ</span> </template> - <el-menu-item index="/home/article/add">棰勮鐮斿垽</el-menu-item> - <el-menu-item index="/home/article">杩濊妫�绱�</el-menu-item> - <el-menu-item index="/home/article">瓒嬪娍鍒嗘瀽</el-menu-item> - <el-menu-item index="/home/article">鏁版嵁缁熻</el-menu-item> - <el-menu-item index="/home/article">杩愯鎶ュ憡</el-menu-item> + <el-menu-item index="/home/operate/add">棰勮鐮斿垽</el-menu-item> + <el-menu-item index="/home/operate">杩濊妫�绱�</el-menu-item> + <el-menu-item index="/home/operate">瓒嬪娍鍒嗘瀽</el-menu-item> + <el-menu-item index="/home/operate">鏁版嵁缁熻</el-menu-item> + <el-menu-item index="/home/operate">杩愯鎶ュ憡</el-menu-item> </el-submenu> <!-- 鎵ф硶绠$悊妯″潡 --> <el-submenu index="/home/law" class="firstMenu"> @@ -110,11 +147,11 @@ </span> <span class="fisrtSpan">鎵ф硶绠$悊</span> </template> - <el-menu-item index="/home/article/add">棰勮鐮斿垽</el-menu-item> - <el-menu-item index="/home/article">杩濊妫�绱�</el-menu-item> - <el-menu-item index="/home/article">瓒嬪娍鍒嗘瀽</el-menu-item> - <el-menu-item index="/home/article">鏁版嵁缁熻</el-menu-item> - <el-menu-item index="/home/article">杩愯鎶ュ憡</el-menu-item> + <el-menu-item index="/home/operate/add">棰勮鐮斿垽</el-menu-item> + <el-menu-item index="/home/operate">杩濊妫�绱�</el-menu-item> + <el-menu-item index="/home/operate">瓒嬪娍鍒嗘瀽</el-menu-item> + <el-menu-item index="/home/operate">鏁版嵁缁熻</el-menu-item> + <el-menu-item index="/home/operate">杩愯鎶ュ憡</el-menu-item> </el-submenu> <!-- 鏅鸿兘宸℃煡妯″潡 --> <el-submenu index="/home/intellect" class="firstMenu"> @@ -124,11 +161,11 @@ </span> <span class="fisrtSpan">鏅鸿兘宸℃煡</span> </template> - <el-menu-item index="/home/article/add">棰勮鐮斿垽</el-menu-item> - <el-menu-item index="/home/article">杩濊妫�绱�</el-menu-item> - <el-menu-item index="/home/article">瓒嬪娍鍒嗘瀽</el-menu-item> - <el-menu-item index="/home/article">鏁版嵁缁熻</el-menu-item> - <el-menu-item index="/home/article">杩愯鎶ュ憡</el-menu-item> + <el-menu-item index="/home/operate/add">棰勮鐮斿垽</el-menu-item> + <el-menu-item index="/home/operate">杩濊妫�绱�</el-menu-item> + <el-menu-item index="/home/operate">瓒嬪娍鍒嗘瀽</el-menu-item> + <el-menu-item index="/home/operate">鏁版嵁缁熻</el-menu-item> + <el-menu-item index="/home/operate">杩愯鎶ュ憡</el-menu-item> </el-submenu> <!-- 骞冲彴鍩烘湰淇℃伅 --> <el-submenu index="/home/info" class="firstMenu"> @@ -138,11 +175,11 @@ </span> <span class="fisrtSpan">骞冲彴鍩烘湰淇℃伅</span> </template> - <el-menu-item index="/home/article/add">棰勮鐮斿垽</el-menu-item> - <el-menu-item index="/home/article">杩濊妫�绱�</el-menu-item> - <el-menu-item index="/home/article">瓒嬪娍鍒嗘瀽</el-menu-item> - <el-menu-item index="/home/article">鏁版嵁缁熻</el-menu-item> - <el-menu-item index="/home/article">杩愯鎶ュ憡</el-menu-item> + <el-menu-item index="/home/operate/add">棰勮鐮斿垽</el-menu-item> + <el-menu-item index="/home/operate">杩濊妫�绱�</el-menu-item> + <el-menu-item index="/home/operate">瓒嬪娍鍒嗘瀽</el-menu-item> + <el-menu-item index="/home/operate">鏁版嵁缁熻</el-menu-item> + <el-menu-item index="/home/operate">杩愯鎶ュ憡</el-menu-item> </el-submenu> </el-menu> </el-scrollbar> @@ -160,12 +197,14 @@ .icon-padding { padding-right: 10px; } + .el-aside { background: #07162e; color: #e9eef3; text-align: center; box-sizing: border-box; position: relative; + // 鍥哄畾鏍囬 .siderbar-title { position: fixed; @@ -177,50 +216,71 @@ top: 0; left: 0; z-index: 999; - // box-shadow: 0 -5px 5px #0ff inset; } + .el-scrollbar { height: calc(100vh - 66px); margin-top: 66px; box-sizing: border-box; + .el-menu { background: linear-gradient(#07162e, #0f2b56); border: 0; + .firstMenu { background: #07162e; text-align: left; - &:hover .fisrtSpan{ + &:hover>.el-submenu__title{ + background-color: #092c4a; + } + &:hover .fisrtSpan { color: #22d3eb; } - span,span { + + span, + span { color: #e9eef3; } + .el-menu-item { color: #e9eef3; background-color: #07162e; - &:hover { - color: #22d3eb; - } } + + .el-menu-item:hover { + background-color: #092c4a; + color: #22d3eb; + } + .is-active { background-color: #07162e; color: #22d3eb; } } - .secondMenu{ - &:hover .secondSpan{ + + .secondMenu { + &:hover>.el-submenu__title{ + background-color: #092c4a; + } + &:hover .secondSpan { color: #22d3eb; } } - .thirdMenu{ - &:hover .thirdSpan{ + + .thirdMenu { + &:hover>.el-submenu__title{ + background-color: #092c4a; + } + &:hover .thirdSpan { color: #22d3eb; } } + .is-active { background-color: #092c4a; } } + .el-scrollbar__wrap { overflow-x: hidden; } -- Gitblit v1.8.0