Ajout calcul total général case cochées
FossilOrigin-Name: 3a1cdc3cd5b81be5a45684569107bbe48f547d471a6873aaa508652cf8103b0b
This commit is contained in:
engel
parent
358c44d23c
commit
57f0d77527
5 changed files with 120 additions and 73 deletions
|
|
@ -71,8 +71,8 @@ $tpl->register_function('afficher_debut_tarif', function ($params)
|
|||
<summary class="activite">
|
||||
<div class="activite">
|
||||
<input type="checkbox" id="check_%1$s"
|
||||
onclick="cocherDecocherTarif(check_%1$s)" />',
|
||||
$idTarif);
|
||||
onclick="cocherDecocherTarif(check_%1$s, %2$s)" />',
|
||||
$idTarif, "total_general");
|
||||
if ($idTarif == 0) {
|
||||
// versement sur un compte non rattaché à une activité
|
||||
$out .= sprintf('
|
||||
|
|
@ -122,7 +122,7 @@ $tpl->register_function('afficher_debut_personne', function ($params)
|
|||
<summary class="personne">
|
||||
<div class="personne">
|
||||
<input type="checkbox" id="check_%1$s"
|
||||
onclick="cocherDecocherPersonne(check_%1$s, total_%1$s)" />
|
||||
onclick="cocherDecocherPersonne(check_%1$s, total_%1$s, %3$s)" />
|
||||
<label for="check_%1$s">
|
||||
%2$s : <span class="total" id="total_%1$s">0,00 €</span>
|
||||
</label>
|
||||
|
|
@ -130,7 +130,8 @@ $tpl->register_function('afficher_debut_personne', function ($params)
|
|||
</summary>
|
||||
<div class="versements">',
|
||||
$idVersement,
|
||||
$personne->nomPrenom
|
||||
$personne->nomPrenom,
|
||||
"total_general"
|
||||
);
|
||||
return $out;
|
||||
});
|
||||
|
|
@ -163,7 +164,7 @@ $tpl->register_function('afficher_versement', function ($params)
|
|||
id="check_%1$s_%2$s"
|
||||
name="selected[]"
|
||||
value="%2$s"
|
||||
onclick="cocherDecocherVersement(check_%1$s_%2$s, total_%1$s)" />
|
||||
onclick="cocherDecocherCase(check_%1$s_%2$s, total_%1$s, %5$s)" />
|
||||
<label for="check_%1$s_%2$s"><span class="montant">%3$s</span>
|
||||
<span>%4$s</span>
|
||||
</label>
|
||||
|
|
@ -176,7 +177,8 @@ $tpl->register_function('afficher_versement', function ($params)
|
|||
",",
|
||||
" "
|
||||
),
|
||||
date_format(date_create($versement->date),"d/m/Y")
|
||||
date_format(date_create($versement->date),"d/m/Y"),
|
||||
"total_general"
|
||||
);
|
||||
return $out;
|
||||
});
|
||||
|
|
|
|||
118
admin/script.js
118
admin/script.js
|
|
@ -1,5 +1,26 @@
|
|||
"use strict";
|
||||
|
||||
/**
|
||||
* renvoyer la valeur numérique d'un montant formaté en €
|
||||
* @param texte qui représente nu nombre
|
||||
*/
|
||||
function getNumber(texte) {
|
||||
return Number(texte.replace(/[^0-9,]/g, '').replace(/,/, '.'));
|
||||
}
|
||||
|
||||
/**
|
||||
* afficher un montant au format monétaire
|
||||
* @param montant à afficher
|
||||
* @param idElem : élément où faire l'affichage
|
||||
*/
|
||||
function displayNumber(montant, idElem) {
|
||||
idElem.innerHTML =
|
||||
montant.toLocaleString('fr-FR', {
|
||||
style: 'currency', currency: 'EUR',
|
||||
minimumFractionDigits: 2
|
||||
});
|
||||
}
|
||||
|
||||
// ------------------------------------------------------------------------
|
||||
// actions sur la liste des versements
|
||||
// ------------------------------------------------------------------------
|
||||
|
|
@ -8,14 +29,15 @@
|
|||
* Fonction appelée quand on (dé)coche la case globale
|
||||
* (dé)sélectionner toutes les cases de toutes les activités
|
||||
* @param {HTMLInputElement} idCaseGlobale id de la case globale
|
||||
* @param {HTMLSpanElement} idTotalGeneral id du total général
|
||||
*/
|
||||
function cocherDecocherTout(idCaseGlobale) {
|
||||
function cocherDecocherTout(idCaseGlobale, idTotalGeneral) {
|
||||
// itérer sur la liste des éléments détails : 1 par couple <activité, tarif>
|
||||
let lesDetails = document.querySelectorAll("details.activite");
|
||||
for (let i = 0; i < lesDetails.length; ++i) {
|
||||
let idCase = lesDetails[i].querySelector("input[type=checkbox]");
|
||||
idCase.checked = idCaseGlobale.checked;
|
||||
cocherDecocherTarif(idCase);
|
||||
cocherDecocherTarif(idCase, idTotalGeneral);
|
||||
}
|
||||
// changer le message
|
||||
changerMessage(idCaseGlobale.nextElementSibling, idCaseGlobale);
|
||||
|
|
@ -25,35 +47,37 @@ function cocherDecocherTout(idCaseGlobale) {
|
|||
* Fonction appelée quand on (dé)coche la case d'activité
|
||||
* (dé)sélectionner toutes les cases de cette activité
|
||||
* @param {HTMLInputElement} idCaseGlobale id de la case d'activité
|
||||
* @param {HTMLSpanElement} idTotalGeneral id du total général
|
||||
*/
|
||||
function cocherDecocherTarif(idCaseGlobale) {
|
||||
function cocherDecocherTarif(idCaseGlobale, idTotalGeneral) {
|
||||
let lesPersonnes = idCaseGlobale.closest("details").querySelectorAll("div.personne");
|
||||
cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes);
|
||||
cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes, idTotalGeneral);
|
||||
}
|
||||
|
||||
/**
|
||||
* idem dans le cas des versements des personnes
|
||||
* @param {HTMLInputElement} idCaseGlobale id case à cocher d'une personne
|
||||
*/
|
||||
function cocherDecocherToutesLesPersonnes(idCaseGlobale) {
|
||||
let lesPersonnes = document.querySelectorAll("div.personne");
|
||||
cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes);
|
||||
function cocherDecocherToutesLesPersonnes(idCaseGlobale, idTotalGeneral) {
|
||||
let lesPersonnes = document.querySelectorAll("summary.personne");
|
||||
cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes, idTotalGeneral);
|
||||
changerMessage(idCaseGlobale.nextElementSibling, idCaseGlobale);
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {HTMLInputElement} idCaseGlobale
|
||||
* @param {NodeListOf<Element>} lesPersonnes
|
||||
*/
|
||||
function cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes) {
|
||||
* @param {HTMLSpanElement} idTotalGeneral id du total général
|
||||
*/
|
||||
function cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes, idTotalGeneral) {
|
||||
for (let j = 0; j < lesPersonnes.length; ++j) {
|
||||
// trouver l'élément total de la personne
|
||||
let idTotal = lesPersonnes[j].querySelector("span");
|
||||
let idTotal = lesPersonnes[j].querySelector("span.total");
|
||||
// puis la case à cocher
|
||||
let idCase = lesPersonnes[j].closest("summary").querySelector("input");
|
||||
let idCase = lesPersonnes[j].querySelector("input[type=checkbox]");
|
||||
idCase.checked = idCaseGlobale.checked;
|
||||
// puis traiter toutes les cases de la personne
|
||||
cocherDecocherPersonne(idCase, idTotal);
|
||||
cocherDecocherPersonne(idCase, idTotal, idTotalGeneral);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -62,51 +86,45 @@ function cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes) {
|
|||
* - (dé)sélectionner toutes les cases à cocher
|
||||
* - faire le total des cases cochées et l'afficher
|
||||
* @param {HTMLInputElement} idCase id de la case qui a été cochée
|
||||
* @param {HTMLSpanElement} idTotal id de l'élément où afficher le total
|
||||
* @param {HTMLSpanElement} idTotal id de l'élément où afficher le total de la personne
|
||||
* @param {HTMLSpanElement} idTotalGeneral id de l'élément où afficher le total général
|
||||
*/
|
||||
function cocherDecocherPersonne(idCase, idTotal) {
|
||||
// chercher le fieldset des versements
|
||||
let fieldset = idCase.closest("details").querySelector("div.versements");
|
||||
let listeCases = fieldset.querySelectorAll("input[type=checkbox]");
|
||||
for (let i = 0; i < listeCases.length; ++i) {
|
||||
listeCases[i].checked = idCase.checked;
|
||||
cocherDecocherVersement(listeCases[i], idTotal);
|
||||
}
|
||||
function cocherDecocherPersonne(idCase, idTotal, idTotalGeneral) {
|
||||
let conteneur = idCase.closest("details").querySelector("div.versements");
|
||||
let listeCases = conteneur.querySelectorAll("input[type=checkbox]");
|
||||
|
||||
for (let i = 0; i < listeCases.length; ++i) {
|
||||
if (listeCases[i].checked != idCase.checked) {
|
||||
listeCases[i].checked = idCase.checked;
|
||||
cocherDecocherVersement(listeCases[i], idTotal, idTotalGeneral);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Fonction appelée quand on (dé)coche la case d'un versement
|
||||
* Faire le total des cases cochées et l'afficher
|
||||
* Mettre à jour le total des cases cochées et le total global et les afficher
|
||||
*
|
||||
* @param {HTMLInputElement} idCase id de la case qui a été cochée
|
||||
* @param {HTMLSpanElement} idTotal id de l'élément où afficher le total
|
||||
* @param {HTMLInputElement} idCase id de la case qui a été (dé)cochée
|
||||
* @param {HTMLSpanElement} idTotal id du total de la personne
|
||||
* @param {HTMLSpanElement} idTotalGeneral id du total général
|
||||
*/
|
||||
function cocherDecocherVersement(idCase, idTotal) {
|
||||
let fieldset = idCase.closest("div.versements");
|
||||
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 {NodeListOf<Element>} listeCases liste des cases
|
||||
* @param {NodeListOf<Element>} listeMontants liste des montants associés
|
||||
* @param {HTMLSpanElement} idTotal id de l'élément où afficher le total
|
||||
*/
|
||||
function calculerTotal(listeCases, listeMontants, idTotal) {
|
||||
let total = 0;
|
||||
for (let i = 0; i < listeCases.length; ++i) {
|
||||
if (listeCases[i].checked) {
|
||||
total += parseFloat(listeMontants[i].textContent.replace(/\s/g, "").replace(",", "."));
|
||||
}
|
||||
}
|
||||
// afficher le total
|
||||
idTotal.innerHTML =
|
||||
total.toLocaleString('fr-FR', {
|
||||
style: 'currency', currency: 'EUR',
|
||||
minimumFractionDigits: 2
|
||||
});
|
||||
function cocherDecocherVersement(idCase, idTotal, idTotalGeneral) {
|
||||
let div = idCase.closest("div");
|
||||
let idmontant = div.querySelector("span.montant");
|
||||
let montant = getNumber(idmontant.textContent);
|
||||
let totalPersonne = getNumber(idTotal.textContent);
|
||||
let totalGeneral = getNumber(idTotalGeneral.textContent);
|
||||
if (idCase.checked) {
|
||||
totalPersonne += montant;
|
||||
totalGeneral += montant;
|
||||
} else {
|
||||
totalPersonne -= montant;
|
||||
totalGeneral -= montant;
|
||||
}
|
||||
displayNumber(totalPersonne, idTotal);
|
||||
displayNumber(totalGeneral, idTotalGeneral);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -273,4 +291,4 @@ function changerStyle(document) {
|
|||
if (sheet.href.includes('imprimer_recu.css')) { sheet.media = 'print'; }
|
||||
}
|
||||
// console.log(styles);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,6 +2,10 @@
|
|||
* liste des versements
|
||||
*/
|
||||
|
||||
label.strong {
|
||||
font-weight : bold;
|
||||
}
|
||||
|
||||
div.pair {
|
||||
background-color: rgba(var(--gSecondColor), 0.15);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue