fix: document.addEventListener visibilitychange window.addEventListener pagehide

src/views/HomeView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, reactive, onMounted, watch } from 'vue'
+import { ref, reactive, onMounted, watch, onBeforeUnmount } from 'vue'
 import { useQuasar } from 'quasar'
 import moment from 'moment'
 import Camera from 'simple-vue-camera'
@@ -504,27 +504,37 @@ const getClassXS = (val: boolean) => {
 }
 const inQueue = ref<boolean>(false)
 
-const photoTimeout = ref<any | null>(null)
-const PHOTO_TIMEOUT_DURATION = 5 * 60 * 1000 // 5 นาที
-
-// ฟังก์ชันใหม่สำหรับจัดการ timeout ของรูป
-function startPhotoTimeout() {
-  clearPhotoTimeout() // ล้าง timeout เดิมก่อน (ถ้ามี)
-
-  photoTimeout.value = setTimeout(() => {
-    // ลบรูปหลังจาก 5 นาที
-    if (img.value) {
-      img.value = undefined
-      cameraIsOn.value = false
-      camera.value?.stop()
-    }
-  }, PHOTO_TIMEOUT_DURATION)
+// ฟังก์ชันสำหรับรีเซ็ตรูปและหยุดกล้อง
+function resetCameraAndImage() {
+  if (img.value) {
+    img.value = undefined
+  }
+  if (cameraIsOn.value && camera.value) {
+    camera.value.stop()
+    cameraIsOn.value = false
+  }
 }
 
-function clearPhotoTimeout() {
-  if (photoTimeout.value) {
-    clearTimeout(photoTimeout.value)
-    photoTimeout.value = null
+// เพิ่มฟังก์ชันสำหรับจัดการการปิดแอพในมือถือ
+function handleAppClose() {
+  resetCameraAndImage()
+
+  // หยุด interval ถ้ามี
+  if (intervalId.value !== undefined) {
+    clearInterval(intervalId.value)
+    intervalId.value = undefined
+  }
+}
+
+// จัดการ visibility change สำหรับมือถือ
+function handleVisibilityChange() {
+  if (document.visibilityState === 'hidden') {
+    handleAppClose()
+  } else if (document.visibilityState === 'visible') {
+    // เมื่อกลับมาที่แอพ ให้เรียกแผนที่ใหม่
+    if (privacyStore.isAccepted) {
+      mapRef.value?.requestLocationPermission()
+    }
   }
 }
 
@@ -538,6 +548,24 @@ onMounted(async () => {
   if (privacyStore.isAccepted) {
     mapRef.value?.requestLocationPermission()
   }
+
+  // เพิ่ม event listeners สำหรับมือถือ
+  document.addEventListener('visibilitychange', handleVisibilityChange)
+  window.addEventListener('pagehide', handleAppClose)
+})
+
+onBeforeUnmount(() => {
+  resetCameraAndImage()
+
+  // หยุด interval ถ้ามี
+  if (intervalId.value !== undefined) {
+    clearInterval(intervalId.value)
+    intervalId.value = undefined
+  }
+
+  // ลบ event listeners
+  document.removeEventListener('visibilitychange', handleVisibilityChange)
+  window.removeEventListener('pagehide', handleAppClose)
 })
 
 watch(