Просмотр исходного кода

故障报警模块:修复点击查看定位不准的问题

  - 地图组件 storeStatusCoordsToLocalStorage 改为同时存储完整路口信息(名称+坐标+告警类型),生成 alarmListFromMap 到
  localStorage
  - Home.vue fetchPageData 优先读取地图生成的告警数据,确保列表显示与地图点位完全匹配
画安 недель назад: 3
Родитель
Сommit
e09b3d29e4
2 измененных файлов с 46 добавлено и 31 удалено
  1. 31 26
      src/components/TongzhouTrafficMap.vue
  2. 15 5
      src/views/Home.vue

+ 31 - 26
src/components/TongzhouTrafficMap.vue

@@ -933,35 +933,40 @@ export default {
       this.legendVisible = !this.legendVisible;
     },
 
-    // 按4:4:4比例提取故障、离线、降级坐标点并存储到localStorage
+    // 按4:4:4比例提取故障、离线、降级路口信息并存储到localStorage
     storeStatusCoordsToLocalStorage() {
-      // 从分类好的路口数据中获取故障、离线、降级的坐标
-      const faultCoords = (this.statusIntersections["故障"] || []).slice(0, 4).map(item => [
-        item["位置-经度"],
-        item["位置-纬度"]
-      ]).filter(coord => coord[0] && coord[1]);
-
-      const offlineCoords = (this.statusIntersections["离线"] || []).slice(0, 4).map(item => [
-        item["位置-经度"],
-        item["位置-纬度"]
-      ]).filter(coord => coord[0] && coord[1]);
-
-      const degradedCoords = (this.statusIntersections["降级"] || []).slice(0, 4).map(item => [
-        item["位置-经度"],
-        item["位置-纬度"]
-      ]).filter(coord => coord[0] && coord[1]);
-
-      // 组合成12个元素的数组
-      const statusCoords = [...faultCoords, ...offlineCoords, ...degradedCoords];
-
-      // 存储到localStorage
-      statusCoords.forEach((coords, index) => {
-        if (coords && coords.length === 2) {
-          localStorage.setItem(`pos${index + 1}`, coords.join(','));
-        }
+      const alarmTypes = [
+        { status: "故障", titles: ["通讯中断", "灯组故障", "相位冲突", "绿冲突"], level: "high", type: "error" },
+        { status: "离线", titles: ["信号机离线", "信号机离线", "通讯中断", "检测器异常"], level: "mid", type: "warning" },
+        { status: "降级", titles: ["降级黄闪", "降级黄闪", "方案切换异常", "检测器异常"], level: "mid", type: "warning" },
+      ];
+
+      const alarmList = [];
+      let id = 1;
+
+      alarmTypes.forEach(({ status, titles, level, type }) => {
+        (this.statusIntersections[status] || []).slice(0, 4).forEach((item, i) => {
+          const lng = item["位置-经度"];
+          const lat = item["位置-纬度"];
+          const name = item["路口名称"] || "";
+          if (!lng || !lat) return;
+          alarmList.push({
+            id: `A${String(id).padStart(3, "0")}`,
+            title: titles[i] || titles[0],
+            loc: name,
+            level,
+            type,
+            description: `${name}-${titles[i] || titles[0]}`,
+            position: [lng, lat],
+          });
+          // 保持原有的 pos1-pos12 存储,兼容其他可能的引用
+          localStorage.setItem(`pos${id}`, `${lng},${lat}`);
+          id++;
+        });
       });
 
-      console.log('状态坐标已存储到localStorage');
+      localStorage.setItem("alarmListFromMap", JSON.stringify(alarmList));
+      console.log('状态坐标及告警数据已存储到localStorage');
     },
     // 公开方法:将经纬度转换为像素坐标
     lngLatToPixel(lng, lat) {

+ 15 - 5
src/views/Home.vue

@@ -196,11 +196,21 @@ export default {
       ]);
       this.controlInfoData = controlData || [];
       
-      // 处理故障报警数据,使用从API获取的12条数据
-      let originalAlarms = alarmData?.list || alarmData || [];
-      
-      // 组合成12条数据
-      this.alarmData = originalAlarms;
+      // 优先使用地图生成的告警数据(与地图点位完全匹配)
+      const mapAlarms = localStorage.getItem('alarmListFromMap');
+      if (mapAlarms) {
+        try {
+          const parsed = JSON.parse(mapAlarms);
+          this.alarmData = parsed.map((a, i) => ({
+            ...a,
+            time: new Date(Date.now() - i * 180000).toLocaleTimeString(),
+          }));
+        } catch (e) {
+          this.alarmData = alarmData?.list || alarmData || [];
+        }
+      } else {
+        this.alarmData = alarmData?.list || alarmData || [];
+      }
       
       this.tableData = taskData?.list || taskData || [];
       this.keyIntersectionData = keyData || [];