From 6c75516f1ba668873807cef33aa996d25cdf16c4 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期二, 13 五月 2025 17:43:06 +0800 Subject: [PATCH] 新增动态溯源异常更新列表 --- src/views/realtimemode/RealtimeMode.vue | 100 ++++++++++++++++++++++++++++--------------------- 1 files changed, 57 insertions(+), 43 deletions(-) diff --git a/src/views/realtimemode/RealtimeMode.vue b/src/views/realtimemode/RealtimeMode.vue index c4de517..af30d78 100644 --- a/src/views/realtimemode/RealtimeMode.vue +++ b/src/views/realtimemode/RealtimeMode.vue @@ -14,6 +14,7 @@ class="m-t-2" :factor="factorDatas.factor[factorType]" ></FactorLegend> + <!-- <SourceTrace></SourceTrace> --> </el-row> <DashBoard class="dash-board" :factor-datas="factorDatas"></DashBoard> <RealTimeTrend @@ -25,19 +26,28 @@ </template> <script> +import moment from 'moment'; +import mapUtil from '@/utils/map/util'; import { useFetchData } from '@/composables/fetchData'; import { TYPE0 } from '@/constant/device-type'; +import { defaultOptions } from '@/constant/radio-options'; import { FactorDatas } from '@/model/FactorDatas'; -import monitorDataApi from '@/api/monitorDataApi'; import DashBoard from './component/DashBoard.vue'; import RealTimeTrend from './component/RealTimeTrend.vue'; import DeviceChange from './component/DeviceChange.vue'; +import SourceTrace from '@/views/sourcetrace/SourceTrace.vue'; import { realTimeMapAnimation } from '@/utils/map/animation'; +import { + fetchHistoryData, + startLoopFetchRealTimeData, + clearFetchingTask +} from '@/utils/factor/data'; +import thirdPartyDataApi from '@/api/thirdPartyDataApi'; // const mapAnimation = new MapAnimation(); export default { - components: { DashBoard, RealTimeTrend, DeviceChange }, + components: { DashBoard, RealTimeTrend, DeviceChange, SourceTrace }, setup() { const { loading, fetchData } = useFetchData(10000); return { loading, fetchData }; @@ -46,9 +56,9 @@ return { // 鐩戞祴璁惧绫诲瀷 deviceType: TYPE0, - deviceCode: '0a0000000001', + deviceCode: '', // 鐩戞祴鍥犲瓙鐨勭被鍨嬬紪鍙� - factorType: '1', + factorType: defaultOptions(TYPE0).value, // 鏂拌幏鍙栫殑鐩戞祴鏁版嵁 factorDatas: new FactorDatas(), // 鍏ㄩ儴鐩戞祴鏁版嵁 @@ -63,11 +73,13 @@ } }, computed: { + // 鏁版嵁鏈�鏂版椂闂达紙鏈�鏂版暟鎹殑閲囨牱鏃堕棿鍔�1绉掞紱娌℃湁鏁版嵁鏃讹紝閲囩敤褰撳墠鏃堕棿鐨勫墠6鍒嗛挓锛� latestTime() { if (this.factorDatas.times.length == 0) { - return ''; + return moment().subtract(6, 'm').format('YYYY-MM-DD HH:mm:ss'); } else { - return this.factorDatas.times[this.factorDatas.times.length - 1]; + const _time = this.factorDatas.times[this.factorDatas.times.length - 1]; + return moment(_time).add(1, 's').format('YYYY-MM-DD HH:mm:ss'); } } }, @@ -93,50 +105,45 @@ }); }, fetchRealTimeData() { - // fixme 2024.5.3 姝ゅ鍒濆鑾峰彇鐨勬暟鎹紝鍙傛暟搴旇鐢眘earchbar鍐冲畾锛屽悗缁慨鏀� this.fetchData((page) => { - return monitorDataApi - .fetchHistroyData({ + return fetchHistoryData( + { deviceCode: this.deviceCode, - // startTime: '2021-11-04 09:53:35', + // startTime: '2024-08-20 06:00:00', + // endTime: '2024-08-20 06:02:00', page, perPage: 100 - }) - .then((res) => { - this.onFetchData(res.data); - this.onMapData(res.data); - this.fetchNextData(); - }); + }, + 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); + }); }); }, clearFetchingTask() { - if (this.fetchingTask) { - clearInterval(this.fetchingTask); - this.fetchingTask = undefined; - } + clearFetchingTask(); }, fetchNextData() { - this.clearFetchingTask(); - this.fetchingTask = setInterval(() => { - if (this.isFetching) { - return; + startLoopFetchRealTimeData( + () => { + return { + deviceCode: this.deviceCode, + updateTime: this.latestTime, + perPage: 10 + }; + }, + (res) => { + this.onFetchData(res.data); + this.onMapData(res.data); + thirdPartyDataApi.fetchLatestData(this.deviceType, this.deviceCode); } - - this.isFetching = true; - this.fetchData(() => { - return monitorDataApi - .fetchNextData({ - deviceCode: this.deviceCode, - updateTime: this.latestTime, - perPage: 10 - }) - .then((res) => { - this.onFetchData(res.data); - this.onMapData(res.data); - }) - .finally(() => (this.isFetching = false)); - }); - }, 10000); + ); }, onMapData(dataList) { let startIndex = this.allFactorDatas.length() - 1; @@ -145,7 +152,7 @@ this.notFirstFetch = true; } startIndex = startIndex < 0 ? 0 : startIndex; - return new Promise((resolve, reject) => { + return new Promise(() => { this.allFactorDatas.addData(dataList, this.drawMode, () => { realTimeMapAnimation.moveAnimation( this.allFactorDatas, @@ -157,12 +164,19 @@ } }, mounted() { - this.fetchRealTimeData(); + // this.fetchRealTimeData(); + // startLoopFetchRealTimeData({ + // compUser: 'user1', + // compPassword: 'User1@jingan', + // mn: 'TX105', + // dtFrom: '2024-08-07 10:00:00', + // dtTo: '2024-08-07 10:00:59' + // }); }, unmounted() { this.clearFetchingTask(); realTimeMapAnimation.stop(); - console.log('clear'); + mapUtil.clearMap(); } }; </script> -- Gitblit v1.9.3