<template>
	<div class="Menus">
		<!-- <div class="menu-logo1">
			<img src="@/assets/img/logo2-1.png" alt="logo">
		</div> -->
		<el-menu :default-active="$route.path" router background-color="#3a394e" text-color="#7a7f8f" :collapse="true">
			<div v-for="(item,index) in $router.options.routes[1].children" :key="index">
				<el-menu-item :index="item.path" v-if="item.meta.authority==$store.state.userInfo.value || item.meta.authority===0">
					<span class="iconfont" :class="'icon-'+item.icons" style="font-size:32px;"></span>
					<span slot="title">{{item.meta.title}}</span>
				</el-menu-item>
			</div>
		</el-menu>
	</div>
</template>

<script>
</script>

<style lang="scss" scoped>
	.Menus{
		user-select: none;
		// .menu-logo1 {
		// 	width: 80px;
		// 	height: 80px;
		// 	display: flex;
		// 	justify-content: center;
		// 	align-items: center;
		// 	img {
		// 		width: 75%;
		// 		height: 75%;
		// 		object-fit: contain;
		// 	}
		// }
		.el-menu-item.is-active {
		    color: #fff;
			background: #409EFF !important;
		}
		.el-menu-item[data-v-512d1d49], .el-submenu__title[data-v-512d1d49] {
		    height: 80px;
		    line-height: 80px;
		    list-style: none;
		}
		.el-menu--collapse {
		    width: 80px;
		}
		.el-menu {
		    border-right: solid 0 #e6e6e6;
		    list-style: none;
		    position: relative;
		    margin: 0;
		    padding-left: 0;
		    background-color: #FFF;
		}
		.el-menu-item, .el-submenu__title {
		    height: 80px;
		    line-height: 56px;
		    list-style: none;
		}
	}
</style>