# 更新marker显示逻辑

src/views/counter/device.vue

@@ -183,7 +183,7 @@ export default {
         console.log('Err: click map failed')
       })
       this.$store.dispatch('changeDeviceID', deviceID).then(() => {
-        this.$router.push('/counter/map')
+        this.$router.push({ path: '/counter/map', query: { device_id: deviceID }})
       }).catch(() => {
         console.log('Err: get device_id failed in device page')
       })

src/views/counter/map2.vue

@@ -22,28 +22,22 @@ export default {
       flag: false,
       mapClick: false,
       geo: [],
-      defaultPositions: [
-        {
-          title: '貝沙灣五期',
-          position: [114.137045, 22.254383],
-          count: 2207,
-          signal: 22,
-          energy: 4149
-        },
-        {
-          title: '貝沙灣二期',
-          position: [114.138051, 22.254208],
-          count: 262,
-          signal: 25,
-          energy: 4155
+      deviceList: [],
+      deviceListQuery: {
+        page: 1,
+        limit: 100
       }
-      ]
     }
   },
   methods: {
     sleep(time) {
       for (var temp = Date.now(); Date.now() - temp <= time;);
     },
+    async getDevices(params) {
+      await fetchDeviceList(params).then(response => {
+        this.deviceList = response.data.results
+      })
+    },
     gotoDriving() {
       this.$confirm('此操作将跳转到路线规划, 是否继续?', '提示', {
         confirmButtonText: '确定',
@@ -65,19 +59,21 @@ export default {
         })
       })
     },
-    initMap() {
+    async initMap() {
       this.map = new AMap.Map('map-container', {
         center: [114.143472, 22.284105],
         resizeEnable: true,
         zoom: 10
       })
       // 标记点测试数据
+      await this.getDevices(this.deviceListQuery)
       const markers = []
-      this.defaultPositions.forEach((item, index) => {
+      this.deviceList.forEach((item, index) => {
+        console.log(item)
         const marker = new AMap.Marker({
-          position: item.position,
+          position: item.coordinate,
           zIndex: 10,
-          title: item.title,
+          title: item.device_name,
           map: this.map
         })
         const infoWindow = this.instantiateInforWindow(item)
@@ -146,7 +142,7 @@ export default {
       const infoWindow = new AMap.InfoWindow({
         isCustom: true,
         closeWhenClickMap: true,
-        content: this.createInfoWindow(item.title, content.join('\n')),
+        content: this.createInfoWindow(item.device_name, content.join('\n')),
         offset: new AMap.Pixel(16, -45)
       })
       return infoWindow
@@ -219,7 +215,7 @@ export default {
         this.deviceList = response.data.results
         const item = this.deviceList[0]
         this.coordinate = item.coordinate
-        if (this.coordinate === null) {
+        if (!this.coordinate) {
           this.coordinate = [113.203460828994, 22.64902452257]
         }
         this.map = new AMap.Map('map-container', {
@@ -232,8 +228,6 @@ export default {
           zIndex: 10,
           map: this.map
         })
-
-        // item.title = '东岸灯饰工业区'
         item.title = item.device_name
         const infoWindow = this.instantiateInforWindow(item, true)
         AMap.event.addListener(marker, 'click', () => {
@@ -251,18 +245,16 @@ export default {
     }
   },
   created() {
-    this.mapClick = this.$store.getters.mapClick
-    // if (!this.mapClick) {
-    //   this.flag = true
-    // }
+    // this.mapClick = this.$store.getters.mapClick
   },
-  mounted() {
-    if (this.mapClick) {
-      const device_id = this.$store.getters.deviceID
+  async mounted() {
+    const device_id = this.$route.query.device_id
+    if (device_id) {
+      // const device_id = this.$store.getters.deviceID
       // this.sleep(2000)
       this.getDevicesInitMap({ device_id })
     } else {
-      this.initMap()
+      await this.initMap()
     }
   }
 }