From 83ff2ebbb1d61c2cd7762df33f61ff0418b2b1c9 Mon Sep 17 00:00:00 2001
From: surprise <15810472099@163.com>
Date: 星期日, 28 四月 2024 22:19:49 +0800
Subject: [PATCH] 页面添加
---
src/components/navMenu.vue | 331 ++++++++++++++++++++++++++----------------------------
1 files changed, 159 insertions(+), 172 deletions(-)
diff --git a/src/components/navMenu.vue b/src/components/navMenu.vue
index 57b86e2..c4fce7b 100644
--- a/src/components/navMenu.vue
+++ b/src/components/navMenu.vue
@@ -1,40 +1,28 @@
<template>
- <div
- class="NavBox"
- @click.stop
- >
+ <div class="NavBox"
+ @click.stop>
<div class="topBox">
<div class="topTitle"></div>
<div class="topMenu">
<div class="menuContent">
- <div
- class="contentDiv"
- @click="setMenuMove(index, item)"
- v-for="(item, index) in listMenu"
- >
+ <div class="contentDiv"
+ @click="setMenuMove(index, item)"
+ v-for="(item, index) in listMenu">
<div style="display: flex;align-items: center">
<div class="ImgMenu">
- <div
- class="menuImage"
- :class="changeSelectStyle == index ? item.checkClass : item.css"
- ></div>
+ <div class="menuImage"
+ :class="changeSelectStyle == index ? item.checkClass : item.css"></div>
</div>
- <div
- class="menulabel"
- :class="{ changeStyle: changeSelectStyle == index }"
- >
+ <div class="menulabel"
+ :class="{ changeStyle: changeSelectStyle == index }">
<span v-show="language"> {{ item.cnName }}</span> <span v-show="!language"> {{ item.enName }}</span>
</div>
</div>
- <div
- class="secondMenuDiv subpage_Div"
- v-show="index == showFlag ? true :false"
- >
- <div
- v-for="res in item.children"
- @click="setLiClick(res,index)"
- :class="{ changeLiStyle: changeliSelect == res.cnName }"
- >
+ <div class="secondMenuDiv subpage_Div"
+ v-show="index == showFlag ? true :false">
+ <div v-for="res in item.children"
+ @click="setLiClick(res,index)"
+ :class="{ changeLiStyle: changeliSelect == res.cnName }">
<span v-show="language"> {{ res.cnName }}</span> <span v-show="!language"> {{ res.enName }}</span>
</div>
</div>
@@ -43,25 +31,19 @@
</div>
<div class="topUser">
<div class="userLanguage">
- <div
- class="userImage theme"
- @click="themeChange"
- ></div>
- <div
- class="userImage user2"
- @click="switchLang"
- ></div>
+ <div class="userImage theme"
+ @click="themeChange"></div>
+ <!-- <div class="userImage user2"
+ @click="switchLang"></div> -->
</div>
<div class="userName">
<div class="userImage user1"></div>
<div class="userText">
<span>{{ this.$store.state.uname }}</span>
- <el-link
- @click="logOut"
- :underline="false"
- class="elLink"
- >{{ $t('common.logout') }}</el-link>
+ <el-link @click="logOut"
+ :underline="false"
+ class="elLink">{{ $t('common.logout') }}</el-link>
</div>
</div>
</div>
@@ -71,12 +53,13 @@
</template>
<script>
-import { logout, selectMenuRecursive, sign_insertOpLog } from '@/api/api';
-import { removeToken, getToken } from '@/utils/auth';
+import { logout,selectMenuRecursive,sign_insertOpLog } from '@/api/api';
+import { removeToken,getToken } from '@/utils/auth';
import customElMenu from '../components/customElMenu.vue';
-import { queryMenuTree, getPerms } from '../api/api';
+import { queryMenuTree,getPerms } from '../api/api';
import colorChange from '../views/maintenance/colorChange.vue';
import { containsCoordinate } from 'ol/extent';
+import axios from "axios";
import Vue from 'vue';
import $ from 'jquery'
export default {
@@ -86,7 +69,7 @@
customElMenu,
colorChange,
},
- data() {
+ data () {
return {
themeColor: true,
@@ -140,34 +123,34 @@
]
};
},
- created() { },
- mounted() {
- this.$store.state.themeflag = false;
+ created () { },
+ mounted () {
+ this.$store.state.themeflag=false;
$("#app").removeClass("Black_theme");
this.getMenuTree();
- if (sessionStorage.getItem('changeliSelect')) {
- this.$set(this, 'changeliSelect', sessionStorage.getItem('changeliSelect'))
+ if(sessionStorage.getItem('changeliSelect')) {
+ this.$set(this,'changeliSelect',sessionStorage.getItem('changeliSelect'))
// this.changeliSelect = sessionStorage.getItem('changeliSelect')
}
- document.body.addEventListener('click', () => {
- this.showFlag = null;
- }, false);
+ document.body.addEventListener('click',() => {
+ this.showFlag=null;
+ },false);
// this.$bus.$on('closeMenuSecond', res => {
// this.showFlag = null;
// })
- window.addEventListener('message', (e) => {
+ window.addEventListener('message',(e) => {
- this.showFlag = null;
+ this.showFlag=null;
})
},
computed: {},
methods: {
- closeSecondMenu() {
- this.showFlag = null
+ closeSecondMenu () {
+ this.showFlag=null
},
- themeChange() {
- this.$store.state.themeflag = !this.$store.state.themeflag;
- if (this.$store.state.themeflag == true) {
+ themeChange () {
+ this.$store.state.themeflag=!this.$store.state.themeflag;
+ if(this.$store.state.themeflag==true) {
$("#app").addClass("Black_theme");
} else {
@@ -175,32 +158,32 @@
}
},
- async getCookies() {
- var boolean = this.getTimeCookies();
- if (boolean != true) {
+ async getCookies () {
+ var boolean=this.getTimeCookies();
+ if(boolean!=true) {
this.$router.push('/login');
return;
}
- if (this.$store.state.permsEntity.length == 0) {
- const data = await getPerms();
- this.$store.state.permsEntity = data.result;
+ if(this.$store.state.permsEntity.length==0) {
+ const data=await getPerms();
+ this.$store.state.permsEntity=data.result;
}
- this.$store.state.uname = JSON.parse(
+ this.$store.state.uname=JSON.parse(
localStorage.getItem('LFToken')
).uname;
- this.$store.state.unid = JSON.parse(
+ this.$store.state.unid=JSON.parse(
localStorage.getItem('LFToken')
).userid;
this.$router.push('/');
},
- getTimeCookies() {
- if (!localStorage.getItem('LFToken')) {
+ getTimeCookies () {
+ if(!localStorage.getItem('LFToken')) {
return false
}
- var time1 = new Date(JSON.parse(localStorage.getItem('LFToken')).time);
- var time2 = new Date();
- if (time2 > time1) {
+ var time1=new Date(JSON.parse(localStorage.getItem('LFToken')).time);
+ var time2=new Date();
+ if(time2>time1) {
return false;
} else {
return true;
@@ -208,77 +191,77 @@
},
//涓婚鍒囨崲
- setThemeColors() { },
- async signInsertOpLog(m1, m2) {
- var obj = {
+ setThemeColors () { },
+ async signInsertOpLog (m1,m2) {
+ var obj={
m1: m1,
m2: m2,
}
- const data = await sign_insertOpLog(obj);
+ const data=await sign_insertOpLog(obj);
},
//榧犳爣绉诲叆鑿滃崟浜嬩欢
- setMenuMove(index, item) {
+ setMenuMove (index,item) {
- if (item.perms != null && item.perms != "") {
+ if(item.perms!=null&&item.perms!="") {
this.$router.push(item.url);
- if (this.showFlag != null) {
+ if(this.showFlag!=null) {
- this.changeliSelect = '%%';
- this.showFlag = null;
+ this.changeliSelect='%%';
+ this.showFlag=null;
}
- if (item.url == "Thematic") {
- this.signInsertOpLog("缁煎悎灞曠ず", item.cnName)
+ if(item.url=="Thematic") {
+ this.signInsertOpLog("缁煎悎灞曠ず",item.cnName)
}
- this.changeSelectStyle = index;
- sessionStorage.setItem('changeSelectStyle', index)
+ this.changeSelectStyle=index;
+ sessionStorage.setItem('changeSelectStyle',index)
} else {
- if (this.showFlag != index) {
- this.showFlag = index;
+ if(this.showFlag!=index) {
+ this.showFlag=index;
} else {
- this.showFlag = null;
+ this.showFlag=null;
}
}
//
- if (index === 4 || index === 5 || index === 6) {
+ if(index===4||index===5||index===6) {
sessionStorage.removeItem('changeliSelect')
- this.$set(this, 'changeliSelect', null)
+ this.$set(this,'changeliSelect',null)
}
},
- closeAllChildren() {
- var val = this.listMenu
- for (var i = 0; i < val.length; i++) {
- let newItem = val[i];
- newItem.show = false;
+ closeAllChildren () {
+ var val=this.listMenu
+ for(var i=0;i<val.length;i++) {
+ let newItem=val[i];
+ newItem.show=false;
- Vue.set(val, i, newItem);
+ Vue.set(val,i,newItem);
}
},
- setShowFalseDiv(bolean) {
- var index = this.showFlag;
- if (index != null) {
- let newItem = this.listMenu[index];
+ setShowFalseDiv (bolean) {
+ var index=this.showFlag;
+ if(index!=null) {
+ let newItem=this.listMenu[index];
- newItem.show = bolean;
- Vue.set(this.listMenu, index, newItem);
+ newItem.show=bolean;
+ Vue.set(this.listMenu,index,newItem);
}
},
- setLiClick(res, index) {
- this.changeSelectStyle = index;
- sessionStorage.setItem('changeSelectStyle', index)
+ setLiClick (res,index) {
+ this.changeSelectStyle=index;
+ sessionStorage.setItem('changeSelectStyle',index)
sessionStorage.removeItem('hanleselectmochaitmo')
sessionStorage.removeItem('hanleselectindex')
// this.signInsertOpLog(this.listMenu[index].cnName, res.cnName)
setTimeout(() => {
- this.changeliSelect = res.cnName;
- sessionStorage.setItem('changeliSelect', res.cnName)
- if (res.url.indexOf('{fmeHost}') != -1) {
- this.$store.reporturl = res.url;
- sessionStorage.setItem('iframehttpurl', this.$store.reporturl)
+ this.changeliSelect=res.cnName;
+ sessionStorage.setItem('changeliSelect',res.cnName)
+ if(res.url.indexOf('{fmeHost}')!=-1) {
+ this.$store.reporturl=res.url;
+ sessionStorage.setItem('iframehttpurl',this.$store.reporturl)
this.$router.push('/QualityInspection');
// if (location.href.indexOf('/WareInspection') == -1) {
// this.$store.reporturl = res.url;
@@ -287,29 +270,33 @@
// this.$bus.$emit('changeNaveUrl', res.url);
// }
} else {
- this.$store.reporturl = null;
- sessionStorage.setItem('iframehttpurl', null)
+ this.$store.reporturl=null;
+ sessionStorage.setItem('iframehttpurl',null)
// sessionStorage.setItem('changeliSelect', null)
this.$router.push(res.url);
- this.$store.commit('currentPerms', res.perms);
+ this.$store.commit('currentPerms',res.perms);
}
this.setShowFalseDiv(false)
- }, 100)
+ },100)
},
- async getMenuTree() {
+ async getMenuTree () {
this.getCookies();
- const data = await queryMenuTree();
+ const data=await queryMenuTree();
+ var that=this;
- var that = this;
- if (data.code == 200) {
+ that.showTreeData(data)
+ },
+ showTreeData (data) {
+ var that=this;
+ if(data.code==200) {
- if (data.result.length != 0) {
- let menuLists = data.result.filter((value) => {
- return value.pid == 1;
+ if(data.result.length!=0) {
+ let menuLists=data.result.filter((value) => {
+ return value.pid==1;
});
- that.menuList = menuLists;
+ that.menuList=menuLists;
that.setMenuTree(menuLists);
} else {
@@ -320,22 +307,22 @@
}
}
},
- async setMenuTree(res) {
+ async setMenuTree (res) {
- for (var i in res) {
- res[i].checkClass = res[i].css + '1';
- res[i].show = false; //鎺у埗鏄鹃殣
+ for(var i in res) {
+ res[i].checkClass=res[i].css+'1';
+ res[i].show=false; //鎺у埗鏄鹃殣
- if (res[i].perms == null || res[i].perms == "") {
- const result = await selectMenuRecursive({ id: res[i].id });
+ if(res[i].perms==null||res[i].perms=="") {
+ const result=await selectMenuRecursive({ id: res[i].id });
- if (result.code == 200) {
+ if(result.code==200) {
- res[i].children = result.result.filter((value) => {
- return value.isShow == 1;
+ res[i].children=result.result.filter((value) => {
+ return value.isShow==1;
})
.filter((value) => {
- return value.pid == res[i].id;
+ return value.pid==res[i].id;
});
}
@@ -353,7 +340,7 @@
// this.changeSelectStyle = this.listMenu.length - 1;
// }
- this.changeSelectStyle = sessionStorage.getItem('changeSelectStyle')
+ this.changeSelectStyle=sessionStorage.getItem('changeSelectStyle')
// var strartMneu = res[i].children[0];
// this.$store.commit('currentPerms', strartMneu.perms);
// this.changeliSelect = strartMneu.cnName;
@@ -363,17 +350,17 @@
}
}
},
- treeData(source) {
- let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕
+ treeData (source) {
+ let cloneData=JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕
// console.log(cloneData);
- if (cloneData.length != 0) {
+ if(cloneData.length!=0) {
return cloneData.filter((father) => {
// 寰幆鎵�鏈夐」
- let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁
- branchArr.length > 0 ? (father.children = branchArr) : ''; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
+ let branchArr=cloneData.filter((child) => father.id==child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁
+ branchArr.length>0? (father.children=branchArr):''; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
// 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭ｄ箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭ｄ箞 a.c.d 涔熸槸=2锛�
// 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋�
- return father.pid == 1; // 杩斿洖涓�绾ц彍鍗�
+ return father.pid==1; // 杩斿洖涓�绾ц彍鍗�
});
} else {
this.$message({
@@ -382,16 +369,16 @@
});
}
},
- logOut() {
- this.$confirm('纭鏄惁閫�鍑虹櫥褰�?', '鎻愮ず', {
+ logOut () {
+ this.$confirm('纭鏄惁閫�鍑虹櫥褰�?','鎻愮ず',{
confirmButtonText: '纭畾',
cancelButtonText: '鍙栨秷',
type: 'warning',
})
.then(async () => {
- const data = await logout({ token: getToken() });
+ const data=await logout({ token: getToken() });
// console.log(data);
- if (data.code != 200) {
+ if(data.code!=200) {
return this.$message.error('閫�鍑虹櫥褰曞け璐�');
}
removeToken();
@@ -408,59 +395,59 @@
});
});
},
- switchLang() {
+ switchLang () {
//褰撳墠en
- if (this.lang == 'en') {
+ if(this.lang=='en') {
//璇█鎹㈡垚zh
- this.lang = 'zh';
- this.language = true;
- this.$store.state.language = true;
+ this.lang='zh';
+ this.language=true;
+ this.$store.state.language=true;
//鑿滃崟鎹负zh
- this.$store.commit('changeLang', 'zh');
+ this.$store.commit('changeLang','zh');
//i18鎹㈡垚zh
- this.$i18n.locale = this.lang;
+ this.$i18n.locale=this.lang;
}
//褰撳墠zh
else {
- this.lang = 'en';
- this.language = false;
- this.$store.state.language = false;
- this.$i18n.locale = this.lang;
- this.$store.commit('changeLang', 'en'); //浼犻�掔偣鍑荤殑鑺傜偣
+ this.lang='en';
+ this.language=false;
+ this.$store.state.language=false;
+ this.$i18n.locale=this.lang;
+ this.$store.commit('changeLang','en'); //浼犻�掔偣鍑荤殑鑺傜偣
}
},
- handleselect(index, indexPath, e) {
+ handleselect (index,indexPath,e) {
// console.log(e.$attrs.perms);
- this.$store.commit('currentPerms', e.$attrs.perms.perms);
- if (Window.ws != null) {
+ this.$store.commit('currentPerms',e.$attrs.perms.perms);
+ if(Window.ws!=null) {
Window.ws.close();
- Window.ws.onclose = () => {
+ Window.ws.onclose=() => {
console.log('鏈嶅姟鍣ㄥ叧闂�');
};
- Window.ws = null;
+ Window.ws=null;
}
-debugger
- if (index.indexOf('{fmeHost}') != -1) {
+ debugger
+ if(index.indexOf('{fmeHost}')!=-1) {
this.$router.push('/databaseMonitoring');
- this.$store.commit('getIframe', index);
- } else if (isNaN(Number(index))) {
+ this.$store.commit('getIframe',index);
+ } else if(isNaN(Number(index))) {
this.$router.push(index);
}
},
},
watch: {
- $route() {
- let str = this.$route.path;
- if (str[0] == '/') {
- this.activeIndex = str.slice(1);
+ $route () {
+ let str=this.$route.path;
+ if(str[0]=='/') {
+ this.activeIndex=str.slice(1);
}
},
},
- created() {
- this.$store.reporturl = null;
- let str = this.$route.path;
- if (str[0] == '/') {
- this.activeIndex = str.slice(1);
+ created () {
+ this.$store.reporturl=null;
+ let str=this.$route.path;
+ if(str[0]=='/') {
+ this.activeIndex=str.slice(1);
}
},
};
--
Gitblit v1.9.3