rt-sim-training-client/src/views/dashboard/index.vue
2019-08-16 14:25:20 +08:00

90 lines
1.8 KiB
Vue

<template>
<div class="dashboard-container">
<!-- <div class="item-row" style="margin-top: 20px">
<div class="item-col">
<echarts-lesson id="lesson" ref="lesson" :size="{width: size.width, height: size.height}" />
</div>
<div class="item-col">
<echarts-exam id="exam" ref="exam" :size="{width: size.width, height: size.height}" />
</div>
</div>
<div class="item-flex">
<echarts-demon id="demon" ref="demon" :size="{width: size.width * 2 + 4, height: size.height}" />
</div> -->
<echarts-permission ref="permission" class="perssmin-card" :size="{ width: size.width, height: size.height }" />
</div>
</template>
<script>
import WindowResizeHandler from '@/mixin/WindowResizeHandler';
// import EchartsExam from './echarts/exam';
// import EchartsLesson from './echarts/lesson';
// import EchartsDemon from './echarts/demonstration';
import EchartsPermission from './echarts/permission';
export default {
name: 'Dashboard',
components: {
// EchartsExam,
// EchartsLesson,
// EchartsDemon,
EchartsPermission
},
mixins: [WindowResizeHandler],
data() {
return {
size: {
width: 0,
height: 0
}
};
},
methods: {
resizeHandler() {
// this.size = {
// width: (this._clientWidth - 60) / 2,
// height: (this._clientHeight - 100) / 2
// };
this.size = {
width: (this._clientWidth - 40),
height: (this._clientHeight - 100)
};
}
}
};
</script>
<style lang="scss" scoped>
.dashboard {
&-container {
margin: 0px;
}
&-text {
font-size: 30px;
line-height: 46px;
}
}
.item-col {
display: inline-block;
}
.item-row {
left: 50%;
right: 50%;
text-align: center;
}
.item-flex {
display: flex;
justify-content: center;
}
.perssmin-card {
display: flex;
justify-content: center;
margin-top: 20px;
}
</style>