feat(recepcion): destacar turnos en atención en la cola
Los turnos ya tomados (en_recepcion) muestran fondo azul pálido, borde izquierdo azul grueso y badge "EN ATENCIÓN" en lugar del chip de tiempo, para que el recepcionista identifique de un vistazo qué turno ya está siendo atendido y no llame otro. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
1d285da6ae
commit
c566c1f33f
@@ -118,7 +118,11 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
|
||||
display: flex; align-items: center; gap: .6rem;
|
||||
transition: box-shadow .15s;
|
||||
}
|
||||
.cola-card.activo { border-color: #3b82f6; box-shadow: 0 0 0 2px #bfdbfe; }
|
||||
.cola-card.activo { border-color: #3b82f6; box-shadow: 0 0 0 2px #bfdbfe; }
|
||||
.cola-card.en-atencion { background: #eff6ff; border-color: #93c5fd; border-left: 4px solid #2563eb; }
|
||||
.atencion-chip { font-size: .6rem; font-weight: 700; border-radius: 99px;
|
||||
padding: 0 6px; line-height: 1.7;
|
||||
background: #dbeafe; color: #1d4ed8; }
|
||||
.cola-card .prio-dot {
|
||||
width: 36px; height: 36px; border-radius: 9px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
@@ -992,12 +996,14 @@ function renderCola(snap) {
|
||||
return;
|
||||
}
|
||||
lista.innerHTML = visibles.map(t => {
|
||||
const enAtencion = t.estado === 'en_recepcion';
|
||||
const te = tiempoEspera(t.creado_at);
|
||||
const badgeRow = te
|
||||
? `<div class="t-badge-row"><span class="tiempo-chip ${te.cls}">${escHtml(te.txt)}</span></div>`
|
||||
: '';
|
||||
const badgeRow = enAtencion
|
||||
? `<div class="t-badge-row"><span class="atencion-chip"><i class="fas fa-circle" style="font-size:.45rem;vertical-align:middle;margin-right:3px"></i>EN ATENCIÓN</span></div>`
|
||||
: (te ? `<div class="t-badge-row"><span class="tiempo-chip ${te.cls}">${escHtml(te.txt)}</span></div>` : '');
|
||||
const clases = ['cola-card', turnoActivo?.id === t.id ? 'activo' : '', enAtencion ? 'en-atencion' : ''].filter(Boolean).join(' ');
|
||||
return `
|
||||
<div class="cola-card ${turnoActivo?.id === t.id ? 'activo' : ''}" data-id="${t.id}">
|
||||
<div class="${clases}" data-id="${t.id}">
|
||||
<div class="prio-dot" style="background:${t.prioridad_color};cursor:pointer" onclick="seleccionarTurno(${t.id})">${t.prioridad_codigo}</div>
|
||||
<div class="turno-info" style="cursor:pointer" onclick="seleccionarTurno(${t.id})">
|
||||
<div class="cod">${escHtml(t.codigo)}</div>
|
||||
@@ -1005,10 +1011,10 @@ function renderCola(snap) {
|
||||
${badgeRow}
|
||||
</div>
|
||||
<button onclick="llamarTurnoEspecifico(${t.id}, '${t.estado}')"
|
||||
title="${t.estado === 'en_recepcion' ? 'Re-llamar este turno' : 'Llamar este turno ahora'}"
|
||||
style="flex-shrink:0;background:#2563eb;border:none;color:#fff;
|
||||
title="${enAtencion ? 'Re-llamar este turno' : 'Llamar este turno ahora'}"
|
||||
style="flex-shrink:0;background:${enAtencion ? '#1d4ed8' : '#2563eb'};border:none;color:#fff;
|
||||
border-radius:7px;padding:5px 9px;font-size:.78rem;cursor:pointer">
|
||||
<i class="fas ${t.estado === 'en_recepcion' ? 'fa-volume-up' : 'fa-bell'}"></i>
|
||||
<i class="fas ${enAtencion ? 'fa-volume-up' : 'fa-bell'}"></i>
|
||||
</button>
|
||||
</div>`;
|
||||
}).join('');
|
||||
|
||||
Reference in New Issue
Block a user