From ff82e86becbd200adabd2ce56fba1f6b3c6c37e1 Mon Sep 17 00:00:00 2001 From: Riku <risaku@163.com> Date: 星期一, 23 六月 2025 23:10:49 +0800 Subject: [PATCH] 2025.6.23 --- src/views/visualization/SubtaskVisual.vue | 250 +++++++++++++++++++++++++++++++++++-------------- 1 files changed, 177 insertions(+), 73 deletions(-) diff --git a/src/views/visualization/SubtaskVisual.vue b/src/views/visualization/SubtaskVisual.vue index 591758d..3d0196e 100644 --- a/src/views/visualization/SubtaskVisual.vue +++ b/src/views/visualization/SubtaskVisual.vue @@ -1,95 +1,199 @@ <template> - <el-scrollbar :height="mapHeight"> - <el-card class="p-events-auto wrapper"> - <div>{{ subtask.name }}</div> - <el-timeline style="max-width: 600px"> - <el-timeline-item - v-for="(activity, index) in activities" - :key="index" - :timestamp="activity.timestamp" - :hide-timestamp="activity.running" - :type="activity.running ? 'danger' : 'success'" - :size="activity.running ? 'large' : 'normal'" - :hollow="false" - > - {{ activity.content }} - </el-timeline-item> - </el-timeline> + <el-scrollbar v-if="mapStore.focusMarker" class="wrapper"> + <el-card class="p-events-auto"> + <el-row justify="space-between"> + <!-- <div class="font-small">{{ scene.name }}</div> --> + <el-text size="large">{{ scene.name }}</el-text> + <el-button icon="Close" circle @click="mapStore.focusMarker = undefined"></el-button> + </el-row> + <el-row justify="space-between"> + <el-text size="small">{{ '鍦板潃锛�' + scene.location }}</el-text> + </el-row> + <el-space class="m-t-8"> + <el-tag type="info" effect="plain"> + {{ scene.districtname + scene.townname }} + </el-tag> + <el-tag type="info" effect="plain"> + {{ scene.type }} + </el-tag> + </el-space> + <el-divider></el-divider> + <el-row justify="space-between"> + <el-col :span="8" style="text-align: center"> + <el-text>鐘舵�侊細{{ subtask.status }}</el-text> + </el-col> + <el-col :span="8" style="text-align: center"> + <el-text>璁″垝锛歿{ $fm.formatYMD(subtask.planstarttime) }}</el-text> + </el-col> + <el-col v-if="subtask.status != '鏈墽琛�'" :span="8" style="text-align: center"> + <el-text> + <span>鎵ц锛歿{ $fm.formatH(subtask.executionstarttime) }}</span> + <!-- <span> - </span> + <span>{{ $fm.formatYMDH(subtask.executionendtime) }}</span> --> + </el-text> + </el-col> + </el-row> + + <el-segmented v-model="value" :options="options" block /> + <div v-show="value == '鐜板満闂'"> + <problem-item + v-for="(item, i) in problemList" + :key="item.guid" + :index="i + 1" + :problem="item" + ></problem-item> + <el-empty v-if="problemList.length == 0" description="鏃犵幇鍦洪棶棰�"> + <template #image> </template> + </el-empty> + </div> + <div v-show="value == '鍦烘櫙鍥剧墖'"> + <FYImageSelectDialog + readonly + height="500px" + :imageWidth="134" + v-loading="scenePicLoading" + :typeList="scenePicTypeList" + :typeImgMap="scenePicTypeMap" + ></FYImageSelectDialog> + </div> + <div v-show="value == '璁惧璁炬柦'"> + + </div> </el-card> </el-scrollbar> </template> -<script> -import { inject } from 'vue' +<script setup> +import { inject, ref, computed, watch } from 'vue' +import { useMapStore } from '@/stores/map.js' +import { mapStores } from 'pinia' + +import { $fysp } from '@/api/index.js' +import problemApi from '@/api/fysp/problemApi.js' +import mediafileApi from '@/api/fysp/mediafileApi.js' +import deviceApi from '@/api/fysp/deviceApi' + /** * 鍏蜂綋宸℃煡浠诲姟鍙鍖� * 鍖呮嫭鍦板浘瀹氫綅淇℃伅灞曠ず銆佸贰鏌ヤ换鍔″叏娴佺▼骞抽摵灞曠ず */ -export default { - setup() { - const mapHeight = inject('mapHeight') +const mapHeight = inject('mapHeight') +const height = 'height:' + mapHeight - const height = 'height:' + mapHeight - return { height, mapHeight } - }, - props: { - subtask: { - type: Object, - default: () => { - return { - 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 +const mapStore = useMapStore() +const subtask = computed(() => (mapStore.focusMarker ? mapStore.focusMarker.subtask : undefined)) +const scene = computed(() => (mapStore.focusMarker ? mapStore.focusMarker.scene : undefined)) +const inspection = computed(() => + mapStore.focusMarker ? mapStore.focusMarker.inspection : undefined +) + +const value = ref('鐜板満闂') +const options = ['鐜板満闂', '鍦烘櫙鍥剧墖', '璁惧璁炬柦'] + +const problemList = ref([]) +const problemListLoading = ref(false) + +const scenePicTypeList = ref([]) +const scenePicTypeMap = ref(new Map()) +const scenePicLoading = ref(false) + +watch(subtask, (nV, oV) => { + if (nV != undefined && nV != oV) { + fetchProblem(nV.stguid) + getRoutineByStGuid(nV.stguid) + } +}) +function fetchProblem(stguid) { + problemListLoading.value = true + problemApi + .fetchProblems(stguid) + .then((res) => { + problemList.value = res + }) + .finally(() => (problemListLoading.value = false)) +} + +// 鍥剧墖鍒嗙被 +function getRoutineByStGuid(stguid) { + scenePicLoading.value = true + mediafileApi + .getRoutineByStGuid(stguid) + .then((res) => { + let typeList = [] + let typeMap = new Map() + const data = res.data + for (const e of data) { + let img = { + url: $fysp.imgUrl + e.extension1 + e.guid + '.jpg', + data: e + } + const businesstype = e.businesstype + const businesstypeid = e.businesstypeid + if (typeList.find((item) => item.typeId == businesstypeid) != undefined) { + typeMap.get(businesstypeid).push(img) + } else { + typeList.push({ + typeId: businesstypeid, + typeName: businesstype + }) + typeMap.set(businesstypeid, [img]) } } + scenePicTypeList.value = typeList + scenePicTypeMap.value = typeMap + }) + .finally(() => (scenePicLoading.value = false)) +} + +function fetchDevices() { + deviceApi.fetchDevices(scene.value.guid, this.currSelect.topDeviceTypeId).then((result) => { + this.initList() + if (result.data == null || result.data.length <= 0) { + this.isEmpty = true + return } - }, - data() { - return { - activities: [ - { - content: '浠诲姟鍒涘缓', - timestamp: '2024-06-04 08:00', - running: false - }, - { - content: '寮�濮嬪贰鏌�', - timestamp: '2024-06-04 09:00', - running: false - }, - { - content: '缁撴潫宸℃煡', - timestamp: '2024-06-04 09:15', - running: false - }, - { - content: '瀹屾垚闂瀹℃牳', - timestamp: '2024-06-04 10:15', - running: false - }, - { - content: '闂鏁存敼涓�...', - timestamp: '2024-06-04 10:15', - running: true + // 鏍囧噯鍖栧睘鎬у悕 + for (let index = 0; index < result.data.length; index++) { + var element = this.convertKeys(result.data[index]) + this.initFormData(element) + // 鑾峰彇璁惧鐘舵�佷俊鎭� + let data = { + deviceId: element.id, + sceneId: element.sceneGuid, + deviceTypeId: this.currSelect.topDeviceTypeId + } + deviceApi.fetchDeviceStatus(data).then((status) => { + var statusData = status.data + var imgPaths = [] + if (statusData) { + if (statusData.length == 0) { + this.formInfo.push(element) + return + } + element = this.convertKeys(result.data[index]) + element = this.setDeviceType(element) + element._picUrls = imgPaths + for (let index = 0; index < statusData.length; index++) { + const statusItem = statusData[index] + // 璁惧瀵硅薄娣诲姞涓�涓睘鎬у垪琛ㄥ睘鎬х敤鏉ヤ繚瀛樿澶囩姸鎬� + this.saveStatus(element, statusItem) + element.dlLocation = statusItem.dlLocation + this.formInfo.push(element) + } } - ] + }) } - } + }) } </script> <style scoped> .wrapper { - /* position: absolute; */ - top: 0; - right: 0; - /* background-color: wheat; */ + width: 450px; + max-height: 800px; +} + +.el-card { + --el-card-padding: 8px; } </style> -- Gitblit v1.9.3