From 31a0f8fdc39681e8e11b81061e7147455f328dfd Mon Sep 17 00:00:00 2001
From: engel <>
Date: Fri, 14 Jan 2022 19:26:00 +0000
Subject: [PATCH] =?UTF-8?q?Ajout=20=C3=A9couteur=20case=20versement=20Calc?=
 =?UTF-8?q?ul=20et=20affichage=20total=20des=20lignes=20coch=C3=A9es?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

FossilOrigin-Name: d8e436ba77f939fa0aa475bfcffc0ca23a9ad9ec0861d9bbee615ff36761a79f
---
 templates/index.tpl | 13 +++++++++----
 www/admin/script.js | 42 +++++++++++++++++++++++++++++++++++++++---
 2 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/templates/index.tpl b/templates/index.tpl
index 40c2c90..1a3e8c0 100644
--- a/templates/index.tpl
+++ b/templates/index.tpl
@@ -84,14 +84,19 @@
                         <?php $idVersements = $versement->idTarif."_".$versement->idUser; ?>
                         <h3>Versements de {$versement.Nom} : <span id="total_{$idVersements}">0,00 €</span></h3>
                         <fieldset class="versements" id="versements_{$idVersements}">
-                            <input class="check_{$idVersements}" type="checkbox" id="check_{$idVersements}" onclick="cocherDecocherPersonne(check_{$idVersements}, total_{$idVersements})" />
-                            <label for="check_{$idVersements}" style="font-weight:bold;">Cliquer ici pour sélectionner toutes les lignes</label><br />
+                            <input class="check_{$idVersements}"
+                            type="checkbox" id="check_{$idVersements}"
+                            onclick="cocherDecocherPersonne(check_{$idVersements}, total_{$idVersements})" />
+                            <label for="check_{$idVersements}" style="font-weight:bold;">Cliquer ici pour cocher toutes les lignes</label><br />
                             <hr>
                             <?php $currentUser = $versement->idUser; ?>
                     {/if}
                     {* afficher les infos du versement de la personne*}
-                    <input class="check_{$idVersements}" type="checkbox" name="selected[]" value={$rang}>
-                    <label for={$rang}></label>
+                    <input class="check_{$idVersements}" type="checkbox"
+                    id="check_{$idVersements}_{$rang}"
+                    name="selected[]" value={$rang}
+                    onclick="cocherDecocherVersement(check_{$idVersements}_{$rang}, total_{$idVersements})" />
+                    <label for=check_{$idVersements}_{$rang}></label>
                     <span class="montant">{$versement.Versement}</span>
                     <span>{$versement.Date|date_format:"%d/%m/%Y"}</span><br />
                 {/if}
diff --git a/www/admin/script.js b/www/admin/script.js
index f0e9d4a..d2e95f2 100644
--- a/www/admin/script.js
+++ b/www/admin/script.js
@@ -1,7 +1,7 @@
 /**
  * Fonction appelée quand on (dé)coche la case d'une personne
  * - (dé)sélectionner toutes les cases à cocher
- * - faire le total des cases cochées
+ * - faire le total des cases cochées et l'afficher
  * 
  * @param id de la case qui a été cochée
  * @param id de l'élément où afficher le total
@@ -11,10 +11,46 @@ function cocherDecocherPersonne(idCase, idTotal) {
     var fieldset = idCase.closest("fieldset");
     var listeCheck = fieldset.getElementsByTagName("input");
     var listeMontants = fieldset.querySelectorAll("span.montant");
-    var total = 0;
     for (var i = 1; i < listeCheck.length; ++i)
     {
         listeCheck[i].checked = listeCheck[0].checked;
+    }
+    // changer le message
+    var message = idCase.nextElementSibling;
+    if (idCase.checked) {
+        message.innerHTML = "Cliquer ici pour dé-cocher toutes les lignes";
+    } else {
+        message.innerHTML = "Cliquer ici pour cocher toutes les lignes";
+    }
+    // calculer et afficher le total
+    calculerTotal(listeCheck, listeMontants, idTotal);
+}
+
+/**
+ * Fonction appelée quand on (dé)coche la case d'un versement
+ * - (dé)sélectionner cette case (?)
+ * - faire le total des cases cochées et l'afficher
+ * 
+ * @param id de la case qui a été cochée
+ * @param id de l'élément où afficher le total
+ */
+function cocherDecocherVersement(idCase, idTotal) {
+    var fieldset = idCase.closest("fieldset");
+    var listeCheck = fieldset.getElementsByTagName("input");
+    var listeMontants = fieldset.querySelectorAll("span.montant");
+    calculerTotal(listeCheck, listeMontants, idTotal);
+}
+
+/**
+ * Faire le total des cases cochées et l'afficher
+ * @param listes des cases
+ * @param listes des montants associés
+ * @param id de l'élément où afficher le total
+*/
+function calculerTotal(listeCheck, listeMontants, idTotal) {
+    var total = 0;
+    for (var i = 1; i < listeCheck.length; ++i)
+    {
         if (listeCheck[i].checked) {
             total += Number(listeMontants[i-1].textContent);
         }
@@ -29,7 +65,7 @@ function cocherDecocherPersonne(idCase, idTotal) {
  * Cocher/décocher toutes les cases d'un tableau
  * en fonction de l'état de la première (ligne d'entête)
  * @param evt : événement déclencheur
-* @remarks : est remplacé par la foncion cocherDecocher ci-dessus
+* @remarks : est remplacé par la fonction cocherDecocherPersonne ci-dessus
  */
 function cocherDecocher_old(evt) {
     console.log("this = " + this.className);