recusfiscaux/www/admin/script.js

"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 {HTMLInputElement} idCaseGlobale id de la case globale
 */
function cocherDecocherTout(idCaseGlobale)
{
    // 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)
    {
        // itérer sur les personnes
        let lesPersonnes = lesDetails[i].querySelectorAll("h4.personne");
        cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes);
    }
    // changer le message
    changerMessage(idCaseGlobale.nextElementSibling, idCaseGlobale);
}

/**
 * idem dans le cas des versements des personnes
 * @param {HTMLInputElement} idCaseGlobale id de la case globale
 */
function cocherDecocherToutesLesPersonnes(idCaseGlobale)
{
    let lesPersonnes = document.querySelectorAll("h4.personne");
    cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes);
    changerMessage(idCaseGlobale.nextElementSibling, idCaseGlobale);
}

/**
 * @param {HTMLInputElement} idCaseGlobale
 * @param {NodeListOf<Element>} lesPersonnes
 */
function cocherDecocherLesPersonnes(idCaseGlobale, lesPersonnes)
{
    for (let j = 0; j < lesPersonnes.length; ++j)
    {
        // trouver l'élément total de la personne
        let idTotal = lesPersonnes[j].querySelector("span");
        // puis la case à cocher
        let idCase = lesPersonnes[j].closest("summary").querySelector("input");
        idCase.checked = idCaseGlobale.checked;
        // puis traiter toutes les cases de la personne
        cocherDecocherPersonne(idCase, idTotal);
    }
}

/**
 * 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 {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)
{
    // chercher le fieldset des versements
    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
    let listeMontants = fieldset.querySelectorAll("span.montant");
    calculerTotal(listeCases, listeMontants, idTotal);
}

/**
 * Fonction appelée quand on (dé)coche la case d'un versement
 * 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
 */
function cocherDecocherVersement(idCase, idTotal)
{
    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 {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, ""));
        }
    }
    // afficher le total
    idTotal.innerHTML =
        total.toLocaleString('fr-FR', {style: 'currency', currency: 'EUR',
                                       minimumFractionDigits: 2});
}

/**
 * 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) {
        message.innerHTML = "Cliquer pour dé-cocher toutes les lignes";
    } else {
        message.innerHTML = "Cliquer pour cocher toutes les lignes";
    }
}

/**
 * fonction appelée lors de la validation du formulaire
 * @return vrai si au moins un choix a été fait
 * @param {HTMLFormElement} formulaire
 */
function verifierChoix(formulaire)
{
    let listeCheck = formulaire.getElementsByTagName("input");
    let ok = false;
    for (let i = 1; i < listeCheck.length; ++i)
    {
	if (listeCheck[i].checked)
	{
	    ok = true;
	    break;
	}
    }
    if (! ok)
    {
	alert("Erreur : il faut sélectionner au moins un versement");
    }
    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 (let elem of formulaire.querySelectorAll(nomClasse1)) {
        elem.classList.remove('hidden');
    }
    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é :)
 * @param {string} idElem id du conteneur des cases à vérifier
 */
function verifierCases(idElem)
{
    let div = document.getElementById(idElem);
    let nbChoix = 0;
    // parcourir les cases à cocher
    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é
            let ligneCorrecte = false;
            // trouver la ligne englobante
            let ligne = idCase.closest("tr");
            for (let idRadio of ligne.querySelectorAll('input[type=radio]'))
            {
                if (idRadio.checked) { ligneCorrecte = true; break; }
            }
            if (! ligneCorrecte) {
                alert("Erreur : il faut sélectionner un taux de réduction dans chaque ligne cochée");
                return false;
            }
        }
    }
    if (nbChoix == 0) {
        alert("Erreur : il faut sélectionner au moins une activité/tarif");
    }
    return nbChoix != 0;
}

/**
 * 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)
{
    let div = document.getElementById(idElem);
    for (let idRadio of div.querySelectorAll('input[type=radio]'))
    {
        if (idRadio.checked) { return true; }
    }
    alert("Erreur : il faut sélectionner un taux de réduction");
    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)
{
    let lesDetails = document.querySelectorAll(classe);
    if (lesDetails.length > 0)
    {
        let leBouton = document.getElementById(idElem);
        if (leBouton.textContent.startsWith('Replier'))
        {
            // masquer
            lesDetails.forEach((e) => {
                e.removeAttribute('open');
            });
            leBouton.textContent = "Déplier " + texte;
            leBouton.setAttribute('data-icon', '↓');
        }
        else
        {
            // montrer
            lesDetails.forEach((e) => {
                e.setAttribute('open', 'open');
            });
            leBouton.textContent = "Replier " + texte;
            leBouton.setAttribute('data-icon', '↑');
        }
    }
}