feat: tính năng offline cho upload ảnh và tải bản đồ

2026-06-28 15:18:13 +07:00
parent 2f5ef424c8
commit f91fc7c5ac
10 changed files with 664 additions and 2 deletions
@@ -2,6 +2,7 @@ import React, { useEffect, useState, useRef } from 'react';
 import { io, Socket } from 'socket.io-client';
 import { Capacitor } from '@capacitor/core';
 import { BACKEND_URL } from '@/utils/backendEndpoint';
+import { queueOfflineUpload } from '@/utils/offlineQueue';
 import {
  Compass,
  Users,
@@ -287,6 +288,37 @@ export const MemberDashboard: React.FC<MemberDashboardProps> = ({
      }
      setIsLocating(false);

+      // ── OFFLINE GUARD ──────────────────────────────────────────────────────────
+      if (!navigator.onLine) {
+        try {
+          const token = localStorage.getItem('token') || '';
+          const formFields: Record<string, string> = {};
+          if (attachedLocation) {
+            formFields['latitude']  = attachedLocation.latitude.toString();
+            formFields['longitude'] = attachedLocation.longitude.toString();
+          }
+
+          await queueOfflineUpload({
+            endpoint:  `${BACKEND_URL}/api/v1/tours/${tourId}/photos`,
+            authToken: token,
+            fileBlob:  file,
+            fileName:  file.name,
+            formFields,
+          });
+
+          notify({
+            title:   'Ảnh đã được lưu tạm ngoại tuyến 📦',
+            message: 'Kết nối lại mạng, ảnh sẽ tự động được tải lên tour.',
+            type: 'info',
+          });
+        } catch (err) {
+          notify({ title: 'Lỗi', message: 'Không thể lưu ảnh ngoại tuyến.', type: 'error' });
+        } finally {
+          if (cameraInputRef.current) cameraInputRef.current.value = '';
+        }
+        return;
+      }
+      // ── ONLINE PATH ───────────────────────────────────────────────────────────────
      // Upload photo to tour
      setIsUploading(true);
      try {