From c2ab0aa8f2acf0b2e7900a643a2f63e86a226cde Mon Sep 17 00:00:00 2001
From: zhanghao <774378400@qq.com>
Date: Wed, 5 Aug 2026 17:34:17 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../cockpit/components/MapOverview.vue        | 78 ++++++++++++++++---
 1 file changed, 67 insertions(+), 11 deletions(-)

diff --git a/src/views/inspection/cockpit/components/MapOverview.vue b/src/views/inspection/cockpit/components/MapOverview.vue
index 40d97b4..f99b580 100644
--- a/src/views/inspection/cockpit/components/MapOverview.vue
+++ b/src/views/inspection/cockpit/components/MapOverview.vue
@@ -71,9 +71,12 @@
             <!-- <div class="split-line"></div> -->
             <div class="alarm-container">
                 <div class="container-title">告警记录</div>
-                <div class="alarm-box" v-for="item, index in 2">
-                    <div class="title">#01 检测到异常噪声</div>
-                    <div class="alarm-info">14:28:33 — 厂区A 东侧走廊</div>
+                <div class="alarm-box" v-for="item, index in alarmRecord">
+                    <div class="alarm-title" :class="item.resultStatus">
+                        <div class="title">{{ item.resultName }}</div>
+                        <div class="status">{{ getOptionLabel(resultStatusOptions, item.resultStatus) }}</div>
+                    </div>
+                    <div class="alarm-info">{{ item.createTime }}</div>
                 </div>
             </div>
         </div>
@@ -86,8 +89,7 @@ import MapCanvas from "./MapCanvas.vue";
 import { onMounted, onUnmounted } from "vue";
 import { getRobotList } from '@/api/inspection/robot'
 import { getRunTaskList } from '@/api/inspection/runTask'
-
-console.log('sss', import.meta.env.VITE_INSPECTION_TYPE)
+import { getInspectionResultList } from '@/api/inspection/result'
 
 const robotList = ref([])
 const robotStatus = {
@@ -110,7 +112,7 @@ const getRobot = async () => {
 
     if (res.code === 200) {
         robotList.value = res.rows
-        // getRobot()
+        getRobot()
     }
 }
 
@@ -161,9 +163,31 @@ const centerCanvasView = () => {
     }
 }
 
+const alarmRecord = ref([])
+const resultStatusOptions = [
+  { label: '待处理', value: 'PENDING' },
+  { label: '正常', value: 'NORMAL' },
+  { label: '异常', value: 'ABNORMAL' },
+  { label: '识别失败', value: 'RECOGNIZE_FAILED' }
+]
+const getAlarmRecord = async () => { 
+    const res = await getInspectionResultList({
+        pageNum: 1,
+        pageSize: 10
+    })
+    if (res.code === 200) {
+        alarmRecord.value = res.rows
+    }
+}
+
+const getOptionLabel = (options, value) => {
+  return options.find(item => item.value === value)?.label || value || '-'
+}
+
 onMounted(() => {
     getRobot()
     getRunningTask()
+    getAlarmRecord()
 })
 </script>
 
@@ -387,13 +411,45 @@ onMounted(() => {
                 padding: 16px;
                 margin-bottom: 16px;
 
-                .title {
-                    color: #FF6B6B;
-                    font-size: 14px;
-                    font-family: Inter;
-                    font-weight: bold;
+                .alarm-title {
+                    display: flex;
+                    justify-content: space-between;
+
+                    .title {
+                        font-size: 14px;
+                        font-family: Inter;
+                        font-weight: bold;
+                    }
+
+                    .status {
+                        font-size: 12px;
+                        border-radius: 12px;
+                        padding: 0 8px;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                    }
                 }
 
+                .NORMAL {
+                    color: #00D4FF;
+                }
+
+                .ABNORMAL {
+                    color: #FF6B6B;
+                }
+
+                .PENDING {
+                    color: #8899BB;
+                }
+
+                .RECOGNIZE_FAILED {
+                    color: #FF6B6B;
+                    font-size: 12px;
+                }
+
+                
+
                 .alarm-info {
                     margin: 10px 0;
                     font-size: 12px;