<template>
	<div :class="{'has-logo':showLogo}">
		<logo v-if="showLogo" :collapse="isCollapse" />
		<el-scrollbar wrap-class="scrollbar-wrapper">
			<el-menu :default-openeds="['/systemset','/processMgr']" :default-active="activeMenu" :collapse="isCollapse" :background-color="variables.menuBg"
				:text-color="variables.menuText" :unique-opened="false" :active-text-color="variables.menuActiveText" :collapse-transition="false"
				mode="vertical">
				<sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" />
			</el-menu>
		</el-scrollbar>
	</div>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	import Logo from './Logo'
	import SidebarItem from './SidebarItem'
	import variables from '@/styles/variables.scss'

	export default {
		components: {
			SidebarItem,
			Logo
		},
		computed: {
			...mapGetters([
				'sidebar'
			]),
			routes() {
				// 查看权限: 1 管理员 admin, 2 超级管理员 superAdmin
				// console.log(this.$store.state.user.level)
				// console.log(this.$router.options.routes);
				var p = this.$store.state.user.level;
				var returnRoutes = [];
				const r = this.$router.options.routes;
				for (var i = 0; i < r.length; i++) {
					if (p == 2) {
						if (typeof r[i].meta !== 'undefined' && typeof r[i].meta.roles !== 'undefined') {
							if (r[i].meta.roles.includes('superAdmin')) {
								returnRoutes.push(r[i]);
							}
						} else if (typeof r[i].children !== 'undefined' && typeof r[i].children[0].meta.roles !== 'undefined') {
							if (r[i].children[0].meta.roles.includes('superAdmin')) {
								returnRoutes.push(r[i]);
							}
						} else {
							returnRoutes.push(r[i]);
						}
					} else {
						if (typeof r[i].meta !== 'undefined' && typeof r[i].meta.roles !== 'undefined') {
							if (r[i].meta.roles.includes('admin')) {
								returnRoutes.push(r[i]);
							}
						} else if (typeof r[i].children !== 'undefined' && typeof r[i].children[0].meta.roles !== 'undefined') {
							if (r[i].children[0].meta.roles.includes('admin')) {
								returnRoutes.push(r[i]);
							}
						} else {
							returnRoutes.push(r[i]);
						}
					}
				}
				// console.log(returnRoutes);
				// 返回过滤的路由
				return returnRoutes;
			},
			activeMenu() {
				const route = this.$route
				const {
					meta,
					path
				} = route
				// if set path, the sidebar will highlight the path you set
				if (meta.activeMenu) {
					return meta.activeMenu
				}
				return path
			},
			showLogo() {
				return this.$store.state.settings.sidebarLogo
			},
			variables() {
				return variables
			},
			isCollapse() {
				return !this.sidebar.opened
			}
		}
	}
</script>