From 1888314fa7b3bd347e122c1860959666183bd6d2 Mon Sep 17 00:00:00 2001 From: engel <> Date: Wed, 27 Apr 2022 13:49:23 +0000 Subject: [PATCH] modernisation code ; simplification affichage FossilOrigin-Name: e1b162c4d12b471d8f71c44e29fcce22c466ce789434c6780d2439bb14f3b761 --- garradin_plugin.ini | 2 +- templates/versements_personnes.tpl | 17 ++-- www/admin/action.php | 21 ++--- www/admin/script.js | 143 +++++++++++++++++------------ www/admin/style.css | 3 +- 5 files changed, 109 insertions(+), 77 deletions(-) diff --git a/garradin_plugin.ini b/garradin_plugin.ini index 3193717..41e3323 100644 --- a/garradin_plugin.ini +++ b/garradin_plugin.ini @@ -2,7 +2,7 @@ nom="Reçus fiscaux" description="Génération de reçus fiscaux pour les dons des membres" auteur="jce" url="https://git.roflcopter.fr/lesanges/recus-fiscaux-garradin" -version="0.6" +version="0.6.4" menu=1 config=1 min_version="1.1" diff --git a/templates/versements_personnes.tpl b/templates/versements_personnes.tpl index cb1f926..da70472 100644 --- a/templates/versements_personnes.tpl +++ b/templates/versements_personnes.tpl @@ -4,11 +4,14 @@

Versements par personne

- - - - + + + +
@@ -19,7 +22,7 @@ {if $rang == 0} {* 1ère personne *} idUser; + $personneCourante = $versement->idUser; ?> {afficher_debut_personne user=$personneCourante idVersement=$personneCourante} {afficher_versement versement=$versement idVersement=$personneCourante rang=$rang} @@ -29,7 +32,7 @@ idUser; + $personneCourante = $versement->idUser; ?> {afficher_debut_personne user=$personneCourante idVersement=$personneCourante} {afficher_versement versement=$versement idVersement=$personneCourante rang=$rang} diff --git a/www/admin/action.php b/www/admin/action.php index 53bce04..3036d84 100644 --- a/www/admin/action.php +++ b/www/admin/action.php @@ -71,14 +71,8 @@ $tpl->register_function('afficher_debut_personne', function ($params) $personne = $_SESSION['membresDonateurs'][$idUser]; $out = '
- '; - $out .= sprintf('

Versements de %s : 0,00 €

', - $personne->nomPrenom, - $idVersement); - $out .= ''; - $out .= sprintf(' -
', - $idVersement); + +

'; $out .= sprintf(' register_function('afficher_debut_personne', function ($params) $idVersement, $idVersement); $out .= sprintf(' - ', + ', + $idVersement); + $out .= sprintf('%s : 0,00 €', + $personne->nomPrenom, + $idVersement); + $out .= '

'; + $out .= sprintf(' +
', $idVersement); - $out .= '
-
'; return $out; }); diff --git a/www/admin/script.js b/www/admin/script.js index f97f5c9..0829d99 100644 --- a/www/admin/script.js +++ b/www/admin/script.js @@ -1,16 +1,18 @@ +"use strict"; + /** * Fonction appelée quand on (dé)coche la case de sélection globale * (dé)sélectionner toutes les cases à cocher de toutes les activités - * @param id de la case globale + * @param {HTMLInputElement} idCaseGlobale id de la case globale */ function cocherDecocherTout(idCaseGlobale) { // itérer sur la liste des éléments détails : 1 par couple - var lesDetails = document.querySelectorAll("details.activite"); - for (var i = 0; i < lesDetails.length; ++i) + let lesDetails = document.querySelectorAll("details.activite"); + for (let i = 0; i < lesDetails.length; ++i) { // itérer sur les personnes - var lesPersonnes = lesDetails[i].querySelectorAll("h4.personne"); + let lesPersonnes = lesDetails[i].querySelectorAll("h4.personne"); cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes); } // changer le message @@ -19,26 +21,30 @@ function cocherDecocherTout(idCaseGlobale) /** * idem dans le cas des versements des personnes -*/ + * @param {HTMLInputElement} idCaseGlobale id de la case globale + */ function cocherDecocherToutesLesPersonnes(idCaseGlobale) { - var lesPersonnes = document.querySelectorAll("h4.personne"); + let lesPersonnes = document.querySelectorAll("h4.personne"); cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes); changerMessage(idCaseGlobale.nextElementSibling, idCaseGlobale); } +/** + * @param {HTMLInputElement} idCaseGlobale + * @param {NodeListOf} lesPersonnes + */ function cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes) { - for (var j = 0; j < lesPersonnes.length; ++j) + for (let j = 0; j < lesPersonnes.length; ++j) { // trouver l'élément total de la personne - var idTotal = lesPersonnes[j].querySelector("span"); + let idTotal = lesPersonnes[j].querySelector("span"); // puis la case à cocher - var fieldset = lesPersonnes[j].closest("details").querySelector("fieldset"); - var idCase = fieldset.querySelector("input"); + let idCase = lesPersonnes[j].closest("summary").querySelector("input"); idCase.checked = idCaseGlobale.checked; // puis traiter toutes les cases de la personne - cocherDecocherPersonne(idCase, idTotal, false); + cocherDecocherPersonne(idCase, idTotal); } } @@ -46,58 +52,54 @@ function cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes) * Fonction appelée quand on (dé)coche la case globale d'une personne * - (dé)sélectionner toutes les cases à cocher * - 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 - * @param changer : vrai, s'il faut changer le message de la personne + * @param {HTMLInputElement} idCase id de la case qui a été cochée + * @param {HTMLSpanElement} idTotal id de l'élément où afficher le total */ -function cocherDecocherPersonne(idCase, idTotal, changer = true) +function cocherDecocherPersonne(idCase, idTotal) { // chercher le fieldset des versements - var fieldset = idCase.closest("details").querySelector("fieldset"); - var listeCases = fieldset.querySelectorAll("input[type=checkbox]"); - for (var i = 0; i < listeCases.length; ++i) + let fieldset = idCase.closest("details").querySelector("fieldset"); + let listeCases = fieldset.querySelectorAll("input[type=checkbox]"); + for (let i = 0; i < listeCases.length; ++i) { listeCases[i].checked = idCase.checked; } // calculer et afficher le total - var listeMontants = fieldset.querySelectorAll("span.montant"); + let listeMontants = fieldset.querySelectorAll("span.montant"); calculerTotal(listeCases, listeMontants, idTotal); - // changer le message - if (changer) { changerMessage(idCase.nextElementSibling, idCase); } } /** * Fonction appelée quand on (dé)coche la case d'un versement * 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 + * @param {HTMLInputElement} idCase id de la case qui a été cochée + * @param {HTMLSpanElement} idTotal id de l'élément où afficher le total */ function cocherDecocherVersement(idCase, idTotal) { - var fieldset = idCase.closest("fieldset"); - var listeCases = fieldset.querySelectorAll("input[type=checkbox]"); - var listeMontants = fieldset.querySelectorAll("span.montant"); + let fieldset = idCase.closest("fieldset"); + let listeCases = fieldset.querySelectorAll("input[type=checkbox]"); + let listeMontants = fieldset.querySelectorAll("span.montant"); calculerTotal(listeCases, 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 -*/ + * @param {NodeListOf} listeCases liste des cases + * @param {NodeListOf} listeMontants liste des montants associés + * @param {HTMLSpanElement} idTotal id de l'élément où afficher le total + */ function calculerTotal(listeCases, listeMontants, idTotal) { - var total = 0; - for (var i = 1; i < listeCases.length; ++i) + let total = 0; + for (let i = 0; i < listeCases.length; ++i) { if (listeCases[i].checked) { - total += parseFloat(listeMontants[i-1].textContent.replace(/\s/g, "")); + total += parseFloat(listeMontants[i].textContent.replace(/\s/g, "")); } } - // "afficher" le total + // afficher le total idTotal.innerHTML = total.toLocaleString('fr-FR', {style: 'currency', currency: 'EUR', minimumFractionDigits: 2}); @@ -105,7 +107,9 @@ function calculerTotal(listeCases, listeMontants, idTotal) /** * changer le message en fonction de l'état coché de la case -*/ + * @param {Element} message + * @param {HTMLInputElement} idCase + */ function changerMessage(message, idCase) { if (idCase.checked) { @@ -118,13 +122,13 @@ function changerMessage(message, idCase) /** * fonction appelée lors de la validation du formulaire * @return vrai si au moins un choix a été fait - * @param : formulaire -*/ + * @param {HTMLFormElement} formulaire + */ function verifierChoix(formulaire) { - var listeCheck = formulaire.getElementsByTagName("input"); - var ok = false; - for (var i = 1; i < listeCheck.length; ++i) + let listeCheck = formulaire.getElementsByTagName("input"); + let ok = false; + for (let i = 1; i < listeCheck.length; ++i) { if (listeCheck[i].checked) { @@ -139,39 +143,55 @@ function verifierChoix(formulaire) return ok; } +/** + * afficher et masquer des portions de formulaire selon l'action + * @param {HTMLFormElement} formulaire + * @param {string} action après envoi du formulaire + * @param {any} nomClasse1 classe des éléments à afficher + * @param {any} nomClasse2 classe des éléments à masquer + */ function choixMethodeGeneration(formulaire, action, nomClasse1, nomClasse2) { formulaire.setAttribute('action', 'action.php?action=' + action); afficherMasquer(formulaire, nomClasse1, nomClasse2); } +/** + * afficher et masquer des portions de formulaire + * @param {HTMLFormElement} formulaire + * @param {any} nomClasse1 classe des éléments à afficher + * @param {any} nomClasse2 classe des éléments à masquer + */ function afficherMasquer(formulaire, nomClasse1, nomClasse2) { - for (var elem of formulaire.querySelectorAll(nomClasse1)) { + for (let elem of formulaire.querySelectorAll(nomClasse1)) { elem.classList.remove('hidden'); } - for (var elem of formulaire.querySelectorAll(nomClasse2)) { + for (let elem of formulaire.querySelectorAll(nomClasse2)) { elem.classList.add('hidden'); } } -// vérifier -// - qu'au moins une activité/tarif est sélectionnée -// - qu'un radio de chaque activité/tarif sélectionné a été sélectionné :) +/** + * vérifier + * - qu'au moins une activité/tarif est sélectionnée + * - qu'un radio de chaque activité/tarif sélectionné a été sélectionné :) + * @param {string} idElem id du conteneur des cases à vérifier + */ function verifierCases(idElem) { - var div = document.getElementById(idElem); - var nbChoix = 0; + let div = document.getElementById(idElem); + let nbChoix = 0; // parcourir les cases à cocher - for (var idCase of div.querySelectorAll("input[type=checkbox]")) + for (let idCase of div.querySelectorAll("input[type=checkbox]")) { if (idCase.checked) { ++nbChoix; // vérifier qu'un radio de la même ligne est sélectionné - var ligneCorrecte = false; + let ligneCorrecte = false; // trouver la ligne englobante - var ligne = idCase.closest("tr"); - for (var idRadio of ligne.querySelectorAll('input[type=radio]')) + let ligne = idCase.closest("tr"); + for (let idRadio of ligne.querySelectorAll('input[type=radio]')) { if (idRadio.checked) { ligneCorrecte = true; break; } } @@ -187,11 +207,14 @@ function verifierCases(idElem) return nbChoix != 0; } -// vérifier qu'un radio a été sélectionné dans la div paramètre +/** + * vérifier qu'un radio a été sélectionné dans la div paramètre + * @param {string} idElem id du conteneur des radios à vérifier + */ function verifierRadio(idElem) { - var div = document.getElementById(idElem); - for (var idRadio of div.querySelectorAll('input[type=radio]')) + let div = document.getElementById(idElem); + for (let idRadio of div.querySelectorAll('input[type=radio]')) { if (idRadio.checked) { return true; } } @@ -199,12 +222,18 @@ function verifierRadio(idElem) return false; } +/** + * afficher/masquer les détails + * @param {string} idElem bouton de masquage/affichage + * @param {string} classe des détails à afficher/masquer + * @param {string} texte du bouton + */ function montrerMasquerDetails(idElem, classe, texte) { - var lesDetails = document.querySelectorAll(classe); + let lesDetails = document.querySelectorAll(classe); if (lesDetails.length > 0) { - var leBouton = document.getElementById(idElem); + let leBouton = document.getElementById(idElem); if (leBouton.textContent.startsWith('Replier')) { // masquer diff --git a/www/admin/style.css b/www/admin/style.css index 81dc14d..7253822 100644 --- a/www/admin/style.css +++ b/www/admin/style.css @@ -32,7 +32,8 @@ summary.personne padding-top : 0; padding-bottom : 0; } -h3.personne, h4.personne { +h3.personne, h4.personne +{ font-weight : normal; background: rgba(var(--gSecondColor), 0.25); }