# Plan para la aplicación móvil de ConstruProgress

## Objetivo
Crear una aplicación móvil (Android/iOS, teléfonos y tablets) para realizar inspecciones de campo y sincronizar datos offline con el servidor Laravel de ConstruProgress.

## Tecnologías recomendadas
- Framework: Flutter (una sola codebase)
- Estado: GetX (o Provider/Bloc)
- Almacenamiento local: Sqflite (IndexedDB equivalente) para cola de acciones y datos de inspección
- Comunicación API: Dio con interceptors de autenticación y reintentos
- Autenticación: Flutter Secure Storage para token (Sanctum/JWT)
- Media: Image Picker y Video Player para captura de fotos/videos
- Detección de red: Connectivity Plus
- Sincronización en background: Workmanager (Android) / Background Fetch (iOS) para intentar enviar cola cuando haya conexión
- UI responsive: LayoutBuilder, MediaQuery, Flutter ScreenUtil para adaptar a teléfonos y tablets
- Indicadores de conexión: Banner o ícono que muestre 🟢 Online, 🟡 Pendientes (X), 🔴 Offline, con botón “Sincronizar ahora”

## Estructura de carpetas (sugerida)
lib/
  main.dart
  config.dart          # Endpoints y configuración
  bindings/            # GetX bindings
  controllers/         # GetX controllers (AuthController, ProjectController, InspectionController, SyncController)
  models/              # Modelos de datos (Project, Phase, Feature, Inspection, PendingAction)
  services/            # Servicios API (ApiService, AuthService, SyncService)
  ui/                  # Pantallas y widgets reutilizables
    auth/
    projects/
    inspections/
    components/
  utils/               # Helpers, extensiones
  assets/              # Íconos, imágenes

## Fases de desarrollo

1. **Configuración inicial y autenticación**
   - Crear proyecto Flutter con flutter create
   - Añadir dependencias esenciales (get, dio, flutter_secure_storage, connectivity_plus, sqflite, workmanager, image_picker)
   - Configurar .gitignore y README
   - Implementar pantalla de login que obtenga token desde `/api/sanctum/token` (o similar) y lo guarde de forma segura
   - Manejo de errores de autenticación y redirección a home

2. **Navegación y layout base**
   - Implementar BottomNavigationBar o NavigationRail (adaptativo) con secciones: Proyectos, Inspecciones, Perfil
   - Diseño responsive: usar LayoutBuilder para cambiar entre NavigationBar (teléfono) y NavigationRail (tablet)
   - AppBar con título y indicador de conexión (🟢/🟡/🔴) y número de acciones pendientes

3. **Módulo de proyectos**
   - Pantalla de lista de proyectos (con filtro por estado y búsqueda)
   - Tarjeta de proyecto mostrando nombre, estado, progreso global, última actualización
   - Navegación al detalle del proyecto al tocar una tarjeta
   - Detalle del proyecto: lista de fases con barra de progreso, botón para ver mapa (opcional, usar webview o lanzar mapa externo)
   - Pull-to-refresh para obtener proyectos actualizados desde API (`GET /api/projects`)

4. **Módulo de inspecciones**
   - Lista de inspecciones asociadas a un proyecto/fase (o global)
   - Botón “+ Nueva inspección” que abre formulario
   - Formulario de inspección basado en templates (obtener templates desde `/api/templates/{project}` o `/api/templates?phase_id=X`)
   - Campos dinámicos según tipo (texto, número, selección, fecha, firma, foto)
   - Captura de foto usando image_picker, opción para tomar foto o elegir de galería
   - Guardar borrador localmente (sqflite) mientras se llena el formulario
   - Botón “Guardar borrador” y “Finalizar inspección”
   - Al finalizar, validar campos requeridos y enviar a backend (`POST /api/inspections`) o encolar para sincronización offline

5. **Sincronización offline**
   - Definir modelo de acción pendiente (PendingAction) con campos: id, type, payload, timestamp, retries, synced
   - Servicio de cola que guarda acciones en base local cuando falta conexión
   - Al detectar cambio a online (connectivity_plus) o manualmente (botón “Sincronizar ahora”), procesar cola:
     * Enviar acciones en lote a `/offline/sync` (endpoint existente)
     * Procesar respuesta por acción, marcar como sincronizada o incrementar reintentos
     * Manejar errores de servidor (reintentar con backoff exponencial)
   - Notificaciones locales (opcional) cuando la sincronización completa o falla
   - Indicador UI: ícono con contador de acciones pendientes, tooltip con detalle

6. **Mapa y visualización de features (opcional MVP)**
   - Integrar paquete google_maps_flutter o flutter_leaflet para mostrar mapa
   - Obtener features (GeoJSON) desde `/api/projects/{id}/features` o similar
   - Permitir tocar un feature para ver detalles y asociar inspección rápida
   - Modo offline: mostrar features cacheados (descargados previamente cuando había conexión)

7. **Perfil y ajustes**
   - Pantalla de perfil mostrando nombre, correo, rol
   - Opción para cerrar sesión (eliminar token seguro)
   - Ajustes: frecuencia de sincronización background, solo sync en Wi‑Fi, tema claro/oscuro

8. **Pruebas y calidad**
   - Pruebas unitarias para modelos y servicios (mockito)
   - Pruebas de widget para pantallas críticas (login, formulario de inspección)
   - Pruebas de integración para flujos completos (login → inspección → sincronización)
   - Análisis estático con flutter_lints
   - Generar APK y AAB para Android, IPA para iOS (usando flutter build)

9. **Despliegue**
   - Crear cuentas en Google Play Console y App Store Connect
   - Configurar firmado de aplicaciones (keystore, certificados)
   - Automatizar builds con fastlane (opcional)
   - Subir versiones de prueba (internal test, TestFlight) y producción
   - Monitorear crashes con Firebase Crashlytics (opcional)

## Próximos pasos inmediatos
1. Clonar el repositorio de ConstruProgress backend (ya hecho) y revisar los endpoints disponibles (especialmente `/offline/sync`, rutas de inspección, templates, autenticación).
2. Definir contratos exactos de las APIs (request/response) y documentarlos en un archivo `API.md` dentro del repo móvil o en el wiki.
3. Crear la rama `dev` en el repositorio móvil y comenzar con la fase 1 (autenticación y layout base).
4. Sincronizar frecuentemente con el backend para asegurar compatibilidad.

## Notas adicionales
- Usar heroicon y blade-icons para iconos en lugar de emojis o símbolos unicode directos (preferencia del usuario).
- Mantener el código limpio y comentado; seguir la guía de estilo de Flutter.
- Registrar decisiones importantes en este archivo PLAN_MOBILE.md o en el README.
