Inspección nueva, Pregunta 1 (Frenos):
Abro chat → aiChatMessages = [] (vacío)
Pregunto sobre frenos
Cierro → se guarda en answers[pregunta1].chatHistory
Misma inspección, Pregunta 2 (Neumáticos):
Abro chat → aiChatMessages = [] (vacío, porque esta pregunta no tiene historial)
Chat limpio, sin mezclar con frenos ✅
Vuelvo a Pregunta 1:
Abro chat → aiChatMessages = [historial guardado]
Veo mi conversación anterior sobre frenos ✅
Nueva inspección en otro momento:
Todas las preguntas empiezan con aiChatMessages = []
No se mezcla con inspecciones anteriores ✅
He mejorado significativamente el sistema de extracción de texto de PDFs para el análisis con IA. Aquí están los cambios principales:
🎯 Problemas Resueltos
Límites muy pequeños → Aumentados significativamente según capacidad del modelo
No extraía todo el documento → Ahora procesa hasta 100k caracteres
Duplicación de contenido → Detecta y elimina páginas repetidas
Sin información de estado → Reporta páginas procesadas, truncado, etc.
🎯 Nueva Funcionalidad Completa
Se ha implementado un sistema de chat conversacional con IA que permite adjuntar archivos (imágenes y PDFs), similar a ChatGPT, con prompt personalizable y envío completo al webhook.
📋 Características Implementadas
1. Adjuntar Archivos en el Chat
✅ Botón 📎 para adjuntar archivos
✅ Soporte para imágenes (JPG, PNG, etc.) y PDFs
✅ Preview de archivos adjuntos antes de enviar
✅ Eliminación individual de archivos adjuntos
✅ Múltiples archivos por mensaje
✅ Validación de tipos de archivo
2. Procesamiento Backend de Archivos
✅ Endpoint modificado para recibir FormData con archivos
✅ PDFs: Extracción automática de texto con pypdf
✅ Imágenes: Conversión a base64 para Vision AI
✅ Análisis combinado de texto + imágenes
✅ Límite de 2000 caracteres por PDF para optimizar
3. Integración con IA
✅ OpenAI Vision: Soporte multimodal (texto + imágenes)
✅ Gemini: Soporte de imágenes y texto
✅ Contexto enriquecido con archivos adjuntos
✅ Prompts adaptados según tipo de archivo
4. Custom Prompt por Checklist
✅ Campo assistant_prompt configurable por pregunta
✅ Campo assistant_instructions para instrucciones adicionales
✅ Control de longitud de respuesta (short/medium/long)
✅ Contexto automático del vehículo en cada mensaje
5. Persistencia del Chat
✅ Nuevo campo chat_history en modelo Answer
✅ Migración SQL: add_chat_history_to_answers.sql
✅ Guardado automático del historial completo
✅ Restauración del chat al reabrir
6. Envío al Webhook (n8n)
✅ Todos los chats incluidos en send_completed_inspection_to_n8n()
✅ Campo chat_history en cada respuesta del webhook
✅ Incluye metadata de archivos adjuntos
✅ Tipo de pregunta identificado en webhook
✅ Datos completos para análisis posterior
📋 Cambios Implementados
Frontend:
✅ Input acepta image/*,application/pdf
✅ Label actualizado: "Fotografías / Documentos PDF *"
✅ Preview diferenciado: PDFs muestran icono 📝 rojo en lugar de imagen
✅ Nombre de archivo PDF visible en el preview
✅ Contador genérico: "archivo(s) cargado(s)"
Backend:
✅ Agregado pypdf==4.0.1 a requirements.txt
✅ Detección automática de PDFs por content_type o extensión
✅ Extracción de texto de PDFs usando pypdf.PdfReader
✅ Validación de PDFs vacíos (sin texto extraíble)
✅ Prompts adaptados automáticamente para PDFs
✅ Soporte en OpenAI y Gemini (análisis de texto en lugar de vision)
✅ Límite de 4000 caracteres del PDF para análisis
🎯 Funcionamiento
Usuario sube PDF → Sistema detecta tipo de archivo
Extrae texto → PyPDF lee todas las páginas
Análisis IA → Envía texto al modelo (no usa Vision API)
Respuesta → Misma estructura JSON que con imágenes
⚠️ Limitaciones
PDFs escaneados sin OCR no funcionarán (requieren texto seleccionable)
Máximo 4000 caracteres del PDF enviados al AI
📦 Versiones
Frontend: 1.0.91 → 1.0.92
Backend: 1.0.89 → 1.0.90
Sidebar
✅ Oculto por defecto en móvil (window.innerWidth < 1024px)
✅ Overlay oscuro cuando está abierto en móvil (se cierra al tocar fuera)
✅ Deslizable desde la izquierda con transiciones suaves
✅ Siempre visible en desktop (lg: breakpoint)
Header
✅ Botón hamburguesa visible solo en móvil (lg:hidden)
✅ Logo escalable: 50px en móvil → 70px en desktop
✅ Título oculto en móvil para ahorrar espacio
✅ Indicador de sección: icono solo en móvil, texto completo en desktop
✅ Padding adaptable: 3px móvil → 4px tablet → 8px desktop
Contenido Principal
✅ Sin margin-left en móvil (el sidebar es overlay)
✅ Padding responsive: 3px → 4px → 6px según tamaño
✅ Border-radius adaptable: xl en móvil → 2xl en desktop
Modal de Inspección
✅ Ancho completo en móvil con padding mínimo (2px)
✅ Título responsive: lg (móvil) → xl (tablet) → 2xl (desktop)
✅ Altura máxima: 95vh móvil → 90vh desktop
Navegador de Preguntas
✅ Botones más pequeños en móvil: 7px/8px círculos
✅ Overflow horizontal con scroll para muchas preguntas
✅ Números responsive: texto sm en móvil → lg en desktop
✅ Gaps reducidos: 1px móvil → 2px desktop
Botones de Navegación
✅ Solo flechas en móvil (← →)
✅ Texto completo en desktop ("← Anterior", "Siguiente →")
✅ Padding y texto adaptables: text-sm móvil → text-base desktop
✅ Mejor uso del espacio horizontal
Formularios
✅ Espaciado adaptive: space-y-3 móvil → space-y-6 desktop
✅ Labels y texto responsive: xs → sm → base
✅ Banner de modo IA con wrap en móvil
La interfaz ahora es completamente funcional en móviles sin scroll horizontal, con todos los elementos accesibles y legibles! 📱✨
