Actualizar servicios.html

servicios.html

@@ -142,6 +142,13 @@
                                 <div>
                                     <label class="label-modern">Teléfono</label>
                                     <input type="tel" id="nPhone" placeholder="Ej: 600123456" class="input-modern" required>
+
+                                    <div id="addrSuggestions" class="hidden mt-2 p-3 bg-amber-50 border border-amber-200 rounded-xl text-[10px] font-bold text-amber-700 flex items-center gap-2">
+    <i data-lucide="info" class="w-3 h-3"></i> 
+    <span>Este cliente ya tiene direcciones guardadas. Puedes usar la actual o escribir una nueva.</span>
+</div>
+
+
                                 </div>
                                 <div>
                                     <label class="label-modern">Nombre Completo</label>
@@ -383,6 +390,40 @@
     </div>
 
     <script src="js/layout.js"></script>
+
+
+    // --- FUNCIÓN PARA BUSCAR CLIENTE POR TELÉFONO AL ESCRIBIR ---
+async function searchClientByPhone(phone) {
+    if (phone.length < 9) {
+        document.getElementById('addrSuggestions').classList.add('hidden');
+        return;
+    }
+    try {
+        const res = await fetch(`${API_URL}/clients/search?phone=${phone}`, {
+            headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` }
+        });
+        const data = await res.json();
+        
+        if (data.ok && data.client) {
+            // Rellenar nombre si está vacío
+            const nameInput = document.getElementById('nName');
+            if (!nameInput.value) {
+                nameInput.value = data.client.full_name;
+                nameInput.classList.add('bg-emerald-50'); // Efecto visual de éxito
+            }
+            
+            // Mostrar aviso de direcciones si existen
+            const addrDiv = document.getElementById('addrSuggestions');
+            if (data.client.addresses && data.client.addresses.length > 0) {
+                addrDiv.classList.remove('hidden');
+                // Si el campo de dirección está vacío, ponemos la primera que tengamos
+                if (!document.getElementById('nAddr').value) {
+                    document.getElementById('nAddr').value = data.client.addresses[0];
+                }
+            }
+        }
+    } catch (e) { console.error("Error en buscador rápido:", e); }
+}
     <script>
         let localData = [];
         let systemStatuses = []; 
@@ -542,58 +583,40 @@
 
     const searchTerm = document.getElementById('searchFilter').value.toLowerCase();
     const selectedOp = document.getElementById('opFilter').value;
-            const weekValue = document.getElementById('weekFilter').value; 
 
-            // Inicializamos contadores reales
+    // Reiniciamos contadores para volver a sumarlos
-            let kpiUnassigned = 0;
+    let kpiUnassigned = 0, kpiScheduled = 0, kpiWaiting = 0, kpiIncident = 0;
-            let kpiScheduled = 0;
-            let kpiWaiting = 0;
-            let kpiIncident = 0;
 
     const filteredData = localData.filter(s => {
         const raw = s.raw_data || {};
         const stateInfo = getServiceStateInfo(s);
-                s._stateInfo = stateInfo; // Guardamos info para el render
+        s._stateInfo = stateInfo; 
-
-                // LÓGICA DE CONTADORES REVOLUCIONADA:
         const stName = stateInfo.name.toLowerCase();
         
-                // 1. SIN ASIGNAR: No tiene nombre de operario O está en bolsa
+        // --- LÓGICA DE SUMA DE CONTADORES ---
         if (!s.assigned_name || stateInfo.id === 'bolsa' || stName.includes('asignar')) {
             kpiUnassigned++;
-                } 
+        } else if (stName.includes('incidencia') || stName.includes('pausa')) {
-                // 2. INCIDENCIA: El estado tiene la palabra clave
-                else if (stName.includes('incidencia') || stName.includes('pausa')) {
             kpiIncident++;
-                } 
+        } else if (raw.scheduled_date && raw.scheduled_date !== "" && !stateInfo.is_final) {
-                // 3. AGENDADOS: Tiene fecha puesta y no es un estado final
-                else if (raw.scheduled_date && raw.scheduled_date !== "" && !stateInfo.is_final) {
             kpiScheduled++;
-                } 
+        } else if (!stateInfo.is_final && !raw.scheduled_date) {
-                // 4. ESPERA CLIENTE: No tiene cita pero ya tiene técnico (o estado específico)
-                else if (!stateInfo.is_final && (!raw.scheduled_date || stName.includes('espera'))) {
             kpiWaiting++;
         }
 
-                // Filtros de búsqueda
+        // Filtro de búsqueda visual
-                const name = (raw["Nombre Cliente"] || raw["CLIENTE"] || "").toLowerCase();
+        const matchesSearch = searchTerm === "" || 
-                const ref = (s.service_ref || "").toLowerCase();
+            (raw["Nombre Cliente"] || "").toLowerCase().includes(searchTerm) || 
-                const matchesSearch = searchTerm === "" || name.includes(searchTerm) || ref.includes(searchTerm);
+            (s.service_ref || "").toLowerCase().includes(searchTerm) ||
+            (raw["Teléfono"] || "").toLowerCase().includes(searchTerm);
+            
         const matchesOp = selectedOp === "ALL" || s.assigned_name === selectedOp;
+        const matchesStatus = (activeStatusFilter === "ALL") ? true : String(stateInfo.id) === activeStatusFilter;
 
-                let matchesWeek = true;
+        return matchesSearch && matchesOp && matchesStatus;
-                if (weekValue !== "" && raw.scheduled_date) {
-                    matchesWeek = isDateInWeekString(raw.scheduled_date, weekValue);
-                } else if (weekValue !== "") {
-                    matchesWeek = false;
-                }
-                
-                let matchesStatus = (activeStatusFilter === "ALL") ? true : String(stateInfo.id) === activeStatusFilter;
-
-                return matchesSearch && matchesOp && matchesWeek && matchesStatus;
     });
 
-            // Actualizamos la vista con los números reales
+    // Inyectar los números en los circulitos de arriba
     document.getElementById('kpi-unassigned').innerText = kpiUnassigned;
     document.getElementById('kpi-scheduled').innerText = kpiScheduled;
     document.getElementById('kpi-waiting').innerText = kpiWaiting;
@@ -602,10 +625,7 @@
     const grid = document.getElementById('servicesGrid');
     grid.innerHTML = filteredData.length > 0 
         ? filteredData.map(s => buildGridCard(s)).join('')
-                : `<div class="col-span-full py-20 text-center bg-white rounded-[2rem] border-2 border-dashed border-slate-200">
+        : `<div class="col-span-full py-20 text-center text-slate-400 font-bold">No hay servicios con estos filtros</div>`;
-                        <i data-lucide="layout-grid" class="w-12 h-12 text-slate-300 mx-auto mb-3"></i>
-                        <p class="text-slate-400 font-bold uppercase tracking-widest text-sm">No hay servicios que coincidan</p>
-                   </div>`;
 
     lucide.createIcons();
 }
@@ -970,6 +990,39 @@
                 lucide.createIcons();
             }
         }
+
+        // --- FUNCIÓN PARA BUSCAR CLIENTE POR TELÉFONO AL ESCRIBIR ---
+async function searchClientByPhone(phone) {
+    if (phone.length < 9) {
+        document.getElementById('addrSuggestions').classList.add('hidden');
+        return;
+    }
+    try {
+        const res = await fetch(`${API_URL}/clients/search?phone=${phone}`, {
+            headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` }
+        });
+        const data = await res.json();
+        
+        if (data.ok && data.client) {
+            // Rellenar nombre si está vacío
+            const nameInput = document.getElementById('nName');
+            if (!nameInput.value) {
+                nameInput.value = data.client.full_name;
+                nameInput.classList.add('bg-emerald-50'); // Efecto visual de éxito
+            }
+            
+            // Mostrar aviso de direcciones si existen
+            const addrDiv = document.getElementById('addrSuggestions');
+            if (data.client.addresses && data.client.addresses.length > 0) {
+                addrDiv.classList.remove('hidden');
+                // Si el campo de dirección está vacío, ponemos la primera que tengamos
+                if (!document.getElementById('nAddr').value) {
+                    document.getElementById('nAddr').value = data.client.addresses[0];
+                }
+            }
+        }
+    } catch (e) { console.error("Error en buscador rápido:", e); }
+}
     </script>
 </body>
 </html>