diff --git a/src/components/AscGISMap.vue b/src/components/AscGISMap.vue index ec1eb0b..bfe0e9c 100644 --- a/src/components/AscGISMap.vue +++ b/src/components/AscGISMap.vue @@ -163,8 +163,19 @@ function reattachAndResizeMap(retry = 0) { mapView.value.container = activeContainer } - mapView.value.resize() - mapView.value.requestRender?.() + // เรียก resize() อย่างปลอดภัยด้วยการตรวจสอบว่ามี method นี้หรือไม่ + try { + if (typeof mapView.value.resize === 'function') { + mapView.value.resize() + } + } catch (error) { + console.warn('Map resize failed:', error) + } + + if (typeof mapView.value.requestRender === 'function') { + mapView.value.requestRender?.() + } + mapView.value .goTo( { @@ -285,7 +296,11 @@ async function initializeMap() { geometry: userPoint, symbol: userSymbol, }) - mapView.value.graphics.add(userGraphic) + + // เพิ่มการตรวจสอบความปลอดภัยก่อนเข้าถึง graphics + if (mapView.value && mapView.value.graphics && !mapView.value.destroyed) { + mapView.value.graphics.add(userGraphic) + } // Get POI place ยิงไปขอที่ server ของกทม.ก่อน // await axios // .get( @@ -381,12 +396,22 @@ async function initializeMap() { geometry: poiPoint, symbol: poiSymbol, }) - mapView.value.graphics.add(poiGraphic) - // อัปเดตการแสดงผลให้แสดงทั้งตำแหน่งของผู้ใช้และ POI - mapView.value.goTo({ - target: [userPoint, poiPoint], - zoom: zoomMap.value, - }) + + // เพิ่มการตรวจสอบความปลอดภัยก่อนเข้าถึง graphics และ goTo + if (mapView.value && !mapView.value.destroyed) { + if (mapView.value.graphics) { + mapView.value.graphics.add(poiGraphic) + } + // อัปเดตการแสดงผลให้แสดงทั้งตำแหน่งของผู้ใช้และ POI + if (typeof mapView.value.goTo === 'function') { + mapView.value.goTo({ + target: [userPoint, poiPoint], + zoom: zoomMap.value, + }).catch(() => { + // Ignore goTo errors + }) + } + } updateLocation(latitude, longitude, poiPlaceName.value) }) diff --git a/src/stores/socket.ts b/src/stores/socket.ts index be2ceee..28c1e3b 100644 --- a/src/stores/socket.ts +++ b/src/stores/socket.ts @@ -1,3 +1,4 @@ +import { ref } from 'vue' import config from '@/app.config' import { getToken } from '@/plugins/auth' import { defineStore } from 'pinia' @@ -10,6 +11,7 @@ interface sockeBackup { export const useSocketStore = defineStore('socket', () => { let socket: Socket + const notificationCounter = ref(0); async function init() { socket = io(new URL(config.API.socket).origin, { @@ -19,6 +21,7 @@ export const useSocketStore = defineStore('socket', () => { socket.on('socket-notification', (payload) => { let body: sockeBackup = JSON.parse(payload) + notificationCounter.value++ notifyStatus(body.message, body.success) }) } @@ -94,5 +97,5 @@ export const useSocketStore = defineStore('socket', () => { init() - return {} + return { notificationCounter } }) diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index 9b76ae3..84a3e77 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -11,6 +11,7 @@ import { import { useQuasar } from 'quasar' import { format } from 'date-fns' import Camera from 'simple-vue-camera' +import { storeToRefs } from 'pinia' import config from '@/app.config' import http from '@/plugins/http' @@ -18,6 +19,7 @@ import { useCounterMixin } from '@/stores/mixin' import { usePermissions } from '@/composables/usePermissions' import { usePrivacyStore } from '@/stores/privacy' import { usePositionKeycloakStore } from '@/stores/positionKeycloak' +import { useSocketStore } from '@/stores/socket' import type { FormRef, OptionReason } from '@/interface/response/checkin' @@ -32,6 +34,8 @@ const { syncPermissionStates, requestCameraPermission, } = usePermissions() +const socketStore = useSocketStore() +const { notificationCounter } = storeToRefs(socketStore) const privacyStore = usePrivacyStore() const positionKeycloakStore = usePositionKeycloakStore() const MOCK_CHECK_DELAY_MS = 800 @@ -634,19 +638,18 @@ async function fetchCheckStatus() { /** inQueue เป็น true */ isDisabledCheckTime.value = true msgCheckTime.value = 'ระบบกำลังประมวลผล' - if (intervalId.value === undefined) { - intervalId.value = setInterval(async () => { - try { - await fetchCheckStatus() - } catch (error) { - console.error('Error in interval fetchCheckStatus:', error) - // หยุด interval ถ้าเกิด error - stopChecking() - } - }, 3000) - console.log('startChecking called, intervalId:', intervalId.value) - } - // hideLoader() + // if (intervalId.value === undefined) { + // intervalId.value = setInterval(async () => { + // try { + // await fetchCheckStatus() + // } catch (error) { + // console.error('Error in interval fetchCheckStatus:', error) + // // หยุด interval ถ้าเกิด error + // stopChecking() + // } + // }, 3000) + // console.log('startChecking called, intervalId:', intervalId.value) + // } } else { /** inQueue เป็น false */ isDisabledCheckTime.value = false @@ -1248,6 +1251,11 @@ watch( } } ) + +/** Watch notification counter on socket */ +watch(notificationCounter, () => { + startChecking() +})