Explorar el Código

修改TongzhouTrafficMap组件抛出地图路口点击事件

画安 hace 1 mes
padre
commit
c0f4f7ec83
Se han modificado 3 ficheros con 12 adiciones y 2 borrados
  1. 6 1
      src/components/TongzhouTrafficMap.vue
  2. 1 0
      src/views/Home.vue
  3. 5 1
      src/views/StatusMonitoring.vue

+ 6 - 1
src/components/TongzhouTrafficMap.vue

@@ -238,7 +238,12 @@ export default {
         }
       });
 
-      marker.on('click', (e) => this.openLightInfo(e.target.getExtData(), e.lnglat));
+      marker.on('click', (e) => {
+        this.openLightInfo(e.target.getExtData(), e.lnglat);
+        // 抛出地图路口点击事件
+        this.$emit('map-crossing-click', e.target.getExtData(), e.lnglat);
+      });
+      
       return marker;
     },
 

+ 1 - 0
src/views/Home.vue

@@ -235,6 +235,7 @@ export default {
       
       // 地图联动
       this.$refs.trafficMapRef.focusByLocation([Number(position[0]), Number(position[1])]);
+      
     },
     onIntersectionRowClick({ row, index }) {
       console.log(`准备跳转查看关键路口详情,当前路口:`, row.id, row.intersection);

+ 5 - 1
src/views/StatusMonitoring.vue

@@ -11,7 +11,7 @@
         <template #map>
             <!-- 地图 -->
             <TongzhouTrafficMap amapKey="db2da7e3e248c3b2077d53fc809be63f"
-                securityJsCode="a7413c674852c5eaf01d90813c5b7ef6" />
+                securityJsCode="a7413c674852c5eaf01d90813c5b7ef6" @map-crossing-click="handleMapCrossingClick" />
         </template>
 
         <template #left>
@@ -237,6 +237,10 @@ export default {
 
     },
     methods: {
+        // 处理地图点击事件
+        handleMapCrossingClick(mapData) {
+            console.log('父组件接收到了地图路口点击事件:', mapData);
+        },
         // 模式切换
         onViewSelect(item) {
             console.log('你点击了:', item.label);