{% extends 'layout.twig' %}

{% block body %}
    <div class="contenu clearfix" id="ListeModeles">
        <h1>{{ titre }}</h1>
        {{ ariane() }}
        <h2>{{ 'Liste des modèles de termes de paiement' | trad }}
                {{ Button('Nouveau modèle' | trad, true, path('TermeDePaiement.TermeDePaiement.ajoutModeleTermeDePaiement', {MODULE: MODULE, id: id, numtp: numtp}), '', {}, false, 'ajout') }}
        </h2>
        <div id="listeModeleTp" class="my-base">
            <form name="filtre_listeModeleTp" method="post" id="filtre_listeModeleTp">
                <table class="table table-hover">
                    <thead class="thead-dark">
                        <tr>
                            <th scope="col" width="20%">{{ triTable('LIB_MODELE',  post.tri_LIB_MODELE, 'Nom du modèle' | trad, '', '', 'filtre_listeModeleTp') }}</th>
                            <th scope="col">{{ triTable('DESCRIPTIF',  post.tri_DESCRIPTIF, 'Descriptif' | trad, '', '', 'filtre_listeModeleTp') }}</th>
                            <th scope="col" width="10%">{{ 'Action' | trad }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr class="recherche">
                            <td>{{ filterTable('LIB_MODELE', post.filter_LIB_MODELE, '', 'listeModeleTp', '', 'filtre_listeModeleTp', '', '') }}</td>
                            <td>{{ filterTable('DESCRIPTIF', post.filter_DESCRIPTIF, '', 'listeModeleTp', '', 'filtre_listeModeleTp', '', '') }}</td>
                            <td></td>
                        </tr>
                        {% for modele in modeles %}
                            <tr id="modele_{{ modele.ID_MODELE }}" class="modele_{{ modele.ID_MODELE }}focus">
                                <td style="width:350px;" class="toggleSlide" onclick="toggleSlide('{{ path('TermeDePaiement.TermeDePaiement.ligneModele',{MODULE: MODULE, idModele : modele.ID_MODELE}) }}' , 'modele_{{ modele.ID_MODELE }}detail');">
                                    {{ shortLibelle(modele.LIB_MODELE, taille: 200, ajaxPopup: false) }}
                                </td>
                                <td>
                                    {{ shortLibelle(modele.DESCRIPTIF, taille: 200, ajaxPopup: false) }}
                                </td>
                                <td style="width:120px;">
                                    <div style="display: flex; justify-content: end;">
                                        {{ hover_action(
                                            'modele_'~modele.ID_MODELE,
                                            'modifier_v2',
                                            "window.location.href='"~path('TermeDePaiement.TermeDePaiement.updateModeleTermeDePaiement', {MODULE: MODULE, idModele: modele.ID_MODELE})~"'",
                                            'float: left;margin-left:5px;'
                                        ) }}
                                        {{ hover_action(
                                            'modele_'~modele.ID_MODELE,
                                            'Supprimer_v2',
                                            "popupConfirmation('"~path('Ajax.Erreur.popupConfirmationSuppresion')~"', '', '"~path('TermeDePaiement.TermeDePaiement.deleteModele', {MODULE: MODULE, idModele: modele.ID_MODELE})~"', '"~('Etes-vous sûr de vouloir supprimer ce modèle ?' | trad |e('js')|raw)~"', 'ListeModeles')",
                                            'float: left;margin-left:5px;'
                                        ) }}
                                    </div>
                                </td>
                            </tr>
                            <tr id="modele_{{ modele.ID_MODELE }}detail" class="detail_ligne hide_detail"></tr>
                        {% else %}
                            <tr>
                                <td class="text-center" colspan="2">{{ 'Aucun modèle trouvé' | trad }}</td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </form>
        </div>
    </div>
{% endblock %}