<template>
|
<sidenav :orientation="orientation" :class="curClasses">
|
|
<!-- Brand demo (see src/demo.css) -->
|
<div class="app-brand demo" v-if="orientation !== 'horizontal'">
|
<span class="app-brand-logo demo bg-primary">
|
<svg viewBox="0 0 148 80" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><linearGradient id="a" x1="46.49" x2="62.46" y1="53.39" y2="48.2" gradientUnits="userSpaceOnUse"><stop stop-opacity=".25" offset="0"></stop><stop stop-opacity=".1" offset=".3"></stop><stop stop-opacity="0" offset=".9"></stop></linearGradient><linearGradient id="e" x1="76.9" x2="92.64" y1="26.38" y2="31.49" xlink:href="#a"></linearGradient><linearGradient id="d" x1="107.12" x2="122.74" y1="53.41" y2="48.33" xlink:href="#a"></linearGradient></defs><path style="fill: #fff;" transform="translate(-.1)" d="M121.36,0,104.42,45.08,88.71,3.28A5.09,5.09,0,0,0,83.93,0H64.27A5.09,5.09,0,0,0,59.5,3.28L43.79,45.08,26.85,0H.1L29.43,76.74A5.09,5.09,0,0,0,34.19,80H53.39a5.09,5.09,0,0,0,4.77-3.26L74.1,35l16,41.74A5.09,5.09,0,0,0,94.82,80h18.95a5.09,5.09,0,0,0,4.76-3.24L148.1,0Z"></path><path transform="translate(-.1)" d="M52.19,22.73l-8.4,22.35L56.51,78.94a5,5,0,0,0,1.64-2.19l7.34-19.2Z" fill="url(#a)"></path><path transform="translate(-.1)" d="M95.73,22l-7-18.69a5,5,0,0,0-1.64-2.21L74.1,35l8.33,21.79Z" fill="url(#e)"></path><path transform="translate(-.1)" d="M112.73,23l-8.31,22.12,12.66,33.7a5,5,0,0,0,1.45-2l7.3-18.93Z" fill="url(#d)"></path></svg>
|
</span>
|
<router-link to="/" class="app-brand-text demo sidenav-text font-weight-normal ml-2">行为监控系统</router-link>
|
<!-- 左边的三个横行 -->
|
<a href="javascript:void(0)" class="layout-sidenav-toggle sidenav-link text-large ml-auto" @click="toggleSidenav()">
|
<i class="ion ion-md-menu align-middle pl10"></i>
|
</a>
|
</div>
|
<div class="sidenav-divider mt-0" v-if="orientation !== 'horizontal'"></div>
|
<div class="sidenav-inner" :class="{ 'py-1': orientation !== 'horizontal' }" >
|
<!-- <sidenav-router-link icon="fas fa-home" to="/" :exact="true">首页</sidenav-router-link> -->
|
<!-- 菜单 start menuListData -->
|
<!-- <sidenav-divider class="mb-1"/> -->
|
<sidenav-header class="small font-weight-semibold">行为监控系统</sidenav-header>
|
<sidenav-router-link
|
v-for=" menu in menuListData "
|
v-if="(!menu.child||!isChildMenu(menu.child) )&&menu.type !== 2"
|
:key="menu.id"
|
:icon="menu.icon"
|
:to="menu.url"
|
:exact="true"
|
>
|
{{menu.name}}
|
</sidenav-router-link>
|
<sidenav-menu
|
v-for=" menu in menuListData "
|
v-if="menu.child&&isChildMenu(menu.child)&&menu.type !==2"
|
:key="menu.id"
|
:icon="menu.icon"
|
:open="isMenuOpen(menu.url)"
|
>
|
<template slot="link-text">{{menu.name}}</template>
|
<sidenav-router-link
|
v-for="iteam in menu.child"
|
:key="iteam.id"
|
v-if="(!iteam.child||!isChildMenu(iteam.child)&& iteam.type !== 2 )"
|
:to="iteam.url"
|
:active="isMenuActive(iteam.url)"
|
:exact="true"
|
>
|
{{iteam.name}}
|
</sidenav-router-link>
|
<sidenav-menu
|
v-for=" iteam in menu.child "
|
v-if="iteam.child&&isChildMenu(iteam.child)&& iteam.type !== 2"
|
:key="iteam.id"
|
:icon="iteam.icon"
|
:open="isMenuOpen(iteam.url)"
|
>
|
<template slot="link-text">{{iteam.name}}</template>
|
<sidenav-router-link
|
v-for="it in iteam.child"
|
:key="it.id"
|
v-if="it.type !== 2"
|
:to="it.url"
|
:exact="true"
|
>
|
{{it.name}}
|
</sidenav-router-link>
|
</sidenav-menu>
|
</sidenav-menu>
|
<!-- 菜单 end-->
|
</div>
|
<!-- <div class="sidenav-inner" :class="{ 'py-1': orientation !== 'horizontal' }" >
|
<sidenav-router-link icon="fas fa-home" to="/" :exact="true">首页</sidenav-router-link>
|
<sidenav-divider class="mb-1"/>
|
<sidenav-header class="small font-weight-semibold">通用系统设置</sidenav-header>
|
<sidenav-router-link v-for=" menu in menuListData " v-if="(!menu.child||!isChildMenu(menu.child) )&&menu.type !== 2" :key="menu.id" :icon="menu.icon" :to="menu.url" :exact="true">{{menu.name}}</sidenav-router-link>
|
<sidenav-menu v-for=" menu in menuListData " v-if="menu.child&&isChildMenu(menu.child)&&menu.type !==2" :key="menu.id" :icon="menu.icon" :active="isMenuActive(menu.url)" :open="isMenuOpen(menu.url)">
|
<template slot="link-text">{{menu.name}}</template>
|
<sidenav-router-link v-for="iteam in menu.child" :key="iteam.id" v-if="iteam.type !== 2" :to="iteam.url" :exact="true">{{iteam.name}}</sidenav-router-link>
|
</sidenav-menu>
|
</div> -->
|
<!-- 三级菜单使用 -->
|
<!-- <div class="sidenav-inner" :class="{ 'py-1': orientation !== 'horizontal' }" >
|
<sidenav-router-link icon="fas fa-home" to="/" :exact="true">首页</sidenav-router-link>
|
<sidenav-divider class="mb-1"/>
|
<sidenav-header class="small font-weight-semibold">学区管理中心</sidenav-header>
|
<sidenav-router-link v-for=" menu in menuListData " v-if="(!menu.child||!isChildMenu(menu.child) )" :key="menu.id" :icon="menu.icon" :to="menu.url" :exact="true">{{menu.name}}</sidenav-router-link>
|
<sidenav-menu v-for=" menu in menuListData " v-if="menu.child&&isChildMenu(menu.child)" :key="menu.id" :icon="menu.icon" :active="isMenuActive(menu.url)" :open="isMenuOpen(menu.url)">
|
<template slot="link-text">{{menu.name}}</template>
|
<sidenav-router-link v-for="iteam in menu.child" :key="iteam.id" v-if="(!iteam.child||!isChildMenu(iteam.child)&& iteam.type !== 2 )" :to="iteam.url" :exact="true">{{iteam.name}}</sidenav-router-link>
|
<sidenav-menu v-for=" iteam in menu.child " v-if="iteam.child&&isChildMenu(iteam.child)" :key="iteam.id" :icon="iteam.icon" :active="isMenuActive(iteam.url)" :open="isMenuOpen(iteam.url)">
|
<template slot="link-text">{{iteam.name}}</template>
|
<sidenav-router-link v-for="it in iteam.child" :key="it.id" v-if="it.type !== 2" :to="it.url" :exact="true">{{it.name}}</sidenav-router-link>
|
</sidenav-menu>
|
</sidenav-menu>
|
</div> -->
|
</sidenav>
|
</template>
|
<script>
|
import router from '@/router'
|
import { getMenuListData } from '@/server/login.js'
|
import {
|
Sidenav,
|
SidenavLink,
|
SidenavRouterLink,
|
SidenavMenu,
|
SidenavHeader,
|
SidenavBlock,
|
SidenavDivider
|
} from '@/vendor/libs/sidenav'
|
import { findButtonAuthoritys, findInArr } from '../components/common/util.js'
|
export default {
|
name: 'app-layout-sidenav',
|
components: {
|
Sidenav,
|
SidenavLink,
|
SidenavRouterLink,
|
SidenavMenu,
|
SidenavHeader,
|
SidenavBlock,
|
SidenavDivider
|
},
|
|
props: {
|
orientation: {
|
type: String,
|
default: 'vertical'
|
}
|
},
|
data() {
|
return {
|
menuListData: []
|
}
|
},
|
computed: {
|
curClasses() {
|
let bg = this.layoutSidenavBg
|
|
if (
|
this.orientation === 'horizontal' &&
|
(bg.indexOf(' sidenav-dark') !== -1 ||
|
bg.indexOf(' sidenav-light') !== -1)
|
) {
|
bg = bg
|
.replace(' sidenav-dark', '')
|
.replace(' sidenav-light', '')
|
.replace('-darker', '')
|
.replace('-dark', '')
|
}
|
|
return (
|
`bg-${bg} ` +
|
(this.orientation !== 'horizontal'
|
? 'layout-sidenav'
|
: 'layout-sidenav-horizontal container-p-x flex-grow-0')
|
)
|
}
|
},
|
|
methods: {
|
isMenuActive(url) {
|
return this.$route.matched[1].path === url
|
// return this.$route.path.indexOf(url) === 0
|
},
|
|
isMenuOpen(url) {
|
return (
|
this.$route.path.indexOf(url) === 0 && this.orientation !== 'horizontal'
|
)
|
},
|
toggleSidenav() {
|
this.layoutHelpers.toggleCollapsed()
|
},
|
isChildMenu(arr) {
|
for (let iteam of arr) {
|
if (iteam.type === 1) {
|
return true
|
}
|
}
|
return false
|
},
|
/* 获取菜单数据 */
|
async getMenuList() {
|
let results = await getMenuListData({
|
module: this.$store.state.menuName
|
})
|
if (results && !results.error) {
|
/* 菜单数据赋值 permission权限 */
|
this.menuListData = results
|
// this.$router.replace(results && results[0].url)
|
/* 存储权限 */
|
let buttonAuthoritys = []
|
console.log(this.$route.query.is_loginsss)
|
if (results && results.length && this.$route.query.is_login) {
|
this.$router.replace(results[0].url)
|
}
|
findButtonAuthoritys(results, authority => {
|
if (findInArr(authority, buttonAuthoritys) === -1) {
|
buttonAuthoritys.push(authority)
|
}
|
})
|
sessionStorage.setItem('buttonAuthoritys', ',' + buttonAuthoritys + ',')
|
|
sessionStorage.setItem('menuInfo', JSON.stringify(results))
|
} else {
|
this.$toast({
|
type: 'error',
|
message: '菜单获取失败'
|
})
|
}
|
}
|
},
|
created() {
|
// console.log(this.$store.state.projectName, 'projectName', this.$route.query)
|
// 初始化数据
|
let token =
|
JSON.parse(sessionStorage.getItem('loginedInfo')) &&
|
JSON.parse(sessionStorage.getItem('loginedInfo')).access_token
|
if (token && token !== '') {
|
this.getMenuList()
|
} else {
|
router.push({
|
path: '/login'
|
})
|
}
|
}
|
}
|
</script>
|
