Merge branch 'master' of http://gitlab.oytour.com/luochao/superman

src/components/newTravelmanager/TravelGroupControl/tripmap.vue

@@ -241,7 +241,7 @@ export default {
 
           this.TripMapList.push(JSON.parse(JSON.stringify(obj)));
         }
-        console.log(this.TripMapList, "----TripMapList");
+        // console.log(this.TripMapList, "----TripMapList");
       },
       deep: true,
       immediate: true
@@ -249,6 +249,7 @@ export default {
   },
   computed: {},
   mounted() {
+    // 日本随机背景色
     this.setPaintRbBgList()
     this.initMap();
   },
@@ -309,6 +310,7 @@ export default {
       this.TripMapList.forEach(x => {
         let obj = {
           MName: x.MName,
+          name: x.MName,
           MId: x.MId,
           ColorStr: x.ColorStr,
           Lng: x.Lng,
@@ -366,7 +368,6 @@ export default {
           this.SearchCity(x.MId);
         }
       });
-      console.log(this.countriesData,'------=====')
     },
     // 清除已有源
     ClearSource(Id,type){
@@ -410,9 +411,11 @@ export default {
         bounds.extend([city.longitude, city.latitude]);
       });
       this.map.fitBounds(bounds,{
-      padding: 150, // 可选：在地图边界周围添加一些内边距
-    });
-      // this.map.setCenter(bounds.getCenter());
+        padding: 150, // 可选：在地图边界周围添加一些内边距
+      });
+      if(this.countriesData&&this.countriesData.length>0&&this.countriesData.length==1){
+        this.map.setCenter(bounds.getCenter());
+      }
       this.addMarker(); //标记
       this.createLineHandler(); //连线
       await this.addCountriesMaker(); //标记国家
@@ -429,12 +432,12 @@ export default {
           }
         });
       });
-      this.countriesData.forEach(y => {
-        if (x.MName == y.name) {
-          x.Lng = y.Lng;
-            x.Lat = y.Lat;
-          }
-        });
+      // this.countriesData.forEach(y => {
+      //   if (x.MName == y.name) {
+      //     x.Lng = y.Lng;
+      //       x.Lat = y.Lat;
+      //     }
+      //   });
       });
       this.dataAll.TripMapList = JSON.parse(JSON.stringify(this.TripMapList));
     },
@@ -625,8 +628,8 @@ export default {
     addCountryFillRange() {
       let that = this
       this.countriesData.forEach((x, i) => {
-        if (x.MName == "中国") x.MName = "中华人民共和国";
-        if (x.MName == "韩国") x.MName = "大韩民国";
+        if (x.MName == "中国") x.name = "中华人民共和国";
+        if (x.MName == "韩国") x.name = "大韩民国";
         x.CityListAll.forEach(y=>{
 
         })
@@ -653,7 +656,7 @@ export default {
           id: "world-layer-" + x.MId,
           type: "fill",
           source: source,
-          filter: ["==", "NAME_ZH", x.MName]
+          filter: ["==", "NAME_ZH", x.name]
         });
         if(x.MId!=651&&x.MId!=891) {
           that.ClearSource("mapLayer-" + x.MId,1)
@@ -661,7 +664,7 @@ export default {
           this.map.setPaintProperty("world-layer-" + x.MId, "fill-color",[
             "match",
             ["get", "NAME_ZH"],
-            x.MName,
+            x.name,
             x.ColorStr, // 选定的国家颜色
             ["rgba", 0, 122, 255, 0]
           ]);
@@ -671,7 +674,7 @@ export default {
             id: "mapLayer-"+ x.MId,
             type: "fill",
             source: source,
-            filter: ["==", "NAME_ZH", x.MName],
+            filter: ["==", "NAME_ZH", x.name],
           });
           this.map.addLayer({
             id: "mapLayerId-"+ x.MId,
@@ -890,37 +893,36 @@ export default {
       }
     },
     async addCountriesMaker() {
-      console.log(this.countriesData,'-----------1111')
       let that = this;
       await Promise.all(
         this.countriesData.map(async (x, i) => {
           let result;
           if (x.Lng && x.Lat) {
-            // console.log(x.Lng, "====");
             result = [x.Lng, x.Lat];
           } else {
-            // console.log(x.Lng, "22222====");
-            result = await this.getCountryCoordinates(x.MName);
+            result = await this.getCountryCoordinates(x.name);
           }
           if (result && result.length == 2) {
             let el = document.createElement("div");
             el.style.fontSize = "30px";
             el.style.fontWeight = "bold";
             el.style.color = "rgba(0,0,0,0.4)";
-            el.innerHTML = x.MName;
+            el.innerHTML = x.name;
             var marker = new mapboxgl.Marker(el, {
               offset: [0, 0],
               draggable: true
             });
             marker.setLngLat(result);
             marker.addTo(this.map);
+            let currentMarkerLngLat = marker.getLngLat();
+            let TripMapList = that.TripMapList.filter(y=> y.MName==x.MName)
+            TripMapList[0].Lng = currentMarkerLngLat.lng;
+            TripMapList[0].Lat = currentMarkerLngLat.lat;
             marker.on("dragend", function() {
-              let currentMarkerLngLat = marker.getLngLat();
-              x.Lng = currentMarkerLngLat.lng;
-              x.Lat = currentMarkerLngLat.lat;
-              console.log(x.MName,'=====')
-              let TripMapList = that.TripMapList.filter(y=>y.MName==x.MName)
-              console.log(TripMapList,'--------')
+              currentMarkerLngLat = marker.getLngLat();
+              TripMapList = that.TripMapList.filter(y=> y.MName==x.MName)
+              TripMapList[0].Lng = currentMarkerLngLat.lng;
+              TripMapList[0].Lat = currentMarkerLngLat.lat;
             });
             this.countriesMarkers.push(marker);
           }