feat: 优化 HandlerUtil 方法命名和 Type 定义

src/components/Map/Mapbox/index.ts

@@ -941,6 +941,29 @@ export interface MapboxInstance {
     setLayoutProperty: (layerId: string, name: string, value: any) => void
 }
 
+/**
+ * 站点数据类型定义
+ */
+export interface Station extends Recordable {
+    /**
+     * key 用于标识站点是什么类型的数据（例如：降水量、气温...）
+     */
+    key: string
+    value: string | number
+    suffix?: string
+    stationCode?: string
+    stationName?: string
+    city: string
+    cnty: string
+    lon: string
+    lat: string
+}
+
+/**
+ * 判断是否为非空对象
+ * @param obj 对象
+ * @returns 是否为非空对象
+ */
 function isPlainObject(obj: any) {
     if (typeof obj !== 'object' || obj === null) {
         return false
@@ -950,9 +973,12 @@ function isPlainObject(obj: any) {
     return proto === null || proto === Object.prototype
 }
 
+/**
+ * 数据处理工具
+ */
 export const HandlerUtil = {
     isPlainObject,
-    createDefaultGeoJSONFeatureData(station: Recordable) {
+    createDefaultPointFeature(station: Station, map = {} as Recordable) {
         return {
             type: 'Feature',
             geometry: {
@@ -962,18 +988,18 @@ export const HandlerUtil = {
             properties: {
                 key: station.key,
                 suffix: station.suffix,
-                value: Number(station.value),
-                popup: HandlerUtil.createDefaultStylePopupHtml({ '{key}': '{value}{suffix}' }, station),
+                value: station.value,
+                popup: HandlerUtil.createDefaultPopupHtml(station, { '{key}': '{value}{suffix}', ...map }),
             },
         }
     },
-    createDefaultGeoJSONSymbolSourceData(features: GeoJSON.Feature<GeoJSON.Geometry>[] = []) {
+    createFeatureCollection(features: GeoJSON.Feature<GeoJSON.Geometry>[] = []) {
         return {
             type: 'FeatureCollection',
             features: features || [],
         }
     },
-    createDefaultStylePopupHtml(map: Recordable, station: Recordable) {
+    createDefaultPopupHtml(station: Station, map: Recordable) {
         const htmls = ['<div class="custom-popup">']
 
         if (isPlainObject(station)) {

src/pages/business/monitor/tem/index.vue

@@ -9,7 +9,7 @@
     import { TimeBarWidget, formatTime, useTimeBarWidget } from '@/components/Map/Widgets/TimeBar'
     import { ToolBoxWidget, useToolBoxWidget } from '@/components/Map/Widgets/ToolBox'
     import { BottomBarWidget, useBottomBarWidget } from '@/components/Map/Widgets/BottomBar'
-    import type { MapboxInstance } from '@/components/Map/Mapbox'
+    import type { MapboxInstance, Station } from '@/components/Map/Mapbox'
     import { HandlerUtil } from '@/components/Map/Mapbox'
 
     useShare()
@@ -75,12 +75,12 @@
                 }),
                 // 此处使用
                 (response) => {
-                    const features = response.body.liveVos.map(function (item) {
+                    const features = response.body.liveVos.map((item: Station) => {
                         item.key = '气温'
                         item.suffix = '°C'
-                        return HandlerUtil.createDefaultGeoJSONFeatureData(item)
+                        return HandlerUtil.createDefaultPointFeature(item)
                     })
-                    return HandlerUtil.createDefaultGeoJSONSymbolSourceData(features)
+                    return HandlerUtil.createFeatureCollection(features)
                 },
             )
 

src/pages/business/monitor/wind/index.vue

@@ -9,7 +9,7 @@
     import { TimeBarWidget, formatTime, useTimeBarWidget } from '@/components/Map/Widgets/TimeBar'
     import { ToolBoxWidget, useToolBoxWidget } from '@/components/Map/Widgets/ToolBox'
     import { BottomBarWidget, useBottomBarWidget } from '@/components/Map/Widgets/BottomBar'
-    import type { MapboxInstance } from '@/components/Map/Mapbox'
+    import type { MapboxInstance, Station } from '@/components/Map/Mapbox'
     import { HandlerUtil } from '@/components/Map/Mapbox'
     import { useGlobSetting } from '/@/hooks/setting'
 
@@ -124,12 +124,12 @@
                 }),
                 // 此处使用
                 (response) => {
-                    const features = response.body.liveVos.map(function (item) {
+                    const features = response.body.liveVos.map((item: Station) => {
                         item.key = '风速'
                         item.suffix = 'm/s'
-                        return HandlerUtil.createDefaultGeoJSONFeatureData(item)
+                        return HandlerUtil.createDefaultPointFeature(item)
                     })
-                    return HandlerUtil.createDefaultGeoJSONSymbolSourceData(features)
+                    return HandlerUtil.createFeatureCollection(features)
                 },
             )