From 5679cbbb630092a197d991cb41997a2d953261e9 Mon Sep 17 00:00:00 2001
From: Riku <risaku@163.com>
Date: 星期三, 11 六月 2025 22:49:07 +0800
Subject: [PATCH] 动态溯源(待完成)

---
 src/views/realtimemode/RealtimeMode.vue |  111 ++++++++++++++++++++++++++++++++++++++-----------------
 1 files changed, 76 insertions(+), 35 deletions(-)

diff --git a/src/views/realtimemode/RealtimeMode.vue b/src/views/realtimemode/RealtimeMode.vue
index 240930d..c72f699 100644
--- a/src/views/realtimemode/RealtimeMode.vue
+++ b/src/views/realtimemode/RealtimeMode.vue
@@ -2,18 +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>
+      <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
@@ -21,6 +25,11 @@
       :factor-datas="factorDatas"
       :device-type="deviceType"
     ></RealTimeTrend>
+    <SourceTrace
+      class="source-trace"
+      v-model:factorType="factorType"
+    ></SourceTrace>
+    <UnderwayAdvice></UnderwayAdvice>
   </div>
 </template>
 
@@ -34,18 +43,32 @@
 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 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';
 
 // const mapAnimation = new MapAnimation();
 
+// 璋冭瘯妯″紡
+const mode = 'debug';
+// const mode = 'product';
+
 export default {
-  components: { DashBoard, RealTimeTrend, DeviceChange },
+  components: {
+    DashBoard,
+    RealTimeTrend,
+    DeviceChange,
+    SourceTrace,
+    UnderwayAdvice
+  },
   setup() {
     const { loading, fetchData } = useFetchData(10000);
     return { loading, fetchData };
@@ -60,7 +83,8 @@
       // 鏂拌幏鍙栫殑鐩戞祴鏁版嵁
       factorDatas: new FactorDatas(),
       // 鍏ㄩ儴鐩戞祴鏁版嵁
-      allFactorDatas: new FactorDatas()
+      allFactorDatas: new FactorDatas(),
+      pause: false
     };
   },
   watch: {
@@ -101,28 +125,44 @@
         // 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',
+                // startTime: '2025-01-20 12:40:00',
+                // startTime: '2024-12-27 08:30:00',
+                // startTime: '2024-12-13 16:35:00',
+                // startTime: '2024-11-27 11:50:41', // Pm, 涓窛绂诲伐鍦�
+                // startTime: '2024-08-30 15:28:00', // voc 杩戣窛绂绘苯淇�
+                startTime: '2024-07-23 15:22:00',
+                // startTime: '2024-07-23 14:39:00',
+                endTime: '2025-01-16 11:51:41',
+                page,
+                perPage: 10
+              }
+            : {
+                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);
         });
       });
+    },
+    pauseTask() {
+      this.pause = pauseTask();
     },
     clearFetchingTask() {
       clearFetchingTask();
@@ -133,14 +173,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) {
@@ -162,14 +203,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();
@@ -182,11 +218,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