{% block app_content %}
<div class="pageContent">

    <h2>Liste de l'assiduité et des justificatifs de <span class="rouge">{{sco.etud.nomprenom}}</span></h2>
    {% include "assiduites/widgets/tableau_base.j2" %}
    <h3>Assiduité :</h3>
    <span class="iconline">
        <a class="icon filter" onclick="filterAssi()"></a>
        <a class="icon download" onclick="downloadAssi()"></a>
    </span>
    {% include "assiduites/widgets/tableau_assi.j2" %}
    <h3>Justificatifs :</h3>
    <span class="iconline">
        <a class="icon filter" onclick="filterJusti()"></a>
        <a class="icon download" onclick="downloadJusti()"></a>
    </span>
    {% include "assiduites/widgets/tableau_justi.j2" %}
    <ul id="contextMenu" class="context-menu">
        <li id="detailOption">Detail</li>
        <li id="editOption">Editer</li>
        <li id="deleteOption">Supprimer</li>
    </ul>
    <div class="legende">
        <h3>Gestion des justificatifs</h3>
        <p>
            Faites
            <span style="font-style: italic;">clic droit</span> sur une ligne du tableau pour afficher le menu
            contextuel :
        </p>
        <ul>
            <li>Détails : Affiche les détails du justificatif sélectionné</li>
            <li>Editer : Permet de modifier le justificatif (dates, etat, ajouter/supprimer fichier etc)</li>
            <li>Supprimer : Permet de supprimer le justificatif (Action Irréversible)</li>
        </ul>

        <p>Vous pouvez filtrer le tableau en cliquant sur l'icone d'entonnoir sous le titre du tableau.</p>

        <h3>Gestion de l'assiduité</h3>
        <p>
            Faites
            <span style="font-style: italic;">clic droit</span> sur une ligne du tableau pour afficher le menu
            contextuel :
        </p>
        <ul>
            <li>Détails : affiche les détails de l'assiduité sélectionnée</li>
            <li>Éditer : modifier l'élément (module, état)</li>
            <li>Supprimer : supprimer l'élément (action irréversible)</li>
        </ul>
        <p>Vous pouvez filtrer le tableau en cliquant sur l'icone d'entonnoir sous le titre du tableau.</p>

    </div>
</div>
{% endblock app_content %}

<script>
    const etudid = {{ sco.etud.id }}

    const assiduite_unique_id = {{ assi_id }};

    const assi_limit_annee = "{{ assi_limit_annee }}" == "True" ? true : false;


    function wayForFilter() {
        if (typeof assiduites[etudid] !== "undefined") {
            console.log("Done")
            let assiduite = assiduites[etudid].filter((a) => { return a.assiduite_id == assiduite_unique_id });

            if (assiduite) {
                assiduite = assiduite[0]
                filterAssiduites["filters"] = {
                    "obj_id": [
                        assiduite.assiduite_id,
                    ]
                }
                const obj_ids = assiduite.justificatifs ? assiduite.justificatifs.map((j) => { return j.justif_id }) : []
                filterJustificatifs["filters"] = {
                    "obj_id": obj_ids
                }

                loadAll();
            }
        } else {
            setTimeout(wayForFilter, 250)
        }
    }

    window.onload = () => {
        loadAll();

        if (assiduite_unique_id != -1) {
            wayForFilter()
        }

    }

</script>