优化

src/views/home/map.vue

@@ -11,8 +11,8 @@ import { getUserInfoAPI } from 'http/api/login/index'
 import { ElMessage } from 'element-plus'
 import { wgs84ToGcj02ToBd09Public } from 'utils/map'
 import { getMapData, mapLoginApi, getIotListApi, getBadgeInfoApi } from 'http/api/map'
-import icon1 from '@/assets/img/work-card.png'
-import icon2 from '@/assets/img/IOT.png'
+import icon1 from '@/assets/img/work-card.jpg'
+import icon2 from '@/assets/img/IOT.jpg'
 
 const router: any = useRouter()
 const userStore = useStore()
@@ -45,10 +45,11 @@ const loginApi = async () => {
 // 获取地图数据
 const getMapDataList = async () => {
     try {
-        const res: any = await getMapData()
+        await getMapData()
+    } catch (res: any) {
         console.log('🚀 ~ getMapDataList ~ res:', res)
-        mapData.value = res.data
-        console.log('🚀 ~ getMapDataList ~ mapData.value:', mapData.value.longitude)
+        if (res) {
+            mapData.value = res
             let { longitude, latitude } = wgs84ToGcj02ToBd09Public(
                 Number(mapData.value.longitude),
                 Number(mapData.value.latitude),
@@ -56,16 +57,15 @@ const getMapDataList = async () => {
             mapData.value.longitude = longitude
             mapData.value.latitude = latitude
             console.log('🚀 ~ getMapDataList ~ longitude:', longitude, latitude)
-        points.value.push({
+            points.value = [
+                {
                     id: 4,
                     lng: longitude,
                     lat: latitude,
                     isWork: false,
-        })
-        getWorkData()
-        // initMap()
-    } catch (error) {
-        console.log('🚀 ~ getMapDataList ~ error:', error)
+                },
+            ]
+        }
         getWorkData()
         // initMap()
     }
@@ -75,13 +75,13 @@ const getMapDataList = async () => {
 const getWorkData = async () => {
     try {
         await getIotListApi()
-    } catch (res) {
+    } catch (res: any) {
         console.log('🚀 ~ getWorkData ~ res:', res)
         if (res.errorCode != 200) {
             initMap()
             return
         }
-        points.value = res.devices.map((item: any) => {
+        const point = res.devices.map((item: any) => {
             return {
                 id: item.user_id,
                 lng: item.jingdu,
@@ -89,6 +89,9 @@ const getWorkData = async () => {
                 isWork: true,
             }
         })
+        // 数组合并
+        points.value = [...JSON.parse(JSON.stringify(points.value)), ...point]
+        console.log('🚀 ~ getWorkData ~ points.value:', points.value)
         initMap()
     }
 }
@@ -97,7 +100,7 @@ const getWorkData = async () => {
 const getWorkCardDetails = async (id: any) => {
     try {
         await getBadgeInfoApi(id)
-    } catch (res) {
+    } catch (res: any) {
         console.log('🚀 ~ getWorkCardDetails ~ res:', res)
         if (res.errorCode != 200) {
             return
@@ -245,7 +248,7 @@ const formatUtcTimeV2 = (utcTime: any, date: any) => {
 const initMap = () => {
     if (window.BMap) {
         const map = new BMap.Map(mapContainer.value)
-        const point = new BMap.Point(106.6302, 26.6477) // 默认贵州贵阳
+        const point = new BMap.Point(106.674974,26.489328) // 默认贵州贵阳
         // 添加标记点
         points.value.forEach((item: any) => {
             const point = new BMap.Point(item.lng, item.lat)
@@ -278,7 +281,7 @@ const initMap = () => {
             })
         })
         map.addControl(new BMap.NavigationControl()) // 添加平移缩放控件
-        map.centerAndZoom(point, 7) // 设置地图中心点及缩放级别
+        map.centerAndZoom(point, 11) // 设置地图中心点及缩放级别
         map.enableScrollWheelZoom(true) // 启用滚轮缩放
         // 将贵阳整个地图放大到级别 7
     } else {
@@ -296,6 +299,7 @@ const handleTag = (tag: number) => {
     } else {
         tagData.value = mapData.value.cphase
     }
+    console.log('🚀 ~ handleTag ~ tagData.value:', tagData.value)
 }
 
 onMounted(async () => {
@@ -676,7 +680,9 @@ onMounted(async () => {
             <el-col :span="12" :offset="0">iccid: {{ mapWorkCardData.su }}</el-col>
             <el-col :span="12" :offset="0">联系人: {{ mapWorkCardData.owner }}</el-col>
             <el-col :span="12" :offset="0">经纬度: {{ mapWorkCardData.jingwei }}</el-col>
-            <el-col :span="12" :offset="0">离线报警开关: {{ mapWorkCardData.alarm != 0 ? '开' : '关' }}</el-col>
+            <el-col :span="12" :offset="0"
+                >离线报警开关: {{ mapWorkCardData.alarm != 0 ? '开' : '关' }}</el-col
+            >
             <el-col :span="12" :offset="0">服务商描述: {{ mapWorkCardData.deviceRemark }}</el-col>
             <el-col :span="12" :offset="0">设备软件版本号: {{ mapWorkCardData.macVersion }}</el-col>
             <el-col :span="12" :offset="0">视频地址: {{ mapWorkCardData.VideoConfig }}</el-col>