From 16eb4bd55a4fd61ddd7a171b1a07378c45d1665b Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期四, 05 六月 2025 13:59:28 +0800 Subject: [PATCH] 动态溯源(待完成) --- src/views/realtimemode/RealtimeMode.vue | 76 +++++++++++++++++++++++++------------- 1 files changed, 50 insertions(+), 26 deletions(-) diff --git a/src/views/realtimemode/RealtimeMode.vue b/src/views/realtimemode/RealtimeMode.vue index 86b798a..5691c14 100644 --- a/src/views/realtimemode/RealtimeMode.vue +++ b/src/views/realtimemode/RealtimeMode.vue @@ -2,19 +2,22 @@ <div class="p-events-none m-t-2"> <el-row justify="center" align="middle" class="top-wrap"> <DeviceChange @change="onDeviceChange"></DeviceChange> + <el-button + type="primary" + class="p-events-auto el-button-custom" + @click="pauseTask" + > + {{ pause ? '缁х画' : '鏆傚仠' }} + </el-button> </el-row> <el-row class="m-t-2"> - <FactorRadio - :device-type="deviceType" - @change="(e) => (factorType = e)" - ></FactorRadio> + <FactorRadio :device-type="deviceType" v-model="factorType"></FactorRadio> </el-row> <el-row class="m-t-2"> - <FactorLegend - class="m-t-2" - :factor="factorDatas.factor[factorType]" - ></FactorLegend> - <SourceTrace></SourceTrace> + <el-col span="1"> + <FactorLegend :factor="factorDatas.factor[factorType]"></FactorLegend> + </el-col> + <el-col span="1"> </el-col> </el-row> <DashBoard class="dash-board" :factor-datas="factorDatas"></DashBoard> <RealTimeTrend @@ -22,6 +25,11 @@ :factor-datas="factorDatas" :device-type="deviceType" ></RealTimeTrend> + <SourceTrace + class="source-trace" + v-model:factorType="factorType" + ></SourceTrace> + <UnderwayAdvice></UnderwayAdvice> </div> </template> @@ -36,11 +44,13 @@ import RealTimeTrend from './component/RealTimeTrend.vue'; import DeviceChange from './component/DeviceChange.vue'; import SourceTrace from '@/views/sourcetrace/SourceTrace.vue'; +import UnderwayAdvice from '@/views/sourcetrace/UnderwayAdvice.vue'; import { realTimeMapAnimation } from '@/utils/map/animation'; import { fetchHistoryData, startLoopFetchRealTimeData, - clearFetchingTask + clearFetchingTask, + pauseTask } from '@/utils/factor/data'; import thirdPartyDataApi from '@/api/thirdPartyDataApi'; import websocket from '@/api/websocket'; @@ -49,9 +59,16 @@ // 璋冭瘯妯″紡 const mode = 'debug'; +// const mode = 'product'; export default { - components: { DashBoard, RealTimeTrend, DeviceChange, SourceTrace }, + components: { + DashBoard, + RealTimeTrend, + DeviceChange, + SourceTrace, + UnderwayAdvice + }, setup() { const { loading, fetchData } = useFetchData(10000); return { loading, fetchData }; @@ -66,7 +83,8 @@ // 鏂拌幏鍙栫殑鐩戞祴鏁版嵁 factorDatas: new FactorDatas(), // 鍏ㄩ儴鐩戞祴鏁版嵁 - allFactorDatas: new FactorDatas() + allFactorDatas: new FactorDatas(), + pause: false }; }, watch: { @@ -117,10 +135,12 @@ mode == 'debug' ? { deviceCode: this.deviceCode, - startTime: '2025-01-16 11:30:00', - endTime: '2025-01-16 11:32:00', + // startTime: '2025-01-16 11:34:00', + // endTime: '2025-01-16 11:35:00', + startTime: '2024-11-27 11:50:41', + endTime: '2025-01-16 11:51:41', page, - perPage: 100 + perPage: 10 } : { deviceCode: this.deviceCode, @@ -135,6 +155,9 @@ }); }); }, + pauseTask() { + this.pause = pauseTask(); + }, clearFetchingTask() { clearFetchingTask(); }, @@ -144,14 +167,15 @@ return { deviceCode: this.deviceCode, updateTime: this.latestTime, - perPage: 10 + perPage: mode == 'debug' ? 1 : 10 }; }, (res) => { this.onFetchData(res.data); this.onMapData(res.data); thirdPartyDataApi.fetchLatestData(this.deviceType, this.deviceCode); - } + }, + mode == 'debug' ? 4000 : undefined ); }, onMapData(dataList) { @@ -173,14 +197,9 @@ } }, mounted() { - // this.fetchRealTimeData(); - // startLoopFetchRealTimeData({ - // compUser: 'user1', - // compPassword: 'User1@jingan', - // mn: 'TX105', - // dtFrom: '2024-08-07 10:00:00', - // dtTo: '2024-08-07 10:00:59' - // }); + if (mode == 'debug') { + websocket.send('start'); + } }, unmounted() { this.clearFetchingTask(); @@ -193,11 +212,16 @@ .dash-board { position: absolute; left: 0; - bottom: 2px; + bottom: 0px; } .real-time-trend { position: absolute; right: 0; top: 0; } +.source-trace { + position: absolute; + right: 0; + bottom: 0px; +} </style> -- Gitblit v1.9.3