<template>
	<div v-if="pageLoading">
		<el-main>
			<el-card shadow="never">
				<el-skeleton :rows="1"></el-skeleton>
			</el-card>
			<el-card shadow="never" style="margin-top: 15px;">
				<el-skeleton></el-skeleton>
			</el-card>
		</el-main>
	</div>
	<console v-if="dashboard=='1'" @on-mounted="onMounted"></console>
	<work v-else-if="dashboard=='2'" @on-mounted="onMounted"></work>
	<widgets v-else @on-mounted="onMounted"></widgets>

</template>

<script>
	import { defineAsyncComponent } from 'vue';
	const work = defineAsyncComponent(() => import('./work'));
	const widgets = defineAsyncComponent(() => import('./widgets'));
	const console = defineAsyncComponent(() => import('./console'));

	export default {
		name: "dashboard",
		components: {
			work,
			widgets,
			console
		},
		data(){
			return {
				pageLoading: true,
				dashboard: '1'
			}
		},
		created(){
			// this.dashboard = this.$TOOL.data.get("USER_INFO").dashboard || '0';
		},
		mounted(){

		},
		methods: {
			onMounted(){
				this.pageLoading = false
			}
		}
	}
</script>

<style scoped lang="scss">

</style>
