usite-sas-bic/whatsapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
Lizandro Guarnizo
2026-06-11 22:52:45 -05:00
parent 23a21d02fb
commit ca964c76a3
8 changed files with 307 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/turnero/views/display_global.php
+46 -37
View File
@@ -108,17 +108,10 @@ $_hasVideo = (bool)$_tvVideo;
position: relative;
}
.pg-body.has-video {
grid-template-columns: 1fr auto;
grid-template-columns: 240px 1fr 240px;
}
/* ── Left area ── */
.left-area {
display: flex; flex-direction: column;
overflow: hidden;
position: relative;
}
/* ── Turno activo (centro) ── */
.turno-activo {
display: flex; flex-direction: column;
@@ -165,31 +158,44 @@ $_hasVideo = (bool)$_tvVideo;
color: #cbd5e1;
}
/* ── Últimos llamados ── */
.ultimos-llamados {
flex-shrink: 0;
border-top: 1px solid #e2e8f0;
padding: .3rem 1.5rem .5rem;
/* ── Últimos llamados (columna izquierda) ── */
.left-area {
display: flex; flex-direction: column;
overflow: hidden;
position: relative;
background: #fff;
border-right: 1px solid #e2e8f0;
}
.ultimos-llamados {
display: flex; flex-direction: column;
overflow: hidden;
height: 100%;
}
.ultimos-llamados .ul-label {
font-size: .7rem; font-weight: 700; text-transform: uppercase;
letter-spacing: 2px; color: #94a3b8; margin-bottom: .2rem;
letter-spacing: 2px; color: #94a3b8;
padding: .8rem .8rem .3rem; flex-shrink: 0;
}
.ultimos-llamados .ul-scroll {
display: flex; gap: .5rem;
overflow-x: auto; scrollbar-width: none;
flex: 1; overflow-y: auto; padding: 0 .5rem .5rem;
scrollbar-width: thin; scrollbar-color: #e2e8f0 transparent;
}
.ultimos-llamados .ul-scroll::-webkit-scrollbar { display: none; }
.ul-item {
display: flex; align-items: center; gap: .4rem;
padding: .25rem .7rem; border-radius: 99px;
padding: .5rem .6rem; border-radius: 8px;
margin-bottom: .25rem;
background: #f8fafc; border: 1px solid #e2e8f0;
white-space: nowrap; flex-shrink: 0;
font-size: .72rem;
}
.ul-item .ul-cod { font-weight: 800; font-size: .78rem; }
.ul-item .ul-nom { font-size: .72rem; color: #64748b; }
.ul-item .ul-dest { font-size: .65rem; color: #94a3b8; }
.ul-item.activo {
background: var(--brand);
border-color: var(--brand);
color: #fff;
}
.ul-item.activo .ul-nom,
.ul-item.activo .ul-dest { color: rgba(255,255,255,.75); }
.ul-item .ul-cod { font-weight: 800; font-size: .82rem; display: block; }
.ul-item .ul-nom { color: #1e293b; font-weight: 600; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ul-item .ul-dest { color: #64748b; font-size: .65rem; display: block; }
.ul-item .ul-dest i { margin-right: 2px; }
/* ── Video reel (9:16, alto completo, columna derecha) ── */
@@ -364,18 +370,18 @@ $_hasVideo = (bool)$_tvVideo;
<div class="pg-body <?= $_hasVideo ? 'has-video' : '' ?>">
<div class="left-area">
<div class="turno-activo" id="zona-activo">
<div class="label">Siguiente turno</div>
<div class="codigo" id="codigo-activo">—</div>
<div class="lugar-label" id="lugar-label">Llamado a</div>
<div class="lugar-nombre" id="lugar-nombre">—</div>
<div class="pac-nombre" id="pac-nombre"></div>
</div>
<div class="ultimos-llamados" id="ultimos-llamados" style="display:none">
<div class="ul-label"><i class="fas fa-history me-1"></i>Últimos llamados</div>
<div class="ul-label"><i class="fas fa-history me-1"></i>Llamados</div>
<div class="ul-scroll" id="ul-scroll"></div>
</div>
</div>
<div class="turno-activo" id="zona-activo">
<div class="label">Siguiente turno</div>
<div class="codigo" id="codigo-activo">—</div>
<div class="lugar-label" id="lugar-label">Llamado a</div>
<div class="lugar-nombre" id="lugar-nombre">—</div>
<div class="pac-nombre" id="pac-nombre"></div>
</div>
<div class="reel-wrap <?= $_hasVideo ? 'has-video' : '' ?>" id="reel-wrap">
<div class="reel-inner">
<video autoplay muted loop playsinline>
@@ -565,7 +571,7 @@ function renderSnapshot(snap) {
});
lastTurnoKey = key;
llamados.unshift({ codigo: t.codigo, destino: t.destino, paciente: t.paciente_nombre, color: c });
if (llamados.length > 20) llamados.pop();
if (llamados.length > 30) llamados.pop();
renderLlamados();
}
} else {
@@ -611,13 +617,16 @@ function renderLlamados() {
if (!wrap || !sc) return;
if (llamados.length === 0) { wrap.style.display = 'none'; return; }
wrap.style.display = '';
sc.innerHTML = llamados.map(l => `
<div class="ul-item">
<span class="ul-cod" style="color:${l.color || '<?= $_labColor ?>'}">${esc(l.codigo)}</span>
const activo = llamados[0];
sc.innerHTML = llamados.map((l, i) => {
const isActivo = i === 0;
const c = l.color || '<?= $_labColor ?>';
return `<div class="ul-item${isActivo ? ' activo' : ''}"${isActivo ? ' style="--brand:' + c + '"' : ''}>
<span class="ul-cod">${esc(l.codigo)}</span>
${l.paciente ? `<span class="ul-nom">${esc(l.paciente)}</span>` : ''}
<span class="ul-dest"><i class="fas fa-arrow-right"></i> ${esc(l.destino)}</span>
</div>
`).join('');
</div>`;
}).join('');
}
function esc(s) {