Astreintes : interventions dans un menu dépliant fermé, cadre élargi

Les heures d'intervention (début, fin, description) passent en trois
colonnes alignées, cachées par défaut derrière un bouton « N
interventions » ; l'heure de retour et le total restent visibles.
L'état déplié survit aux rafraîchissements HTMX. Le conteneur passe
de 1100 à 1400 px pour que les lignes ne dépassent plus du cadre.

💘 Generated with Crush

Assisted-by: Crush:glm-5.2
This commit is contained in:
Jacquin Antoine
2026-09-08 22:40:06 +02:00
parent c208a17eec
commit 83f5512cb6
5 changed files with 147 additions and 64 deletions

View File

@ -368,19 +368,50 @@ document.addEventListener('input', function(e) {
</script>
<script>
// Astreinte — ajoute une ligne d'intervention vierge dans le jour ciblé
// Astreinte — heures d'intervention dans un menu dépliant fermé par défaut.
// L'état ouvert est mémorisé par date et restauré après les swaps HTMX
// (le bloc entier est re-rendu côté serveur à chaque enregistrement).
var asOpen = {};
window.asToggle = function (btn) {
var block = document.getElementById('as-block-' + btn.dataset.date);
if (!block) return;
block.classList.toggle('open');
asSync(block);
};
function asSync(block) {
var open = block.classList.contains('open');
asOpen[block.dataset.date] = open;
var btn = block.querySelector('.as-toggle');
if (btn) btn.setAttribute('aria-expanded', String(open));
var caret = block.querySelector('.as-caret');
if (caret) caret.textContent = open ? '▾' : '▸';
}
function asRestore() {
document.querySelectorAll('.as-block[data-date]').forEach(function (block) {
if (asOpen[block.dataset.date]) block.classList.add('open');
asSync(block);
});
}
asRestore();
document.addEventListener('htmx:afterSwap', asRestore);
// Ajoute une ligne d'intervention vierge dans le jour ciblé
window.asAddEvent = function (date) {
var wrap = document.getElementById('as-events-' + date);
if (!wrap) return;
var grid = document.getElementById('as-events-' + date);
if (!grid) return;
var ev = document.createElement('div');
ev.className = 'as-event';
ev.innerHTML =
'<input class="time-input" type="time" name="astreinte_debut" data-date="' + date + '" value="">' +
'<span class="time-sep">→</span>' +
'<input class="time-input" type="time" name="astreinte_fin" data-date="' + date + '" value="">' +
'<input type="text" class="as-desc" name="astreinte_desc" data-date="' + date + '" maxlength="200" placeholder="description" value="">' +
'<button type="button" class="as-del" title="Supprimer" onclick="this.closest(\'.as-event\').remove()">×</button>';
wrap.appendChild(ev);
'<div class="as-desc-cell">' +
'<input type="text" class="as-desc" name="astreinte_desc" data-date="' + date + '" maxlength="200" placeholder="description" value="">' +
'<button type="button" class="as-del" title="Supprimer" onclick="this.closest(\'.as-event\').remove()">×</button>' +
'</div>';
grid.appendChild(ev);
};
</script>
{% endblock %}