From 8756117a473facf0bf64c9e28f821b52e46cce85 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期一, 08 七月 2024 17:38:18 +0800
Subject: [PATCH] 完善问题整改跟踪模块
---
src/views/inspection/problem/component/ProblemSummary.vue | 31 ++
src/views/management/ManagementView.vue | 50 +++
src/views/management/TaskSummary.vue | 165 ++++++++++-
src/views/management/EvaluateSummary.vue | 39 ++
src/assets/styles/element/index.scss | 8
src/utils/resize-observer.js | 32 ++
src/views/visualization/SupervisionVisual.vue | 38 +-
src/views/management/TaskStats.vue | 3
src/components.d.ts | 4
src/views/inspection/ReInspectionView.vue | 71 +++++
/dev/null | 39 --
src/views/inspection/SelfInspection.vue | 44 ++
src/main.js | 1
src/stores/area.js | 43 +++
src/views/inspection/problem/component/ProblemTable.vue | 87 ++++++
index.html | 2
src/api/fysp/taskApi.js | 11
src/views/inspection/problem/ProblemTrack.vue | 59 ++++
src/views/management/StatisticView.vue | 52 +++
src/views/main/MonitorView.vue | 28 +
src/views/inspection/JointEnforcement.vue | 7
src/utils/css-util.js | 21 +
src/views/visualization/VisualizationView.vue | 2
23 files changed, 736 insertions(+), 101 deletions(-)
diff --git a/index.html b/index.html
index 5861907..81fd4dd 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,5 @@
<!doctype html>
-<html lang="en">
+<html lang="en" class="dark">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
diff --git a/src/api/fysp/taskApi.js b/src/api/fysp/taskApi.js
index 54ab091..b0072b5 100644
--- a/src/api/fysp/taskApi.js
+++ b/src/api/fysp/taskApi.js
@@ -34,7 +34,7 @@
/**
* 鑾峰彇瀛愪换鍔＄粺璁′俊鎭�
*/
- fetchSubtaskSummaryArea(area) {
+ fetchTaskProgress(area) {
return $fysp.post('subtask/summary/area', area).then((res) => res.data)
},
@@ -49,5 +49,14 @@
}
})
.then((res) => res.data)
+ },
+
+ /**
+ * 鑾峰彇宸℃煡浠诲姟闂缁熻淇℃伅
+ * @param {Object} area
+ * @returns
+ */
+ fetchSubtaskSummaryByArea(area) {
+ return $fysp.post('subtask/summary/area/problem', area).then((res) => res.data)
}
}
diff --git a/src/assets/styles/element/index.scss b/src/assets/styles/element/index.scss
index 063bc6d..f490cf0 100644
--- a/src/assets/styles/element/index.scss
+++ b/src/assets/styles/element/index.scss
@@ -5,3 +5,11 @@
// )
// )
// );
+
+@forward 'element-plus/theme-chalk/src/dark/var.scss' with (
+ $bg-color: (
+ 'page': #ffffffa9,
+ '': #122b54a9,
+ 'overlay': #122b54a9
+ )
+);
diff --git a/src/components.d.ts b/src/components.d.ts
index 6f28edd..c1a6a40 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -11,17 +11,21 @@
copy: typeof import('./components/search/OptionLocation copy.vue')['default']
CoreHeader: typeof import('./components/core/CoreHeader.vue')['default']
ElButton: typeof import('element-plus/es')['ElButton']
+ ElCalendar: typeof import('element-plus/es')['ElCalendar']
ElCard: typeof import('element-plus/es')['ElCard']
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCol: typeof import('element-plus/es')['ElCol']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElFormItem: typeof import('element-plus/es')['ElFormItem']
+ ElIcon: typeof import('element-plus/es')['ElIcon']
+ ElLink: typeof import('element-plus/es')['ElLink']
ElOption: typeof import('element-plus/es')['ElOption']
ElProgress: typeof import('element-plus/es')['ElProgress']
ElRow: typeof import('element-plus/es')['ElRow']
ElScorllbar: typeof import('element-plus/es')['ElScorllbar']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
+ ElSegmented: typeof import('element-plus/es')['ElSegmented']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElStatistic: typeof import('element-plus/es')['ElStatistic']
ElTable: typeof import('element-plus/es')['ElTable']
diff --git a/src/main.js b/src/main.js
index af0994d..78f6786 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,6 +1,7 @@
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+import 'element-plus/theme-chalk/src/dark/css-vars.scss'
import App from './App.vue'
import router from './router'
diff --git a/src/stores/area.js b/src/stores/area.js
new file mode 100644
index 0000000..638389f
--- /dev/null
+++ b/src/stores/area.js
@@ -0,0 +1,43 @@
+// 鍖哄煙绛涢�夌殑閫昏緫绠＄悊
+
+import { defineStore } from 'pinia'
+import dayjs from 'dayjs'
+
+export const useAreaStore = defineStore('area', {
+ state: () => {
+ return {
+ area: {
+ provincecode: undefined,
+ provincename: undefined,
+ citycode: undefined,
+ cityname: undefined,
+ districtcode: undefined,
+ districtname: undefined,
+ starttime: undefined,
+ endtime: undefined,
+ scensetypeid: undefined
+ }
+ }
+ },
+ actions: {
+ // 璁剧疆琛屾斂鍖哄垝淇℃伅
+ setLocation(location) {
+ this.area.provincecode = location.pCode
+ this.area.provincename = location.pName
+ this.area.citycode = location.cCode
+ this.area.cityname = location.cName
+ this.area.districtcode = location.dCode
+ this.area.districtname = location.dName
+ },
+ // 璁剧疆鏃堕棿涓虹粰瀹氭椂闂村搴斿綋鏃ョ殑澶村熬
+ setTimeOneDay(time) {
+ const d = time ? dayjs(time) : dayjs()
+ this.area.starttime = d.startOf('day').format('YYYY-MM-DD HH:mm:ss')
+ this.area.endtime = d.endOf('day').format('YYYY-MM-DD HH:mm:ss')
+ },
+ // 璁剧疆鍦烘櫙绫诲瀷
+ setSceneType(t) {
+ this.area.scensetypeid = t
+ }
+ }
+})
diff --git a/src/utils/css-util.js b/src/utils/css-util.js
new file mode 100644
index 0000000..bf826b1
--- /dev/null
+++ b/src/utils/css-util.js
@@ -0,0 +1,21 @@
+/**
+ * 鎻愬彇css涓甫鏈塩alc鍑芥暟鐨勮〃杈惧紡鐨勫弬鏁伴儴鍒�
+ * @param {String} str css涓甫鏈塩alc鍑芥暟鐨勮〃杈惧紡
+ */
+function unCalc(str) {
+ if (str.startsWith('calc(')) {
+ let _str = str.replace('calc(', '')
+ _str = _str.replace(/\)/g, (match, offset, string) => {
+ if (offset === string.lastIndexOf(match)) {
+ return ''
+ } else {
+ return match
+ }
+ })
+ return _str
+ } else {
+ return str
+ }
+}
+
+export { unCalc }
diff --git a/src/utils/resize-observer.js b/src/utils/resize-observer.js
new file mode 100644
index 0000000..617c6d3
--- /dev/null
+++ b/src/utils/resize-observer.js
@@ -0,0 +1,32 @@
+//瀵逛簬瀵硅薄鐨勫紩鐢ㄦ槸寮卞紩鐢紝杩欐剰鍛崇潃鍦ㄦ病鏈夊叾浠栧紩鐢ㄥ瓨鍦ㄦ椂鍨冨溇鍥炴敹鑳芥纭繘琛屻�傚湪鍙栨秷寮曠敤鏃讹紝涓嶉渶瑕佹墜鍔ㄥ垹闄ゅ厓绱狅紝鍥犱负瀹冧滑浼氳嚜鍔ㄨ鍨冨溇鍥炴敹銆�
+const map = new WeakMap()
+
+// ResizeObserver鏄竴涓瀯閫犲嚱鏁帮紝鐢ㄤ簬鐩戝惉鍏冪礌鐨勫彉鍖栵紝褰撳厓绱犵殑灏哄鍙戠敓鍙樺寲鏃讹紝浼氳Е鍙戝洖璋冨嚱鏁般��
+const divs = new ResizeObserver((entries) => {
+ // entries鏄竴涓暟缁勶紝鍖呭惈鎵�鏈夎瑙傚療鐨勫厓绱犵殑淇℃伅
+ for (const entry of entries) {
+ // 灏嗗厓绱犲拰鍥炶皟鍑芥暟鍙栧嚭
+ const handler = map.get(entry.target)
+ // 濡傛灉鍥炶皟鍑芥暟瀛樺湪锛屽垯璋冪敤鍥炶皟鍑芥暟
+ if (handler) {
+ handler({
+ width: Math.ceil(entry.borderBoxSize[0].inlineSize), //鍏冪礌鐨勫搴�
+ height: Math.ceil(entry.borderBoxSize[0].blockSize) //鍏冪礌鐨勯珮搴�
+ })
+ }
+ }
+})
+
+//鑾峰彇浣跨敤鎸囦护鐨刣iv鐨勫楂�.e.width鍜宔.height
+export const vResize = {
+ mounted(el, binding) {
+ // 灏嗗厓绱犲拰鍥炶皟鍑芥暟瀛樺叆map涓�
+ map.set(el, binding)
+ // 寮�濮嬭瀵熷厓绱�
+ divs.observe(el)
+ },
+ unmounted(el) {
+ // 鍋滄瑙傚療鍏冪礌
+ divs.unobserve(el)
+ }
+}
diff --git a/src/views/inspection/JointEnforcement.vue b/src/views/inspection/JointEnforcement.vue
index 3e39db6..b0456e1 100644
--- a/src/views/inspection/JointEnforcement.vue
+++ b/src/views/inspection/JointEnforcement.vue
@@ -1,6 +1,9 @@
<template>
- <div class="border-r-small" style="height: 200px">
+ <div class="border-r-small">
<div class="font-large">鑱斿悎鎵ф硶</div>
+ <el-scrollbar height="300px">
+ <el-calendar v-model="value" />
+ </el-scrollbar>
</div>
</template>
@@ -8,7 +11,7 @@
export default {
data() {
return {
- tasks: []
+ value: new Date()
}
},
watch: {},
diff --git a/src/views/inspection/ProblemTrack.vue b/src/views/inspection/ProblemTrack.vue
deleted file mode 100644
index d0c1de1..0000000
--- a/src/views/inspection/ProblemTrack.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-<template>
- <el-card shadow="hover">
- <div class="font-large">宸℃煡闂璺熻釜</div>
- </el-card>
-</template>
-
-<script>
-export default {
- data() {
- return {
- subtaskList: []
- }
- },
- watch: {},
- methods: {},
- mounted() {
- let i = 0
- while (i < 3) {
- this.subtaskList.push({
- guid: 'SMuheEkjswioSn7A',
- name: '涓鐢熸�佹暟瀛楁腐椤圭洰宸℃煡',
- district: '閲戝北鍖�',
- planTime: '2024-06-04',
- startTime: '2024-06-04 13:31:26',
- endTime: '2024-06-04 13:33:37',
- userName: '鏈辨寮�',
- status: '宸茬粨鏉�'
- })
- i++
- }
- }
-}
-</script>
-
-<style scoped>
-.text {
- background-color: aliceblue;
-}
-</style>
diff --git a/src/views/inspection/ReInspectionView.vue b/src/views/inspection/ReInspectionView.vue
new file mode 100644
index 0000000..eb9786e
--- /dev/null
+++ b/src/views/inspection/ReInspectionView.vue
@@ -0,0 +1,71 @@
+<template>
+ <div class="wrapper">
+ <div>澶嶆牳宸℃煡</div>
+ <el-table
+ :data="tableData"
+ v-loading="loading"
+ table-layout="fixed"
+ :row-class-name="tableRowClassName"
+ :height="tableHeight"
+ size="small"
+ >
+ <el-table-column
+ fixed="left"
+ prop="name"
+ :show-overflow-tooltip="true"
+ label="鍚嶇О"
+ width="200"
+ >
+ </el-table-column>
+ <el-table-column prop="planTime" :show-overflow-tooltip="true" label="鏃堕棿">
+ </el-table-column>
+ <!-- <el-table-column prop="score" :show-overflow-tooltip="true" label="璇勫垎" width="60">
+ </el-table-column>
+ <el-table-column prop="risk" :show-overflow-tooltip="true" label="椋庨櫓" width="60">
+ </el-table-column> -->
+ <el-table-column prop="recheck" :show-overflow-tooltip="true" label="澶嶆牳" width="60">
+ </el-table-column>
+ </el-table>
+ </div>
+</template>
+
+<script>
+/**
+ * 鐜板満宸℃煡瀹炴椂璺熻釜
+ */
+export default {
+ data() {
+ return {
+ tableData: [],
+ tableHeight: 'calc(var(--fy-body-height) / 3 - 27px)'
+ }
+ },
+ mounted() {
+ let i = 0
+ while (i < 20) {
+ this.tableData.push({
+ guid: 'SMuheEkjswioSn7A',
+ name: '涓鐢熸�佹暟瀛楁腐椤圭洰宸℃煡涓鐢熸�佹暟瀛楁腐椤圭洰宸℃煡',
+ district: '閲戝北鍖�',
+ planTime: '2024-06-04',
+ startTime: '2024-06-04 13:31:26',
+ endTime: '2024-06-04 13:33:37',
+ userName: '鏈辨寮�',
+ status: '宸茬粨鏉�',
+ total: 4,
+ checked: 2,
+ score: 90,
+ risk: '楂�',
+ recheck: 1
+ })
+ i++
+ }
+ }
+}
+</script>
+
+<style scoped>
+.wrapper {
+ /* height: calc(var(--fy-body-height) / 3); */
+}
+</style>
diff --git a/src/views/inspection/SelfInspection.vue b/src/views/inspection/SelfInspection.vue
index d03f0a1..866f771 100644
--- a/src/views/inspection/SelfInspection.vue
+++ b/src/views/inspection/SelfInspection.vue
@@ -1,6 +1,30 @@
<template>
- <div class="border-r-small" style="height: 200px">
+ <div class="border-r-small">
<div class="font-large">搴旀�ヨ嚜宸℃煡</div>
+ <el-text>鏈湀鍏卞彂甯�4娆¤嚜宸℃煡锛屽凡瀹屾垚0娆★紝鏈畬鎴�4娆�</el-text>
+ <el-table
+ :data="tableData"
+ v-loading="loading"
+ table-layout="fixed"
+ :row-class-name="tableRowClassName"
+ :height="tableHeight"
+ size="small"
+ >
+ <el-table-column
+ fixed="left"
+ prop="name"
+ :show-overflow-tooltip="true"
+ label="浼佷笟"
+ width="200"
+ >
+ </el-table-column>
+ <el-table-column prop="planTime" :show-overflow-tooltip="true" label="鍙戝竷鏃堕棿">
+ </el-table-column>
+ <el-table-column prop="complete" :show-overflow-tooltip="true" label="瀹屾垚鎯呭喌">
+ </el-table-column>
+ <!-- <el-table-column prop="recheck" :show-overflow-tooltip="true" label="澶嶆牳" width="60">
+ </el-table-column> -->
+ </el-table>
</div>
</template>
@@ -8,12 +32,26 @@
export default {
data() {
return {
- tasks: []
+ tableData: []
}
},
watch: {},
methods: {},
- mounted() {}
+ mounted() {
+ let i = 0
+ while (i < 4) {
+ this.tableData.push({
+ guid: 'SMuheEkjswioSn7A',
+ name: '涓鐢熸�佹暟瀛楁腐椤圭洰',
+ district: '閲戝北鍖�',
+ planTime: '2024-06-04',
+ startTime: '2024-06-04 13:31:26',
+ endTime: '2024-06-04 13:33:37',
+ complete: '0/6'
+ })
+ i++
+ }
+ }
}
</script>
diff --git a/src/views/inspection/problem/ProblemTrack.vue b/src/views/inspection/problem/ProblemTrack.vue
new file mode 100644
index 0000000..4ccefe6
--- /dev/null
+++ b/src/views/inspection/problem/ProblemTrack.vue
@@ -0,0 +1,59 @@
+<template>
+ <div class="border-r-small">
+ <div class="font-large">闂鏁存敼璺熻釜</div>
+ <div>
+ <ProblemSummary :data="subtaskList"></ProblemSummary>
+ <ProblemTable :data="subtaskList"></ProblemTable>
+ </div>
+ </div>
+</template>
+
+<script>
+import { useAreaStore } from '@/stores/area.js'
+import { mapStores } from 'pinia'
+
+import ProblemTable from './component/ProblemTable.vue'
+import ProblemSummary from './component/ProblemSummary.vue'
+import taskApi from '@/api/fysp/taskApi.js'
+
+export default {
+ components: { ProblemSummary, ProblemTable },
+ data() {
+ return {
+ subtaskList: []
+ }
+ },
+ watch: {},
+ computed: {
+ ...mapStores(useAreaStore)
+ // area() {
+ // return {
+ // provincecode: '31',
+ // provincename: '涓婃捣甯�',
+ // citycode: '3100',
+ // cityname: '涓婃捣甯�',
+ // districtcode: '310116',
+ // districtname: '閲戝北鍖�',
+ // starttime: '',
+ // endtime: ''
+ // }
+ // }
+ },
+ methods: {
+ fetchSubtask() {
+ taskApi.fetchSubtaskSummaryByArea(this.areaStore.area).then((res) => {
+ this.subtaskList = res.data
+ })
+ }
+ },
+ mounted() {
+ this.fetchSubtask()
+ }
+}
+</script>
+
+<style scoped>
+.text {
+ background-color: aliceblue;
+}
+</style>
diff --git a/src/views/inspection/problem/component/ProblemSummary.vue b/src/views/inspection/problem/component/ProblemSummary.vue
new file mode 100644
index 0000000..71c3684
--- /dev/null
+++ b/src/views/inspection/problem/component/ProblemSummary.vue
@@ -0,0 +1,31 @@
+<template>
+ <div>
+ 闂鏁�: {{ summary.proNum }}锛屾暣鏀规暟: {{ summary.changeNum }}锛屾暣鏀圭巼: {{ summary.changePer }}
+ </div>
+</template>
+<script setup>
+import { computed, ref } from 'vue'
+
+const props = defineProps({
+ data: {
+ type: Array
+ },
+ loading: Boolean
+})
+
+const summary = computed(() => {
+ let proNum = 0,
+ changeNum = 0,
+ changePer = '/'
+ props.data.forEach((d) => {
+ proNum += d.proNum
+ changeNum += d.changeNum
+ })
+
+ if (proNum > 0) {
+ changePer = Math.round((changeNum / proNum) * 100) / 100 + '%'
+ }
+
+ return { proNum, changeNum, changePer }
+})
+</script>
diff --git a/src/views/inspection/problem/component/ProblemTable.vue b/src/views/inspection/problem/component/ProblemTable.vue
new file mode 100644
index 0000000..50c65e2
--- /dev/null
+++ b/src/views/inspection/problem/component/ProblemTable.vue
@@ -0,0 +1,87 @@
+<template>
+ <el-table
+ :data="showTableData"
+ v-loading="loading"
+ table-layout="fixed"
+ :row-class-name="tableRowClassName"
+ :height="tableHeight"
+ size="small"
+ >
+ <el-table-column type="index" label="" width="30"> </el-table-column>
+ <el-table-column prop="scene.name" :show-overflow-tooltip="true" label="鍚嶇О" width="150">
+ </el-table-column>
+ <el-table-column prop="scene.location" :show-overflow-tooltip="true" label="鍦板潃">
+ </el-table-column>
+ <el-table-column prop="proNum" :show-overflow-tooltip="true" label="闂" width="41">
+ </el-table-column>
+ <el-table-column prop="changeNum" :show-overflow-tooltip="true" label="鏁存敼" width="41">
+ </el-table-column>
+ <el-table-column :show-overflow-tooltip="true" label="鏁存敼鐜�" width="54">
+ <template #default="{ row }">
+ {{ calPer(row.proNum, row.changeNum) }}
+ </template>
+ </el-table-column>
+ <el-table-column prop="updateTime" :show-overflow-tooltip="true" label="鏃堕棿">
+ <template #default="{ row }">
+ {{ $fm.formatH(row.updateTime) }}
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="btn-more font-small">
+ <el-link type="primary" @click="showMore = !showMore">鏌ョ湅鏇村</el-link>
+ </div>
+</template>
+<script setup>
+import { computed, ref } from 'vue'
+import dayjs from 'dayjs'
+
+const props = defineProps({
+ data: {
+ type: Array
+ },
+ loading: Boolean
+})
+
+const showMore = ref(false)
+
+const tableData = computed(() => {
+ const l = props.data.map((value) => {
+ const time = value.subtask.executionendtime
+ ? value.subtask.executionendtime
+ : value.subtask.executionstarttime
+ value.updateTime = time
+ return value
+ })
+
+ return l.sort((a, b) => {
+ return dayjs(b.updateTime) - dayjs(a.updateTime)
+ })
+ // return l
+})
+
+const showTableData = computed(() => {
+ if (showMore.value) {
+ return tableData.value
+ } else {
+ return tableData.value.slice(0, 3)
+ }
+})
+
+/**
+ * 璁＄畻鏁存敼鐜�
+ * @param {Number} p 闂鏁�
+ * @param {Number} c 鏁存敼鏁�
+ */
+function calPer(p, c) {
+ if (p == 0) {
+ return '/'
+ } else {
+ return Math.round((c / p) * 100) / 100 + '%'
+ }
+}
+</script>
+<style scoped>
+.btn-more {
+ text-align: center;
+}
+</style>
diff --git a/src/views/main/MonitorView.vue b/src/views/main/MonitorView.vue
index 3038b9a..9ee3c3f 100644
--- a/src/views/main/MonitorView.vue
+++ b/src/views/main/MonitorView.vue
@@ -1,11 +1,11 @@
<template>
<el-row>
- <el-col :span="6" class="page-right">
- <el-scrollbar height="var(--fy-body-height)">
- <ManagementView></ManagementView>
- </el-scrollbar>
+ <el-col :span="7" class="page-right">
+ <!-- <el-scrollbar height="var(--fy-body-height)"> -->
+ <ManagementView></ManagementView>
+ <!-- </el-scrollbar> -->
</el-col>
- <el-col :span="12">
+ <el-col :span="10">
<el-scrollbar class="page-left-top">
<VisualizationView></VisualizationView>
</el-scrollbar>
@@ -13,20 +13,32 @@
<InspectionView></InspectionView>
</el-scrollbar>
</el-col>
- <el-col :span="6" class="page-right">
+ <el-col :span="7" class="page-right">
<el-scrollbar height="var(--fy-body-height)">
- <ManagementView></ManagementView>
+ <StatisticView></StatisticView>
</el-scrollbar>
</el-col>
</el-row>
</template>
<script setup>
+import { provide, ref } from 'vue'
import InspectionView from '@/views/inspection/InspectionView.vue'
import ManagementView from '@/views/management/ManagementView.vue'
+import StatisticView from '@/views/management/StatisticView.vue'
import VisualizationView from '@/views/visualization/VisualizationView.vue'
+import { useAreaStore } from '@/stores/area.js'
-import { provide } from 'vue'
+const windowHeight = ref(window.innerHeight)
+const areaStore = useAreaStore()
+areaStore.setTimeOneDay()
+
+// const headerHeight = computed(()=>{
+// return
+// })
+// fetch('../../assets/styles/layout.scss').then((res) => {
+// console.log(res.text())
+// })
provide('mapHeight', 'calc(var(--fy-body-height) / 3 * 2)')
</script>
diff --git a/src/views/management/EvaluateSummary.vue b/src/views/management/EvaluateSummary.vue
index 2ad888e..45869f4 100644
--- a/src/views/management/EvaluateSummary.vue
+++ b/src/views/management/EvaluateSummary.vue
@@ -1,7 +1,7 @@
<template>
<div class="border-r-small">
- <div class="font-large">椋庨櫓璇勪及</div>
- <el-row justify="space-evenly">
+ <div ref="titleRef" class="font-large">缁煎悎椋庨櫓璇勪及</div>
+ <el-row ref="statisticRef" justify="space-evenly">
<el-statistic title="楂橀闄�" :value="10"> </el-statistic>
<el-statistic title="涓闄�" :value="10"> </el-statistic>
<el-statistic title="浣庨闄�" :value="10"> </el-statistic>
@@ -26,23 +26,50 @@
</el-table-column>
<el-table-column prop="score" :show-overflow-tooltip="true" label="璇勫垎" width="60">
</el-table-column>
- <el-table-column prop="score" :show-overflow-tooltip="true" label="椋庨櫓" width="60">
+ <el-table-column prop="risk" :show-overflow-tooltip="true" label="椋庨櫓" width="60">
</el-table-column>
+ <!-- <el-table-column prop="recheck" :show-overflow-tooltip="true" label="澶嶆牳" width="60">
+ </el-table-column> -->
</el-table>
</div>
</template>
<script>
+import { unCalc } from '@/utils/css-util'
/**
* 瀵瑰畬鎴愮殑浠诲姟杩涜璇勪及椋庨櫓锛屾樉绀洪珮椋庨櫓鍦烘櫙锛屾樉绀哄鏍哥殑鍦烘櫙鐨勬儏鍐�
*/
export default {
+ props: {
+ height: {
+ type: String,
+ default: '200'
+ }
+ },
data() {
return {
- tableData: []
+ tableData: [],
+ tableHeight: '200'
+ }
+ },
+ watch: {
+ height(nV, oV) {
+ if (nV != oV) {
+ this.tableHeight = this.calcTableHeight()
+ }
+ }
+ },
+ methods: {
+ calcTableHeight() {
+ const h1 = this.$refs.titleRef.offsetHeight
+ const h2 = this.$refs.statisticRef.$el.offsetHeight
+ const h = h1 + h2
+ const r = `calc(${unCalc(this.height)} - ${h}px)`
+ return r
}
},
mounted() {
+ this.tableHeight = this.calcTableHeight()
let i = 0
while (i < 20) {
this.tableData.push({
@@ -56,7 +83,9 @@
status: '宸茬粨鏉�',
total: 4,
checked: 2,
- score: 90
+ score: 90,
+ risk: '楂�',
+ recheck: 1
})
i++
}
diff --git a/src/views/management/ManagementView.vue b/src/views/management/ManagementView.vue
index 9b222cc..5a74e98 100644
--- a/src/views/management/ManagementView.vue
+++ b/src/views/management/ManagementView.vue
@@ -1,14 +1,56 @@
<template>
<!-- <el-row> 缁熻绠＄悊 </el-row> -->
- <TaskStats></TaskStats>
- <EvaluateSummary></EvaluateSummary>
- <TaskSummary></TaskSummary>
+ <ProblemTrack ref="statusRef"></ProblemTrack>
+ <!-- <TaskStats ref="statusRef"></TaskStats> -->
+ <EvaluateSummary :height="height"></EvaluateSummary>
+ <!-- <TaskSummary ref="summaryRef"></TaskSummary> -->
+ <ReInspectionView ref="summaryRef"></ReInspectionView>
</template>
-<script setup>
+<script>
import TaskStats from '@/views/management/TaskStats.vue'
import TaskSummary from '@/views/management/TaskSummary.vue'
import EvaluateSummary from '@/views/management/EvaluateSummary.vue'
+import ReInspectionView from '@/views/inspection/ReInspectionView.vue'
+import ProblemTrack from '@/views/inspection/problem/ProblemTrack.vue'
+import { vResize } from '@/utils/resize-observer'
+
+export default {
+ components: { TaskStats, TaskSummary, EvaluateSummary, ReInspectionView, ProblemTrack },
+ data() {
+ return {
+ // height: '500px',
+ statusHeight: 200,
+ summaryHeight: 200
+ }
+ },
+ computed: {
+ height() {
+ const h = this.statusHeight + this.summaryHeight + 5
+ return `calc(var(--fy-body-height) - ${h}px)`
+ }
+ },
+ methods: {
+ calcHeight() {
+ const h1 = this.$refs.statusRef.$el.offsetHeight
+ const h2 = this.$refs.summaryRef.$el.offsetHeight
+ const h = h1 + h2
+ return `calc(var(--fy-body-height) - ${h}px)`
+ }
+ },
+ mounted() {
+ vResize.mounted(this.$refs.statusRef.$el, ({ height }) => {
+ this.statusHeight = height
+ })
+ vResize.mounted(this.$refs.summaryRef.$el, ({ height }) => {
+ this.summaryHeight = height
+ })
+ },
+ unmounted() {
+ vResize.unmounted(this.$refs.statusRef.$el)
+ vResize.unmounted(this.$refs.summaryRef.$el)
+ }
+}
</script>
<style scoped></style>
diff --git a/src/views/management/StatisticView.vue b/src/views/management/StatisticView.vue
new file mode 100644
index 0000000..79d9ba8
--- /dev/null
+++ b/src/views/management/StatisticView.vue
@@ -0,0 +1,52 @@
+<template>
+ <!-- <el-row> 缁熻绠＄悊 </el-row> -->
+ <SelfInspection></SelfInspection>
+ <JointEnforcement></JointEnforcement>
+ <TaskSummary></TaskSummary>
+</template>
+
+<script>
+import SelfInspection from '@/views/inspection/SelfInspection.vue'
+import JointEnforcement from '@/views/inspection/JointEnforcement.vue'
+import TaskSummary from '@/views/management/TaskSummary.vue'
+import { vResize } from '@/utils/resize-observer'
+
+export default {
+ components: { SelfInspection, JointEnforcement, TaskSummary },
+ data() {
+ return {
+ // height: '500px',
+ statusHeight: 200,
+ summaryHeight: 200
+ }
+ },
+ computed: {
+ height() {
+ const h = this.statusHeight + this.summaryHeight
+ return `calc(var(--fy-body-height) - ${h}px)`
+ }
+ },
+ methods: {
+ calcHeight() {
+ const h1 = this.$refs.statusRef.$el.offsetHeight
+ const h2 = this.$refs.summaryRef.$el.offsetHeight
+ const h = h1 + h2
+ return `calc(var(--fy-body-height) - ${h}px)`
+ }
+ },
+ mounted() {
+ // vResize.mounted(this.$refs.statusRef.$el, ({ height }) => {
+ // this.statusHeight = height
+ // })
+ // vResize.mounted(this.$refs.summaryRef.$el, ({ height }) => {
+ // this.summaryHeight = height
+ // })
+ },
+ unmounted() {
+ // vResize.unmounted(this.$refs.statusRef.$el)
+ // vResize.unmounted(this.$refs.summaryRef.$el)
+ }
+}
+</script>
+
+<style scoped></style>
diff --git a/src/views/management/TaskStats.vue b/src/views/management/TaskStats.vue
index 1cadd40..107ab66 100644
--- a/src/views/management/TaskStats.vue
+++ b/src/views/management/TaskStats.vue
@@ -29,6 +29,9 @@
*/
export default {
components: { SelfInspection, JointEnforcement },
+ props: {
+ height: String
+ },
data() {
return {
tasks: []
diff --git a/src/views/management/TaskSummary.vue b/src/views/management/TaskSummary.vue
index 4bc0909..de24fc4 100644
--- a/src/views/management/TaskSummary.vue
+++ b/src/views/management/TaskSummary.vue
@@ -1,26 +1,147 @@
<template>
- <el-row> 宸℃煡姹囨�� </el-row>
- <el-row>
- <el-col :span="8">
- <TaskSummaryItem title="浠婃棩姹囨��"></TaskSummaryItem>
- </el-col>
- <el-col :span="8">
- <TaskSummaryItem title="鍛ㄥ害姹囨��"></TaskSummaryItem>
- </el-col>
- <el-col :span="8">
- <TaskSummaryItem title="鏈堝害姹囨��"></TaskSummaryItem>
- </el-col>
- </el-row>
- <el-row>
- <el-col :span="12">
- <TaskSummaryItem title="瀛ｅ害姹囨��"></TaskSummaryItem>
- </el-col>
- <el-col :span="12">
- <TaskSummaryItem title="骞村害姹囨��"></TaskSummaryItem>
- </el-col>
- </el-row>
+ <div class="border-r-small">
+ <el-row> 宸℃煡姹囨�� </el-row>
+ <el-segmented v-model="value" :options="options" />
+ <div><el-text tag="i"> 璇勪及 </el-text></div>
+ <el-row justify="space-evenly">
+ <div>
+ <el-statistic title="鎬昏" :value="10"> </el-statistic>
+ <div class="statistic-footer">
+ <div class="footer-item">
+ <span>瀵规瘮鏄ㄦ棩</span>
+ <span class="green">
+ 24%
+ <el-icon>
+ <CaretTop />
+ </el-icon>
+ </span>
+ </div>
+ </div>
+ </div>
+ <el-statistic title="楂橀闄�" :value="2" :value-style="styleRed"> </el-statistic>
+ <el-statistic title="涓闄�" :value="6" :value-style="styleYellow"> </el-statistic>
+ <el-statistic title="浣庨闄�" :value="2" :value-style="styleGreen"> </el-statistic>
+ </el-row>
+ <div><el-text tag="i"> 澶嶆牳 </el-text></div>
+ <el-row justify="space-evenly">
+ <div>
+ <el-statistic title="闇�澶嶆牳" :value="2"> </el-statistic>
+ <div class="statistic-footer">
+ <div class="footer-item">
+ <span>瀵规瘮鏄ㄦ棩</span>
+ <span class="green">
+ 24%
+ <el-icon>
+ <CaretTop />
+ </el-icon>
+ </span>
+ </div>
+ </div>
+ </div>
+ <el-statistic title="宸插畬鎴�" :value="2" :value-style="styleGreen"> </el-statistic>
+ </el-row>
+ <div><el-text tag="i"> 闂 </el-text></div>
+ <el-row justify="space-evenly">
+ <div>
+ <el-statistic title="鎬昏" :value="10"> </el-statistic>
+ <div class="statistic-footer">
+ <div class="footer-item">
+ <span>瀵规瘮鏄ㄦ棩</span>
+ <span class="green">
+ 24%
+ <el-icon>
+ <CaretTop />
+ </el-icon>
+ </span>
+ </div>
+ </div>
+ </div>
+ <el-statistic title="寰呭鏍�" :value="2" :value-style="styleRed"> </el-statistic>
+ <el-statistic title="宸插鏍�" :value="6" :value-style="styleYellow"> </el-statistic>
+ <el-statistic title="寰呮暣鏀�" :value="2" :value-style="styleGreen"> </el-statistic>
+ <el-statistic title="宸叉暣鏀�" :value="2" :value-style="styleGreen"> </el-statistic>
+ <el-statistic title="寰呯‘璁�" :value="2" :value-style="styleGreen"> </el-statistic>
+ </el-row>
+ <!-- <el-row>
+ <el-col :span="8">
+ <TaskSummaryItem title="浠婃棩姹囨��"></TaskSummaryItem>
+ </el-col>
+ <el-col :span="8">
+ <TaskSummaryItem title="鍛ㄥ害姹囨��"></TaskSummaryItem>
+ </el-col>
+ <el-col :span="8">
+ <TaskSummaryItem title="鏈堝害姹囨��"></TaskSummaryItem>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="12">
+ <TaskSummaryItem title="瀛ｅ害姹囨��"></TaskSummaryItem>
+ </el-col>
+ <el-col :span="12">
+ <TaskSummaryItem title="骞村害姹囨��"></TaskSummaryItem>
+ </el-col>
+ </el-row> -->
+ </div>
</template>
-<script setup></script>
+<script>
+export default {
+ props: {
+ height: String
+ },
+ emits: ['update:height'],
+ data() {
+ return {
+ value: '浠婃棩姹囨��',
+ options: ['浠婃棩姹囨��', '鍛ㄥ害姹囨��', '鏈堝害姹囨��', '瀛ｅ害姹囨��', '骞村害姹囨��'],
+ styleRed: 'color:var(--el-color-danger);',
+ styleYellow: 'color:var(--el-color-warning);',
+ styleGreen: 'color:var(--el-color-success);'
+ }
+ },
+ mounted() {}
+}
+</script>
-<style scoped></style>
+<style scoped>
+.el-segmented {
+ --el-segmented-item-selected-color: var(--el-text-color-primary);
+ --el-segmented-item-selected-bg-color: #ffd100;
+ --el-border-radius-base: 16px;
+}
+
+.el-statistic {
+ --el-statistic-content-font-size: var(--el-font-size-base);
+ /* background-color: aliceblue; */
+}
+
+.statistic-footer {
+ background-color: #ffd100;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ flex-wrap: wrap;
+ font-size: 12px;
+ color: var(--el-text-color-regular);
+ /* margin-top: 16px; */
+}
+
+.statistic-footer .footer-item {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.statistic-footer .footer-item span:last-child {
+ display: inline-flex;
+ align-items: center;
+ margin-left: 4px;
+}
+
+.green {
+ color: var(--el-color-success);
+}
+.red {
+ color: var(--el-color-error);
+}
+</style>
diff --git a/src/views/visualization/SupervisionVisual.vue b/src/views/visualization/SupervisionVisual.vue
index d362111..c14bbdd 100644
--- a/src/views/visualization/SupervisionVisual.vue
+++ b/src/views/visualization/SupervisionVisual.vue
@@ -10,6 +10,9 @@
<script>
import { inject } from 'vue'
+import { useAreaStore } from '@/stores/area.js'
+import { mapStores } from 'pinia'
+
import taskApi from '@/api/fysp/taskApi.js'
import marks from '@/utils/map/marks.js'
import scene_1 from '@/assets/icon/scene_1.png'
@@ -33,23 +36,28 @@
}
},
computed: {
- area() {
- return {
- provincecode: this.locations.pCode,
- provincename: this.locations.pName,
- citycode: this.locations.cCode,
- cityname: this.locations.cName,
- districtcode: this.locations.dCode,
- districtname: this.locations.dName,
- starttime: this.$fm.formatYMDH(this.time),
- scensetypeid: this.sceneType.value
- }
- }
+ ...mapStores(useAreaStore)
+ // area() {
+ // return {
+ // provincecode: this.locations.pCode,
+ // provincename: this.locations.pName,
+ // citycode: this.locations.cCode,
+ // cityname: this.locations.cName,
+ // districtcode: this.locations.dCode,
+ // districtname: this.locations.dName,
+ // starttime: this.$fm.formatYMDH(this.time),
+ // scensetypeid: this.sceneType.value
+ // }
+ // }
},
methods: {
// 鏌ヨ
- fetchSubtaskSummaryArea() {
- return taskApi.fetchSubtaskSummaryArea(this.area).then((res) => {
+ fetchTaskProgress() {
+ this.areaStore.setLocation(this.locations)
+ this.areaStore.setTimeOneDay(this.time)
+ this.areaStore.setSceneType(this.sceneType.value)
+
+ return taskApi.fetchTaskProgress(this.areaStore.area).then((res) => {
let list = []
res.data.forEach((e) => {
list = list.concat(e.subTaskSummary)
@@ -62,7 +70,7 @@
}
},
mounted() {
- this.fetchSubtaskSummaryArea()
+ // this.fetchTaskProgress()
}
}
</script>
diff --git a/src/views/visualization/VisualizationView.vue b/src/views/visualization/VisualizationView.vue
index 89942b4..fdf7440 100644
--- a/src/views/visualization/VisualizationView.vue
+++ b/src/views/visualization/VisualizationView.vue
@@ -6,7 +6,7 @@
<SupervisionVisual></SupervisionVisual>
</el-col>
<el-col :span="6">
- <SubtaskVisual></SubtaskVisual>
+ <!-- <SubtaskVisual></SubtaskVisual> -->
</el-col>
</el-row>
</template>
--
Gitblit v1.9.3