Actualizar asignados.html

asignados.html

@@ -477,7 +477,7 @@
             return diffDays;
         }
 
-        function renderServices() {
+   function renderServices() {
             const container = document.getElementById('servicesList');
             const noDateSec = document.getElementById('noDateSection');
             
@@ -507,6 +507,11 @@
                 const isUrgent = s.is_urgent;
                 const company = raw["Compañía"] || raw["Procedencia"] || "Particular";
                 
+                // 🔥 AÑADIDO: Extraer y limpiar la descripción de avería
+                let desc = raw["Descripción"] || raw["DESCRIPCION"] || raw["Averia"] || "Sin descripción de avería en el expediente.";
+                // Quitar posibles saltos de línea molestos y limitarlo a ~100 caracteres visuales
+                desc = desc.replace(/(\r\n|\n|\r)/gm, " "); 
+
                 const calledTimes = parseInt(raw.called_times || 0);
                 const delayDays = calculateDelayDays(s.created_at);
                 
@@ -519,8 +524,8 @@
                 <div class="bg-white p-5 rounded-3xl border border-slate-200 shadow-sm relative overflow-hidden mb-4">
                     ${isUrgent ? '<div class="absolute top-0 right-0 bg-red-500 text-white text-[8px] font-black px-3 py-1 rounded-bl-xl uppercase tracking-widest shadow-sm z-10">Urgente</div>' : ''}
                     
-                    <div onclick="openActionModal(${s.id})" class="flex gap-4 items-center active:scale-95 transition-transform cursor-pointer">
+                    <div onclick="openActionModal(${s.id})" class="flex gap-4 items-start active:scale-95 transition-transform cursor-pointer">
-                        <div class="w-12 h-12 bg-primary-dynamic/10 rounded-2xl flex flex-col items-center justify-center text-primary-dynamic shrink-0 border border-primary-dynamic/20">
+                        <div class="w-12 h-12 bg-primary-dynamic/10 rounded-2xl flex flex-col items-center justify-center text-primary-dynamic shrink-0 border border-primary-dynamic/20 mt-1">
                             <i data-lucide="clock" class="w-5 h-5"></i>
                         </div>
                         <div class="min-w-0 flex-1">
@@ -529,8 +534,13 @@
                             <p class="text-[10px] font-bold text-slate-500 mt-1 truncate uppercase flex items-center gap-1">
                                 <i data-lucide="map-pin" class="w-3 h-3"></i> ${addr}, ${pop}
                             </p>
+                            
+                            <div class="mt-2.5 bg-slate-50 border border-slate-100 rounded-xl p-2.5 relative">
+                                <p class="text-[10px] text-slate-600 font-medium leading-relaxed line-clamp-2 pr-4">${desc}</p>
+                                <i data-lucide="info" class="w-3 h-3 text-slate-300 absolute right-2 top-2.5"></i>
+                            </div>
                         </div>
-                        <div class="text-slate-300 shrink-0 pr-2">
+                        <div class="text-slate-300 shrink-0 pr-2 self-center">
                             <i data-lucide="chevron-right"></i>
                         </div>
                     </div>
@@ -547,6 +557,51 @@
             lucide.createIcons();
         }
 
+        // 🔥 MEJORA: El "Mata-Fantasmas" por si se intenta abrir un aviso que ya no está en BD
+        async function openActionModal(id) {
+            let s = localServices.find(x => x.id === id);
+            
+            if (!s) {
+                try {
+                    showToast("Cargando datos...");
+                    const res = await fetch(`${API_URL}/services/active`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } });
+                    const data = await res.json();
+                    s = data.services.find(x => x.id === id);
+                    if (s) localServices.push(s);
+                } catch(e) {}
+            }
+
+            if (!s) {
+                showToast("El aviso ya no está disponible", true);
+                refreshData();
+                return;
+            }
+
+            const raw = s.raw_data;
+
+            document.getElementById('detId').value = s.id;
+            document.getElementById('detRef').innerText = `Exp. #${s.service_ref || "S/R"}`;
+            document.getElementById('detName').innerText = raw["Nombre Cliente"] || "Asegurado";
+            document.getElementById('detAddress').innerText = `${raw["Dirección"] || ""}, ${raw["Población"] || ""}`;
+            
+            const rawPhone = raw["Teléfono"] || raw["TELEFONOS"] || raw["TELEFONO"] || "";
+            const matchPhone = rawPhone.toString().match(/[6789]\d{8}/);
+            document.getElementById('detPhoneRaw').value = matchPhone ? matchPhone[0] : "";
+
+            document.getElementById('durationInput').value = "60"; 
+            pickerSelectedDate = ""; 
+            pickerSelectedTime = ""; 
+            buildDayCarousel(); 
+            checkSaveButton();
+
+            const modal = document.getElementById('actionModal');
+            const content = document.getElementById('modalContent');
+            modal.classList.remove('hidden');
+            void modal.offsetWidth; 
+            modal.classList.remove('opacity-0');
+            content.classList.remove('translate-y-full');
+        }
+
         async function markClientNotFound(serviceId, currentTimes) {
             const btn = event.currentTarget;
             const originalHtml = btn.innerHTML;