Merge remote-tracking branch 'origin/master'

src/main/map/.prettierrc

@@ -0,0 +1,6 @@
+{
+    "semi": true,
+    "singleQuote": true,
+    "tabWidth": 4,
+    "trailingComma": "all"
+}

src/main/map/.prettierrc.js

@@ -1,6 +0,0 @@
-module.exports = {
-    semi: true,
-    singleQuote: true,
-    tabWidth: 4,
-		trailingComma: 'all',
-};

src/main/map/src/views/Home.vue

@@ -8,7 +8,6 @@ function getInfo(info) {
     console.log(info);
 }
 window.getInfo = getInfo;
-import { mapState } from 'vuex';
 import Marker from '../utils/Marker';
 import { getStatusInfo } from '../utils/OrderUtils';
 export default {
@@ -16,133 +15,83 @@ export default {
     data() {
         return {
             map: null,
-            orderInfo: null,
-            userLoaction: null,
-            merchantLoaction: null,
+            userMarker: null,
+            merchantMarKer: null,
+            riderMarKer: null,
+            center: null,
+            location: null,
+            merchantLocation: null,
+            riderLocation: null,
         };
     },
-    computed: {
-        ...mapState(['userInfo']),
-        center() {
-            if (
-                this.nowStatus.nowImgType === 'merchant' &&
-                this.merchantLoaction
-            ) {
-                return this.merchantLoaction;
-            } else if (
-                this.nowStatus.nowImgType === 'user' &&
-                this.userLoaction
-            ) {
-                return this.userLoaction;
-            } else {
-                return { lat: 40.02906301748584, lng: 116.25499991104516 };
-            }
-        },
-        userMarker() {
-            if (this.map && this.userLoaction) {
-                return new Marker({
-                    map: this.map,
-                    position: new TMap.LatLng(
-                        this.userLoaction.lat,
-                        this.userLoaction.lng,
-                    ),
-                    type: 'user',
-                    nowStatus: this.nowStatus,
-                });
-            }
-            return null;
-        },
-        merchantMarKer() {
-            if (this.map && this.merchantLoaction) {
-                return new Marker({
-                    map: this.map,
-                    position: new TMap.LatLng(
-                        this.merchantLoaction.lat,
-                        this.merchantLoaction.lng,
-                    ),
-                    type: 'merchant',
-                    nowStatus: this.nowStatus,
-                });
-            }
-            return null;
-        },
-        nowStatus() {
-            if (this.$route.query) {
-                return getStatusInfo(this.$route.query);
-            } else {
-                return null;
-            }
-        },
+    mounted() {
+        window.setLocation = this.setLocation;
     },
-    watch: {
-        '$route.query'() {
-            if (this.$route.query.location) {
-                this.userLoaction = {
-                    lat: this.$route.query.location.split(',')[1],
-                    lng: this.$route.query.location.split(',')[0],
-                };
-            }
-            if (this.$route.query.merchantLocation) {
-                this.merchantLoaction = {
-                    lat: this.$route.query.merchantLocation.split(',')[1],
-                    lng: this.$route.query.merchantLocation.split(',')[0],
-                };
+    methods: {
+        setLocation(orderInfo, location, merchantLocation, riderLocation) {
+            this.nowStatus = getStatusInfo(orderInfo);
+            this.location = location;
+            this.merchantLocation = merchantLocation;
+            this.riderLocation = riderLocation;
+
+            if (this.nowStatus.nowImgType === 'merchant' && merchantLocation) {
+                this.center = merchantLocation;
+            } else if (this.nowStatus.nowImgType === 'rider' && riderLocation) {
+                this.center = riderLocation;
+            } else {
+                this.center = location;
             }
 
             this.$nextTick(() => {
-                setTimeout(() => {
-                    this.initMap();
-                }, 1000);
+                this.initMap();
             });
         },
-    },
-    mounted() {
-        if (this.$route.query.location) {
-            this.userLoaction = {
-                lat: this.$route.query.location.split(',')[1],
-                lng: this.$route.query.location.split(',')[0],
-            };
-        }
-        if (this.$route.query.merchantLocation) {
-            this.merchantLoaction = {
-                lat: this.$route.query.merchantLocation.split(',')[1],
-                lng: this.$route.query.merchantLocation.split(',')[0],
-            };
-        }
-
-        this.$nextTick(() => {
-            setTimeout(() => {
-                this.initMap();
-            }, 1000);
-        });
-    },
-    methods: {
         initMap() {
             // 初始化地图
-            this.map = new TMap.Map('container', {
-                zoom: 15, // 设置地图缩放级别
-                center: new TMap.LatLng(this.center.lat, this.center.lng), // 设置地图中心点坐标
-                doubleClickZoom: false,
-            });
-            let donutList = [
-                this.userMarker,
-                this.merchantMarKer,
-                new Marker({
-                    map: this.map,
-                    position: new TMap.LatLng(
-                        40.02906301748584,
-                        116.25499991104516,
-                    ),
-                    type: 'rider',
-                    nowStatus: this.nowStatus,
-                }),
-            ];
-            donutList.forEach((donut, index) => {
-                donut.on('click', () => {
-                    console.log(
-                        `第${index}个环形图被点击，位置为${donut.position}`,
-                    );
+            if (!this.map) {
+                this.map = new TMap.Map('container', {
+                    zoom: 15, // 设置地图缩放级别
+                    center: new TMap.LatLng(this.center.lat, this.center.lng), // 设置地图中心点坐标
+                    doubleClickZoom: false,
                 });
+            } else {
+                this.map.setCenter(
+                    new TMap.LatLng(this.center.lat, this.center.lng),
+                );
+            }
+
+            if (this.userMarker) {
+                this.userMarker.setMap(null);
+            }
+            this.userMarker = new Marker({
+                map: this.map,
+                position: new TMap.LatLng(this.location.lat, this.location.lng),
+                type: 'user',
+                nowStatus: this.nowStatus,
+            });
+            if (this.merchantMarKer) {
+                this.merchantMarKer.setMap(null);
+            }
+            this.merchantMarKer = new Marker({
+                map: this.map,
+                position: new TMap.LatLng(
+                    this.merchantLocation.lat,
+                    this.merchantLocation.lng,
+                ),
+                type: 'merchant',
+                nowStatus: this.nowStatus,
+            });
+            if (this.riderMarKer) {
+                this.riderMarKer.setMap(null);
+            }
+            this.riderMarKer = new Marker({
+                map: this.map,
+                position: new TMap.LatLng(
+                    this.riderLocation.lat,
+                    this.riderLocation.lng,
+                ),
+                type: 'rider',
+                nowStatus: this.nowStatus,
             });
         },
     },