{% extends "base.html" %}

{% block extra_javascript %}
<script>
$(document).ready(function() {
    $('#btn-js-archivage').on('click', archiveFamilies);
});
</script>
{% endblock %}

{% block boutons_droite %}
<div class="topnav-right text-end">
    <div class="float-end">
        {% if request.user|has_group:'direction' %}
            <a class="btn btn-sm btn-outline-primary mt-2" name="export" role="button"
                href="{% url 'export-prestation' %}">Exporter
            </a>
        {% endif %}
        <form method="get" action=".">
            <div class="float-end input-group ms-2 mt-2">
                {{ form.nom }}
                <button class="px-2" type="submit" title="Rechercher">
                    <img src="{% static 'admin/img/search.svg' %}">
                </button>
                <button id="reset-button" class="ms-2" type="reset" title="Réinitialiser tous les filtres">
                    <img src="{% static 'img/filter_off.svg' %}">
                </button>
            </div>
        </form>
    </div>
</div>
{% endblock %}

{% block content %}
    <div class="row border-bottom mb-3">
        <div class="col lead">Suivis terminés</div>
        {% if perms.aemo.can_archive %}
        <div class="col text-end">
            <button type="button" class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#archiveModal">
                Archivage de masse
            </button>
        </div>
        {% endif %}
    </div>
    <div id="archive-message" class="row" hidden>
        <div class="col">
            <p class="alert alert-danger">
                Archivage en cours: <span id="archive-counter">0</span> dossiers sur <span id="archive-total">0</span>
            </p>
        </div>
    </div>
    <div class="row">
        <div class="col">
            <table id="benef_table" class="table table-sm table-hover sortable">
                <thead class="table-light">
                    <tr>
                        <th>Nom</th>
                        <th>Adresse</th>
                        <th>Réf. AEMO</th>
                        <th>Réf. OPE</th>
                        <th>Début du suivi</th>
                        <th>Fin du suivi</th>
                        <th>Total heures</th>
                        <th>Motif de fin</th>
                        <th>Archiver {% help_tooltip "Le bouton d’archivage n’apparaît que si vous avez la permission d’archivage, que le suivi est terminé depuis plus de 180 jours et que le suivi s’est terminé l’année précédente." %}
                        </th>
                    </tr>
                </thead>
                <tbody>
                    {% for famille in object_list %}
                            <tr data-famille="{{ famille.pk }}">
                                <td>
                                    <div>
                                        <a href="{% url 'famille-suivi' famille.id %}" title="Suivi">{{ famille.nom }}</a>
                                    </div>
                                </td>
                                <td>{{ famille.npa}} {{ famille.localite }}</td>
                                <td>{{ famille.suivi|sigles_referents }}</td>
                                <td>{{ famille.suivi.ope_referent.nom_prenom|default_if_none:'' }}
                                    {{ famille.suivi.mandat_ope|join:', '|in_parens }}
                                </td>
                                <td>{{ famille.suivi.date_debut_suivi|date:'d.m.Y' }}</td>
                                <td>{{ famille.suivi.date_fin_suivi|date:'d.m.Y' }}</td>
                                <td>{{ famille.temps_total_prestations|format_duree }}</td>
                                <td>{{ famille.suivi.get_motif_fin_suivi_display }}</td>

                                <td class="text-center">
                                    {% if famille|archivable:user %}
                                    <form method="post" action="{% url 'archive-add' 'aemo' famille.pk %}">{% csrf_token %}
                                    <button type="submit" class="btn btn-xs btn-danger confirm"
                                        data-confirm="Voulez-vous vraiment archiver cette famille ?">X</button>
                                    </form>
                                    {% endif %}
                                </td>

                            </tr>
                        {% empty %}
                        <tr><td colspan="8">Cette liste est actuellement vide.</td></tr>
                        {% endfor %}
                </tbody>
            </table>
        </div>
    </div>

    <!-- Modal pour archivage de masse-->
    <div class="modal" id="archiveModal" tabindex="-1" aria-labelledby="archiveModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="archiveModalLabel">Archivage</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
                </div>
                <div class="modal-body">
                    <p>Cette action va archiver tous les dossiers qui correspondent aux critères définis.
                       Les données seront cryptées puis effacées de la base de données.
                       Cette action est irréversible.
                    </p>
                    <p>Voulez-vous continuer ?</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
                    <button type="button" id="btn-js-archivage" class="btn btn-warning"
                            data-archiveurl="{% url 'archive-add' 'aemo' 999 %}"
                            data-getarchivableurl="{% url 'famille-archivable' %}">Archivage</button>
                </div>
            </div>
        </div>
    </div>
{% endblock %}