From 66e48ee8e286533a9614efa34d42297213c1da4b Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期三, 04 六月 2025 17:34:11 +0800 Subject: [PATCH] 动态溯源(待完成) --- src/views/realtimemode/RealtimeMode.vue | 84 +++++++++++++++++++++++++---------------- 1 files changed, 51 insertions(+), 33 deletions(-) diff --git a/src/views/realtimemode/RealtimeMode.vue b/src/views/realtimemode/RealtimeMode.vue index af30d78..b18b4a6 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="clearFetchingTask" + > + 鍋滄 + </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,10 @@ :factor-datas="factorDatas" :device-type="deviceType" ></RealTimeTrend> + <SourceTrace + class="source-trace" + v-model:factorType="factorType" + ></SourceTrace> </div> </template> @@ -43,8 +50,13 @@ clearFetchingTask } from '@/utils/factor/data'; import thirdPartyDataApi from '@/api/thirdPartyDataApi'; +import websocket from '@/api/websocket'; // const mapAnimation = new MapAnimation(); + +// 璋冭瘯妯″紡 +const mode = 'debug'; +// const mode = 'product'; export default { components: { DashBoard, RealTimeTrend, DeviceChange, SourceTrace }, @@ -103,24 +115,29 @@ // this.draw(); this.factorDatas = fDatas; }); + if (mode == 'debug') { + websocket.send(JSON.stringify(data)); + } }, fetchRealTimeData() { this.fetchData((page) => { - return fetchHistoryData( - { - deviceCode: this.deviceCode, - // startTime: '2024-08-20 06:00:00', - // endTime: '2024-08-20 06:02:00', - page, - perPage: 100 - }, - false - ).then((res) => { + const param = + mode == 'debug' + ? { + deviceCode: this.deviceCode, + startTime: '2025-01-16 11:34:00', + endTime: '2025-01-16 11:35:00', + page, + perPage: 100 + } + : { + deviceCode: this.deviceCode, + page, + perPage: 100 + }; + return fetchHistoryData(param, false).then((res) => { this.onFetchData(res.data); this.onMapData(res.data); - // if (res.data.length > 0) { - // this.fetchNextData(res.data[res.data.length - 1].time); - // } this.fetchNextData(); thirdPartyDataApi.fetchLatestData(this.deviceType, this.deviceCode); }); @@ -135,14 +152,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) { @@ -164,14 +182,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(); @@ -184,11 +197,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