From b4d6e0923d825f3a6cbb12c29b5a522d56362ff8 Mon Sep 17 00:00:00 2001
From: odc.xiaohui <xiaohui@Q1>
Date: 星期六, 18 三月 2023 13:04:17 +0800
Subject: [PATCH] 用户管理导入导出
---
src/views/layout/components/Menu/index.vue | 349 +++++++++++++++++++++++----------------------------------
1 files changed, 143 insertions(+), 206 deletions(-)
diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue
index 3ee22e5..b92563b 100644
--- a/src/views/layout/components/Menu/index.vue
+++ b/src/views/layout/components/Menu/index.vue
@@ -2,192 +2,63 @@
<div>
<!-- 渚ц竟瀵艰埅鏍� -->
<el-aside width="200px">
- <h2 class="siderbar-title">閬傛槍鎵ф硶骞冲彴</h2>
+ <h2 class="siderbar-title" @click="toHome()">閬傛槍鎵ф硶骞冲彴</h2>
<el-scrollbar>
<!-- 璺敱 -->
- <el-menu router class="el-menu-vertical" :default-active="$route.path">
- <!-- 绯荤粺璁剧疆妯″潡 -->
- <el-submenu index="/home/system" class="firstMenu">
- <template slot="title">
- <!-- <i class="el-icon-reading"></i> -->
- <span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="system"></svg-icon>
- </span>
- <span class="fisrtSpan">绯荤粺璁剧疆</span>
- </template>
- <!-- 鍩烘湰璁剧疆 -->
- <el-submenu index="/home/system/base" class="secondMenu">
- <template slot="title">
- <span class="secondSpan">鍩烘湰璁剧疆</span>
- </template>
- <!-- 鐢ㄦ埛绠$悊 -->
- <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-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-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-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 index="/home/operate/add" class="secondMenu">
- <template slot="title">
- <span class="secondSpan">闂ㄦ埛绠$悊</span>
- </template>
- <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>
- <!-- 杩愯惀绠$悊妯″潡 -->
- <el-submenu index="/home/operate" class="firstMenu">
+ <el-menu router
+ class="el-menu-vertical"
+ :default-active="$route.path.name"
+ @select="handleSelect">
+ <el-submenu
+ :index="String(menu.id)"
+ v-for="menu in menuList"
+ :key="menu.id"
+ class="firstMenu"
+ >
<template slot="title">
<span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="operate"></svg-icon>
+ <svg-icon class="icon-title" :icon-class="menu.icon"></svg-icon>
</span>
- <span class="fisrtSpan">杩愯惀绠$悊</span>
+ <span class="fisrtSpan">{{ menu.title }}</span>
</template>
- <el-submenu index="/home/operate/baseSetting" class="secondMenu">
- <template slot="title">
- <span class="secondSpan">鍩虹璁剧疆</span>
+ <template v-if="menu.menuVoArrayList.length > 0">
+ <template v-for="secondMenu in menu.menuVoArrayList">
+ <el-submenu
+ :key="secondMenu.id"
+ v-if="secondMenu.menuVoArrayList.length > 0"
+ :index="secondMenu.url ? secondMenu.url : secondMenu.id.toString()"
+ class="secondMenu"
+ :class="secondMenu.menuVoArrayList.length > 0?'is-Active':'none-Active'"
+ >
+ <template slot="title">
+ <span class="secondSpan">{{ secondMenu.title }}</span>
+ </template>
+ <el-menu-item
+ v-for="thirdMenu in secondMenu.menuVoArrayList"
+ :key="thirdMenu.id"
+ :index="`${thirdMenu.id}`"
+ :route="{ name: thirdMenu.url }"
+ v-if="thirdMenu.id!='65'"
+ >
+ <template>
+ {{thirdMenu.title }}
+ </template></el-menu-item
+ >
+ </el-submenu>
+ <el-menu-item
+ v-else
+ :index="`${secondMenu.id}`"
+ :route="{ name: secondMenu.url }"
+ >{{ secondMenu.title }}</el-menu-item>
</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/learn">鍐嶅涔犵鐞�</el-menu-item>
- <el-menu-item index="/home/operate/casepool/notDeal">鏆備笉澶勭悊</el-menu-item>
- </el-submenu>
- <el-menu-item index="/home/operate/management">瀹℃牳绠$悊</el-menu-item>
- <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-submenu index="/home/operate/car" class="secondMenu">
- <template slot="title">
- <span class="secondSpan">杞﹁締绠$悊</span>
- </template>
- <el-menu-item index="/home/operate/car/carIndex">杞﹁締绠$悊</el-menu-item>
- <el-menu-item index="/home/operate/car/lawTrajectory">杞ㄨ抗鍒嗘瀽(鎵ф硶杞�)</el-menu-item>
- <el-menu-item index="/home/operate/car/soilTrajectory">杞ㄨ抗鍒嗘瀽(娓e湡杞�)</el-menu-item>
- </el-submenu>
- <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">
- <template slot="title">
- <span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="video"></svg-icon>
- </span>
- <span slot="title" class="fisrtSpan">瑙嗛宸℃煡</span>
</template>
- <el-menu-item index="/home/video">瑙嗛宸℃煡</el-menu-item>
- </el-submenu>
- <!-- 娌圭儫淇℃伅鏌ヨ妯″潡 -->
- <el-submenu index="/home/lampblack" class="firstMenu">
- <template slot="title">
- <span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="intelligence"></svg-icon>
- </span>
- <span class="fisrtSpan">娌圭儫淇℃伅鏌ヨ</span>
- </template>
- <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">
- <template slot="title">
- <span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="intelligence"></svg-icon>
- </span>
- <span class="fisrtSpan">鎵ф硶绠$悊</span>
- </template>
- <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">
- <template slot="title">
- <span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="intelligence"></svg-icon>
- </span>
- <span class="fisrtSpan">鏅鸿兘宸℃煡</span>
- </template>
- <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">
- <template slot="title">
- <span slot="prefix" class="icon-padding fisrtSpan">
- <svg-icon icon-class="intelligence"></svg-icon>
- </span>
- <span class="fisrtSpan">骞冲彴鍩烘湰淇℃伅</span>
- </template>
- <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-menu-item
+ v-else
+ :key="menu.id"
+ :index="`${menu.id}`"
+ :route="{ name: menu.url }"
+ >{{ menu.title }}</el-menu-item
+ >
</el-submenu>
</el-menu>
</el-scrollbar>
@@ -196,23 +67,61 @@
</template>
<script>
-export default {
+import users from "@/api/users";
+import router from "@/router";
+export default {
+ data() {
+ return {
+ menuList: [],
+ isActive:''
+ };
+ },
+ created() {
+ this.loadMenu();
+ },
+ watch: {
+ $route(){
+ this.handleSelect(this.$route.fullPath)
+ console.log(this.$route)
+ }
+ },
+ methods: {
+ handleSelect(path){
+ this.isActive = path
+ },
+ loadMenu() {
+ const userName = sessionStorage.getItem('name');
+ users.getMenu({ name: userName })
+ .then(res => {
+ // console.log(res)
+ // debugger
+ this.menuList = res.menus;
+ sessionStorage.setItem('user', JSON.stringify(res));
+ })
+ .catch(err => this.$message.error(err))
+ },
+ toHome(){
+ router.push("/home")
+ }
+ },
};
</script>
<style lang="scss" scpoed>
.icon-padding {
padding-right: 10px;
+ .icon-title{
+ width: 36px;
+ height: 36px;
+ }
}
-
.el-aside {
- background: #07162e;
+ background: #313350;
color: #e9eef3;
text-align: center;
box-sizing: border-box;
position: relative;
-
// 鍥哄畾鏍囬
.siderbar-title {
position: fixed;
@@ -224,62 +133,91 @@
top: 0;
left: 0;
z-index: 999;
+ cursor: pointer;
}
-
.el-scrollbar {
height: calc(100vh - 66px);
margin-top: 66px;
box-sizing: border-box;
-
.el-menu {
- background: linear-gradient(#07162e, #0f2b56);
+ background: linear-gradient(#313350, #0f2b56);
border: 0;
-
+ font-size: 16px;
+ .is-opened{
+ .fisrtSpan{
+ color: #22d3eb;
+ }
+ }
.firstMenu {
- background: #07162e;
+ background: #313350;
text-align: left;
-
- &:hover>.el-submenu__title {
+ //border-bottom:1px solid #ccc ;
+ &:hover > .el-submenu__title {
background-color: #092c4a;
}
-
&:hover .fisrtSpan {
color: #22d3eb;
}
-
span,
span {
color: #e9eef3;
+ font-size: 16px;
}
-
+ .el-menu{
+ .is-active {
+ background-color: #409EFF;
+ color: #fff;
+ }
+ .is-Active{
+ background-color: #092c4a;
+ color: #fff;
+ }
+ }
.el-menu-item {
color: #e9eef3;
- background-color: #07162e;
+ background-color: #313350;
+ font-size: 16px;
+ // border-bottom: 0.5px solid #7c7979;
}
-
.el-menu-item:hover {
- background-color: #092c4a;
+ background-color: #409EFF;
color: #22d3eb;
}
-
- .is-active {
- background-color: #07162e;
- color: #22d3eb;
+ .is-opened{
+ .secondSpan{
+ color: #22d3eb;
+ }
+ }
+ .secondMenu{
+ //border-bottom:1px solid #ccc ;
+ .is-active {
+ background-color: #409EFF;
+ color: #22d3eb;
+ }
}
}
-
.secondMenu {
- &:hover>.el-submenu__title {
+
+ &:hover > .el-submenu__title {
background-color: #092c4a;
}
-
+ .secondSpan{
+ }
&:hover .secondSpan {
color: #22d3eb;
}
+ .is-opened{
+ .el-submenu__title{
+ background-color: #fff;
+ }
+ }
+ .is-active {
+ background-color: #409EFF;
+ color: #fff;
+ }
}
-
.thirdMenu {
- &:hover>.el-submenu__title {
+ &:hover > .el-submenu__title {
background-color: #092c4a;
}
@@ -292,10 +230,9 @@
background-color: #092c4a;
}
}
-
.el-scrollbar__wrap {
overflow-x: hidden;
}
}
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.8.0