<template>
	<div class="apply_auth" v-if="perssionList.length">
		<div style="font-size:16px;color:#666;margin-bottom:15px">申请时间：{{approvalTime|formatTime}}</div>
		<h3 class="auth_title">申请品种：</h3>
		<ul>
			<li class="auth_item" v-for="auth in perssionList" :key="auth.ClassifyName">
				<span class="class_title" v-if="auth.CheckList.length">{{auth.ClassifyName}}:</span>
				<template v-for="sub_auth in auth.Items">
					<el-tag 
						size="mini"
						class="sub_auth_tag"
						:key="sub_auth.ChartPermissionId"
						v-if="auth.CheckList.includes(sub_auth.ChartPermissionId)">
						{{sub_auth.PermissionName}}
					</el-tag>
				</template>
			</li>
		</ul>
	</div>
</template>

<script>
export default {
	props: {
		perssionList: {
			type: Array
		},
		approvalTime:{
			type:String,
		}
	},
	data () {
		return {

		};
	},
	methods: {},
	created() {},
	mounted() {},
}
</script>
<style lang='scss' scoped>
.apply_auth {
	border-top: 1px dashed #DCDCDC;
	padding: 20px 0;
	font-size: 14px;
	.auth_title {
		margin-bottom: 20px;
	}
	.auth_item {
		margin-bottom: 15px;
		.class_title {
			color: #409EFF;
			margin-right: 10px;
		}
		.sub_auth_tag {
			margin: 0 8px 5px;
		}
	}
}
</style>