首页执法队员调用接口

.env.production

@@ -5,4 +5,4 @@ VUE_APP_TITLE = 城市精细化管理监测主题
 ENV = 'production'
 
 # 若依管理系统/生产环境
-VUE_APP_BASE_API = 'http://39.101.188.84:9029'
+VUE_APP_BASE_API = 'http://39.101.188.84:9037'

src/assets/styles/leaflet.scss

@@ -432,4 +432,25 @@
 //   -moz-filter: invert(1) grayscale(0) saturate(0.5) brightness(1.6) opacity(1) hue-rotate(334deg) sepia(10%) !important;
 // filter: invert(1) grayscale(0) saturate(0.5) brightness(1.6) opacity(1) hue-rotate(10deg) sepia(100%) !important;
 // filter: invert(1) grayscale(0) saturate(0.5) brightness(1.6) opacity(1) hue-rotate(195deg) !important;
-// }
+// }
+// 执法人员icon
+.divIcon-marker {
+  .markers {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .marker-title {
+      width: 100%;
+      height: 100%;
+      text-align: center;
+      padding: 5px;
+      font-size: 14px;
+      font-family: Source Han Sans CN, Source Han Sans CN;
+      font-weight: 500;
+      color: #FFFFFF;
+      line-height: 20px;
+      background-image: url('../images/personInfo.png');
+      background-size: 100% 100%;
+    }
+  }
+}

src/views/bigScreen/map/index.vue

@@ -503,6 +503,7 @@ export default {
     },
     // 执法人员点位
     getTem(){
+      this.personLine = [];
       getDeviceList({imei:'861316060217211'}).then(res=>{
         console.log('res0',res);
         let obj = [];
@@ -527,12 +528,21 @@ export default {
         this.addMark(obj);
       })
     },
+    getIcons(name,src){
+      let icon = L.divIcon({
+        className: 'divIcon-marker',
+        html: `<div class="markers"><div class="marker-title">${name}</div><img src="${src}" /></div>`,
+        iconSize: [100, 50],
+      });
+      return icon
+    },
     addMark(obj) {
       this.mapEvent.mapEvent1.clearLayers();
-      let ico1 = L.icon({
+      let ico1 = require("../../../assets/images/icon/icon1.png")
-        iconUrl: require("../../../assets/images/icon/icon1.png"),
+      // let ico1 = L.icon({
-        iconSize: [52, 81],
+      //   iconUrl: require("../../../assets/images/icon/icon1.png"),
-      });
+      //   iconSize: [52, 81],
+      // });
       let ico2 = L.icon({
         iconUrl: require("../../../assets/images/icon/icon2.png"),
         iconSize: [44, 91],
@@ -556,7 +566,7 @@ export default {
               lng: item.longitude,
               lat: item.latitude,
             },
-            { icon: ico1 }
+            { icon: this.getIcons(item.userName,ico1) }
           )
             .bindPopup(
               `
@@ -1110,7 +1120,11 @@ export default {
     // 切换地图事件
     changeMap(id) {
       this.actionMap = id;
-      this.addMark();
+      if(id == 1) {
+        this.getTem();
+      } else {
+        this.addMark();
+      }
       // switch (id) {
       //   case 1:
       //     this.addMark("执法人员");