marsalva/Portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actualizar index.html

Browse Source
This commit is contained in:
marsalva
2026-02-24 21:03:55 +00:00
parent 6ff883bb16
commit e1af474ba7
1 changed files with 19 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
index.html
View File

@@ -9,6 +9,7 @@
<style>
body {
background-color: #f4f7f9;
/* Patrón de fondo muy sutil */
background-image: radial-gradient(#e2e8f0 1px, transparent 1px);
background-size: 24px 24px;
}
@@ -145,18 +146,17 @@
let text = rawText.replace(/\n/g, ' ');
// 2. Cortamos el texto justo antes de donde empieza la basura habitual de los seguros
// (fechas entre paréntesis, "M.O.", "MATERIAL", "ASEGURADO INFORMADO", "URGENTE", etc)
const regexCorte = /(\(|\bM\.O\b|\bMATERIAL\b|\bASEGURADO\b|\bTELEFONO\b|\bURGENTE\b)/i;
let cutPos = text.search(regexCorte);
if (cutPos > 5) { // Si encuentra la palabra clave y no es al inicio
if (cutPos > 5) {
text = text.substring(0, cutPos);
}
// 3. Limpiamos espacios extra
text = text.trim();
// 4. Lo pasamos a formato "Capitalizado" (Primera en mayúscula, resto minúsculas)
// 4. Lo pasamos a formato "Capitalizado"
text = text.charAt(0).toUpperCase() + text.slice(1).toLowerCase();
// 5. Cogemos solo las primeras 8-10 palabras para que quede bonito
@@ -165,7 +165,6 @@
return words.slice(0, 10).join(" ") + "...";
}
// Si quedó muy vacío, devolvemos genérico
if (text.length < 5) return "Reparación general solicitada.";
return text.endsWith('.') ? text : text + ".";
@@ -229,25 +228,28 @@
</div>
`;
} else if (isPendingWorker) {
// MODO 1: AÚN NO HAY TÉCNICO (Botón de agendar bloqueado)
// MODO 1: AÚN NO HAY TÉCNICO - AHORA CON DISEÑO AZUL Y BONITO
statusHtml = `
<div class="bg-slate-100 border border-slate-200 p-6 rounded-2xl text-center">
<div class="w-12 h-12 bg-slate-200 text-slate-500 rounded-full flex items-center justify-center mx-auto mb-3">
<i data-lucide="search" class="w-6 h-6 animate-pulse"></i>
<div class="bg-blue-50/50 border border-blue-100 p-6 rounded-2xl text-center">
<div class="w-12 h-12 bg-blue-100 text-blue-600 rounded-full flex items-center justify-center mx-auto mb-3 relative">
<span class="absolute inset-0 bg-blue-200 rounded-full animate-ping opacity-50"></span>
<i data-lucide="search" class="w-6 h-6 relative z-10"></i>
</div>
<h4 class="font-black text-slate-700 uppercase text-sm mb-1 tracking-tight">Buscando Técnico</h4>
<p class="text-[10px] text-slate-500 font-bold leading-tight px-4">Estamos asignando al técnico más cercano a tu domicilio. <br><br>En cuanto esté asignado, se habilitará la opción de agendar la visita aquí mismo.</p>
<h4 class="font-black text-slate-800 uppercase text-base leading-tight tracking-tight">Buscando Técnico</h4>
<p class="text-[10px] text-slate-500 font-medium mt-2 mb-2 px-2">Estamos asignando al técnico más cercano a tu domicilio para esta reparación.</p>
<p class="text-[10px] text-blue-600 font-bold leading-tight px-4 mt-2">En cuanto esté asignado, se habilitará la opción de agendar la visita aquí mismo.</p>
</div>
`;
} else if (srv.appointment_status === 'pending') {
// MODO 2: PENDIENTE DE ACEPTACIÓN POR LA OFICINA
statusHtml = `
<div class="bg-amber-50 border border-amber-200 p-5 rounded-2xl text-center shadow-inner">
<div class="w-10 h-10 bg-amber-100 text-amber-600 rounded-full flex items-center justify-center mx-auto mb-3">
<i data-lucide="clock" class="w-5 h-5 animate-pulse"></i>
<div class="w-10 h-10 bg-amber-100 text-amber-600 rounded-full flex items-center justify-center mx-auto mb-3 relative">
<span class="absolute inset-0 bg-amber-200 rounded-full animate-ping opacity-50"></span>
<i data-lucide="clock" class="w-5 h-5 relative z-10"></i>
</div>
<h4 class="font-black text-amber-800 uppercase text-sm mb-1 tracking-tight">Pendiente de Confirmación</h4>
<p class="text-[10px] text-amber-700 font-bold leading-tight">Tu solicitud de fecha ha sido enviada. El técnico debe confirmarla en breve.</p>
<p class="text-[10px] text-amber-700 font-bold leading-tight px-2 mt-2">Tu solicitud de fecha ha sido enviada. El técnico debe confirmarla en breve.</p>
</div>
`;
} else if (srv.status_name === 'Visita Agendada' || (srv.scheduled_date && srv.scheduled_time)) {
@@ -275,13 +277,13 @@
</div>
<div>
<h4 class="font-black text-indigo-800 uppercase text-sm tracking-tight">¡Técnico en camino!</h4>
<p class="text-[10px] text-indigo-600 font-bold">Llegando en breves momentos a tu domicilio.</p>
<p class="text-[10px] text-indigo-600 font-bold mt-1">Llegando en breves momentos a tu domicilio.</p>
</div>
</div>
<div class="w-full h-24 bg-indigo-100 rounded-xl border border-indigo-200 border-dashed flex items-center justify-center text-indigo-300 relative z-10">
<div class="text-center">
<i data-lucide="map" class="w-6 h-6 mx-auto mb-1 opacity-50"></i>
<p class="text-[8px] font-black uppercase tracking-widest">Señal GPS Próximamente</p>
<p class="text-[8px] font-black uppercase tracking-widest mt-1">Señal GPS Próximamente</p>
</div>
</div>
</div>
@@ -295,7 +297,7 @@
</div>
<div>
<h4 class="font-black text-orange-800 uppercase text-sm tracking-tight">En Reparación</h4>
<p class="text-[10px] text-orange-600 font-bold">El técnico está trabajando en tu domicilio ahora mismo.</p>
<p class="text-[10px] text-orange-600 font-bold mt-1">El técnico está trabajando en tu domicilio ahora mismo.</p>
</div>
</div>
`;
@@ -308,7 +310,7 @@
</div>
<div>
<h4 class="font-black text-red-800 uppercase text-sm tracking-tight">Incidencia / Pausado</h4>
<p class="text-[10px] text-red-600 font-bold">El servicio está pausado (ej: esperando pieza). Te avisaremos pronto.</p>
<p class="text-[10px] text-red-600 font-bold mt-1">El servicio está pausado (ej: esperando pieza). Te avisaremos pronto.</p>
</div>
</div>
`;