Fix the issue that the data is not displayed when the map is not loaded.

src/components/GMap.vue

@@ -474,7 +474,7 @@ export default defineComponent({
   setup () {
     const useMouseToolHook = useMouseTool()
     const useGMapManageHook = useGMapManage()
-    const deviceTsaUpdateHook = ref()
+    const deviceTsaUpdateHook = deviceTsaUpdate()
     const root = getRoot()
 
     const mouseMode = ref(false)
@@ -532,16 +532,12 @@ export default defineComponent({
 
     watch(() => store.state.deviceStatusEvent,
       data => {
-        if (root.$map === undefined) {
-          return
-        }
-        deviceTsaUpdateHook.value = deviceTsaUpdate()
         if (Object.keys(data.deviceOnline).length !== 0) {
-          deviceTsaUpdateHook.value.initMarker(data.deviceOnline.domain, data.deviceOnline.device_callsign, data.deviceOnline.sn)
+          deviceTsaUpdateHook.initMarker(data.deviceOnline.domain, data.deviceOnline.device_callsign, data.deviceOnline.sn)
           store.state.deviceStatusEvent.deviceOnline = {} as DeviceStatus
         }
         if (Object.keys(data.deviceOffline).length !== 0) {
-          deviceTsaUpdateHook.value.removeMarker(data.deviceOffline.sn)
+          deviceTsaUpdateHook.removeMarker(data.deviceOffline.sn)
           if ((data.deviceOffline.sn === osdVisible.value.sn) || (osdVisible.value.is_dock && data.deviceOffline.sn === osdVisible.value.gateway_sn)) {
             osdVisible.value.visible = false
             store.commit('SET_OSD_VISIBLE_INFO', osdVisible)
@@ -555,29 +551,23 @@ export default defineComponent({
     )
 
     watch(() => store.state.deviceState, data => {
-      if (root.$aMap === undefined) {
-        return
-      }
-      if (!deviceTsaUpdateHook.value) {
-        deviceTsaUpdateHook.value = deviceTsaUpdate()
-      }
       if (data.currentType === EDeviceTypeName.Gateway && data.gatewayInfo[data.currentSn]) {
-        deviceTsaUpdateHook.value.moveTo(data.currentSn, data.gatewayInfo[data.currentSn].longitude, data.gatewayInfo[data.currentSn].latitude)
+        deviceTsaUpdateHook.moveTo(data.currentSn, data.gatewayInfo[data.currentSn].longitude, data.gatewayInfo[data.currentSn].latitude)
         if (osdVisible.value.visible && osdVisible.value.gateway_sn !== '') {
           deviceInfo.gateway = data.gatewayInfo[osdVisible.value.gateway_sn]
         }
       }
       if (data.currentType === EDeviceTypeName.Aircraft && data.deviceInfo[data.currentSn]) {
-        deviceTsaUpdateHook.value.moveTo(data.currentSn, data.deviceInfo[data.currentSn].longitude, data.deviceInfo[data.currentSn].latitude)
+        deviceTsaUpdateHook.moveTo(data.currentSn, data.deviceInfo[data.currentSn].longitude, data.deviceInfo[data.currentSn].latitude)
         if (osdVisible.value.visible && osdVisible.value.sn !== '') {
           deviceInfo.device = data.deviceInfo[osdVisible.value.sn]
         }
       }
       if (data.currentType === EDeviceTypeName.Dock && data.dockInfo[data.currentSn]) {
-        deviceTsaUpdateHook.value.initMarker(EDeviceTypeName.Dock, [EDeviceTypeName.Dock], data.currentSn, data.dockInfo[data.currentSn].basic_osd?.longitude, data.dockInfo[data.currentSn].basic_osd?.latitude)
+        deviceTsaUpdateHook.initMarker(EDeviceTypeName.Dock, [EDeviceTypeName.Dock], data.currentSn, data.dockInfo[data.currentSn].basic_osd?.longitude, data.dockInfo[data.currentSn].basic_osd?.latitude)
         if (osdVisible.value.visible && osdVisible.value.is_dock && osdVisible.value.gateway_sn !== '') {
           deviceInfo.dock = data.dockInfo[osdVisible.value.gateway_sn]
-          deviceInfo.device = data.deviceInfo[deviceInfo.dock.basic_osd.sub_device?.device_sn ?? osdVisible.value.sn]
+          deviceInfo.device = data.deviceInfo[deviceInfo.dock.basic_osd?.sub_device?.device_sn ?? osdVisible.value.sn]
         }
       }
     }, {
@@ -655,6 +645,9 @@ export default defineComponent({
     onMounted(() => {
       const app = getApp()
       useGMapManageHook.globalPropertiesConfig(app)
+      setInterval(() => {
+        console.info(deviceInfo.dock)
+      }, 1000)
     })
     function getDrawCallback ({ obj }) {
       switch (state.currentType) {

src/hooks/use-g-map-tsa.ts

@@ -10,7 +10,7 @@ import { EDeviceTypeName } from '/@/types'
 
 export function deviceTsaUpdate () {
   const root = getRoot()
-  const AMap = root.$aMap
+  let AMap = root.$aMap
 
   const icons = new Map([
     [EDeviceTypeName.Aircraft, droneIcon],
@@ -43,8 +43,12 @@ export function deviceTsaUpdate () {
     if (markers[sn]) {
       return
     }
+    if (root.$aMap === undefined) {
+      return
+    }
+    AMap = root.$aMap
     markers[sn] = new AMap.Marker({
-      position: new AMap.LngLat(lng || 113.935913, lat || 22.525335),
+      position: new AMap.LngLat(lng || 113.943225499, lat || 22.577673716),
       icon: initIcon(type),
       title: name,
       anchor: 'top-center',

src/hooks/use-g-map.ts

@@ -15,7 +15,7 @@ export function useGMapManage () {
     }).then((AMap) => {
       state.aMap = AMap
       state.map = new AMap.Map(container, {
-        center: [113.935913, 22.525335],
+        center: [113.943225499, 22.577673716],
         zoom: 15
       })
       state.mouseTool = new AMap.MouseTool(state.map)

src/pages/page-web/projects/tsa.vue

@@ -259,7 +259,7 @@ onMounted(() => {
   }, 3000)
   const element = document.getElementsByClassName('scrollbar').item(0) as HTMLDivElement
   const parent = element?.parentNode as HTMLDivElement
-  scorllHeight.value = parent?.clientHeight - parent.firstElementChild!.clientHeight
+  scorllHeight.value = parent?.clientHeight - parent?.firstElementChild?.clientHeight
 })
 
 function getOnlineTopo () {