96 lines
2.6 KiB
Vue
96 lines
2.6 KiB
Vue
|
<template>
|
||
|
|
<div class="project-checked main-page">
|
||
|
|
<el-col :span="6" class="h100">
|
||
|
|
<module-one-1-1 label="举牌验收数量统计" class="chart1-module">
|
||
|
|
<doughnut-chart :data="doughnutData" title="验收统计"/>
|
||
|
|
</module-one-1-1>
|
||
|
|
<module-one-2-1 label="本周验收列表">
|
||
|
|
|
||
|
|
</module-one-2-1>
|
||
|
|
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="18" class="h100">
|
||
|
|
|
||
|
|
<module-one-2-3 label="举牌验收列表" class="h66">
|
||
|
|
|
||
|
|
</module-one-2-3>
|
||
|
|
<module-one-1-3 label="举牌验收技术员统计" class="h33">
|
||
|
|
|
||
|
|
</module-one-1-3>
|
||
|
|
</el-col>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import DoughnutChart from '@/components/doughnutChart.vue'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
DoughnutChart
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dpi: "",
|
||
|
|
chartKey: 0,
|
||
|
|
selProject: null,
|
||
|
|
// 圆环图数据 - 参考进度管理中计划状态的数据格式
|
||
|
|
doughnutData: [
|
||
|
|
{ name: '未开始', value: 15 },
|
||
|
|
{ name: '进行中（正常）', value: 45 },
|
||
|
|
{ name: '进行中（滞后）', value: 25 },
|
||
|
|
{ name: '已完成（正常）', value: 10 },
|
||
|
|
{ name: '已完成（滞后）', value: 5 }
|
||
|
|
]
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.$store.dispatch("ChangeNav", 403);
|
||
|
|
this.$bus.$on(
|
||
|
|
"projectChange",
|
||
|
|
debounce((prj) => {
|
||
|
|
this.selProject = prj;
|
||
|
|
this.init();
|
||
|
|
})
|
||
|
|
);
|
||
|
|
this.selProject = this.$store.getters.selProject;
|
||
|
|
this.init();
|
||
|
|
this.dpi = this.$dpi();
|
||
|
|
window.addEventListener("resize", () => {
|
||
|
|
if (this.dpi != this.$dpi()) {
|
||
|
|
this.dpi = this.$dpi();
|
||
|
|
this.resize();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
this.resize();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
init() {
|
||
|
|
this.chartKey++;
|
||
|
|
// 这里可以调用API获取真实数据
|
||
|
|
this.loadDoughnutData();
|
||
|
|
},
|
||
|
|
resize() {
|
||
|
|
this.$refs.chart && this.$refs.chart.resize();
|
||
|
|
},
|
||
|
|
loadDoughnutData() {
|
||
|
|
// 模拟从API获取数据
|
||
|
|
// this.$api.project.getCheckStats().then(res => {
|
||
|
|
// this.doughnutData = res.data;
|
||
|
|
// })
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less">
|
||
|
|
.project-checked {
|
||
|
|
.screen-module{
|
||
|
|
&.h66{
|
||
|
|
height: calc(66% - 20px) !important;
|
||
|
|
}
|
||
|
|
&.h33{
|
||
|
|
height: calc(33% - 20px) !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|