juavillo/vacaciones
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Límites por día/cargo, aprobación de días y calendario de admin

Browse Source 
- Límite de solicitudes por día y cargo (modelo reserva: pendientes + aprobadas
  ocupan hueco, rechazar lo libera). Días completos, pasados o el de hoy no se
  pueden elegir; validado también en el servidor.
- Estados de aprobación en las peticiones (pendiente/aprobado/rechazado) visibles
  para el trabajador con color; solo puede editar pendientes o añadir nuevas.
- Calendario de admin con barra lateral por empleado: aprobar/rechazar por día y
  en bloque, añadir/quitar días, y editar los límites por cargo.
- Excel con días por estado y ocupación por día/cargo.
- Migraciones automáticas no destructivas (columnas rounds.limits y requests.status;
  las peticiones existentes pasan a "pendiente").

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Juan Antonio Villanueva
2026-06-26 12:15:31 +02:00
parent 15fc6dac3b
commit 9c9d2d25f9
7 changed files with 1076 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/admin.html
+69 -23
View File
@@ -31,37 +31,83 @@
<!-- Panel -->
<div id="panel" class="hidden">
<section class="card">
<h2>Nueva ronda</h2>
<form id="create-form">
<div class="form-row">
<div>
<label for="round-name">Local</label>
<input id="round-name" type="text" maxlength="80" placeholder="P. ej. Restaurante Centro" required />
</div>
<div>
<label for="round-year">Año</label>
<input id="round-year" type="number" min="2020" max="2100" required />
<!-- Vista: lista de rondas -->
<div id="rounds-view">
<section class="card">
<h2>Nueva ronda</h2>
<form id="create-form">
<div class="form-row">
<div>
<label for="round-name">Local</label>
<input id="round-name" type="text" maxlength="80" placeholder="P. ej. Restaurante Centro" required />
</div>
<div>
<label for="round-year">Año</label>
<input id="round-year" type="number" min="2020" max="2100" required />
</div>
</div>
<label>Cargos y límite por día</label>
<div id="roles-editor"></div>
<button type="button" class="btn btn--ghost btn--small" id="add-role">+ Añadir cargo</button>
<p class="field-hint">El equipo elegirá su cargo al registrarse. El <b>máx/día</b> es cuántas personas de ese cargo pueden tener vacaciones el mismo día (vacío = sin límite).</p>
<div class="error-msg" id="create-error"></div>
<button class="btn btn--accent" type="submit">Crear ronda y obtener URL</button>
</form>
</section>
<section class="card">
<h2>Rondas</h2>
<div id="rounds-list"></div>
</section>
<button class="btn btn--ghost" id="logout-btn">Cerrar sesión</button>
</div>
<!-- Vista: calendario / aprobación de una ronda -->
<div id="calendar-view" class="hidden">
<div class="cal-topbar">
<button class="btn btn--ghost btn--small" id="cal-back">← Volver</button>
<div class="cal-heading">
<h2 id="cal-title">Calendario</h2>
<span class="badge" id="cal-status"></span>
</div>
<label for="round-roles">Cargos</label>
<input id="round-roles" type="text" maxlength="200" value="Camarero/a, Encargado, Cocina" />
<p class="field-hint">Sepáralos con comas. El equipo elegirá uno al registrarse y verá el recuento de su mismo cargo.</p>
<div class="error-msg" id="create-error"></div>
<button class="btn btn--accent" type="submit">Crear ronda y obtener URL</button>
</form>
</section>
</div>
<section class="card">
<h2>Rondas</h2>
<div id="rounds-list"></div>
</section>
<section class="card cal-limits">
<h3>Límite de solicitudes por día y cargo</h3>
<div id="cal-limits-fields" class="cal-limits-grid"></div>
<div class="cal-limits-foot">
<span class="field-hint">Vacío = sin límite. Ampliar o reducir afecta a las nuevas solicitudes.</span>
<button class="btn btn--small" id="cal-limits-save">Guardar límites</button>
</div>
</section>
<div class="cal-layout">
<aside class="cal-sidebar card" id="cal-sidebar"></aside>
<div class="cal-main">
<div id="cal-grid"></div>
</div>
</div>
</div>
<button class="btn btn--ghost" id="logout-btn">Cerrar sesión</button>
</div>
<footer class="colophon">Panel del administrador</footer>
</div>
<!-- Barra de acción para aprobar/rechazar/quitar un día concreto -->
<div class="actionbar" id="cal-actionbar">
<div class="inner">
<span class="label" id="cal-action-label"></span>
<div class="acts">
<button class="btn btn--small act-approve" data-status="approved">Aprobar</button>
<button class="btn btn--small act-reject" data-status="rejected">Rechazar</button>
<button class="btn btn--small btn--ghost" data-status="pending">Pendiente</button>
<button class="btn btn--small btn--ghost" data-status="none">Quitar</button>
</div>
</div>
</div>
<div class="toast" id="toast"></div>
<script src="/js/admin.js"></script>