<template>
|
<el-space>
|
<el-descriptions :column="3" size="small" border direction="vertical">
|
<el-descriptions-item
|
label="问题数"
|
label-class-name="problem-label"
|
class-name="secondary-content"
|
>{{ summary.proCount }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="整改数"
|
label-class-name="problem-label"
|
class-name="secondary-content"
|
>{{ summary.changeCount }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="整改率"
|
label-class-name="problem-label"
|
:class-name="summary.changePer < 1 ? 'danger-content' : 'secondary-content'"
|
>{{ formatPercent(summary.changePer) }}</el-descriptions-item
|
>
|
</el-descriptions>
|
<el-descriptions :column="8" size="small" border direction="vertical">
|
<el-descriptions-item
|
label="巡查点次"
|
label-class-name="pro-check-label"
|
class-name="secondary-content"
|
>{{ summary.total }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="问题未审核"
|
label-class-name="pro-check-label"
|
:class-name="summary.proUnCheck > 0 ? 'danger-content' : 'secondary-content'"
|
>{{ summary.proUnCheck }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="部分审核"
|
label-class-name="pro-check-label"
|
:class-name="summary.proPartCheck > 0 ? 'danger-content' : 'secondary-content'"
|
>{{ summary.proPartCheck }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="全部审核"
|
label-class-name="pro-check-label"
|
class-name="secondary-content"
|
>{{ summary.proAllCheck }}</el-descriptions-item
|
>
|
</el-descriptions>
|
<el-descriptions :column="8" size="small" border direction="vertical">
|
<el-descriptions-item
|
label="未整改"
|
label-class-name="change-check-label"
|
:class-name="summary.UnChange > 0 ? 'danger-content' : 'secondary-content'"
|
>{{ summary.UnChange }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="整改未审核"
|
label-class-name="change-check-label"
|
:class-name="summary.changeUnCheck > 0 ? 'danger-content' : 'secondary-content'"
|
>{{ summary.changeUnCheck }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="部分审核"
|
label-class-name="change-check-label"
|
:class-name="summary.changePartCheck > 0 ? 'danger-content' : 'secondary-content'"
|
>{{ summary.changePartCheck }}</el-descriptions-item
|
>
|
<el-descriptions-item
|
label="全部审核"
|
label-class-name="change-check-label"
|
class-name="secondary-content"
|
>{{ summary.changeAllCheck }}</el-descriptions-item
|
>
|
</el-descriptions>
|
</el-space>
|
<!-- <el-space>
|
<el-tag v-for="(s, i) in summary" :key="i" :type="s.type" size="small">
|
<el-icon v-if="s.icon" color="">
|
<component :is="s.icon"></component>
|
</el-icon>
|
{{ s.name + ': ' + s.value }}
|
</el-tag>
|
</el-space> -->
|
</template>
|
<script>
|
export default {
|
props: {
|
subtasks: Array
|
},
|
computed: {
|
//任务问题审核情况统计信息
|
summary() {
|
const _summary = {
|
total: 0,
|
proUnCheck: 0,
|
proPartCheck: 0,
|
proAllCheck: 0,
|
UnChange: 0,
|
changeUnCheck: 0,
|
changePartCheck: 0,
|
changeAllCheck: 0,
|
proCount: 0,
|
changeCount: 0,
|
changePer: 0
|
};
|
this.subtasks.forEach((s) => {
|
_summary.total++;
|
_summary.proCount += s.data.proNum;
|
_summary.changeCount += s.data.changeNum;
|
|
// 问题审核情况
|
if (s.data.proNum == 0) {
|
_summary.proAllCheck++;
|
} else if (s.data.proCheckedNum == 0) {
|
_summary.proUnCheck++;
|
} else if (s.data.proCheckedNum < s.data.proNum) {
|
_summary.proPartCheck++;
|
} else {
|
_summary.proAllCheck++;
|
}
|
|
// 是否有未整改
|
if (s.data.changeNum < s.data.proNum) {
|
_summary.UnChange++;
|
}
|
|
// 整改审核情况
|
if (s.data.proNum == 0) {
|
_summary.changeAllCheck++;
|
} else if (s.data.changeNum > 0) {
|
if (s.data.changeCheckedNum == 0) {
|
_summary.changeUnCheck++;
|
} else if (s.data.changeCheckedNum < s.data.changeNum) {
|
_summary.changePartCheck++;
|
} else {
|
_summary.changeAllCheck++;
|
}
|
}
|
});
|
|
if (_summary.proCount != 0) {
|
_summary.changePer = _summary.changeCount / _summary.proCount;
|
}
|
return _summary;
|
}
|
},
|
methods: {
|
formatPercent(value) {
|
return Math.round(value * 1000) / 10 + '%';
|
}
|
}
|
};
|
</script>
|
<style scoped>
|
:deep(.el-descriptions__cell) {
|
padding: 0px 4px !important;
|
/* font-size: 13px !important; */
|
}
|
|
:deep(.problem-label) {
|
background: var(--el-color-primary-light-7) !important;
|
}
|
:deep(.problem-content) {
|
/* background: var(--el-color-danger-light-9); */
|
}
|
|
:deep(.pro-check-label) {
|
background: var(--el-color-success-light-7) !important;
|
}
|
:deep(.pro-check-content) {
|
}
|
|
:deep(.change-check-label) {
|
background: var(--el-color-warning-light-7) !important;
|
}
|
:deep(.change-check-content) {
|
}
|
|
:deep(.danger-content) {
|
color: var(--el-color-danger) !important;
|
font-weight: 600 !important;
|
font-size: 17px !important;
|
}
|
|
:deep(.secondary-content) {
|
color: var(--el-text-color-regular) !important;
|
font-size: 12px !important;
|
}
|
</style>
|
