- Reemplazar prompt del navegador por modal personalizado
- Modal muestra lista de campos modificados con estilo de la app
- Distingue entre almacenamiento local y servidor
- Incluye soporte para modo oscuro
- Mejora UX con diseño responsive
- Nuevo botón "Reiniciar" en el footer junto a Cancelar y Guardar
- Solo aparece cuando hay cambios pendientes (v-if="hasChanges")
- Color warning con variant soft para indicar acción destructiva
- Ícono de arrow-path (flecha circular)
- Función resetForm() que:
- Pide confirmación al usuario
- Restaura todos los campos a valores originales
- Limpia la cookie de borrador
- Muestra toast informativo
- Ubicado entre botones Cancelar y Guardar cambios
El botón permite descartar todos los cambios y volver al estado
original sin tener que recargar la página.
- Hacer el mensaje más claro y explicativo
- Enfatizar que los cambios NO se han enviado al servidor
- Indicar que quedarán guardados localmente en el navegador
- Agregar instrucción de cómo guardar definitivamente
- Iniciar con pregunta "¿Estás seguro de salir?"
Mensaje anterior era ambiguo, ahora es más específico sobre:
- Qué se guarda (localmente)
- Qué NO se guarda (en el servidor)
- Qué hacer para guardar definitivamente
- Agregar cookie para persistir cambios del formulario (7 días)
- Detectar y mostrar campos modificados con indicadores visuales
- Alertar al usuario antes de salir si hay cambios sin guardar
- Restaurar borrador automáticamente al reabrir formulario
- Notificar al usuario de cambios restaurados con toast
- Limpiar cookie al guardar exitosamente
Indicadores visuales:
- Label en color warning para campos modificados
- Badge "Modificado" con ícono de lápiz
- Mensaje en beforeunload listando campos pendientes
La cookie guarda todos los campos del formulario y se restauran
automáticamente al abrir el formulario de nuevo.
- Mover sección de foto de perfil al primer lugar del formulario
- Eliminar preview del avatar (MsnAvatar) - no repetir
- Simplificar botones: más compactos (size="sm", iconos w-4 h-4)
- Eliminar card/container extra (.avatar-section) con background y padding
- Nueva clase simple .avatar-actions-simple con solo flex y gap
- Limpiar estilos CSS no utilizados (avatar-section, avatar-preview, avatar-actions)
- Actualizar UModal para usar v-model:open en lugar de v-model
- Envolver contenido de UModal en slot #content según nueva sintaxis
- Corregir tipos en CameraCapture: agregar verificación de objeto antes de spread
- Cambiar tipo de retorno de getAppIconUrl de null a undefined
- Comentar capture_links en manifest PWA (propiedad experimental no soportada en tipos)
- Resolver todos los errores de TypeScript y warnings de hidratación
Errores corregidos:
- TS2353: width no existe en tipo ui de UModal
- TS2698: Spread types solo de tipos objeto
- TS18048: camera posiblemente undefined
- TS2322: null no asignable a undefined
- TS2353: capture_links no existe en ManifestOptions
- Agregar CameraCapture.vue con soporte multi-dispositivo
* Soporte para múltiples cámaras (frontal/trasera)
* Manejo robusto de permisos y errores
* Preview y confirmación de foto
* Detección automática de capacidades del dispositivo
- Crear endpoint /api/avatar/upload para subir avatares
* Validación de tipo y tamaño de archivo
* Almacenamiento en /public/avatars/
* Actualización de atributos en Authentik
* Limpieza automática de avatares antiguos
- Actualizar UserProfileForm con gestión de avatar
* Integración con CameraCapture en modal
* Preview del avatar actual con MsnAvatar
* Opciones para cambiar y eliminar avatar
- Actualizar useAuthentik para avatares personalizados
* Carga de atributos completos del usuario
* Soporte para avatar_url desde Authentik
* Fallback a UI Avatars si no hay custom avatar
- Crear componente UserProfileForm con diseño glassmorphism
- Alternar entre lista de apps y formulario de edición
- Quitar modal de UserHeader, usar emit event
- Agregar nuevos campos deshabilitados:
* Avatar URL
* Teléfono
* Cédula
* Fecha de nacimiento
* NFC vinculada
* PIN numérico
* Código Nucleo V2
- Sistema de eventos entre componentes