fix map bugs when page loaded in list view (V8-2716)

components/Ui/Map/Structures.vue

@@ -63,6 +63,11 @@ export default Vue.extend({
       type: Array as () => Array<Structure>,
       required: false,
       default: () => []
+    },
+    zoomAtStart: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
   data () {
@@ -77,7 +82,7 @@ export default Vue.extend({
         { src: '/images/la_reunion.png', alt: 'La Réunion', bounds: [[-20.65, 54.92], [-21.65, 56.15]] },
         { src: '/images/guyane.png', alt: 'Guyane', bounds: [[6.24, -54.62], [1.87, -50.59]] }
       ],
-      zoomRequired: false
+      zoomRequired: this.zoomAtStart
     }
   },
   watch: {
@@ -87,11 +92,7 @@ export default Vue.extend({
       }
 
       if (this.zoomRequired) {
-        const zoomed = this._fitBoundsToMarkers()
-        if (!zoomed) {
-          this.setMapBounds(this.defaultBounds)
-        }
-        this.zoomRequired = false
+        this._applyZoom()
       }
     }
   },
@@ -112,6 +113,10 @@ export default Vue.extend({
     this.map.on('zoomend moveend', () => {
       this.$emit('boundsUpdated', this.map.getBounds())
     })
+
+    if (this.zoomRequired) {
+      this._applyZoom()
+    }
   },
   beforeDestroy (): void {
     if (this.map) {
@@ -162,8 +167,15 @@ export default Vue.extend({
       if (!(coords.length > 0)) {
         return false
       }
-      this.setMapBounds(coords, [120, 120])
+      this.setMapBounds(coords, [80, 80])
       return true
+    },
+    _applyZoom (): void {
+      const zoomed = this._fitBoundsToMarkers()
+      if (!zoomed) {
+        this.setMapBounds(this.defaultBounds)
+      }
+      this.zoomRequired = false
     }
   }
 })