2025年04月29日09:47:14

src/layout/index.vue

@@ -50,20 +50,20 @@ const onMessage = (res) => {
 };
 
 onMounted(() => {
-  const isReload = localStorage.getItem("isReload");
-  if (isReload !== "true") {
-    ElMessageBox.alert("由于浏览器安全策略，用户必须点击屏幕才能播放告警声音", "提示", {
-      confirmButtonText: "OK",
-      callback: () => {
-        localStorage.setItem("isReload", "true");
-      },
-    });
-  }
+  // const isReload = localStorage.getItem("isReload");
+  // if (isReload !== "true") {
+  //   ElMessageBox.alert("由于浏览器安全策略，用户必须点击屏幕才能播放告警声音", "提示", {
+  //     confirmButtonText: "OK",
+  //     callback: () => {
+  //       localStorage.setItem("isReload", "true");
+  //     },
+  //   });
+  // }
 
-  if (ws.socket == null) {
-    ws.connect();
-  }
-  ws.onMessage(onMessage);
+  // if (ws.socket == null) {
+  //   ws.connect();
+  // }
+  // ws.onMessage(onMessage);
 
   window.addEventListener("beforeunload", handleBeforeUnload);
 });

src/utils/mapCustom.js

@@ -106,39 +106,34 @@ export class MapCustom {
   newIcon(option) {
     let data = {
       size: new AMap.Size(36, 42),
-      image: '', // Icon的图像
+      image: option.image, // Icon的图像
       imageSize: new AMap.Size(36, 42)
     }
-    if (typeof option == 'string') {
-      data.image = option
-    } else {
-      data = {
-        image: option.image, // Icon的图像
-        size: new AMap.Size(option.size[0], option.size[1]),
-        imageSize: new AMap.Size(option.size[0], option.size[1]),
-      }
+    if (option.size) {
+      data.size = new AMap.Size(option.size[0], option.size[1])
+      data.imageSize = new AMap.Size(option.size[0], option.size[1])
     }
     return new AMap.Icon({ ...data })
   }
   // 创建marker
-  marker({ icon, position, offset }) {
+  marker(option) {
     return new AMap.Marker({
-      icon,
-      position,
       map: this.map,
       offset: new AMap.Pixel(-13, -26),
+      ...option
     })
   }
   lngLat(lng, lat) {
     return new AMap.LngLat(lng, lat);
   }
-  infoWindow(option = {
+  infoWindow(option) {
+    return new AMap.InfoWindow({
       anchor: 'bottom-center',
-    isCustom: true, //使用自定义窗体
+      isCustom: true,
       content: document.querySelector('.infoBox'),
       offset: new AMap.Pixel(-2, -40),
-  }) {
-    return new AMap.InfoWindow(option)
+      ...option
+    })
 
   }
   //绘制轨迹线条

src/views/incidentDispose/index.vue

@@ -281,7 +281,7 @@ const getData = async () => {
 
     map.clearMap();
     map.setCenter([res.lng, res.lat]);
-    let icon = map.newIcon(location);
+    let icon = map.newIcon({ image: location });
     let marker = map.marker({ icon, position: [res.lng, res.lat] });
     marker.setMap(map.map);
     marker.on("click", () => {

src/views/monitoringCenter/deviceLocationMap.vue

@@ -62,11 +62,11 @@ const getLocateRecord = () => {
       list.forEach((item, index) => {
         let marker: any = "";
         if (index == 0) {
-          marker = newMap.marker({ icon: startIcon, position: [item.lng, item.lat] });
+          marker = newMap.marker({ icon: startIcon, position: [item.lng, item.lat], zIndex: 13 });
         } else if (index == list.length - 1) {
-          marker = newMap.marker({ icon: endIcon, position: [item.lng, item.lat] });
+          marker = newMap.marker({ icon: endIcon, position: [item.lng, item.lat], zIndex: 13 });
         } else {
-          marker = newMap.marker({ icon: ViaIcon, position: [item.lng, item.lat] });
+          marker = newMap.marker({ icon: ViaIcon, position: [item.lng, item.lat], zIndex: 12 });
         }
         marker.setMap(newMap.map);
         marker.on("click", () => {

src/views/synthesizeManage/mapLocation/index.vue

@@ -68,8 +68,10 @@ import { locateRecord } from "@/api";
 import { format } from "@/utils";
 import { TLocateRecord } from "@/api/index.d";
 import { useRoute } from "vue-router";
-import location from "@/assets/img/location.png";
 import InfoWindow from "@/components/InfoWindow.vue";
+import ViaMarker from "@/assets/img/via-marker.png";
+import endMarker from "@/assets/img/end-marker.png";
+import startMarker from "@/assets/img/start-marker.png";
 
 const { query } = useRoute();
 let d = new Date();
@@ -105,9 +107,28 @@ const getLocateRecord = () => {
       newMap.clearMap();
       newMap.setCenter([list[0].lng, list[0].lat]);
       newMap.polyline(list);
-      let icon = newMap.newIcon(location);
-      list.forEach((item) => {
-        let marker = newMap.marker({ icon, position: [item.lng, item.lat] });
+      let startIcon = newMap.newIcon({
+        image: startMarker,
+        size: [20, 29],
+      });
+      let endIcon = newMap.newIcon({
+        image: endMarker,
+        size: [20, 29],
+      });
+      let ViaIcon = newMap.newIcon({
+        image: ViaMarker,
+        size: [20, 29],
+      });
+
+      list.forEach((item, index) => {
+        let marker: any = "";
+        if (index == 0) {
+          marker = newMap.marker({ icon: startIcon, position: [item.lng, item.lat], zIndex: 13 });
+        } else if (index == list.length - 1) {
+          marker = newMap.marker({ icon: endIcon, position: [item.lng, item.lat], zIndex: 13 });
+        } else {
+          marker = newMap.marker({ icon: ViaIcon, position: [item.lng, item.lat], zIndex: 12 });
+        }
         marker.setMap(newMap.map);
         marker.on("click", () => {
           deviceInfo.value = item;