Merge pull request #11136 from dataease/pr@dev-v2@fix_online_map_key_refresh

fix(图表): 在线地图的 key 未刷新 #10219 #10974

core/core-frontend/src/store/modules/map.ts

@@ -3,14 +3,19 @@ import { store } from '@/store'
 import { FeatureCollection } from '@antv/l7plot/dist/esm/plots/choropleth/types'
 interface MapStore {
   mapCache: Record<string, FeatureCollection>
+  mapKey: string
 }
 export const useMapStore = defineStore('map', {
   state: (): MapStore => ({
-    mapCache: {}
+    mapCache: {},
+    mapKey: ''
   }),
   actions: {
     setMap({ id, geoJson }) {
       this.mapCache[id] = geoJson
+    },
+    setKey(key) {
+      this.mapKey = key
     }
   }
 })

core/core-frontend/src/views/chart/components/js/panel/charts/map/flow-map.ts

@@ -12,7 +12,6 @@ import { GaodeMap } from '@antv/l7-maps'
 import { Scene } from '@antv/l7-scene'
 import { LineLayer } from '@antv/l7-layers'
 import { PointLayer } from '@antv/l7-layers'
-import { queryMapKeyApi } from '@/api/setting/sysParameter'
 import { mapRendered, mapRendering } from '@/views/chart/components/js/panel/common/common_antv'
 const { t } = useI18n()
 
@@ -316,14 +315,6 @@ export class FlowMap extends L7ChartView<Scene, L7Config> {
     }
   }
 
-  getMapKey = async () => {
-    const key = 'online-map-key'
-    if (!localStorage.getItem(key)) {
-      await queryMapKeyApi().then(res => localStorage.setItem(key, res.data))
-    }
-    return localStorage.getItem(key)
-  }
-
   setupDefaultOptions(chart: ChartObj): ChartObj {
     chart.customAttr.misc.flowMapConfig.lineConfig.mapLineAnimate = true
     return chart

core/core-frontend/src/views/chart/components/js/panel/charts/map/heat-map.ts

@@ -11,7 +11,6 @@ import { deepCopy } from '@/utils/utils'
 import { GaodeMap } from '@antv/l7-maps'
 import { Scene } from '@antv/l7-scene'
 import { HeatmapLayer } from '@antv/l7-layers'
-import { queryMapKeyApi } from '@/api/setting/sysParameter'
 import { DEFAULT_BASIC_STYLE } from '@/views/chart/components/editor/util/chart'
 import { mapRendered, mapRendering } from '@/views/chart/components/js/panel/common/common_antv'
 const { t } = useI18n()
@@ -104,14 +103,6 @@ export class HeatMap extends L7ChartView<Scene, L7Config> {
     return new L7Wrapper(scene, config)
   }
 
-  getMapKey = async () => {
-    const key = 'online-map-key'
-    if (!localStorage.getItem(key)) {
-      await queryMapKeyApi().then(res => localStorage.setItem(key, res.data))
-    }
-    return localStorage.getItem(key)
-  }
-
   setupDefaultOptions(chart: ChartObj): ChartObj {
     chart.customAttr.misc.mapLineAnimate = true
     return chart

core/core-frontend/src/views/chart/components/js/panel/charts/map/symbolic-map.ts

@@ -12,7 +12,6 @@ import { GaodeMap } from '@antv/l7-maps'
 import { Scene } from '@antv/l7-scene'
 import { PointLayer } from '@antv/l7-layers'
 import { LayerPopup } from '@antv/l7'
-import { queryMapKeyApi } from '@/api/setting/sysParameter'
 import { mapRendered, mapRendering } from '@/views/chart/components/js/panel/common/common_antv'
 const { t } = useI18n()
 
@@ -388,14 +387,6 @@ export class SymbolicMap extends L7ChartView<Scene, L7Config> {
     }
   }
 
-  getMapKey = async () => {
-    const key = 'online-map-key'
-    if (!localStorage.getItem(key)) {
-      await queryMapKeyApi().then(res => localStorage.setItem(key, res.data))
-    }
-    return localStorage.getItem(key)
-  }
-
   setupDefaultOptions(chart: ChartObj): ChartObj {
     chart.customAttr.label = {
       ...chart.customAttr.label,

core/core-frontend/src/views/chart/components/js/panel/types/impl/l7.ts

@@ -13,6 +13,9 @@ import {
   configL7Tooltip,
   configL7Zoom
 } from '@/views/chart/components/js/panel/common/common_antv'
+import { queryMapKeyApi } from '@/api/setting/sysParameter'
+import { useMapStoreWithOut } from '@/store/modules/map'
+const mapStore = useMapStoreWithOut()
 
 export type L7DrawConfig<P> = AntVDrawOptions<P>
 export interface L7Config extends ILayer {
@@ -109,5 +112,13 @@ export abstract class L7ChartView<
   protected constructor(name: string, defaultData: any[]) {
     super(ChartLibraryType.L7, name, defaultData)
   }
+
+  protected getMapKey = async () => {
+    if (!mapStore.mapKey) {
+      await queryMapKeyApi().then(res => mapStore.setKey(res.data))
+    }
+    return mapStore.mapKey
+  }
+
   protected abstract setupOptions(chart: Chart, options: O): O
 }