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

Actualizar aceptar.html

Browse Source
This commit is contained in:
marsalva
2026-02-16 08:27:42 +00:00
parent b2abddaffc
commit 287d862f23
1 changed files with 24 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
aceptar.html
View File

@@ -15,7 +15,7 @@
<div class="max-w-md mx-auto min-h-screen flex flex-col p-4"> <div class="max-w-md mx-auto min-h-screen flex flex-col p-4">
<div class="text-center py-6"> <div id="top-header" class="text-center py-6">
<div class="bg-blue-600 w-16 h-16 rounded-2xl flex items-center justify-center mx-auto shadow-lg shadow-blue-200 mb-4"> <div class="bg-blue-600 w-16 h-16 rounded-2xl flex items-center justify-center mx-auto shadow-lg shadow-blue-200 mb-4">
<i data-lucide="briefcase" class="text-white w-8 h-8"></i> <i data-lucide="briefcase" class="text-white w-8 h-8"></i>
</div> </div>
@@ -71,10 +71,10 @@
</div> </div>
<div id="error-screen" class="hidden text-center py-20 px-6"> <div id="error-screen" class="hidden text-center py-20 px-6">
<i data-lucide="clock-alert" class="w-16 h-16 text-slate-300 mx-auto mb-4"></i> <i data-lucide="clock-alert" class="w-20 h-20 text-slate-300 mx-auto mb-6"></i>
<h2 class="text-xl font-black text-slate-800 uppercase">¡Lo sentimos!</h2> <h2 class="text-2xl font-black text-slate-800 uppercase">¡Lo sentimos!</h2>
<p id="error-msg" class="text-slate-500 text-sm mt-2 font-medium">Este enlace ha caducado o el servicio ya ha sido asignado a otro compañero.</p> <p id="error-msg" class="text-slate-500 text-base mt-3 font-medium">Este enlace ha caducado o el servicio ya ha sido asignado a otro compañero.</p>
<button onclick="window.close()" class="mt-8 text-blue-600 font-bold uppercase text-xs">Cerrar ventana</button> <button onclick="window.close()" class="mt-10 text-blue-600 font-bold uppercase text-sm tracking-widest">Cerrar ventana</button>
</div> </div>
<div id="loading" class="flex-1 flex items-center justify-center"> <div id="loading" class="flex-1 flex items-center justify-center">
@@ -109,14 +109,13 @@
document.getElementById('location').innerText = `${raw["Población"] || 'Zona'} (CP: ${raw["Código Postal"] || '---'})`; document.getElementById('location').innerText = `${raw["Población"] || 'Zona'} (CP: ${raw["Código Postal"] || '---'})`;
document.getElementById('desc').innerText = raw["Descripción"] || "Revisar en el lugar."; document.getElementById('desc').innerText = raw["Descripción"] || "Revisar en el lugar.";
// Mostrar debug si existe, si no, mensaje normal
if (data.debug) { if (data.debug) {
const limitDate = new Date(data.debug.hora_limite_bd);
const timeStr = limitDate.toLocaleTimeString('es-ES', { hour: '2-digit', minute: '2-digit' });
document.getElementById('timer').innerHTML = ` document.getElementById('timer').innerHTML = `
Responde antes de que caduque el turno<br> Responde antes de que caduque el turno<br>
<span class="text-[10px] text-gray-500 font-mono font-normal mt-2 block"> <span class="text-xs text-slate-500 font-medium mt-2 block">Límite hasta las: <strong class="text-slate-800">${timeStr}</strong></span>
LÍMITE BD: ${new Date(data.debug.hora_limite_bd).toLocaleTimeString()}<br>
ACTUAL BD: ${new Date(data.debug.hora_actual_bd).toLocaleTimeString()}
</span>
`; `;
} else { } else {
document.getElementById('timer').innerText = "Responde antes de que caduque el turno"; document.getElementById('timer').innerText = "Responde antes de que caduque el turno";
@@ -125,23 +124,25 @@
document.getElementById('loading').classList.add('hidden'); document.getElementById('loading').classList.add('hidden');
document.getElementById('content').classList.remove('hidden'); document.getElementById('content').classList.remove('hidden');
} else { } else {
showError(data.error, data.debug); showError(data.error);
} }
} catch (e) { } catch (e) {
showError("Error al conectar con el servidor", null); showError("Error al conectar con el servidor");
} }
} }
async function respond(action) { async function respond(action) {
const btnText = action === 'accept' ? 'ACEPTANDO...' : 'RECHAZANDO...';
const originalContent = document.getElementById('content').innerHTML;
if(!confirm(`¿Seguro que quieres ${action === 'accept' ? 'ACEPTAR' : 'RECHAZAR'} este servicio?`)) return; if(!confirm(`¿Seguro que quieres ${action === 'accept' ? 'ACEPTAR' : 'RECHAZAR'} este servicio?`)) return;
try { try {
document.getElementById('loading').classList.remove('hidden'); // OCULTAMOS TODO PARA DEJAR LA PANTALLA LIMPIA
document.getElementById('top-header').classList.add('hidden');
document.getElementById('content').classList.add('hidden'); document.getElementById('content').classList.add('hidden');
document.getElementById('loading').innerHTML = `<i data-lucide="loader-2" class="w-8 h-8 animate-spin text-blue-600 mt-20"></i>`;
document.getElementById('loading').classList.remove('hidden');
lucide.createIcons();
const res = await fetch(`${API_URL}/public/assignment/respond`, { const res = await fetch(`${API_URL}/public/assignment/respond`, {
method: 'POST', method: 'POST',
headers: { "Content-Type": "application/json" }, headers: { "Content-Type": "application/json" },
@@ -151,10 +152,10 @@
if (data.ok) { if (data.ok) {
document.getElementById('loading').innerHTML = ` document.getElementById('loading').innerHTML = `
<div class="text-center fade-in"> <div class="text-center fade-in mt-20">
<i data-lucide="check-circle-2" class="w-16 h-16 text-green-500 mx-auto mb-4"></i> <i data-lucide="check-circle-2" class="w-24 h-24 text-green-500 mx-auto mb-6"></i>
<h2 class="text-xl font-black uppercase text-slate-800">${action === 'accept' ? '¡Asignado!' : 'Rechazado'}</h2> <h2 class="text-3xl font-black uppercase text-slate-800 tracking-tight">${action === 'accept' ? '¡Asignado!' : 'Rechazado'}</h2>
<p class="text-slate-500 text-sm mt-2">${action === 'accept' ? 'Ya puedes verlo en tu lista de servicios.' : 'Gracias por avisar.'}</p> <p class="text-slate-500 text-base mt-4">${action === 'accept' ? 'Ya puedes verlo en tu lista de servicios.' : 'Gracias por avisar. Turno liberado.'}</p>
</div> </div>
`; `;
lucide.createIcons(); lucide.createIcons();
@@ -166,27 +167,13 @@
} }
} }
function showError(msg, debugData = null) { function showError(msg) {
// EN CASO DE ERROR TAMBIÉN OCULTAMOS LA CABECERA
document.getElementById('top-header').classList.add('hidden');
document.getElementById('loading').classList.add('hidden'); document.getElementById('loading').classList.add('hidden');
document.getElementById('content').classList.add('hidden'); document.getElementById('content').classList.add('hidden');
document.getElementById('error-screen').classList.remove('hidden'); document.getElementById('error-screen').classList.remove('hidden');
if(msg) document.getElementById('error-msg').innerText = msg; if(msg) document.getElementById('error-msg').innerText = msg;
// BLOQUE DE DIAGNÓSTICO EN LA PANTALLA DE ERROR
if(debugData && !document.getElementById('debug-box')) {
const debugDiv = document.createElement('div');
debugDiv.id = 'debug-box';
debugDiv.className = "mt-8 p-4 bg-slate-100 rounded-xl text-left text-[10px] font-mono text-slate-600 overflow-x-auto border border-slate-200";
debugDiv.innerHTML = `
<strong class="text-slate-800 uppercase tracking-widest block mb-2">Modo Diagnóstico (Captura esto)</strong>
ESTADO BD: <span class="text-blue-600 font-bold">${debugData.estado_en_bd}</span><br>
HORA LÍMITE BD: <span class="text-red-500 font-bold">${new Date(debugData.hora_limite_bd).toLocaleString()}</span><br>
HORA ACTUAL BD: <span class="text-emerald-600 font-bold">${new Date(debugData.hora_actual_bd).toLocaleString()}</span><br><br>
* Si ESTADO BD es "expired", el reloj interno lo mató.<br>
* Si HORA LÍMITE < HORA ACTUAL, es un desfase de zona horaria.
`;
document.getElementById('error-screen').appendChild(debugDiv);
}
} }
</script> </script>
</body> </body>