{% include 'partials/header.html.twig' %}

    <link rel="stylesheet" href="{{ asset('assets/libs/select2/css/select2.min.css') }}">

    <script src="{{ asset('assets/libs/jquery/dist/jquery.min.js') }}"></script>
    <script src="{{ asset('assets/libs/select2/js/select2.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/buttons.flash.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/buttons.html5.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/buttons.print.min.js') }}"></script>
    <script src="{{ asset('assets/libs/jszip/jszip.min.js') }}"></script>
    <script src="{{ asset('assets/libs/pdfmake/pdfmake.min.js') }}"></script>
    <script src="{{ asset('assets/libs/pdfmake/vfs_fonts.js') }}"></script>
    <script src="{{ asset('assets/libs/jquery-steps/jquery.steps.min.js') }}"></script>
    <script src="{{ asset('assets/libs/jquery-validation/jquery.validate.min.js') }}"></script>

      <div class="body-wrapper">
        <div class="container-fluid">

         <div class="card card-body py-3">
            <div class="row align-items-center">
              <div class="col-12">
                <h5>Contreparties</h5>
                <div class="d-sm-flex align-items-center justify-space-between">
                  
                  <a href="{{path('app_index')}}" class="p-2"><iconify-icon icon="solar:home-2-broken" class="fs-6"></iconify-icon> </a> >
                  <a href="{{path('projet_index')}}" class="p-2">Projets </a> >
                  <a href="{{path('projet_view', {'id': projet.idtoken})}}" class="p-2">{{projet.titre}} </a> >
                  <a href="{{path('projet_view_contreparties', {'id': projet.idtoken})}}" class="p-2">Contreparties </a>
                  
                </div>
              </div>
            </div>
          </div>

        <div class="card">
            <div class="card-body">
            {% if projet.statut == 'Ouvert' %}
                <div class="text-end">
                    <button class="btn btn-primary me-1 submit-typecontrepartie">
                        Enregistrer les modifications
                    </button>

                    <button type="button" class="btn btn-light" data-bs-toggle="modal" data-bs-target="#addTypeContrepartieModal">
                        Ajouter une contrepartie
                    </button>
                </div>
            {% endif %}
                <div class="row justify-content-center">
                    <div class="datatables">
                        <div class="card">
                            <div class="card-body">
                                <div class="table-responsive mb-4  rounded-1" id="editable-datatable_wrapper">
                                
                                    <table id="list_typecontrepartie" class="table text-nowrap mb-0 align-middle w-100" > 
                                        <thead>
                                            <tr>
                                            <th>Nom</th>
                                            <th></th>
                                            </tr>
                                        </thead>
                                        <tbody>

                                        </tbody>
                                        <tfoot>
                                            <tr>
                                            <th>Nom</th>
                                            <th></th>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                
                {% if projet.statut == 'Ouvert' %}
                    <button class="btn btn-primary me-1 submit-typecontrepartie">
                        Enregistrer les modifications
                    </button>
                {% endif %}

        </div>
      </div>
    </div>

<script>
const tableTypeContrepartie = $('#list_typecontrepartie').DataTable({
    // Options personnalisées (facultatif)
    "paging": true,          // Activer la pagination
    "searching": false,       // Activer la recherche
    "ordering": true,        // Activer le tri des colonnes
    "info": true,            // Afficher les informations sur le nombre de résultats
    "lengthChange": false,    // Permettre de changer le nombre de lignes affichées
    "pageLength": 20,        // Nombre de lignes par page par défaut
    processing: true, // Affiche un indicateur de chargement
    serverSide: true, // Active le mode server-side
    ajax: {
        url: '{{path('ajax_list_typecontrepartie')}}', // URL du backend
        type: 'GET',
        cache: false,
        data: function (d) {
          d.projet = '{{projet.idtoken}}';  
      }
    },
    columns: [
        { data: 'nom' },
        { data: 'action' },     
    ],
    language: {
        "info":           "Voir _START_ à _END_ de _TOTAL_ types de contrepartie",
        "infoEmpty":      "Voir 0 à 0 de 0 type de contrepartie",
        "search":         "Rechercher:",
        "paginate": {
            "first":      "Premier",
            "last":       "Dernier",
            "next":       "Suivant",
            "previous":   "Précédent"
        },
        "infoFiltered": '(filtrés de _MAX_ types de contrepartie)',
        "zeroRecords": "Aucun enregistrement correspondant trouvé",
        "emptyTable": "Aucune donnée disponible dans le tableau",

    }
});
</script>


{% include 'partials/modal/delete_modal.html.twig' %}
{% include 'partials/modal/ajax_modal.html.twig' %}
{% include '@Projet/projet/modal/new_typecontrepartie.html.twig' %} 

<script src="{{ asset('assets/js/global/fonctions.js') }}"></script>
<script src="{{ asset('assets/js/projet/projet_view.js') }}"></script>
<script src="{{ asset('assets/js/projet/mecene.js') }}"></script>

<script src="{{ asset('assets/js/data/search_mecene_ajax.js') }}"></script>
<script src="{{ asset('assets/js/data/update_datatable.js') }}"></script>

{% include 'partials/footer.html.twig' %}