From 64fe4717ac97491d82980d8b984087c06e6aaa56 Mon Sep 17 00:00:00 2001 From: marsalva Date: Thu, 26 Feb 2026 07:55:17 +0000 Subject: [PATCH] Actualizar index.html --- index.html | 115 +++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 81 insertions(+), 34 deletions(-) diff --git a/index.html b/index.html index abce316..bedc961 100644 --- a/index.html +++ b/index.html @@ -75,7 +75,7 @@ : 'https://integrarepara-api.integrarepara.es'; let urlToken = ""; - let etasToInit = []; // Para procesar los tiempos de llegada al cargar + let etasToInit = []; document.addEventListener("DOMContentLoaded", async () => { lucide.createIcons(); @@ -149,7 +149,6 @@ const historyContainerWrapper = document.getElementById('historyContainerWrapper'); const historyContainer = document.getElementById('historyServicesContainer'); - // Limpiar contenedores por si acaso (útil si hay recargas) activeContainer.innerHTML = ''; historyContainer.innerHTML = ''; @@ -157,12 +156,12 @@ let hasHistory = false; allServices.forEach(srv => { - // Usamos la nueva variable booleana que nos manda el servidor const isFinalized = srv.is_final; const raw = srv.raw_data || {}; const descLimpia = summarizeDescription(srv.description); let statusHtml = ''; + // ESTRUCTURA PRINCIPAL DE ESTADOS if (isFinalized) { statusHtml = `
@@ -214,13 +213,21 @@ else if (srv.status_name === 'Visita Agendada' || (srv.scheduled_date && srv.scheduled_time)) { const endT = addOneHour(srv.scheduled_time); statusHtml = ` -
-
-
-

Visita Confirmada

-

${formatDate(srv.scheduled_date)}

-

Llegada aprox: ${srv.scheduled_time} - ${endT}

+
+
+
+ +
+
+

Visita Confirmada

+

${formatDate(srv.scheduled_date)}

+

${srv.scheduled_time} - ${endT}

+
+ + + Modificar Cita +
`; } else { @@ -231,21 +238,76 @@
`; } + // ===================================== + // NUEVO: BLOQUE DE BOTONES DE CONTACTO + // ===================================== + let contactHtml = ''; + const hasWorker = srv.assigned_worker && srv.assigned_worker !== 'Pendiente'; + + if (hasWorker && !isFinalized) { + // Extraemos el teléfono del trabajador (si la BD lo manda) o usamos uno temporal para que funcione el enlace + const workerPhone = srv.worker_phone ? srv.worker_phone.replace('+', '') : "34000000000"; + + contactHtml = ` +
+ + Llamar Técnico + + + WhatsApp + +
+ `; + } + + // ===================================== + // NUEVO: DATOS DEL ASEGURADO (CAJA LIMPIA) + // ===================================== + const clientDataHtml = ` +
+

Información del Siniestro

+
+
+ +

${raw["Nombre Cliente"] || raw["CLIENTE"] || client.name || "Asegurado"}

+
+
+ +

+ ${raw["Dirección"] || raw["DOMICILIO"] || "Dirección no especificada"}
+ ${raw["Código Postal"] || ""} ${raw["Población"] || raw["POBLACION-PROVINCIA"] || ""} +

+
+
+ +

${raw["Compañía"] || raw["COMPAÑIA"] || "Particular"}

+
+
+
+ `; + + // ENSAMBLAJE DE LA TARJETA FINAL let cardHtml = ` -
+
${srv.title} - ${srv.assigned_worker && srv.assigned_worker !== 'Pendiente' ? + ${hasWorker ? `

Técnico

${srv.assigned_worker.split(' ')[0]}

` : '' }
-
${statusHtml}
-
+ +
${statusHtml}
+ + ${contactHtml} + + ${clientDataHtml} + +

Motivo de la Visita

-

${descLimpia}

+

${descLimpia}

`; @@ -259,18 +321,11 @@ } }); - // Lógica para mostrar/ocultar secciones - if (!hasActive) { - document.getElementById('noActiveServices').classList.remove('hidden'); - } else { - document.getElementById('noActiveServices').classList.add('hidden'); - } + if (!hasActive) document.getElementById('noActiveServices').classList.remove('hidden'); + else document.getElementById('noActiveServices').classList.add('hidden'); - if (hasHistory) { - historyContainerWrapper.classList.remove('hidden'); - } else { - historyContainerWrapper.classList.add('hidden'); - } + if (hasHistory) document.getElementById('historyContainerWrapper').classList.remove('hidden'); + else document.getElementById('historyContainerWrapper').classList.add('hidden'); lucide.createIcons(); @@ -279,7 +334,6 @@ document.getElementById('loader').classList.add('hidden'); document.getElementById('mainContent').classList.remove('hidden'); - // Disparamos el cálculo de ETA para los que estén De Camino etasToInit.forEach(item => calculateClientETA(item.id, item.address)); }, 300); } @@ -291,7 +345,6 @@ const container = document.getElementById(`eta-container-${serviceId}`); try { - // 1. Obtenemos la ubicación de donde salió el técnico const res = await fetch(`${API_URL}/public/portal/${urlToken}/location/${serviceId}`); const data = await res.json(); @@ -303,7 +356,6 @@ const wLat = parseFloat(data.location.lat); const wLon = parseFloat(data.location.lng); - // 2. Buscamos las coordenadas del cliente let geoRes = await fetch(`https://nominatim.openstreetmap.org/search?format=json&q=${encodeURIComponent(destAddress + ', España')}`); let geoData = await geoRes.json(); @@ -318,7 +370,6 @@ const cLat = parseFloat(geoData[0].lat); const cLon = parseFloat(geoData[0].lon); - // 3. Calculamos la distancia en línea recta (Fórmula de Haversine) const R = 6371; const dLat = (cLat - wLat) * Math.PI / 180; const dLon = (cLon - wLon) * Math.PI / 180; @@ -326,23 +377,19 @@ const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); const km = R * c; - // 4. Estimamos los minutos totales (velocidad media ciudad 35km/h + 5min atascos/aparcar) const totalMins = Math.round((km/35)*60) + 5; - // 5. EL TRUCO MAGICO: Restar los minutos que ya han pasado desde que salió const startedAt = new Date(data.location.updated_at).getTime(); const now = new Date().getTime(); const diffMins = Math.floor((now - startedAt) / 60000); let remainingMins = totalMins - diffMins; - if (remainingMins < 1) remainingMins = 1; // Para que no ponga 0 o negativo + if (remainingMins < 1) remainingMins = 1; - // Calculamos el % para la barra visual let progressPercent = (diffMins / totalMins) * 100; if (progressPercent > 95) progressPercent = 95; if (progressPercent < 5) progressPercent = 5; - // Dibujamos la barra visual container.innerHTML = `

Llegada en aprox. ${remainingMins} min