tristan
73b34c2ea4
- Colonne Statut affiche le code du type d'absence (ex. AT) au lieu du libellé - Colonne Total en gras - Légende sous le tableau (carré coloré + code + libellé), 6 par ligne - Bouton Exporter masqué en vue Semaine Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
91 lines
4.3 KiB
Twig
91 lines
4.3 KiB
Twig
<!doctype html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Heures - {{ dateLabel }}</title>
|
|
<style>
|
|
@page { size: A4 portrait; margin: 4mm; }
|
|
html, body { margin: 0; padding: 2mm; font-family: Helvetica, sans-serif; font-size: 10px; }
|
|
.title-bar { position: relative; margin: 0 0 3mm 0; }
|
|
h1 { text-align: center; font-size: 15px; margin: 0; }
|
|
.export-date { position: absolute; top: 0; right: 0; font-size: 9px; color: #333; padding-top: 4px; }
|
|
table { width: 100%; border-collapse: collapse; table-layout: fixed; border: 2px solid #0a0a0a; }
|
|
th, td { border: 1px solid #0a0a0a; padding: 4px 2px; vertical-align: middle; text-align: center; overflow: hidden; }
|
|
th { font-weight: 700; background: #f0f0f0; white-space: normal; }
|
|
td { white-space: nowrap; }
|
|
td.name { text-align: left; }
|
|
tr.site-title td { font-weight: bold; font-size: 11px; text-transform: uppercase; text-align: left; padding: 2px 6px; white-space: nowrap; }
|
|
tr.weekend td { background: #c0c0c0; }
|
|
td.total { font-weight: bold; }
|
|
table.legend { width: auto; table-layout: auto; margin-top: 4mm; font-size: 10px; border: 0; border-collapse: collapse; }
|
|
table.legend td { border: 0; padding: 2px 0; vertical-align: middle; overflow: visible; white-space: nowrap; }
|
|
table.legend .legend-title { font-weight: bold; padding-right: 8px; }
|
|
table.legend .legend-box-cell { padding-left: 12px; }
|
|
table.legend .legend-box { display: inline-block; box-sizing: content-box; width: 14px; height: 14px; padding: 3px; line-height: 14px; text-align: center; font-weight: bold; font-size: 9px; }
|
|
table.legend .legend-label { padding-left: 4px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="title-bar">
|
|
<h1>Heures du {{ dateLabel }}</h1>
|
|
<div class="export-date">Édité le {{ exportedAt }}</div>
|
|
</div>
|
|
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 21%;">Nom</th>
|
|
<th style="width: 13%;">Statut</th>
|
|
<th style="width: 8%;">Début matin</th>
|
|
<th style="width: 8%;">Fin matin</th>
|
|
<th style="width: 8%;">Début après-midi</th>
|
|
<th style="width: 8%;">Fin après-midi</th>
|
|
<th style="width: 8%;">Début soir</th>
|
|
<th style="width: 8%;">Fin soir</th>
|
|
<th style="width: 6%;">Jour</th>
|
|
<th style="width: 6%;">Nuit</th>
|
|
<th style="width: 6%;">Total</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for group in groups %}
|
|
<tr class="site-title">
|
|
<td colspan="11" style="background: {{ group.siteColor ?: '#e8e8e8' }};">{{ group.siteName }}</td>
|
|
</tr>
|
|
{% for row in group.rows %}
|
|
<tr class="{{ row.isWeekend ? 'weekend' : '' }}">
|
|
<td class="name">{{ row.employeeName }}</td>
|
|
<td{% if row.statutColor %} style="background: {{ row.statutColor }};"{% endif %}>{{ row.statut }}</td>
|
|
<td>{{ row.morningFrom }}</td>
|
|
<td>{{ row.morningTo }}</td>
|
|
<td>{{ row.afternoonFrom }}</td>
|
|
<td>{{ row.afternoonTo }}</td>
|
|
<td>{{ row.eveningFrom }}</td>
|
|
<td>{{ row.eveningTo }}</td>
|
|
<td>{{ row.dayHours }}</td>
|
|
<td>{{ row.nightHours }}</td>
|
|
<td class="total">{{ row.total }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
|
|
{% if legend is not empty %}
|
|
<table class="legend">
|
|
{% for chunk in legend|batch(6) %}
|
|
<tr>
|
|
<td class="legend-title">{% if loop.first %}Légende :{% endif %}</td>
|
|
{% for item in chunk %}
|
|
<td class="legend-box-cell">
|
|
<span class="legend-box" style="background: {{ item.color ?: '#e8e8e8' }};">{{ item.code }}</span>
|
|
</td>
|
|
<td class="legend-label">{{ item.label }}</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
{% endif %}
|
|
</body>
|
|
</html>
|