fix:修复无法滚动

h5-enginex-manager/baseUrl.js

@@ -5,7 +5,8 @@ switch (process.env.NODE_ENV) {
 	case 'development': // 开发环境代理地址
 		proxyObj = {
 			'/Riskmanage': {
-				target: 'http://127.0.0.1:8082', // 开发环境
+				// target: 'http://127.0.0.1:8082', // 开发环境
+        target: 'http://47.99.93.74:8099', // 开发环境
 				changeOrigin: true, // 是否跨域
 				pathRewrite: {
 					'^/Riskmanage': '/Riskmanage'
@@ -13,7 +14,8 @@ switch (process.env.NODE_ENV) {
 
 			},
 			'/trading': {
-				target: 'http://127.0.0.1:8083', // 开发环境
+				// target: 'http://127.0.0.1:8083', // 开发环境
+        target: 'http://47.99.93.74:8099', // 开发环境
 				changeOrigin: true, // 是否跨域
 				pathRewrite: {
 					'^/trading': '/trading'

h5-enginex-manager/package.json

@@ -30,7 +30,7 @@
 		"less": "^4.1.1",
 		"less-loader": "^5.0.0",
 		"mavon-editor": "^2.6.17", 
-		"node-sass": "^4.14.1",
+    "sass": "^1.58.0",
 		"vue": "^2.6.10",
 		"vue-codemirror": "^4.0.6",
 		"vue-cropperjs": "^3.0.0",

h5-enginex-manager/src/assets/css/main.css

@@ -37,6 +37,7 @@ a {
     width: auto;
     height: 100%;
     padding: 10px;
+    overflow-y: scroll;
     /* overflow-y: scroll; */
     box-sizing: border-box;
 }
@@ -178,7 +179,6 @@ a {
 
 .content-wrapper{
     width: 100%;
-    height: 100%;
     background: #fff;
     border-radius: 4px;
     padding: 21px;  

h5-enginex-manager/src/components/common/HeaderAuth.vue

@@ -0,0 +1,275 @@
+<template>
+	<div class="header">
+		<!-- 折叠按钮 -->
+		<div class="collapse-btn" @click="collapseChage">
+			<i v-if="!collapse" class="el-icon-s-fold"></i>
+			<i v-else class="el-icon-s-unfold"></i>
+		</div>
+		<div class="logo">权限系统</div>
+		<div class="header-right">
+			<div class="header-user-con">
+				<!--  -->
+				<div style="display: flex;font-size: 14px;">
+					
+					<div v-for="value in link.a" class="header_link" @click="go(value)">
+						{{value.title}}
+					</div>
+					
+					
+					
+				</div>
+
+				<!-- 全屏显示 -->
+				<div class="btn-fullscreen" @click="handleFullScreen">
+					<el-tooltip effect="dark" :content="fullscreen?`取消全屏`:`全屏`" placement="bottom">
+						<i class="el-icon-rank"></i>
+					</el-tooltip>
+				</div>
+				
+				<!-- 用户头像 -->
+				<div class="user-avator">
+					<img src="../../assets/img/img.jpg" />
+				</div>
+				<!-- 用户名下拉菜单 -->
+				<el-dropdown class="user-name" trigger="click" @command="handleCommand">
+					<span class="el-dropdown-link">
+						{{username}}
+						<i class="el-icon-caret-bottom"></i>
+					</span>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item divided command="loginout">退出登录</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+		</div>
+	</div>
+</template>
+<script>
+	import bus from './bus';
+	import {
+		getLogout
+	} from '../../api/index';
+		import linkOr from '@/utils/link.js'
+	export default {
+		data() {
+			return {
+				collapse: false,
+				fullscreen: false,
+				name: '',
+				message: 2,
+				link:[]
+			};
+		},
+		created() {
+			this.link = linkOr
+			bus.$on('collapseHeader', res => {
+				this.busCollapseChage(res)
+			})
+			bus.$on('regetcache',res=>{
+				
+				this.$store.dispatch('regetcache',res)
+			})
+
+			
+
+			this.$store.commit('setbarShrink', this.collapse)
+		},
+		computed: {
+			username() {
+				if (localStorage.getItem('ms_username')) {
+					return localStorage.getItem('ms_username');
+				} else {
+					return "未命名"
+				}
+			},
+			fielduser() {
+				if (this.$store.state.FieldUser) {
+					return this.$store.state.FieldUser.data.fieldList
+				} else {
+
+					return null
+				}
+			},
+			ruleList() {
+				if (this.$store.state.RuleList) {
+					return this.$store.state.RuleList
+			
+				} else {
+
+					return null
+				}
+			}
+		},
+		methods: {
+			go(value) {
+				var url = window.location.href
+
+				if (value[url.split('#')[0]]) {
+					window.open(value[url.split('#')[0]])
+				} else {
+					this.$message.error('请检查跳转配置')
+				}
+			},
+			ReGetStorage() {
+
+				if (this.Loading) {
+					return
+				}
+
+				this.mixinReGetStorage()
+			},
+			// 用户名下拉菜单选择事件
+			handleCommand(command) {
+				if (command == 'loginout') {
+					// 调用退出登录接口
+					getLogout();
+					localStorage.removeItem("engineId");
+					// localStorage.removeItem("token");
+					localStorage.removeItem('ms_username');
+          this.$router.push('/loginAuth');
+				}
+			},
+			// Bus侧边栏折叠
+			busCollapseChage(res) {
+				this.collapse = res;
+				this.$store.commit('setbarShrink', this.collapse)
+				bus.$emit('collapse', this.collapse);
+			},
+			// 侧边栏折叠
+			collapseChage() {
+				this.collapse = !this.collapse;
+				this.$store.commit('setbarShrink', this.collapse)
+				bus.$emit('collapse', this.collapse);
+			},
+			// 全屏事件
+			handleFullScreen() {
+				let element = document.documentElement;
+				if (this.fullscreen) {
+					if (document.exitFullscreen) {
+						document.exitFullscreen();
+					} else if (document.webkitCancelFullScreen) {
+						document.webkitCancelFullScreen();
+					} else if (document.mozCancelFullScreen) {
+						document.mozCancelFullScreen();
+					} else if (document.msExitFullscreen) {
+						document.msExitFullscreen();
+					}
+				} else {
+					if (element.requestFullscreen) {
+						element.requestFullscreen();
+					} else if (element.webkitRequestFullScreen) {
+						element.webkitRequestFullScreen();
+					} else if (element.mozRequestFullScreen) {
+						element.mozRequestFullScreen();
+					} else if (element.msRequestFullscreen) {
+						// IE11
+						element.msRequestFullscreen();
+					}
+				}
+				this.fullscreen = !this.fullscreen;
+			}
+		},
+		mounted() {
+			if (document.body.clientWidth < 1500) {
+				this.collapseChage();
+			}
+		}
+	};
+</script>
+<style scoped>
+	.header {
+		position: relative;
+		box-sizing: border-box;
+		width: 100%;
+		height: 70px;
+		font-size: 22px;
+		color: #fff;
+	}
+
+	.collapse-btn {
+		float: left;
+		padding: 0 21px;
+		cursor: pointer;
+		line-height: 70px;
+	}
+	.header_link {
+		padding: 4px;
+		margin-right: 20px;
+		color: #fff;
+	}
+	
+	.header_link:hover {
+		cursor: pointer;
+	}
+	.header .logo {
+		float: left;
+		width: 250px;
+		line-height: 70px;
+	}
+
+	.header-right {
+		float: right;
+		padding-right: 50px;
+	}
+
+	.header-user-con {
+		display: flex;
+		height: 70px;
+		align-items: center;
+	}
+
+	.btn-fullscreen {
+		transform: rotate(45deg);
+		margin-right: 5px;
+		font-size: 24px;
+	}
+
+	.btn-bell,
+	.btn-fullscreen {
+		position: relative;
+		width: 30px;
+		height: 30px;
+		text-align: center;
+		border-radius: 15px;
+		cursor: pointer;
+	}
+
+	.btn-bell-badge {
+		position: absolute;
+		right: 0;
+		top: -2px;
+		width: 8px;
+		height: 8px;
+		border-radius: 4px;
+		background: #f56c6c;
+		color: #fff;
+	}
+
+	.btn-bell .el-icon-bell {
+		color: #fff;
+	}
+
+	.user-name {
+		margin-left: 10px;
+	}
+
+	.user-avator {
+		margin-left: 20px;
+	}
+
+	.user-avator img {
+		display: block;
+		width: 40px;
+		height: 40px;
+		border-radius: 50%;
+	}
+
+	.el-dropdown-link {
+		color: #fff;
+		cursor: pointer;
+	}
+
+	.el-dropdown-menu__item {
+		text-align: center;
+	}
+</style>

h5-enginex-manager/src/components/common/HeaderDatax.vue

@@ -0,0 +1,328 @@
+<template>
+	<div class="header">
+		<!-- 折叠按钮 -->
+		<div class="collapse-btn" @click="collapseChage">
+			<i v-if="!collapse" class="el-icon-s-fold"></i>
+			<i v-else class="el-icon-s-unfold"></i>
+		</div>
+		<div class="logo">数据中心</div>
+		<div class="header-right">
+			<!-- {{fielduser}} -->
+			<!-- {{ruleList}} -->
+
+			<!-- {{fielduser==''}} -->
+			<!-- {{ruleList==null}} -->
+			<div class="header-user-con">
+				<div style="display: flex;font-size: 14px;">
+					
+					
+					<div v-for="value in link.d" class="header_link" @click="go(value)">
+						{{value.title}}
+					</div>
+					
+					
+					
+				</div>
+				<!--  -->
+				<div class="btn-fullscreen" @click="ReGetStorage">
+					<!-- {{fielduser}} -->
+					<!-- {{ruleList=='[]'}} -->
+					<el-tooltip effect="dark" content="刷新缓存" placement="bottom">
+
+						<i :class="Loading?'el-icon-loading':'el-icon-refresh'"></i>
+					</el-tooltip>
+				</div>
+
+				<!-- 全屏显示 -->
+				<div class="btn-fullscreen" @click="handleFullScreen">
+					<el-tooltip effect="dark" :content="fullscreen?`取消全屏`:`全屏`" placement="bottom">
+						<i class="el-icon-rank"></i>
+					</el-tooltip>
+				</div>
+				<!-- 消息中心
+                <div class="btn-bell">
+                    <el-tooltip
+                        effect="dark"
+                        :content="message?`有${message}条未读消息`:`消息中心`"
+                        placement="bottom"
+                    >
+                        <router-link to="/tabs">
+                            <i class="el-icon-bell"></i>
+                        </router-link>
+                    </el-tooltip>
+                    <span class="btn-bell-badge" v-if="message"></span>
+                </div> -->
+				<!-- 用户头像 -->
+				<div class="user-avator">
+					<img src="../../assets/img/img2.png" />
+				</div>
+				<!-- 用户名下拉菜单 -->
+				<el-dropdown class="user-name" trigger="click" @command="handleCommand">
+					<span class="el-dropdown-link">
+						{{username}}
+						<i class="el-icon-caret-bottom"></i>
+					</span>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item divided command="loginout">退出登录</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+		</div>
+	</div>
+</template>
+<script>
+	import bus from '../common/bus';
+	import {
+		getLogout
+	} from '../../api/index';
+	import linkOr from '@/utils/link.js'
+	export default {
+		data() {
+			return {
+				collapse: false,
+				fullscreen: false,
+				name: '',
+				message: 2,
+				link:[]
+			};
+		},
+		created() {
+			
+			this.link = linkOr
+			bus.$on('collapseHeader', res => {
+				this.busCollapseChage(res)
+			})
+			bus.$on('regetcache',res=>{
+				
+				this.$store.dispatch('regetcache',res)
+			})
+
+			this.$store.dispatch('getfielduser')
+			
+			
+
+			Object.keys(this.$store.state.cacheList).forEach(value => {
+				
+				this.$store.dispatch('getcache', value)
+			})
+
+			this.$store.commit('setbarShrink', this.collapse)
+		},
+		computed: {
+			username() {
+				if (localStorage.getItem('ms_username')) {
+					return localStorage.getItem('ms_username');
+				} else {
+					return "未命名"
+				}
+			},
+			fielduser() {
+				if (this.$store.state.FieldUser) {
+					return this.$store.state.FieldUser.data.fieldList
+				} else {
+
+					return null
+				}
+			},
+			ruleList() {
+				if (this.$store.state.RuleList) {
+					return this.$store.state.RuleList
+			
+				} else {
+
+					return null
+				}
+			},
+			Loading() {
+				if (this.$store.state.FieldUser == null) {
+					return true
+				}
+			
+				let is = false
+				Object.keys(this.$store.state.cacheList).forEach(value => {
+					if (this.$store.state[value] == null) {
+						is = true
+					}
+				})
+				if(is) return true
+				
+
+
+
+				return false
+
+			}
+		},
+		methods: {
+			go(value) {
+				var url = window.location.href
+			
+				if (value[url.split('#')[0]]) {
+					window.open(value[url.split('#')[0]])
+				} else {
+					this.$message.error('请检查跳转配置')
+				}
+			},
+			ReGetStorage() {
+
+				if (this.Loading) {
+					return
+				}
+
+				this.mixinReGetStorage()
+			},
+			// 用户名下拉菜单选择事件
+			handleCommand(command) {
+				if (command == 'loginout') {
+					// 调用退出登录接口
+					getLogout();
+					localStorage.removeItem("engineId");
+					// localStorage.removeItem("token");
+					localStorage.removeItem('ms_username');
+					this.$router.push('/loginDatax');
+				}
+			},
+			// Bus侧边栏折叠
+			busCollapseChage(res) {
+				this.collapse = res;
+				this.$store.commit('setbarShrink', this.collapse)
+				bus.$emit('collapse', this.collapse);
+			},
+			// 侧边栏折叠
+			collapseChage() {
+				this.collapse = !this.collapse;
+				this.$store.commit('setbarShrink', this.collapse)
+				bus.$emit('collapse', this.collapse);
+			},
+			// 全屏事件
+			handleFullScreen() {
+				let element = document.documentElement;
+				if (this.fullscreen) {
+					if (document.exitFullscreen) {
+						document.exitFullscreen();
+					} else if (document.webkitCancelFullScreen) {
+						document.webkitCancelFullScreen();
+					} else if (document.mozCancelFullScreen) {
+						document.mozCancelFullScreen();
+					} else if (document.msExitFullscreen) {
+						document.msExitFullscreen();
+					}
+				} else {
+					if (element.requestFullscreen) {
+						element.requestFullscreen();
+					} else if (element.webkitRequestFullScreen) {
+						element.webkitRequestFullScreen();
+					} else if (element.mozRequestFullScreen) {
+						element.mozRequestFullScreen();
+					} else if (element.msRequestFullscreen) {
+						// IE11
+						element.msRequestFullscreen();
+					}
+				}
+				this.fullscreen = !this.fullscreen;
+			}
+		},
+		mounted() {
+			if (document.body.clientWidth < 1500) {
+				this.collapseChage();
+			}
+		}
+	};
+</script>
+<style scoped>
+	.header {
+		position: relative;
+		box-sizing: border-box;
+		width: 100%;
+		height: 70px;
+		font-size: 22px;
+		color: #fff;
+	}
+
+	.collapse-btn {
+		float: left;
+		padding: 0 21px;
+		cursor: pointer;
+		line-height: 70px;
+	}
+	.header_link {
+		padding: 4px;
+		margin-right: 20px;
+		color: #fff;
+	}
+	
+	.header_link:hover {
+		cursor: pointer;
+	}
+	.header .logo {
+		float: left;
+		width: 250px;
+		line-height: 70px;
+	}
+
+	.header-right {
+		float: right;
+		padding-right: 50px;
+	}
+
+	.header-user-con {
+		display: flex;
+		height: 70px;
+		align-items: center;
+	}
+
+	.btn-fullscreen {
+		transform: rotate(45deg);
+		margin-right: 5px;
+		font-size: 24px;
+	}
+
+	.btn-bell,
+	.btn-fullscreen {
+		position: relative;
+		width: 30px;
+		height: 30px;
+		text-align: center;
+		border-radius: 15px;
+		cursor: pointer;
+	}
+
+	.btn-bell-badge {
+		position: absolute;
+		right: 0;
+		top: -2px;
+		width: 8px;
+		height: 8px;
+		border-radius: 4px;
+		background: #f56c6c;
+		color: #fff;
+	}
+
+	.btn-bell .el-icon-bell {
+		color: #fff;
+	}
+
+	.user-name {
+		margin-left: 10px;
+	}
+
+	.user-avator {
+		margin-left: 20px;
+	}
+
+	.user-avator img {
+		display: block;
+		width: 40px;
+		height: 40px;
+		border-radius: 50%;
+	}
+
+	.el-dropdown-link {
+		color: #fff;
+		cursor: pointer;
+	}
+
+	.el-dropdown-menu__item {
+		text-align: center;
+	}
+</style>

h5-enginex-manager/src/components/common/HeaderEnginex.vue

@@ -7,11 +7,6 @@
 		</div>
 		<div class="logo">数字决策平台</div>
 		<div class="header-right">
-			<!-- {{fielduser}} -->
-			<!-- {{ruleList}} -->
-
-			<!-- {{fielduser==''}} -->
-			<!-- {{ruleList==null}} -->
 			<div class="header-user-con">
 
 				<div style="display: flex;font-size: 14px;">
@@ -19,16 +14,10 @@
 					<div v-for="value in link.e" class="header_link" @click="go(value)">
 						{{value.title}}
 					</div>
-
-
-
 				</div>
 
-
 				<!--  -->
 				<div class="btn-fullscreen" @click="ReGetStorage">
-					<!-- {{fielduser}} -->
-					<!-- {{ruleList=='[]'}} -->
 					<el-tooltip effect="dark" content="刷新缓存" placement="bottom">
 
 						<i :class="Loading?'el-icon-loading':'el-icon-refresh'"></i>
@@ -61,7 +50,7 @@
 	</div>
 </template>
 <script>
-	import bus from '../common/bus';
+	import bus from './bus';
 	import {
 		getLogout
 	} from '../../api/index';
@@ -148,25 +137,6 @@
 				})
 				if (is) return true
 
-				// if (this.$store.state.SCO == null) {
-				// 	return true
-				// }
-				// if (this.$store.state.Interface == null) {
-				// 	return true
-				// }
-				// if (this.$store.state.decisionTable == null) {
-				// 	return true
-				// }
-				// if (this.$store.state.decisionTree == null) {
-				// 	return true
-				// }
-				// if (this.$store.state.Sourcelist == null) {
-				// 	return true
-				// }
-				// if (this.$store.state.Engine == null) {
-				// 	return true
-				// }
-
 
 
 				return false
@@ -200,7 +170,7 @@
 					localStorage.removeItem("engineId");
 					// localStorage.removeItem("token");
 					localStorage.removeItem('ms_username');
-					this.$router.push('/login');
+					this.$router.push('/loginEnginex');
 				}
 			},
 			// Bus侧边栏折叠

h5-enginex-manager/src/components/common/Home.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="wrapper"> 
-        <v-head></v-head>
+    <!-- 权限系统 -->
+    <headerAuth v-if="headerShowAuth()"/>
+    <!-- 数据中心 -->
+    <headerDatax v-if="headerShowDatax()" />
+    <!-- 决策引擎系统 -->
+    <headerEnginex v-if="headerShowEnginex()"/>
         <v-sidebar></v-sidebar>
         <div class="content-box" :class="{'content-collapse':collapse}">
             <v-tags></v-tags>
@@ -17,7 +22,9 @@
 </template>
 
 <script>
-import vHead from './Header.vue';
+import headerEnginex from './HeaderEnginex.vue';
+import headerAuth from './HeaderAuth.vue'
+import headerDatax from './HeaderDatax.vue'
 import vSidebar from './Sidebar.vue';
 import vTags from './Tags.vue';
 import bus from './bus';
@@ -29,7 +36,9 @@ export default {
         };
     },
     components: {
-        vHead,
+        headerAuth,  // 权限系统化header
+        headerDatax, // 数据中心header
+        headerEnginex, // 决策引擎系统
         vSidebar,
         vTags
     },
@@ -47,5 +56,31 @@ export default {
             this.tagsList = arr;
         });
     },
+    methods: {
+      // 权限系统
+      headerShowAuth() {
+        if (localStorage.getItem('platform') === 'Auth') {
+          return true
+        } else {
+          return false
+        }
+      },
+      // 数据中心
+      headerShowDatax() {
+        if (localStorage.getItem('platform') === 'DataX') {
+          return true
+        } else {
+          return false
+        }
+      },
+      // 决策引擎系统
+      headerShowEnginex() {
+        if (localStorage.getItem('platform') === 'Enginex') {
+          return true
+        } else {
+          return false
+        }
+      }
+    }
 };
 </script>

h5-enginex-manager/src/components/common/Sidebar.vue

@@ -60,20 +60,27 @@
 
 		methods: {
 			async getMenus() {
-				const data = await getMenus({entity:{resourceSystem:'EngineX'}});
+				const data1 = await getMenus({entity:{resourceSystem:'Auth'}});
+				const data2 = await getMenus({entity:{resourceSystem:'DataX'}});
+				const data3 = await getMenus({entity:{resourceSystem:'Enginex'}});
 			    // console.log('菜单接口返回的数据',data);
-				if (data.status === "0") {
+				// if (data.status === "0") {
-					this.$message.error(data.msg);
+				// 	this.$message.error(data.msg);
-					if (data.error === "01000103") {
+				// 	if (data.error === "01000103") {
-						this.$router.push('/login')
+        //     if (localStorage.getItem('platform') === 'Auth') { 
-					}
+        //       this.$router.push('/loginAuth')
-				}
+        //     } else if (localStorage.getItem('platform') === 'DataX') {
+        //       this.$router.push('/loginDatax')
+        //     } else if (localStorage.getItem('platform') === 'Enginex') {
+        //       this.$router.push('/loginEnginex')
+        //     }
+				// 	}
+				// }
 
-				this.items = data.data;
+				this.items = [...data1.data, ...data2.data, ...data3.data];
 				if(this.items.length == 0){
 					this.$message.error('您没有导航权限,请联系管理员');
 				}
-				// console.log("items", this.items);
 			}
 		}
 	};

h5-enginex-manager/src/components/common/Tags.vue

@@ -47,7 +47,12 @@
             // 关闭全部标签
             closeAll(){
                 this.tagsList = [];
-                this.$router.push('/');
+                if (localStorage.getItem('platform') === 'Auth') {
+                  // 权限系统
+                  this.$router.push('/userManagement');
+                } else {
+                  this.$router.push('/dashboard');
+                }
             },
             // 关闭其他标签
             closeOther(){

h5-enginex-manager/src/components/page/DashboardDatax.vue

@@ -0,0 +1,420 @@
+<template>
+	<div>
+		<el-row :gutter="20">
+			<el-col :span="8">
+				<el-card shadow="hover" class="mgb20" style="height:252px;">
+					<div class="user-info">
+						<img src="../../assets/img/img2.png" class="user-avator" alt />
+						<div class="user-info-cont">
+							<div class="user-info-name">{{name}}</div>
+							<!-- <div>{{role}}</div> -->
+						</div>
+					</div>
+					<div class="user-info-list">
+						上次登录时间：
+						<span>{{lastLoginTime | formatDate}}</span>
+					</div>
+				</el-card>
+				<el-card shadow="hover" style="height:252px;">
+					<div slot="header" class="clearfix">
+						<span>指标详情</span>
+					</div>
+
+					<charts sid="dashboardLeft" height='250px' width='100%' :option="options"></charts>
+				</el-card>
+			</el-col>
+			<el-col :span="16">
+				<el-row :gutter="20" class="mgb20">
+					<el-col :span="8">
+						<el-card shadow="hover" :body-style="{padding: '0px'}">
+							<div class="grid-content grid-con-1">
+								<i class="el-icon-lx-people grid-con-icon"></i>
+								<div class="grid-cont-right">
+									<div class="grid-num">{{fieldCount}}</div>
+									<div>指标数量</div>
+								</div>
+							</div>
+						</el-card>
+					</el-col>
+					<el-col :span="8">
+						<el-card shadow="hover" :body-style="{padding: '0px'}">
+							<div class="grid-content grid-con-2">
+								<i class="el-icon-lx-notice grid-con-icon"></i>
+								<div class="grid-cont-right">
+									<div class="grid-num">{{interfaceCount}}</div>
+									<div>接口数量</div>
+								</div>
+							</div>
+						</el-card>
+					</el-col>
+					<el-col :span="8">
+						<el-card shadow="hover" :body-style="{padding: '0px'}">
+							<div class="grid-content grid-con-3">
+								<i class="el-icon-lx-goods grid-con-icon"></i>
+								<div class="grid-cont-right">
+									<div class="grid-num">{{databaseCount}}</div>
+									<div>数据源数量</div>
+								</div>
+							</div>
+						</el-card>
+					</el-col>
+				</el-row>
+				<el-card shadow="hover" style="height:403px;">
+					<div slot="header" class="clearfix">
+						<span>活动日志</span>
+					</div>
+					<el-table :show-header="false" :data="todoList" style="width:100%;">
+						<el-table-column>
+							<template slot-scope="scope">
+								<div class="todo-item">{{scope.row.opUserName}} {{scope.row.ip}}
+									在{{scope.row.startTime | formatDate}}
+									{{scope.row.opName}}
+								</div>
+							</template>
+						</el-table-column>
+					</el-table>
+				</el-card>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-card shadow="hover">
+					<p style="text-align: center;font-size: 18px;font-weight: bold;color: #666;">指标调用次数</p>
+					<div style="display: flex;flex-wrap: wrap;">
+						<p v-for="value in CallCountList" style="width: 50%;font-size: 16px;text-align: center;">{{value.name}}:{{value.value}}次</p>
+					
+						
+					</div>
+				</el-card>
+			</el-col>
+			<!-- <el-col :span="12">
+				<el-card shadow="hover">
+					<charts sid="dashboardRight" height='250px' width='100%' :option="options2"></charts>
+				</el-card>
+			</el-col> -->
+		</el-row>
+	</div>
+</template>
+
+<script>
+	import charts from '@/components/common/charts.vue'
+	import bus from '../common/bus';
+	import {
+		getIndexInfo,
+		getFieldCallCountList
+	} from '../../api/index';
+	export default {
+		name: 'dashboard',
+		components: {
+			// Schart,
+			charts
+		},
+		data() {
+			return {
+				name: localStorage.getItem('ms_username'),
+				lastLoginTime: null,
+				fieldCount: null,
+				interfaceCount: null,
+				databaseCount: null,
+				fieldTypeName:{
+					1:'基础指标',
+					2:'数据库指标',
+					3:'衍生指标',
+					4:'接口指标',
+					5:'常量指标',
+					6:'实时指标',
+					
+				},
+				CallCountList:[],
+				todoList: [],
+				options: {
+
+					grid: {
+						// top:'20%'
+					},
+					tooltip: {
+						trigger: 'item',
+						formatter: '{b} : {c} ({d}%)'
+					},
+
+					legend: {
+						left: 'center',
+						top: 'bottom',
+					},
+					series: [{
+						name: 'Area Mode',
+						type: 'pie',
+						radius: [10, 60],
+						center: ['50%', '30%'],
+						roseType: 'area',
+						itemStyle: {
+							borderRadius: 5
+						},
+						data: [
+							
+						]
+					}]
+
+				},
+				options2: {
+					title: {
+						text: '最近几个月引擎使用趋势图',
+						left: 'center'
+					},
+					grid: {
+						bottom: '10% '
+					},
+					xAxis: [{
+						type: 'category',
+						axisTick: {
+							show: false
+						},
+						data: []
+					}],
+					yAxis: [{
+						type: 'value'
+					}],
+					tooltip: {
+						trigger: 'item'
+					},
+					series: []
+
+				},
+			};
+		},
+
+		computed: {
+			role() {
+				return this.name === 'admin' ? '超级管理员' : '普通用户';
+			}
+		},
+		// created() {
+		//     this.handleListener();
+		//     this.changeDate();
+		// },
+		// activated() {
+		//     this.handleListener();
+		// },
+		// deactivated() {
+		//     window.removeEventListener('resize', this.renderChart);
+		//     bus.$off('collapse', this.handleBus);
+		// },
+
+		created() {
+			this.getIndexInfos();
+			getFieldCallCountList({}).then(res=>{
+				if(res.status=='1'){
+					this.CallCountList=res.data.map(value=>{
+						return {
+							name:value.fieldCn,
+							value:value.callCount
+						}
+					})
+				}
+			})
+		},
+
+		methods: {
+			changeDate() {
+				const now = new Date().getTime();
+				this.data.forEach((item, index) => {
+					const date = new Date(now - (6 - index) * 86400000);
+					item.name = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`;
+				});
+			},
+			
+			async getIndexInfos() {
+				const result = await getIndexInfo();
+				const data = result.data;
+
+
+				// 引擎基本信息
+				this.fieldCount = data.fieldCount;
+				this.interfaceCount = data.interfaceCount;
+				this.databaseCount = data.databaseCount;
+
+				// 引擎使用占比
+
+
+				// 最近几天引擎使用情况
+
+
+
+				// var labelOption = {
+				// 	show: true,
+				// 	position: 'insideBottomRight',
+				// 	distance: 10,
+				// 	align: 'left',
+				// 	verticalAlign: 'middle',
+				// 	rotate: 90,
+				// 	// formatter: '{c}  {name|{a}}',
+				// 	fontSize: 12,
+				// 	rich: {
+				// 		name: {}
+				// 	}
+				// };
+
+
+				this.options.series[0].data=data.fieldTypeGroup.map(value=>{
+					return {
+						value:value.fieldCount,
+						name:this.fieldTypeName[value.fieldType]
+					}
+				})
+
+				// // 最近几个月引擎使用情况
+				// this.options2.xAxis[0].data = data.recentMonthMap.labels;
+				// this.options2.series = data.recentMonthMap.datasets.map(value => {
+				// 	return {
+				// 		name: value.label,
+				// 		type: 'line',
+				// 		barGap: 0,
+				// 		label: labelOption,
+				// 		emphasis: {
+				// 			focus: 'series'
+				// 		},
+				// 		data: value.data
+				// 	}
+				// })
+
+				// 上次登录时间
+				this.lastLoginTime = data.lastLoginTime;
+
+
+				// 活动日志
+				this.todoList = data.logList;
+			}
+		},
+
+		filters: {
+			formatDate: function(value) {
+				let date = new Date(value);
+				let y = date.getFullYear();
+				let MM = date.getMonth() + 1;
+				MM = MM < 10 ? ('0' + MM) : MM;
+				let d = date.getDate();
+				d = d < 10 ? ('0' + d) : d;
+				let h = date.getHours();
+				h = h < 10 ? ('0' + h) : h;
+				let m = date.getMinutes();
+				m = m < 10 ? ('0' + m) : m;
+				let s = date.getSeconds();
+				s = s < 10 ? ('0' + s) : s;
+				return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
+			}
+		}
+
+	};
+</script>
+
+
+<style scoped>
+	.el-row {
+		margin-bottom: 20px;
+	}
+
+	.grid-content {
+		display: flex;
+		align-items: center;
+		height: 100px;
+	}
+
+	.grid-cont-right {
+		flex: 1;
+		text-align: center;
+		font-size: 14px;
+		color: #999;
+	}
+
+	.grid-num {
+		font-size: 30px;
+		font-weight: bold;
+	}
+
+	.grid-con-icon {
+		font-size: 50px;
+		width: 100px;
+		height: 100px;
+		text-align: center;
+		line-height: 100px;
+		color: #fff;
+	}
+
+	.grid-con-1 .grid-con-icon {
+		background: rgb(45, 140, 240);
+	}
+
+	.grid-con-1 .grid-num {
+		color: rgb(45, 140, 240);
+	}
+
+	.grid-con-2 .grid-con-icon {
+		background: rgb(100, 213, 114);
+	}
+
+	.grid-con-2 .grid-num {
+		color: rgb(45, 140, 240);
+	}
+
+	.grid-con-3 .grid-con-icon {
+		background: rgb(242, 94, 67);
+	}
+
+	.grid-con-3 .grid-num {
+		color: rgb(242, 94, 67);
+	}
+
+	.user-info {
+		display: flex;
+		align-items: center;
+		padding-bottom: 20px;
+		border-bottom: 2px solid #ccc;
+		margin-bottom: 20px;
+	}
+
+	.user-avator {
+		width: 120px;
+		height: 120px;
+		border-radius: 50%;
+	}
+
+	.user-info-cont {
+		padding-left: 50px;
+		flex: 1;
+		font-size: 14px;
+		color: #999;
+	}
+
+	.user-info-cont div:first-child {
+		font-size: 30px;
+		color: #222;
+	}
+
+	.user-info-list {
+		font-size: 14px;
+		color: #999;
+		line-height: 25px;
+	}
+
+	.user-info-list span {
+		margin-left: 70px;
+	}
+
+	.mgb20 {
+		margin-bottom: 20px;
+	}
+
+	.todo-item {
+		font-size: 14px;
+	}
+
+	.todo-item-del {
+		text-decoration: line-through;
+		color: #999;
+	}
+
+	.schart {
+		width: 100%;
+		height: 300px;
+	}
+</style>

h5-enginex-manager/src/components/page/LoginAuth.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="login-wrap">
+      <div class="ms-login">
+          <div class="ms-title">权限系统</div>
+          <el-form :model="param" :rules="rules" ref="login" label-width="0px" class="ms-content">
+              <el-form-item prop="username">
+                  <el-input v-model="param.username" placeholder="username">
+                      <el-button slot="prepend" icon="el-icon-lx-people"></el-button>
+                  </el-input>
+              </el-form-item>
+              <el-form-item prop="password">
+                  <el-input
+                      type="password"
+                      placeholder="password"
+                      v-model="param.password"
+                      @keyup.enter.native="submitForm()"
+                  >
+                      <el-button slot="prepend" icon="el-icon-lx-lock"></el-button>
+                  </el-input>
+              </el-form-item>
+              <div class="login-btn">
+                  <el-button type="primary" @click="submitForm()">登录</el-button>
+              </div>
+          </el-form>
+      </div>
+  </div>
+</template>
+
+<script>
+import { getLogin } from '../../api/index';
+export default {
+  data: function() {
+      return {
+          param: {
+              username: '',
+              password: '',
+          },
+          rules: {
+              username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
+              password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+          },
+      };
+  },
+  methods: {
+      submitForm() {
+          this.$refs.login.validate(valid => {
+              if (valid) {
+                // 调用登录接口
+                this.getLogins();
+
+              } else {
+                  this.$message.error('请输入账号和密码');
+                  console.log('error submit!!');
+                  return false;
+              }
+          });
+      },
+    async getLogins() {
+      var params ={
+        account:this.param.username,
+        password:this.param.password
+      }
+    
+      const data = await getLogin(params);
+      console.log('登录接口返回的数据',data);
+      const code = data.code;
+    
+      if(data.status==="1"){
+        this.$message.success('登录成功，即将跳转');
+        localStorage.setItem('ms_username', this.param.username);
+        localStorage.setItem('token', data.data.token);
+        // 权限系统
+        localStorage.setItem('platform', 'Auth');
+        this.$router.push('/userManagement');
+      } else {
+        this.$message.error(data.msg);
+      }
+    }
+  },
+};
+</script>
+
+<style scoped>
+.login-wrap {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background-image: url(../../assets/img/login-bg.jpg);
+  background-size: 100%;
+}
+.ms-title {
+  width: 100%;
+  line-height: 50px;
+  text-align: center;
+  font-size: 20px;
+  color: #fff;
+  border-bottom: 1px solid #ddd;
+}
+.ms-login {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  width: 350px;
+  margin: -190px 0 0 -175px;
+  border-radius: 5px;
+  background: rgba(255, 255, 255, 0.3);
+  overflow: hidden;
+}
+.ms-content {
+  padding: 30px 30px;
+}
+.login-btn {
+  text-align: center;
+}
+.login-btn button {
+  width: 100%;
+  height: 36px;
+  margin-bottom: 10px;
+}
+.login-tips {
+  font-size: 12px;
+  line-height: 30px;
+  color: #fff;
+}
+</style>

h5-enginex-manager/src/components/page/LoginDatax.vue

@@ -0,0 +1,136 @@
+<template>
+  <div class="login-wrap">
+      <div class="ms-login">
+          <div class="ms-title">数据中心</div>
+          <el-form :model="param" :rules="rules" ref="login" label-width="0px" class="ms-content">
+              <el-form-item prop="username">
+                  <el-input v-model="param.username" placeholder="username">
+                      <el-button slot="prepend" icon="el-icon-lx-people"></el-button>
+                  </el-input>
+              </el-form-item>
+              <el-form-item prop="password">
+                  <el-input
+                      type="password"
+                      placeholder="password"
+                      v-model="param.password"
+                      @keyup.enter.native="submitForm()"
+                  >
+                      <el-button slot="prepend" icon="el-icon-lx-lock"></el-button>
+                  </el-input>
+              </el-form-item>
+              <div class="login-btn">
+                  <el-button type="primary" @click="submitForm()">登录</el-button>
+              </div>
+          </el-form>
+      </div>
+  </div>
+</template>
+
+<script>
+import { getLogin } from '../../api/index';
+export default {
+created() {
+  // if(this.$route.query.type=="token"){
+  // 	this.$message.error('登陆授权码已过期')
+  // 	this.$route.query.type=""
+  // }
+},
+  data: function() {
+      return {
+          param: {
+              username: '',
+              password: '',
+          },
+          rules: {
+              username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
+              password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+          },
+      };
+  },
+  methods: {
+      submitForm() {
+          this.$refs.login.validate(valid => {
+              if (valid) {
+                // 调用登录接口
+                this.getLogins();
+
+              } else {
+                  this.$message.error('请输入账号和密码');
+                  console.log('error submit!!');
+                  return false;
+              }
+          });
+      },
+      async getLogins() {
+          // var formdata = new FormData();
+          // formdata.append('account', this.param.username);
+          // formdata.append('password', this.param.password);
+    var params ={
+      account:this.param.username,
+      password:this.param.password
+    }
+    
+          const data = await getLogin(params);
+          console.log('登录接口返回的数据',data);
+          const code = data.code;
+    
+    if(data.status==="1"){
+        this.$message.success('登录成功，即将跳转');
+        localStorage.setItem('ms_username', this.param.username);
+      localStorage.setItem('token', data.data.token);
+        // 数据中心
+        localStorage.setItem('platform', 'DataX');
+        this.$router.push('/dashboard');
+      this.mixinReGetStorage()
+    }
+    else{
+              this.$message.error(data.msg);
+          }
+      }
+  },
+};
+</script>
+
+<style scoped>
+.login-wrap {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background-image: url(../../assets/img/login-bg.jpg);
+  background-size: 100%;
+}
+.ms-title {
+  width: 100%;
+  line-height: 50px;
+  text-align: center;
+  font-size: 20px;
+  color: #fff;
+  border-bottom: 1px solid #ddd;
+}
+.ms-login {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  width: 350px;
+  margin: -190px 0 0 -175px;
+  border-radius: 5px;
+  background: rgba(255, 255, 255, 0.3);
+  overflow: hidden;
+}
+.ms-content {
+  padding: 30px 30px;
+}
+.login-btn {
+  text-align: center;
+}
+.login-btn button {
+  width: 100%;
+  height: 36px;
+  margin-bottom: 10px;
+}
+.login-tips {
+  font-size: 12px;
+  line-height: 30px;
+  color: #fff;
+}
+</style>

h5-enginex-manager/src/components/page/LoginEnginex.vue

@@ -78,7 +78,9 @@ export default {
 			    this.$message.success('登录成功，即将跳转');
 			    localStorage.setItem('ms_username', this.param.username);
 				localStorage.setItem('token', data.data.token);
-				this.$router.push('/');
+        // 决策引擎系统
+        localStorage.setItem('platform', 'Enginex');
+        this.$router.push('/dashboard');
 				this.mixinReGetStorage()
 			}
 			else{

h5-enginex-manager/src/components/page/systemManagement/resourceManagement.vue

@@ -9,39 +9,20 @@
 			</el-row>
 		</div>
 		<div class="tab-wrapper">
-
-			<!-- <el-tabs v-model="tabs" @tab-click="pager.pageNum=1;getlist()">
-				<el-tab-pane label="EngineX" name="EngineX"></el-tab-pane>
-				<el-tab-pane label="DataX" name="DataX"></el-tab-pane>
-			</el-tabs> -->
-
 			<div v-loading="loading">
 				<el-table border ref="multipleTable" :data="dataList" tooltip-effect="dark" style="width: 100%"
 					@selection-change="handleSelectionChange">
-					<el-table-column type="selection" width="55">
+					<el-table-column type="selection" width="55" />
-					</el-table-column>
+					<el-table-column prop="code" width="200" label="资源编号" />
-
+					<el-table-column prop="name" label="名称" width="" show-overflow-tooltip />
-					<el-table-column prop="code" width="200" label="资源编号">
+					<el-table-column prop="url" label="路径" width="" show-overflow-tooltip />
-					</el-table-column>
+					<el-table-column prop="icon" label="图标" width="" show-overflow-tooltip />
-
+					<el-table-column prop="sort" label="排序" width="" show-overflow-tooltip />
-					<el-table-column prop="name" label="名称" width="" show-overflow-tooltip>
-					</el-table-column>
-
-					<el-table-column prop="url" label="路径" width="" show-overflow-tooltip>
-					</el-table-column>
-
-					<el-table-column prop="icon" label="图标" width="" show-overflow-tooltip>
-					</el-table-column>
-
-					<el-table-column prop="sort" label="排序" width="" show-overflow-tooltip>
-					</el-table-column>
-
 					<el-table-column prop="birth" label="创建时间" width="" show-overflow-tooltip>
 						<template slot-scope="scope">
 							{{scope.row.birth|formatDate}}
 						</template>
 					</el-table-column>
-
 					<el-table-column label="操作" align="center" size="s">
 						<template slot-scope="scope">
 							<el-tooltip content="编辑" placement="left">

h5-enginex-manager/src/router/index.js

@@ -1,4 +1,4 @@
-import Vue from 'vue';
+import Vue, { KeepAlive } from 'vue';
 import Router from 'vue-router';
 
 Vue.use(Router);
@@ -13,19 +13,49 @@ export default new Router({
       path: '/',
       redirect: '/dashboard'
     },
+
+    /**
+     * 登录
+     */
+    // 决策引擎系统 - 登录
 		{
       path: '/login',
-		    component: () => import('../components/page/Login.vue'),
+      component: () => import('../components/page/LoginEnginex.vue'),
       meta: { title: '登录' }
 		},
+    // 权限系统 - 登录
+    {
+      path: '/loginAuth',
+      component: () => import('../components/page/LoginAuth.vue'),
+      meta: { title: '登录', KeepAlive: true }
+		},
+    // 数据中心 - 登录
+    {
+      path: '/loginDatax',
+      component: () => import('../components/page/LoginDatax.vue'),
+      meta: { title: '登录' }
+		},
+
+
     {
       path: '/',
       component: () => import('../components/common/Home.vue'),
       meta: { title: '自述文件' },
       children: [
+        {
+          path: '/dashboardEnginex',
+          component: () => {
+            const userRole = localStorage.getItem('platform');
+            return import('../components/page/DashboardEnginex.vue');
+          },
+          meta: { title: '系统首页' }
+        },
         {
           path: '/dashboard',
-                    component: () => import('../components/page/Dashboard.vue'),
+          component: () => {
+            const userRole = localStorage.getItem('platform');
+            return import('../components/page/DashboardDatax.vue');
+          },
           meta: { title: '系统首页' }
         },
         {
@@ -42,7 +72,8 @@ export default new Router({
           path: '/dataFlowEngine',
           component: () => import('../components/page/dataFlowEngine.vue'),
           meta: { title: '数据流引擎列表' }
-                },{
+        },
+        {
           path: '/dataFlowEngineCont',
 					name:'dataFlowEngineCont',
           component: () => import('../components/page/dataFlowEngineCont.vue'),
@@ -57,7 +88,8 @@ export default new Router({
           path: '/listOperation',
           component: () => import('../components/page/listOperation.vue'),
           meta: { title: '集合规则' }
-				},{
+				},
+        {
           path: '/dataRinse',
           component: () => import('../components/page/dataRinse.vue'),
           meta: { title: '数据清洗' }
@@ -71,22 +103,22 @@ export default new Router({
           path: '/groovyRule',
           component: () => import('../components/page/groovyRule.vue'),
           meta: { title: '脚本规则集' }
-                },{
+        },
+        {
           path: '/decisionTable',
           component: () => import('../components/page/decisionTable.vue'),
           meta: { title: '决策表' }
-                },{
+        },
+        {
           path: '/decisionTree',
           component: () => import('../components/page/decisionTree.vue'),
           meta: { title: '决策树' }
         },
-
         {
           path:'/blackWihiteData',
           component: () => import('../components/page/blackWhiteManage/blackWihiteData.vue'),
           meta: { title: '名单库管理' }
         },
- 
         {
           path:'/logManagement',
           component: () => import('../components/page/systemManagement/logManagement.vue'),
@@ -110,7 +142,8 @@ export default new Router({
           path:'/examineCurrent',
           component: () => import('../components/page/examineCurrent.vue'),
           meta: { title: '审批流' }
-				},{
+				},
+        {
           path:'/examineSet',
           component: () => import('../components/page/examineSet.vue'),
           meta: { title: '审批设置' }
@@ -119,22 +152,22 @@ export default new Router({
           path: '/indexModels',
           component: () => import('@/components/models/index.vue'),
           meta: {title: '模型管理'}
-                },{
+        },
+        {
           path: '/engine_result',
           component: () => import('@/components/page/Engine_watch.vue'),
           meta: {title: '决策流监控列表'}
-                },{
+          },
+          {
             path: '/engine_result_cont/:id',
             component: () => import('@/components/page/Engine_watch_cont.vue'),
             meta: {title: '决策流监控'}
           }, 
-
           {
             path: '/businessRuleRel',
             component: () => import('@/components/page/businessRuleRel.vue'),
             meta: {title: '业务类型'}
           },
-
           {
             path: '/tendencyAnalyse',
             component: () => import('@/components/page/tendencyAnalyse.vue'),
@@ -155,12 +188,11 @@ export default new Router({
             component: () => import('../components/page/403.vue'),
             meta: { title: '403' }
           },
-
+          // 权限系统
-                // --- 
           {
             path:'/userManagement',
             component: () => import('../components/page/systemManagement/userManagement.vue'),
-                  meta: { title: '用户管理' }
+            meta: { title: '用户管理', KeepAlive: true }
           },
           {
             path:'/roleManagement',
@@ -177,7 +209,6 @@ export default new Router({
             component: () => import('../components/page/systemManagement/organizationManagement.vue'),
             meta: { title: '组织管理' }
           },
-
           // 
           {
             path: '/dataManage',
@@ -193,7 +224,8 @@ export default new Router({
             path: '/SQLmanage',
             component: () => import('../components/page/SQLManage.vue'),
             meta: { title: '数据库指标' }
-                },{
+          },
+          {
             path: '/realTimeManage',
             component: () => import('../components/page/realTimeManage.vue'),
             meta: { title: '实时指标' }
@@ -228,10 +260,8 @@ export default new Router({
             component: () => import('@/components/page/FieldStatistics.vue'),
             meta: {title: '指标统计'}
           },
-
         ]
       },
-        
       {
         path: '*',
         redirect: '/404'

h5-enginex-manager/src/styles/index.scss

@@ -1,8 +1,9 @@
-@import './variables.scss';
+
-@import './mixin.scss';
+@use './mixin.scss';
-@import './transition.scss';
+@use './transition.scss';
-@import './element-ui.scss';
+@use './element-ui.scss';
-@import './sidebar.scss';
+@use './variables.scss';
+@use './sidebar.scss';
 
 body {
   -moz-osx-font-smoothing: grayscale;

h5-enginex-manager/src/styles/sidebar.scss

@@ -1,3 +1,5 @@
+@use './variables.scss';
+
 #app {
 
   // 主体区域
@@ -69,9 +71,9 @@
   .sidebar-container .nest-menu .el-submenu>.el-submenu__title,
   .sidebar-container .el-submenu .el-menu-item {
     min-width: 180px !important;
-    background-color: $subMenuBg !important;
+    background-color: variables.$subMenuBg !important;
     &:hover {
-      background-color: $menuHover !important;
+      background-color: variables.$menuHover !important;
     }
   }
   .el-menu--collapse .el-menu .el-submenu {