Actualizar servicios.html

This commit is contained in:
2026-02-15 22:29:05 +00:00
parent f6b59a8407
commit 73d3e037bf

View File

@@ -130,38 +130,59 @@
} catch (e) { console.error(e); } } catch (e) { console.error(e); }
} }
function renderLists() { function renderLists() {
const pending = localData.filter(s => !s.raw_data.scheduled_date); // 1. Pendientes de Cita (Recién aceptados o asignados manual sin fecha)
const assigned = localData.filter(s => s.raw_data.scheduled_date); const pending = localData.filter(s => s.estado_operativo === 'asignado_operario');
// 2. Servicios en Curso (Ya tienen fecha de cita grabada)
const assigned = localData.filter(s => s.estado_operativo === 'citado');
document.getElementById('pending-list').innerHTML = pending.map(s => cardTemplate(s, 'amber')).join(''); // Renderizamos con colores y textos específicos
document.getElementById('assigned-list').innerHTML = assigned.map(s => cardTemplate(s, 'emerald')).join(''); document.getElementById('pending-list').innerHTML = pending.length > 0
lucide.createIcons(); ? pending.map(s => cardTemplate(s, 'blue', 'Asignado a Operario')).join('')
} : '<p class="text-center text-gray-400 text-xs py-10">No hay servicios pendientes de cita.</p>';
function cardTemplate(s, color) { document.getElementById('assigned-list').innerHTML = assigned.length > 0
const raw = s.raw_data; ? assigned.map(s => cardTemplate(s, 'emerald', 'Citado')).join('')
const name = raw["Nombre Cliente"] || raw["CLIENTE"] || "Asegurado"; : '<p class="text-center text-gray-400 text-xs py-10">No hay servicios con cita programada.</p>';
const addr = raw["Dirección"] || raw["DOMICILIO"] || "---";
const worker = s.assigned_name || 'Sin operario'; lucide.createIcons();
}
function cardTemplate(s, color, label) {
const raw = s.raw_data;
const client = raw["Nombre Cliente"] || raw["CLIENTE"] || "Asegurado";
const addr = raw["Dirección"] || raw["DOMICILIO"] || "---";
const dateStr = raw.scheduled_date ? `${raw.scheduled_date} a las ${raw.scheduled_time}` : 'Sin fecha';
return `
<div class="bg-white p-5 rounded-[2rem] border border-slate-100 shadow-sm card-hover text-left flex items-start justify-between gap-4">
<div class="space-y-1">
<div class="flex items-center gap-2 mb-1">
<span class="text-[9px] font-black bg-${color}-100 text-${color}-600 px-2 py-0.5 rounded-full uppercase">${label}</span>
<span class="text-[9px] font-bold text-slate-300">#${s.service_ref}</span>
</div>
<h4 class="font-black text-slate-800 uppercase text-sm leading-tight">${client}</h4>
<p class="text-[10px] text-slate-400 font-bold uppercase truncate max-w-[200px]">${addr}</p>
return ` <div class="flex items-center gap-4 mt-3">
<div class="bg-white p-5 rounded-[2rem] border border-slate-100 shadow-sm card-hover text-left flex items-start justify-between gap-4"> <div class="flex items-center gap-1.5">
<div class="space-y-1"> <div class="w-5 h-5 rounded-full bg-slate-100 flex items-center justify-center text-slate-500"><i data-lucide="user" class="w-3 h-3"></i></div>
<span class="text-[9px] font-black bg-${color}-100 text-${color}-600 px-2 py-0.5 rounded-full uppercase">#${s.service_ref}</span> <span class="text-[10px] font-black text-slate-600 uppercase">${s.assigned_name || 'Pendiente'}</span>
<h4 class="font-black text-slate-800 uppercase text-sm leading-tight">${name}</h4>
<p class="text-[10px] text-slate-400 font-bold uppercase truncate max-w-[200px]">${addr}</p>
<div class="flex items-center gap-2 mt-2">
<div class="w-6 h-6 rounded-full bg-slate-100 flex items-center justify-center text-slate-400"><i data-lucide="user" class="w-3 h-3"></i></div>
<span class="text-[11px] font-black text-slate-600 uppercase">${worker}</span>
</div>
</div> </div>
<div class="flex flex-col gap-2"> ${raw.scheduled_date ? `
<button class="p-3 bg-slate-50 rounded-2xl text-slate-400 hover:bg-blue-50 hover:text-blue-600 transition-all"><i data-lucide="calendar" class="w-5 h-5"></i></button> <div class="flex items-center gap-1.5">
<button class="p-3 bg-slate-50 rounded-2xl text-slate-400 hover:bg-emerald-50 hover:text-emerald-600 transition-all"><i data-lucide="message-square" class="w-5 h-5"></i></button> <div class="w-5 h-5 rounded-full bg-blue-50 flex items-center justify-center text-blue-500"><i data-lucide="calendar" class="w-3 h-3"></i></div>
</div> <span class="text-[10px] font-black text-blue-600 uppercase">${dateStr}</span>
</div>`; </div>` : ''}
} </div>
</div>
<div class="flex flex-col gap-2">
<button onclick="openCalendarModal(${s.id})" class="p-3 bg-slate-50 rounded-2xl text-slate-400 hover:bg-blue-600 hover:text-white transition-all shadow-sm"><i data-lucide="calendar-plus" class="w-5 h-5"></i></button>
<button onclick="openChat(${s.id})" class="p-3 bg-slate-50 rounded-2xl text-slate-400 hover:bg-emerald-600 hover:text-white transition-all shadow-sm"><i data-lucide="message-circle" class="w-5 h-5"></i></button>
</div>
</div>`;
}
async function saveNewService(e) { async function saveNewService(e) {
e.preventDefault(); e.preventDefault();