<template>
|
<div id="sider"
|
:class="['aui-wrapper',{'aui-wrapper-width-pos':$store.state.auiWrapperWidthPos},{'horizontal-hide':$store.state.horizontalHide},{'aui-wrapper-width': $store.state.auiWrapperWidth},{'top-height':$store.state.auiWrapperTop},{ 'aui-sidebar--fold': $store.state.sidebarFold }, { 'hide-tabs': !$store.state.showHeader }]">
|
<template>
|
<main-navbar :flag="flag" @windowResize="windowResize" v-if="$store.state.showTop"/>
|
<main-sidebar :flag="flag" :param="param" v-if="$store.state.menuPos=='left'"
|
:class="{'iframe-top':$store.state.marginTop}"/>
|
<Main-sidebar-horizontal v-else v-show="$store.state.showTop"/>
|
<div class="aui-content__wrapper"
|
:class="[{'high-show-background': $store.state.highShowBackground},{'aui-wrapper-height': $store.state.auiWrapperHeight}]">
|
<main-content v-if="!$store.state.contentIsNeedRefresh"/>
|
</div>
|
<!--<main-theme-tools />-->
|
</template>
|
</div>
|
</template>
|
|
<script>
|
import MainNavbar from './main-navbar'
|
import MainSidebar from './main-sidebar'
|
import MainSidebarHorizontal from './main-sidebar-horizontal'
|
import MainContent from './main-content'
|
// import MainThemeTools from './main-theme-tools'
|
import debounce from 'lodash/debounce'
|
import Cookies from 'js-cookie'
|
import {getUUID} from '../../../packages/utils'
|
import {getMenu} from '@/router/router'
|
import {clearLoginInfo} from '../../../packages/utils'
|
import {fnAddDynamicMenuRoutes} from '@/router/router'
|
|
export default {
|
provide() {
|
return {
|
Collapse() {
|
if (this.$store.state.isCollapse) {
|
this.$nextTick(() => {
|
this.$store.state.isCollapse = false
|
this.$store.state.sidebarFold = false
|
})
|
} else {
|
this.$nextTick(() => {
|
this.$store.state.isCollapse = true
|
this.$store.state.sidebarFold = true
|
})
|
}
|
},
|
// 刷新
|
refresh() {
|
this.$store.state.contentIsNeedRefresh = true
|
this.$nextTick(() => {
|
this.$store.state.contentIsNeedRefresh = false
|
})
|
}
|
}
|
},
|
data() {
|
return {
|
letter: '',
|
loading: true,
|
param: '',
|
flag: false,
|
}
|
},
|
components: {
|
MainNavbar,
|
MainSidebar,
|
MainContent,
|
MainSidebarHorizontal
|
// MainThemeTools
|
},
|
watch: {
|
$route: 'routeHandle'
|
},
|
created() {
|
this.horizontalSystem()
|
},
|
async mounted() {
|
//alert(location.hostname)
|
this.kwReplacement()
|
this.goSingleSign()
|
this.windowResizeHandle()
|
this.routeHandle(this.$route)
|
let body = document.querySelector('body')
|
body.className = 'zt ' + this.$store.state.theme
|
this.pos()
|
this.horizontalSystem()
|
console.log(this.$store.state.dict.keyWord, 'this.$store.modules.dict')
|
},
|
methods: {
|
async kwReplacement() {
|
let res = await this.$http.get(`sys/dict/type/getDictMap`, {params: {dictType: "key_word"}})
|
if (res.data != null) {
|
this.$store.state.word = res.data
|
}
|
console.log(this.$store.state.word, 'this.$store.state.word')
|
},
|
goSingleSign() {
|
let username = this.$route.query.username
|
let system = this.$route.query.system
|
console.log('main token:', Cookies.get('token'))
|
console.log('main username:', username)
|
if (Cookies.get('token') && !username) {
|
this.otherProcess()
|
return
|
} else {
|
return
|
}
|
},
|
otherProcess() {
|
//alert(11)
|
// getMenu()
|
this.getMenu()
|
this.kwReplacement()
|
this.getUserInfo()
|
this.getAdminRoleInfo()
|
this.getOssConfig()
|
this.$store.dispatch('getDictList')
|
},
|
getMenu() {
|
this.$http.get('/sys/menu/nav').then(res => {
|
if (res.code !== 0) {
|
return
|
}
|
let menuList = res.data
|
if (menuList && menuList.length > 0) {
|
//window.SITE_CONFIG['menuList'] = menuList
|
fnAddDynamicMenuRoutes(menuList, [])
|
}
|
window.SITE_CONFIG['menuList'] = menuList
|
console.log(window.SITE_CONFIG['menuList'], 'window.SITE_CONFIG[\'menuList\']')
|
// let that = this
|
setTimeout(() => {
|
this.flag = Date.now() //getUUID()
|
console.log(this.flag,'set flag this.flag')
|
}, 50)
|
})
|
},
|
horizontalSystem() {
|
if (this.$store.state.menuPos === 'top') {
|
this.$store.state.horizontalSystem = true
|
} else {
|
this.$store.state.horizontalSystem = false
|
}
|
},
|
|
pos() {
|
if (this.$store.state.menuPos === 'top') {
|
// console.log(this.$store.state.menuPos,'this.$store.state.menuPos')
|
this.$store.state.auiWrapperWidth = true
|
this.$store.state.auiWrapperWidthPos = true
|
}
|
if (this.$route.name == 'sys-sysPage-digitalData-home'
|
|| this.$route.name == 'sys-sysPage-replace-home'
|
|| this.$route.name == 'sys-sysPage-equipment-home'
|
|| this.$route.name == 'sys-sysPage-technology-home') {
|
this.$store.state.auiWrapperWidth = true
|
this.$store.state.auiWrapperWidthPos = false
|
}
|
},
|
checkFull() {
|
var isFull = document.mozFullScreen ||
|
document.fullScreen ||
|
//谷歌浏览器及Webkit内核浏览器
|
document.webkitIsFullScreen ||
|
document.webkitRequestFullScreen ||
|
document.mozRequestFullScreen ||
|
document.msFullscreenEnabled
|
if (isFull === undefined) {
|
isFull = false
|
}
|
return isFull
|
},
|
windowResize(str) {
|
this.param = str
|
this.$store.state.param = str
|
if (this.param == 'large') {
|
if (this.$store.state.menuPos === 'left') {
|
//全屏
|
this.$store.state.auiWrapperWidthPos = false
|
this.$store.state.showTop = false
|
this.$store.state.highShowBackground = true
|
this.$store.state.auiWrapperHeight = true
|
this.$store.state.sidebarFold = true
|
this.$store.state.isCollapse = true
|
//顶部上内边距高度
|
this.$store.state.auiWrapperTop = true
|
} else {
|
this.$store.state.auiWrapperWidthPos = false
|
this.$store.state.showTop = false
|
this.$store.state.highShowBackground = true
|
this.$store.state.auiWrapperHeight = true
|
this.$store.state.sidebarFold = true
|
this.$store.state.isCollapse = true
|
//顶部上内边距高度
|
this.$store.state.auiWrapperTop = true
|
}
|
|
}
|
// console.log(typeof(this.param), this.param, 'this.param this.param')
|
},
|
// 窗口改变大小
|
windowResizeHandle() {
|
// console.log(this.param, '窗口参数this.param')
|
window.addEventListener('resize', debounce(() => {
|
let that = this
|
if (this.param === 'large') {
|
if (this.$store.state.menuPos === 'left') {
|
if (!that.checkFull()) {
|
//初始样式
|
this.$store.state.showTop = true
|
this.$store.state.auiWrapperWidthPos = false
|
this.$store.state.highShowBackground = false
|
this.$store.state.auiWrapperHeight = false
|
this.$store.state.sidebarFold = false
|
this.$store.state.isCollapse = false
|
//顶部上内边距高度
|
this.$store.state.auiWrapperTop = false
|
}
|
// else {
|
// //全屏
|
// this.$store.state.auiWrapperWidthPos = false
|
// this.$store.state.showTop = false
|
// this.$store.state.highShowBackground = true
|
// this.$store.state.auiWrapperHeight = true
|
// this.$store.state.sidebarFold = true
|
// //顶部上内边距高度
|
// this.$store.state.auiWrapperTop = true
|
// }
|
} else {
|
if (!that.checkFull()) {
|
//初始样式
|
this.$store.state.showTop = true
|
this.$store.state.auiWrapperWidthPos = true
|
this.$store.state.highShowBackground = false
|
this.$store.state.auiWrapperHeight = false
|
this.$store.state.sidebarFold = false
|
this.$store.state.isCollapse = false
|
//顶部上内边距高度
|
this.$store.state.auiWrapperTop = false
|
}
|
// else {
|
// //全屏
|
// this.$store.state.auiWrapperWidthPos = false
|
// this.$store.state.showTop = false
|
// this.$store.state.highShowBackground = true
|
// this.$store.state.auiWrapperHeight = true
|
// this.$store.state.sidebarFold = true
|
// //顶部上内边距高度
|
// this.$store.state.auiWrapperTop = true
|
// }
|
}
|
}
|
}, 150))
|
},
|
// 路由, 监听
|
routeHandle(route) {
|
if (!route.meta.isTab) {
|
return false
|
}
|
// console.log(route, 'routeHandle route')
|
// console.log(route.name, 'routeHandle route.name')
|
// console.log(route.meta.menuId, 'routeHandle route.meta.menuId')
|
var tab = this.$store.state.contentTabs.filter(item => item.name === route.name)[0]
|
console.log(tab, 'routeHandle tab')
|
//var tab = this.$store.state.contentTabs.filter(item => item.menuId === route.meta.menuId)[0]
|
if (!tab) {
|
tab = {
|
...window.SITE_CONFIG['contentTabDefault'],
|
...route.meta,
|
'name': route.name,
|
//'menuId':route.meta.menuId,
|
//'remark': (route.meta || {}).remark || route.title,
|
'params': {...route.params},
|
'query': {...route.query}
|
}
|
this.$store.state.contentTabs = this.$store.state.contentTabs.concat(tab)
|
}
|
console.log(this.$store.state.contentTabs, 'this.$store.state.contentTabs2')
|
this.$store.state.sidebarMenuActiveName = tab.menuId
|
|
if (tab.name === 'single') {
|
this.$store.state.contentTabsActiveName = 'home'
|
} else {
|
this.$store.state.contentTabsActiveName = tab.name
|
}
|
|
this.pos()
|
},
|
// 获取当前用户信息
|
getUserInfo() {
|
return this.$http.get('/user/info').then(res => {
|
if (res.code !== 0) {
|
return this.$message.error(res.msg)
|
}
|
this.$store.state.user.id = res.data.id
|
this.$store.state.user.deptId = res.data.deptId
|
this.$store.state.user.name = res.data.realName
|
this.$store.state.user.tenantId = res.data.tenantId
|
this.$store.state.user.isPlatform = res.data.isPlatform
|
this.$store.state.user.isSuperAdmin = res.data.isSuperAdmin
|
this.$store.state.user.system = res.data.systemMarker
|
window.SITE_CONFIG['permissions'] = res.data.permissions // 权限
|
}).catch(() => {
|
})
|
},
|
getAdminRoleInfo() {
|
// console.log('enter', 'adminRole')
|
this.$http.get('/user/adminRole').then(res => {
|
// console.log(res,'getAdminRoleInfo');
|
this.$store.state.user.isAdmin = res.data.isAdmin
|
this.$store.state.user.isAssistant = res.data.isAssistant
|
this.$store.state.user.roles = res.data.roles
|
this.$store.state.debug = res.data.debug
|
this.$store.state.test = res.data.test
|
this.$store.state.menuPos = res.data.menuPos
|
window.SITE_CONFIG['isAdmin'] = res.data.isAdmin // 权限
|
this.loading = false
|
}).catch(() => {
|
console.log('/user/adminRole', 'adminRole')
|
})
|
|
},
|
// 获取附件配置
|
getOssConfig() {
|
return this.$http.get('/sys/oss/config').then(res => {
|
if (res.code !== 0) {
|
return this.$message.error(res.msg)
|
}
|
this.$store.registerModule('oss', {
|
state: {
|
configs: res.data
|
},
|
getters: {},
|
mutations: {},
|
actions: {}
|
})
|
}).catch(() => {
|
})
|
}
|
}
|
}
|
</script>
|
<style>
|
.aui-sidebar--fold .aui-content__wrapper {
|
margin-left: 64px !important;
|
}
|
|
.aui-sidebar--fold .aui-navbar__header, .aui-sidebar--fold .aui-navbar__brand {
|
width: 300px;
|
}
|
|
.zt .aui-content__wrapper.aui-wrapper-height {
|
min-height: calc(100vh - 0px);
|
}
|
|
.aui-wrapper.top-height {
|
padding-top: 0;
|
}
|
|
.aui-wrapper-width .aui-content__wrapper {
|
margin-left: 0 !important;
|
}
|
|
.aui-wrapper-width-pos .aui-content__wrapper {
|
margin-top: 120px;
|
}
|
|
.iframe-top {
|
display: none !important;
|
}
|
|
.horizontal-hide .aui-content__wrapper {
|
margin-top: 0 !important;
|
}
|
</style>
|
