{% extends "sco_page.j2" %}

{% block styles %}
    {{super()}}
    <style>
.div-warning {
    color: red;
    background-color: yellow;
    font-size: 120%;
    border: 2px solid red;
    border-radius: 12px;
    padding: 12px;
    margin-top: 16px;
    margin-bottom: 16px;
    width: fit-content;
}
    </style>
{% endblock styles %}

{% block app_content %}

<h2>Génération des avis de poursuites d'études (V2 BUT EXPERIMENTALE)</h2>

<div class="div-warning">
    Fonction expérimentale pour le BUT : travaux en cours, merci de tester
    et de faire part de vos expériences sur le Discord.
</div>

<div class="help">
    <p>
    Cette fonction génère un ensemble de feuilles de calcul (xlsx)
    permettant d'éditer des avis de poursuites d'études pour les étudiants
        de BUT diplômés. Les calculs sous-jacents peuvent prendre un peu de temps (1 à 2 minutes).
    <br>
    De nombreux aspects sont paramétrables:
    <a href="https://scodoc.org/AvisPoursuiteEtudes"
        target="_blank" rel="noopener noreferrer">
        voir la documentation
    </a> (en cours de révision).
    </p>
</div>

    <h3>Avis de poursuites d'études de la promo {{ annee_diplome }}</h3>

    <div class="help">
    Seront pris en compte les étudiants ayant (au moins) été inscrits à l'un des semestres suivants :

    <ul>
        {% for rang in rangs_tries %}
        <li>
            <strong>Semestre {{rang}}</strong> : {{ cosemestres[rang] }}
        </li>
        {%  endfor %}
    </ul>
    </div>

    <div>
    <progress id="pe_progress" style="visibility: hidden"></progress>
    <br>
    <button onclick="submitPEGeneration()">Générer les documents de la promo {{ annee_diplome }}</button>
    </div>

    <form method="post" id="pe_generation" style="visibility: hidden">
        <input type="submit"
               onclick="submitPEGeneration()" value=""/>
        <input type="hidden" name="formsemestre_id" value="{{formsemestre.id}}">
    </form>

    <script>
    function submitPEGeneration() {
        // document.getElementById("pe_progress").style.visibility = 'visible';
        document.getElementById("pe_generation").submit(); //attach an id to your form
    }
    </script>
{% endblock app_content %}