From 9256fa50b31dc47862fc0539dc340813164483e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Fri, 6 Jun 2025 15:33:35 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=9C=8B=E6=9D=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AlmModal/index.vue | 206 ++++++++++++++++--------------
 1 file changed, 109 insertions(+), 97 deletions(-)

diff --git a/src/components/AlmModal/index.vue b/src/components/AlmModal/index.vue
index 2b84064..da13d04 100644
--- a/src/components/AlmModal/index.vue
+++ b/src/components/AlmModal/index.vue
@@ -1,14 +1,14 @@
 <template>
   <div>
     <el-dialog
-      title="⚠️ 实时告警通知"
-      :visible.sync="realtimeAlarmDialog"
-      width="900px"
-      append-to-body
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      class="realtime-alarm-dialog"
-      @close="closeRealtimeAlarmDialog"
+        title="⚠️ 实时告警通知"
+        :visible.sync="realtimeAlarmDialog"
+        width="900px"
+        append-to-body
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        class="realtime-alarm-dialog"
+        @close="closeRealtimeAlarmDialog"
     >
       <el-tabs v-model="realtimeActiveTab" type="card">
         <!-- 告警详情标签页 -->
@@ -39,15 +39,15 @@
               <h3 class="section-title">📋 告警内容详情</h3>
               <div class="alarm-contents">
                 <div
-                  v-for="(content, index) in currentRealtimeAlarm.alarmContents"
-                  :key="index"
-                  class="content-item"
+                    v-for="(content, index) in currentRealtimeAlarm.alarmContents"
+                    :key="index"
+                    class="content-item"
                 >
                   <el-alert
-                    :title="content"
-                    type="error"
-                    :closable="false"
-                    show-icon
+                      :title="content"
+                      type="error"
+                      :closable="false"
+                      show-icon
                   />
                 </div>
               </div>
@@ -58,10 +58,10 @@
               <h3 class="section-title">🔎 故障预测内容 </h3>
               <div class="alarm-contents">
                 <el-alert
-                  :title="PredictionContent()"
-                  type="warning"
-                  :closable="false"
-                  show-icon
+                    :title="PredictionContent()"
+                    type="warning"
+                    :closable="false"
+                    show-icon
                 />
               </div>
             </div>
@@ -72,10 +72,10 @@
         <el-tab-pane label="处置措施" name="realtimeActionSteps">
           <div v-if="currentRealtimeAlarm">
             <el-alert
-              :title="`设备：${currentRealtimeAlarm.monitorId} | 告警时间：${formatAlarmTime(currentRealtimeAlarm.recordTime)}`"
-              type="warning"
-              :closable="false"
-              style="margin-bottom: 20px;"
+                :title="`设备：${currentRealtimeAlarm.monitorId} | 告警时间：${formatAlarmTime(currentRealtimeAlarm.recordTime)}`"
+                type="warning"
+                :closable="false"
+                style="margin-bottom: 20px;"
             />
 
             <div v-loading="realtimeActionStepsLoading">
@@ -86,12 +86,12 @@
               <div v-else>
                 <el-timeline>
                   <el-timeline-item
-                    v-for="(step, index) in realtimeActionSteps"
-                    :key="step.objId"
-                    :timestamp="`步骤 ${step.stepSequence}`"
-                    placement="top"
-                    type="primary"
-                    size="large"
+                      v-for="(step, index) in realtimeActionSteps"
+                      :key="step.objId"
+                      :timestamp="`步骤 ${step.stepSequence}`"
+                      placement="top"
+                      type="primary"
+                      size="large"
                   >
                     <el-card class="step-card">
                       <div slot="header" class="clearfix">
@@ -108,10 +108,10 @@
                         <div class="images-title">参考图片：</div>
                         <div class="image-gallery">
                           <div
-                            v-for="image in step.stepImages"
-                            :key="image.objId"
-                            class="image-item"
-                            @click="previewImage(getFullImageUrl(image.imageUrl))"
+                              v-for="image in step.stepImages"
+                              :key="image.objId"
+                              class="image-item"
+                              @click="previewImage(getFullImageUrl(image.imageUrl))"
                           >
                             <img :src="getFullImageUrl(image.imageUrl)" :alt="image.description"/>
                             <div v-if="image.description" class="image-desc">{{ image.description }}</div>
@@ -134,15 +134,20 @@
 
       <div slot="footer" class="dialog-footer">
         <el-button
-          @click="closeRealtimeAlarmDialog"
-          :loading="alarmProcessing"
+            @click="toIndex"
+        >
+          返回首页
+        </el-button>
+        <el-button
+            @click="closeRealtimeAlarmDialog"
+            :loading="alarmProcessing"
         >
           稍后处理
         </el-button>
         <el-button
-          type="primary"
-          @click="processRealtimeAlarm"
-          :loading="alarmProcessing"
+            type="primary"
+            @click="processRealtimeAlarm"
+            :loading="alarmProcessing"
         >
           我已处理
         </el-button>
@@ -189,65 +194,65 @@ export default {
         })
       }
     })
-    // setInterval(() => {
-    //   let e = {
-    //     "monitorId": "T0002_0101",
-    //     "isFlag": 1,
-    //     "deviceParam": {
-    //       "objid": 1927987087563427800,
-    //       "monitorId": "T0002_0101",
-    //       "temperature": 27.68,
-    //       "humidity": 0,
-    //       "illuminance": 0,
-    //       "noise": 0,
-    //       "concentration": 0,
-    //       "VibrationSpeed": 0,
-    //       "VibrationDisplacement": 0,
-    //       "VibrationAcceleration": 0,
-    //       "VibrationTemp": 0,
-    //       "collectTime": "2024-09-03T04:47:06",
-    //       "recordTime": "2025-05-29T15:15:16.3016212+08:00"
-    //     },
-    //     "alarmRules": [
-    //       {
-    //         "objid": 30020,
-    //         "monitorId": "T0002_0101 ",
-    //         "ruleId": null,
-    //         "ruleName": "T0002_0101 表的温度大于阈值 20",
-    //         "triggerRule": 0,
-    //         "monitorField": 0,
-    //         "triggerValue": 20,
-    //         "cause": "温度过高-备注",
-    //         "alarmId": 202506051636001,
-    //       },
-    //       {
-    //         "objid": 30021,
-    //         "monitorId": "T0002_0101 ",
-    //         "ruleId": null,
-    //         "ruleName": "T0002_0101表的温度小于阈值 30",
-    //         "triggerRule": 1,
-    //         "monitorField": 0,
-    //         "triggerValue": 30,
-    //         "cause": "温度过低-备注",
-    //         "alarmId": 202506051636001,
-    //       }
-    //     ],
-    //     "alarmContents": [
-    //       "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101 表的温度大于阈值 20异常告警,告警规则:大于,阈值:20.00,详细信息:温度过高-备注",
-    //       "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101表的温度小于阈值 30异常告警,告警规则:小于,阈值:30.00,详细信息:温度过低-备注"
-    //     ],
-    //     "recordTime": 1748566080572
-    //   }
-    //
-    //   if (e.alarmContents.length > 0) {
-    //     e.alarmRules.forEach((item, index) => {
-    //       if (!this.almData.find(v => v.monitorId === e.monitorId && v.alarmRules[0].objid === item.objid)) {
-    //         this.almData.push({...e, alarmRules: [item], alarmContents: [e.alarmContents[index]], isWaiting: false})
-    //       }
-    //     })
-    //   }
-    //
-    // }, 3000)
+    setInterval(() => {
+      let e = {
+        "monitorId": "T0002_0101",
+        "isFlag": 1,
+        "deviceParam": {
+          "objid": 1927987087563427800,
+          "monitorId": "T0002_0101",
+          "temperature": 27.68,
+          "humidity": 0,
+          "illuminance": 0,
+          "noise": 0,
+          "concentration": 0,
+          "VibrationSpeed": 0,
+          "VibrationDisplacement": 0,
+          "VibrationAcceleration": 0,
+          "VibrationTemp": 0,
+          "collectTime": "2024-09-03T04:47:06",
+          "recordTime": "2025-05-29T15:15:16.3016212+08:00"
+        },
+        "alarmRules": [
+          {
+            "objid": 30020,
+            "monitorId": "T0002_0101 ",
+            "ruleId": null,
+            "ruleName": "T0002_0101 表的温度大于阈值 20",
+            "triggerRule": 0,
+            "monitorField": 0,
+            "triggerValue": 20,
+            "cause": "温度过高-备注",
+            "alarmId": 202506051636001,
+          },
+          {
+            "objid": 30021,
+            "monitorId": "T0002_0101 ",
+            "ruleId": null,
+            "ruleName": "T0002_0101表的温度小于阈值 30",
+            "triggerRule": 1,
+            "monitorField": 0,
+            "triggerValue": 30,
+            "cause": "温度过低-备注",
+            "alarmId": 202506051636001,
+          }
+        ],
+        "alarmContents": [
+          "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101 表的温度大于阈值 20异常告警,告警规则:大于,阈值:20.00,详细信息:温度过高-备注",
+          "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101表的温度小于阈值 30异常告警,告警规则:小于,阈值:30.00,详细信息:温度过低-备注"
+        ],
+        "recordTime": 1748566080572
+      }
+
+      if (e.alarmContents.length > 0) {
+        e.alarmRules.forEach((item, index) => {
+          if (!this.almData.find(v => v.monitorId === e.monitorId && v.alarmRules[0].objid === item.objid)) {
+            this.almData.push({...e, alarmRules: [item], alarmContents: [e.alarmContents[index]], isWaiting: false})
+          }
+        })
+      }
+
+    }, 3000)
   },
   watch: {
     almData: {
@@ -472,6 +477,13 @@ export default {
       } else {
         return ''
       }
+    },
+    toIndex() {
+      let data = this.currentRealtimeAlarm
+      let index = this.almData.findIndex(v => v.monitorId === data.monitorId && v.alarmRules[0].objid === data.alarmRules[0].objid)
+
+      this.$set(this.almData[index], 'isWaiting', true)
+      this.$router.push('/')
     }
   }
 }