Actualizar calendario.html
This commit is contained in:
@@ -513,28 +513,76 @@
|
||||
'purple': { text: 'text-purple-600', bg: 'bg-purple-50', border: 'border-purple-100' }
|
||||
};
|
||||
|
||||
function renderServices() {
|
||||
function renderServices() {
|
||||
const container = document.getElementById('servicesList');
|
||||
const dayTitle = document.getElementById('dayTitle');
|
||||
const displayDate = selectedDateStr.split('-').reverse().join('/');
|
||||
document.getElementById('dayTitle').innerText = `DÍA ${displayDate}`;
|
||||
|
||||
const dayServices = localServices.filter(s => String(s.raw_data.scheduled_date || "").trim() === selectedDateStr);
|
||||
dayServices.sort((a, b) => String(a.raw_data.scheduled_time || "23:59").localeCompare(String(b.raw_data.scheduled_time || "23:59")));
|
||||
const queryInput = document.getElementById('searchInput');
|
||||
const query = queryInput ? queryInput.value.toLowerCase().trim() : "";
|
||||
|
||||
if (dayServices.length === 0) {
|
||||
container.innerHTML = `<div class="text-center py-20 bg-white rounded-[3rem] border border-slate-100 shadow-sm mt-4"><i data-lucide="coffee" class="w-12 h-12 text-slate-200 mx-auto mb-3"></i><h3 class="font-black text-slate-800">Día de Descanso</h3><p class="text-xs text-slate-400 font-medium">No tienes servicios para este día.</p></div>`;
|
||||
let servicesToRender = [];
|
||||
|
||||
// 🔥 MODO BÚSQUEDA GLOBAL O MODO DÍA NORMAL 🔥
|
||||
if (query === "") {
|
||||
// Modo Normal: Solo mostramos el día seleccionado en el carrusel
|
||||
dayTitle.innerText = `DÍA ${displayDate}`;
|
||||
servicesToRender = localServices.filter(s => String(s.raw_data.scheduled_date || "").trim() === selectedDateStr);
|
||||
|
||||
// Ordenar por hora
|
||||
servicesToRender.sort((a, b) => String(a.raw_data.scheduled_time || "23:59").localeCompare(String(b.raw_data.scheduled_time || "23:59")));
|
||||
} else {
|
||||
// Modo Búsqueda: Ignoramos el día y buscamos en TODA la agenda
|
||||
dayTitle.innerText = `RESULTADOS DE BÚSQUEDA TOTA LES`;
|
||||
servicesToRender = localServices.filter(s => {
|
||||
const raw = s.raw_data || {};
|
||||
const searchString = `
|
||||
${s.service_ref || ""}
|
||||
${raw["Nombre Cliente"] || raw["CLIENTE"] || ""}
|
||||
${raw["Dirección"] || raw["DOMICILIO"] || ""}
|
||||
${raw["Población"] || raw["POBLACION-PROVINCIA"] || ""}
|
||||
${raw["Descripción"] || raw["DESCRIPCION"] || raw["Averia"] || ""}
|
||||
${raw["Compañía"] || raw["Procedencia"] || ""}
|
||||
`.toLowerCase();
|
||||
return searchString.includes(query);
|
||||
});
|
||||
|
||||
// Ordenar por fecha y luego por hora
|
||||
servicesToRender.sort((a, b) => {
|
||||
const dateA = String(a.raw_data.scheduled_date || "9999-12-31");
|
||||
const dateB = String(b.raw_data.scheduled_date || "9999-12-31");
|
||||
if (dateA !== dateB) return dateA.localeCompare(dateB);
|
||||
return String(a.raw_data.scheduled_time || "23:59").localeCompare(String(b.raw_data.scheduled_time || "23:59"));
|
||||
});
|
||||
}
|
||||
|
||||
// Si la lista final está vacía (ya sea por descanso o porque la búsqueda no coincide)
|
||||
if (servicesToRender.length === 0) {
|
||||
const isSearch = query !== "";
|
||||
container.innerHTML = `
|
||||
<div class="text-center py-20 bg-white rounded-[3rem] border border-slate-100 shadow-sm mt-4">
|
||||
<i data-lucide="${isSearch ? 'search-x' : 'coffee'}" class="w-12 h-12 text-slate-200 mx-auto mb-3"></i>
|
||||
<h3 class="font-black text-slate-800">${isSearch ? 'Sin resultados' : 'Día de Descanso'}</h3>
|
||||
<p class="text-xs text-slate-400 font-medium">${isSearch ? 'No hay coincidencias en toda tu agenda.' : 'No tienes servicios para este día.'}</p>
|
||||
</div>`;
|
||||
safeLoadIcons(); return;
|
||||
}
|
||||
|
||||
container.innerHTML = dayServices.map(s => {
|
||||
container.innerHTML = servicesToRender.map(s => {
|
||||
const raw = s.raw_data || {};
|
||||
const time = raw.scheduled_time || "--:--";
|
||||
let time = raw.scheduled_time || "--:--";
|
||||
|
||||
// 🔥 DETALLE PRO: Si estamos buscando, mostramos el día de la cita en la tarjeta
|
||||
if (query !== "" && raw.scheduled_date) {
|
||||
const [y, m, d] = raw.scheduled_date.split('-');
|
||||
time = `<span class="text-[9px] text-slate-400 font-bold block leading-none mb-0.5">${d}/${m}</span>${time}`;
|
||||
}
|
||||
|
||||
// ¿Tiene este siniestro un mensaje nuevo?
|
||||
const hasNewMessage = activeNotifications.includes(s.id);
|
||||
|
||||
if (s.provider === 'SYSTEM_BLOCK') {
|
||||
return `<div class="bg-blue-50/50 p-5 rounded-3xl border border-slate-200 flex gap-4"><div class="flex flex-col items-center justify-center border-r border-slate-200 pr-4 shrink-0"><i data-lucide="lock" class="w-5 h-5 text-primary-dynamic"></i><span class="font-black text-primary-dynamic text-sm mt-1">${time}</span></div><div class="min-w-0 flex-1"><h3 class="font-black text-primary-dynamic text-sm uppercase">BLOQUEADO</h3><p class="text-[10px] font-bold text-slate-400 mt-1 uppercase">${raw["Descripción"] || ""}</p></div></div>`;
|
||||
return `<div class="bg-blue-50/50 p-5 rounded-3xl border border-slate-200 flex gap-4"><div class="flex flex-col items-center justify-center border-r border-slate-200 pr-4 shrink-0 text-center"><i data-lucide="lock" class="w-5 h-5 text-primary-dynamic mx-auto"></i><span class="font-black text-primary-dynamic text-sm mt-1">${time}</span></div><div class="min-w-0 flex-1"><h3 class="font-black text-primary-dynamic text-sm uppercase">BLOQUEADO</h3><p class="text-[10px] font-bold text-slate-400 mt-1 uppercase">${raw["Descripción"] || ""}</p></div></div>`;
|
||||
}
|
||||
|
||||
const name = raw["Nombre Cliente"] || raw["CLIENTE"] || "Asegurado";
|
||||
@@ -566,11 +614,12 @@
|
||||
` : ''}
|
||||
|
||||
${s.is_urgent ? '<div class="absolute top-0 right-0 bg-primary-dynamic text-white text-[8px] font-black px-3 py-1.5 rounded-bl-xl uppercase tracking-widest z-10">Urgente</div>' : ''}
|
||||
<div class="flex flex-col items-center justify-center border-r border-slate-100 pr-4 shrink-0 min-w-[70px]">
|
||||
<div class="${cMap.bg} ${cMap.text} p-2 rounded-xl mb-1 ${cMap.border} border shadow-sm">
|
||||
|
||||
<div class="flex flex-col items-center justify-center border-r border-slate-100 pr-4 shrink-0 min-w-[70px] text-center">
|
||||
<div class="${cMap.bg} ${cMap.text} p-2 rounded-xl mb-1 ${cMap.border} border shadow-sm mx-auto">
|
||||
<i data-lucide="${iconName}" class="w-5 h-5"></i>
|
||||
</div>
|
||||
<span class="font-black text-slate-900 text-sm">${time}</span>
|
||||
<span class="font-black text-slate-900 text-sm mt-1">${time}</span>
|
||||
</div>
|
||||
<div class="min-w-0 flex-1">
|
||||
<div class="flex flex-wrap gap-1.5 mb-2">
|
||||
|
||||
Reference in New Issue
Block a user