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

Actualizar calendario.html

Browse Source
This commit is contained in:
marsalva
2026-03-07 18:00:07 +00:00
parent 4b244b8463
commit 825f5067c1
1 changed files with 53 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
calendario.html
View File

@@ -57,9 +57,9 @@
<a href="menu.html" class="w-10 h-10 shrink-0 bg-slate-50 rounded-full flex items-center justify-center text-slate-600 border border-slate-200 active:scale-95 transition-transform">
<i data-lucide="arrow-left" class="w-5 h-5"></i>
</a>
<div class="flex-1 min-w-0 text-left">
<div class="flex-1 min-w-0 text-left">
<p class="text-[10px] font-black text-primary-dynamic uppercase tracking-widest mb-0.5 truncate" id="monthYearDisplay">Cargando...</p>
<div class="flex items-center gap-2">
<div class="flex items-center gap-2" onclick="if(lastUnreadCount > 0) showNotifList()">
<h1 class="text-xl font-black tracking-tight text-slate-900 leading-none truncate">Mi Agenda</h1>
<div id="topNotificationBadge" class="hidden bg-red-500 text-white text-[10px] font-black px-1.5 py-0.5 rounded-full animate-bounce shadow-sm border border-white">!</div>
</div>
@@ -71,6 +71,16 @@
</div>
<div class="overflow-x-auto no-scrollbar py-2 -mx-5 px-5 flex gap-3" id="weekStrip"></div>
</header>
<div id="notifPanel" class="hidden absolute top-32 left-5 right-5 bg-white rounded-3xl shadow-2xl z-50 border border-blue-100 fade-in overflow-hidden">
<div class="p-4 bg-blue-600 text-white flex justify-between items-center">
<span class="text-xs font-black uppercase tracking-widest">Mensajes Pendientes</span>
<button onclick="document.getElementById('notifPanel').classList.add('hidden')"><i data-lucide="x" class="w-4 h-4"></i></button>
</div>
<div id="notifList" class="max-h-60 overflow-y-auto p-2 space-y-2 bg-slate-50">
</div>
</div>
<audio id="notifSound" src="https://assets.mixkit.co/active_storage/sfx/2358/2358-preview.mp3" preload="auto"></audio>
<main class="flex-1 overflow-y-auto no-scrollbar p-5 main-content relative z-10" id="mainArea">
<div id="loader" class="text-center py-10 opacity-50">
@@ -331,26 +341,66 @@
setInterval(checkNotifications, 30000);
});
let lastUnreadCount = 0; // Para saber si el número ha subido y sonar
async function checkNotifications() {
try {
const res = await fetch(`${API_URL}/worker/notifications`, {
headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` }
});
const data = await res.json();
if (data.ok) {
activeNotifications = data.serviceIds;
const badge = document.getElementById('topNotificationBadge');
const panel = document.getElementById('topNotificationBadge').parentElement; // El contenedor para el click
if (data.unreadCount > 0) {
badge.classList.remove('hidden');
badge.innerText = data.unreadCount;
// Si hay más mensajes que antes, ¡SUENA!
if (data.unreadCount > lastUnreadCount) {
document.getElementById('notifSound').play().catch(e => console.warn("Audio bloqueado por el navegador"));
}
// Hacer que el globo sea clicable
badge.style.cursor = 'pointer';
badge.onclick = (e) => { e.stopPropagation(); showNotifList(); };
} else {
badge.classList.add('hidden');
}
renderServices(); // Refrescamos para pintar los iconos en las tarjetas
lastUnreadCount = data.unreadCount;
renderServices(); // Refrescamos iconos en tarjetas
}
} catch (e) {}
}
async function showNotifList() {
const panel = document.getElementById('notifPanel');
const list = document.getElementById('notifList');
panel.classList.remove('hidden');
list.innerHTML = '<p class="text-center p-4 text-xs font-bold text-slate-400">Cargando...</p>';
// Obtenemos los nombres de los siniestros con mensajes
list.innerHTML = activeNotifications.map(id => {
const s = localServices.find(x => x.id === id);
const name = s ? (s.raw_data["Nombre Cliente"] || "Expediente") : "Nuevo Mensaje";
const ref = s ? s.service_ref : id;
return `
<div onclick="openService(${id}); document.getElementById('notifPanel').classList.add('hidden')" class="bg-white p-3 rounded-xl border border-slate-200 flex items-center justify-between active:scale-95 transition-all">
<div class="flex flex-col">
<span class="text-[10px] font-black text-blue-600 uppercase">#${ref}</span>
<span class="text-xs font-bold text-slate-700">${name}</span>
</div>
<i data-lucide="chevron-right" class="w-4 h-4 text-slate-300"></i>
</div>
`;
}).join('');
safeLoadIcons();
}
async function loadGuilds() {
try {
const res = await fetch(`${API_URL}/guilds`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } });