From c2a3a77f2466efb3b0fe1b19b10d3899c578c78e Mon Sep 17 00:00:00 2001
From: engel <>
Date: Sat, 15 Jan 2022 18:17:18 +0000
Subject: [PATCH] Ajout directives de style

FossilOrigin-Name: 1b127048e020c713814f73d04cbedf86c74127dda40fa1f5d8bb665e472cd56a
---
 templates/index.tpl | 20 ++++++++++++++------
 www/admin/index.php |  1 +
 www/admin/script.js | 24 ++++++++++++------------
 www/admin/style.css | 20 ++++++++++++++++++++
 4 files changed, 47 insertions(+), 18 deletions(-)
 create mode 100644 www/admin/style.css

diff --git a/templates/index.tpl b/templates/index.tpl
index 1a3e8c0..48fa22f 100644
--- a/templates/index.tpl
+++ b/templates/index.tpl
@@ -84,21 +84,29 @@
                         <?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}"
+                            <input
+                            type="checkbox"
+                            class="check_{$idVersements}"
+                            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 />
+                            <label for="check_{$idVersements}" style="font-weight:bold;">Cliquer 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"
+                    <div {if $rang%2==0}class="pair"{else}class="impair"{/if}>
+                    <input
+                    type="checkbox"
+                    class="check_{$idVersements}"
                     id="check_{$idVersements}_{$rang}"
-                    name="selected[]" value={$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 />
+                    <span>{$versement.Date|date_format:"%d/%m/%Y"}</span>
+                    </div>
                 {/if}
             {/foreach} {* Itération sur les versements *}
             </fieldset>
diff --git a/www/admin/index.php b/www/admin/index.php
index 967f584..8c35315 100644
--- a/www/admin/index.php
+++ b/www/admin/index.php
@@ -22,6 +22,7 @@ foreach ($activites as $num => $activite)
 $tpl->assign('activitesTarifsComptes', $activitesTarifsComptes);
 $tpl->assign('lesVersements', $lesVersements);
 $tpl->assign('listeParActiviteEtTarif', $activites);
+$tpl->assign('plugin_css', ['style.css']);
 
 // envoyer au template
 $tpl->display(PLUGIN_ROOT . '/templates/index.tpl');
diff --git a/www/admin/script.js b/www/admin/script.js
index d2e95f2..d6bbd28 100644
--- a/www/admin/script.js
+++ b/www/admin/script.js
@@ -9,21 +9,21 @@
 function cocherDecocherPersonne(idCase, idTotal) {
     // chercher le fieldset englobant
     var fieldset = idCase.closest("fieldset");
-    var listeCheck = fieldset.getElementsByTagName("input");
-    var listeMontants = fieldset.querySelectorAll("span.montant");
-    for (var i = 1; i < listeCheck.length; ++i)
+    var listeCases = fieldset.querySelectorAll("input[type=checkbox]");
+    for (var i = 1; i < listeCases.length; ++i)
     {
-        listeCheck[i].checked = listeCheck[0].checked;
+        listeCases[i].checked = idCase.checked;
     }
     // changer le message
     var message = idCase.nextElementSibling;
     if (idCase.checked) {
-        message.innerHTML = "Cliquer ici pour dé-cocher toutes les lignes";
+        message.innerHTML = "Cliquer pour dé-cocher toutes les lignes";
     } else {
-        message.innerHTML = "Cliquer ici pour cocher toutes les lignes";
+        message.innerHTML = "Cliquer pour cocher toutes les lignes";
     }
     // calculer et afficher le total
-    calculerTotal(listeCheck, listeMontants, idTotal);
+    var listeMontants = fieldset.querySelectorAll("span.montant");
+    calculerTotal(listeCases, listeMontants, idTotal);
 }
 
 /**
@@ -36,9 +36,9 @@ function cocherDecocherPersonne(idCase, idTotal) {
  */
 function cocherDecocherVersement(idCase, idTotal) {
     var fieldset = idCase.closest("fieldset");
-    var listeCheck = fieldset.getElementsByTagName("input");
+    var listeCases = fieldset.querySelectorAll("input[type=checkbox]");
     var listeMontants = fieldset.querySelectorAll("span.montant");
-    calculerTotal(listeCheck, listeMontants, idTotal);
+    calculerTotal(listeCases, listeMontants, idTotal);
 }
 
 /**
@@ -47,11 +47,11 @@ function cocherDecocherVersement(idCase, idTotal) {
  * @param listes des montants associés
  * @param id de l'élément où afficher le total
 */
-function calculerTotal(listeCheck, listeMontants, idTotal) {
+function calculerTotal(listeCases, listeMontants, idTotal) {
     var total = 0;
-    for (var i = 1; i < listeCheck.length; ++i)
+    for (var i = 1; i < listeCases.length; ++i)
     {
-        if (listeCheck[i].checked) {
+        if (listeCases[i].checked) {
             total += Number(listeMontants[i-1].textContent);
         }
     }
diff --git a/www/admin/style.css b/www/admin/style.css
new file mode 100644
index 0000000..c947fd3
--- /dev/null
+++ b/www/admin/style.css
@@ -0,0 +1,20 @@
+div.pair {
+    padding : 0.2em;
+    background: rgba(var(--gSecondColor), 0.2);
+}
+div.impair {
+    padding : 0.2em;
+    /*background: #eeeeee; /*rgba(var(--gSecondColor), 0.5);*/
+}
+fieldset {
+    border:2px solid brown;
+    -webkit-border-radius:8px;	
+    border-radius:8px;	
+}
+fieldset label {
+    font-weight:bold;
+}
+div span {
+    padding-left : 0.5em;
+    padding-right : 0.5em;
+}