| | |
| | | <template> |
| | | <div v-if="value"> |
| | | <el-row justify="start"> |
| | | <el-text>{{ name }}</el-text> |
| | | <el-text>{{ value.name }}</el-text> |
| | | </el-row> |
| | | <div> |
| | | <el-text>总量</el-text> |
| | | <el-text size="default">{{ completetask + '/' + totaltask }}</el-text> |
| | | <el-text v-if="value._totaltask > 0" size="default">{{ |
| | | value._completetask + '/' + value._totaltask |
| | | }}</el-text> |
| | | <el-text v-else size="default">{{ value.completetask + '/' + value.totaltask }}</el-text> |
| | | <el-progress |
| | | style="width: 300px" |
| | | type="line" |
| | | status="warning" |
| | | :text-inside="true" |
| | | :stroke-width="18" |
| | | :striped="percentFormat(completetask, totaltask) < 100" |
| | | :striped="percentFormat(value.completetask, value.totaltask) < 100" |
| | | striped-flow |
| | | :percentage="percentFormat(completetask, totaltask)" |
| | | :percentage="percentFormat(value.completetask, value.totaltask)" |
| | | > |
| | | <template #default="{ percentage }"> |
| | | <span class="percentage-value">{{ percentage }}%</span> |
| | |
| | | <el-row class="m-t-8"> |
| | | <div |
| | | align="center" |
| | | :style="'width: ' + 300 / count.length + 'px'" |
| | | v-for="item in count" |
| | | :style="'width: ' + 300 / value.count.length + 'px'" |
| | | v-for="item in value.count" |
| | | :key="item.sceneType" |
| | | > |
| | | <el-progress |
| | |
| | | <!-- <span class="percentage-label-small">{{ item.finish + '/' + item.total }} </span> --> |
| | | </div> |
| | | </el-row> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | |
| | | */ |
| | | export default { |
| | | props: { |
| | | name: String, |
| | | province: String, |
| | | district: String, |
| | | planTime: String, |
| | | startTime: String, |
| | | endTime: String, |
| | | userName: String, |
| | | status: String, |
| | | totaltask: Number, |
| | | completetask: Number, |
| | | // name: String, |
| | | // province: String, |
| | | // district: String, |
| | | // planTime: String, |
| | | // startTime: String, |
| | | // endTime: String, |
| | | // userName: String, |
| | | // status: String, |
| | | // totaltask: Number, |
| | | // completetask: Number, |
| | | // count: Array, |
| | | |
| | | count: Array |
| | | value: Object |
| | | }, |
| | | data() { |
| | | return {} |
| | |
| | | <el-col :span="24"> |
| | | <el-row justify="space-between" class="p-h-16"> |
| | | <el-statistic title="场景数" :value="sceneNum" /> |
| | | <el-statistic title="问题数" :value="proNum" /> |
| | | <!-- <el-statistic title="单场景问题均值" :value="proEachSceneNum" /> --> |
| | | <el-statistic title="整改数" :value="changeNum" /> |
| | | <el-statistic title="整改通过数" :value="changePassNum" /> |
| | | <el-statistic title="问题整改率" :value="changePer" /> |
| | | <el-statistic title="整改通过率" :value="changePassPer" /> |
| | | <el-statistic title="问题/整改" :value="proNum + '/' + changePassNum" /> |
| | | <el-statistic title="单场景问题均值" :value="proEachSceneNum" /> |
| | | <!-- <el-statistic title="整改数" :value="changeNum" /> --> |
| | | <!-- <el-statistic title="整改通过数" :value="changePassNum" /> --> |
| | | <!-- <el-statistic title="整改提交率" :value="changePer" /> --> |
| | | <el-statistic title="整改率/(提交率)" :value="changePassPer + '/' + changePer" /> |
| | | </el-row> |
| | | <!-- <el-row justify="space-between" class="p-h-16"> |
| | | <el-statistic title="整改通过数" :value="changePassNum" /> |
| | |
| | | if (this.proNum > 0) { |
| | | return Math.round((this.changeNum / this.proNum) * 100) + '%' |
| | | } else { |
| | | return '/' |
| | | return '-' |
| | | } |
| | | }, |
| | | changePassPer() { |
| | | if (this.proNum > 0) { |
| | | return Math.round((this.changePassNum / this.proNum) * 100) + '%' |
| | | } else { |
| | | return '/' |
| | | return '-' |
| | | } |
| | | } |
| | | }, |
| | |
| | | <el-statistic title="本周完成" :value="10"> </el-statistic> |
| | | </el-row> --> |
| | | <!-- <el-row> --> |
| | | <TaskItem v-for="item in tasks" :key="item.guid" v-bind="item"></TaskItem> |
| | | <TaskItem v-for="item in tasks" :key="item.guid" :value="item"></TaskItem> |
| | | <TaskSummary></TaskSummary> |
| | | <!-- </el-row> --> |
| | | |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | /** |
| | | * 1. 按照场景类型进行统计展示 |
| | | */ |
| | | import { inject, ref, onMounted, computed } from 'vue' |
| | | import { unCalc } from '@/utils/css-util' |
| | | |
| | |
| | | |
| | | tInfoList.forEach((tInfo) => { |
| | | const _sceneTaskMap = new Map() |
| | | // 有巡查进度的场景类型的总完成量(针对某些场景类型不做巡查但依旧在计划中的情况) |
| | | let _totaltask = 0, |
| | | _completetask = 0 |
| | | |
| | | // 将各场景类型的巡查量 |
| | | for (const key in tInfo.totaltaskByScene) { |
| | | const e = tInfo.totaltaskByScene[key] |
| | | _sceneTaskMap.set(key, { |
| | | const v = { |
| | | sceneType: key, |
| | | total: e, |
| | | finish: tInfo.completetaskByScene[key] ? tInfo.completetaskByScene[key] : 0 |
| | | }) |
| | | } |
| | | // const total = tInfo.totaltask |
| | | // tInfo.subTaskSummary.forEach((s) => { |
| | | // if (!_sceneTaskMap.has(s.scene.type)) { |
| | | // _sceneTaskMap.set(s.scene.type, { |
| | | // sceneType: s.scene.type, |
| | | // total: total, |
| | | // finish: 0 |
| | | // }) |
| | | // } |
| | | // const st = _sceneTaskMap.get(s.scene.type) |
| | | // st.finish++ |
| | | // }) |
| | | _sceneTaskMap.set(key, v) |
| | | if (v.finish > 0) { |
| | | _totaltask += v.total |
| | | _completetask += v.finish |
| | | } |
| | | } |
| | | |
| | | const task = { |
| | | name: tInfo.name, |
| | |
| | | district: tInfo.districtName, |
| | | totaltask: tInfo.totaltask, |
| | | completetask: tInfo.completetask, |
| | | _totaltask, |
| | | _completetask, |
| | | count: [] |
| | | } |
| | | |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | /** |
| | | * 1. 区域分类统计更加灵活 |
| | | */ |
| | | import * as echarts from 'echarts' |
| | | import { ref, onMounted } from 'vue' |
| | | import dayjs from 'dayjs' |
| | |
| | | |
| | | function fetchSubtaskThisWeek() { |
| | | const area = getParams('week') |
| | | // 修改时段为周一到周日 |
| | | area.starttime = dayjs(area.starttime).add(1, 'day').format('YYYY-MM-DD HH:mm:ss') |
| | | area.endtime = dayjs(area.endtime).add(1, 'day').format('YYYY-MM-DD HH:mm:ss') |
| | | taskApi.fetchSubtaskSummaryByArea(area).then((res) => { |
| | | subtaskWeek.value = res.data |
| | | const series = refreshChartData(res.data) |
| | |
| | | |
| | | function fetchSubtaskLastWeek() { |
| | | const area = getParams('week') |
| | | area.starttime = dayjs(area.starttime).add(-7, 'day').format('YYYY-MM-DD HH:mm:ss') |
| | | area.endtime = dayjs(area.endtime).add(-7, 'day').format('YYYY-MM-DD HH:mm:ss') |
| | | // 修改时段为周一到周日 |
| | | area.starttime = dayjs(area.starttime).add(-6, 'day').format('YYYY-MM-DD HH:mm:ss') |
| | | area.endtime = dayjs(area.endtime).add(-6, 'day').format('YYYY-MM-DD HH:mm:ss') |
| | | taskApi.fetchSubtaskSummaryByArea(area).then((res) => { |
| | | subtaskLastWeek.value = res.data |
| | | const series = refreshChartData(res.data) |
| | |
| | | |
| | | .bar-chart { |
| | | width: 400px; |
| | | height: 600px; |
| | | height: 400px; |
| | | } |
| | | </style> |