{#Integration du fichier base.html.twig#}
{% extends 'base.html.twig'%}

{#Bloc Titre de la page#}
{% block title %}
    Liste des comptes 
{% endblock %}

{#Bloc Header de la page#}
{% block head %}
    <!-- Script Javascript pour le tableau (DataTables) -->
    <link href="{{ asset("vendor/datatables/dataTables.bootstrap4.min.css") }}" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
    <script src="https://cdn.datatables.net/v/bs4/jq-3.7.0/dt-1.13.8/b-2.4.2/sp-2.2.0/datatables.js"></script>
{% endblock %}

{#Cormps de la page#}
{% block body %}


<!-- DataTales Example -->
                    <div class="card shadow mb-4">
                        <div class="card-header py-3">
                            <h6 class="m-0 font-weight-bold text-primary">Liste d'utilisateurs</h6>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                                    <thead>
                                        <tr>
                                            <th>Nom d'utilisateur</th><!-- Colonne Nom Utilisateur -->
                                            <th>Mot de passe</th><!-- Colonne Mot de Passe -->
                                            <th>Email</th><!-- Colonne Mail -->
                                            <th>Rôle</th><!-- Colonne Role -->
                                            <th>IP VPN</th><!-- Colonne IP VPN -->
                                            <th>Nom de la clinique</th><!-- Colonne Nom Clinique -->
                                            <th>Est à creer ?</th><!-- Colonne A creer -->
                                            <th></th><!-- Colonne pour Fonction -->
                                            <th></th><!-- Colonne pour fonction -->
                                        </tr>
                                    </thead>
                                    <tbody>
                                    <!-- Parcourir la liste des users -->
                                    {% set adminCount = 0 %}
                                    {% for usr in users %}
                                    {% if usr.role == "ADMIN_ATIMA" %}
                                        {% set adminCount = adminCount + 1 %}
                                    {% endif %}
                                    <tr>
                                        <!--<td>{{ usr.id }}</td><!-- Colonne ID user -->
                                        <td>{{ usr.username }}</td><!-- Colonne Nom Utilisateur -->
                                        <td>{{ usr.mdp }}</td><!-- Colonne Mot de Passe -->
                                        <td>{{ usr.email }}</td><!-- Colonne Mail -->
                                        <td>{{ usr.role }}</td><!-- Colonne Role -->
                                        <td>{{ usr.ipVPN }}</td><!-- Colonne IP VPN -->

                                        <!-- Données sur la clinique -->
                                        <!-- Si l'utilisateur n'a pas de clinique, champ vide sinon nom de la clinique -->
                                        {% if usr.laClinique is null %}
                                            <td></td>
                                        {% else %}
                                            <!-- Lien vers la page d'infos de la clinique -->
                                            <td><a href="{{ path('voir_clinique', { id: usr.laClinique.id }) }}">{{ usr.laClinique.nomClinique }}</a></td>
                                        {% endif %}

                                        <!-- Si le champ "acreer" est à 1, on met le champ à "Oui", sinon on met "Non" -->
                                        {% if usr.acreer %}
                                            <td>Oui</td>
                                        {% else %}
                                            <td>Non</td>
                                        {% endif %}

                                        <!-- Vérification si l'utilisateur a le rôle "CREATEUR" -->
                                        {% if usr.role == "CREATEUR" %}
                                            <!-- Bouton pour télécharger le profil VPN si l'utilisateur a le rôle "CREATEUR" -->
                                            {% if usr.laClinique is not null %}
                                                <td><a href="{{ path('download', { username: usr.username, idClinique: usr.laClinique.id }) }}"><i class="fas fa-download"></i></a></td>
                                            {% else %}
                                                <td></td>
                                            {% endif %}
                                        {% else %}
                                            <!-- Champ vide si l'utilisateur n'a pas le rôle "CREATEUR" -->
                                            <td></td>
                                        {% endif %}

                                        <!-- Colonne + Bouton pour supprimer l'utilisateur -->
                                        {% if usr.role != "ADMIN_ATIMA" or (usr.role == "ADMIN_ATIMA" and adminCount > 1) %}
                                            <td><a href="{{ path('demande_supp_util', { id: usr.id }) }}"><i class="fa fa-trash" aria-hidden="true" style="color:red;"></i></a></td>
                                        {% else %}
                                            <td><i class="fa fa-trash" aria-hidden="true" style="color:gray;"></i></td>
                                        {% endif %}
                                    </tr> 
                                    {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
<!------------------>



{#FURUREMENT A SUPPRIMER
   <!-- Conteneur Principal -->
<div class="card shadow mb-4">
    <div class="card-header py-3">
        <!-- Element Titre du conteneur -->
        <h6 class="m-0 font-weight-bold text-primary">Liste des utilisateurs</h6>
    </div>
    <div class="card-body">
        <table class="table table-bordered display" id="dataTable" width="100%" cellspacing="0">
            <!-- Definition des colonnes du tableau -->
            <thead>
                <tr>
                    <!--<th>ID</th><!-- Colonne ID -->
                    <th>Nom d'utilisateur</th><!-- Colonne Nom Utilisateur -->
                    <th>Mot de passe</th><!-- Colonne Mot de Passe -->
                    <th>Email</th><!-- Colonne Mail -->
                    <th>Rôle</th><!-- Colonne Role -->
                    <th>IP VPN</th><!-- Colonne IP VPN -->
                    <th>Nom de la clinique</th><!-- Colonne Nom Clinique -->
                    <th>Est à creer ?</th><!-- Colonne A creer -->
                    <th>eeeeeeeeee</th><!-- Colonne pour Fonction -->
                    <th>ffffffffff</th><!-- Colonne pour fonction -->
                    <th>ytrefrghjrewrgthyrewq</th><th>wefghrewqrghrewfghewfghngre</th>
                </tr>
            </thead>
                
            <!-- Association des données de la base de donnée avec les colonnes du tableau -->
            <tbody>
                <!-- Parcourir la liste des users -->
                {% set adminCount = 0 %}
                {% for usr in users %}
                {% if usr.role == "ADMIN_ATIMA" %}
                    {% set adminCount = adminCount + 1 %}
                {% endif %}
                <tr>
                <td></td><td></td>
                    <!--<td>{{ usr.id }}</td><!-- Colonne ID user -->
                    <td>{{ usr.username }}</td><!-- Colonne Nom Utilisateur -->
                    <td>{{ usr.mdp }}</td><!-- Colonne Mot de Passe -->
                    <td>{{ usr.email }}</td><!-- Colonne Mail -->
                    <td>{{ usr.role }}</td><!-- Colonne Role -->
                    <td>{{ usr.ipVPN }}</td><!-- Colonne IP VPN -->

                    <!-- Données sur la clinique -->
                    <!-- Si l'utilisateur n'a pas de clinique, champ vide sinon nom de la clinique -->
                    {% if usr.laClinique is null %}
                        <td></td>
                    {% else %}
                        <!-- Lien vers la page d'infos de la clinique -->
                        <td><a href="{{ path('voir_clinique', { id: usr.laClinique.id }) }}">{{ usr.laClinique.nomClinique }}</a></td>
                    {% endif %}

                    <!-- Si le champ "acreer" est à 1, on met le champ à "Oui", sinon on met "Non" -->
                    {% if usr.acreer %}
                        <td>Oui</td>
                    {% else %}
                        <td>Non</td>
                    {% endif %}

                    <!-- Vérification si l'utilisateur a le rôle "CREATEUR" -->
                    {% if usr.role == "CREATEUR" %}
                        <!-- Bouton pour télécharger le profil VPN si l'utilisateur a le rôle "CREATEUR" -->
                        {% if usr.laClinique is not null %}
                            <td><a href="{{ path('download', { username: usr.username, idClinique: usr.laClinique.id }) }}"><i class="fas fa-download"></i></a></td>
                        {% else %}
                            <td></td>
                        {% endif %}
                    {% else %}
                        <!-- Champ vide si l'utilisateur n'a pas le rôle "CREATEUR" -->
                        <td></td>
                    {% endif %}

                    <!-- Colonne + Bouton pour supprimer l'utilisateur -->
                    {% if usr.role != "ADMIN_ATIMA" or (usr.role == "ADMIN_ATIMA" and adminCount > 1) %}
                        <td><a href="{{ path('demande_supp_util', { id: usr.id }) }}"><i class="fa fa-trash" aria-hidden="true" style="color:red;"></i></a></td>
                    {% else %}
                        <td><i class="fa fa-trash" aria-hidden="true" style="color:gray;"></i></td>
                    {% endif %}
                </tr> 
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
#}
{% endblock %}

    {#Bloc Script de la page#}
    {% block script %}
        <!-- Script Javascript pour le tableau (DataTables) -->
        <script src="{{ asset("vendor/datatables/jquery.dataTables.min.js") }}"></script>
        <script src="{{ asset("vendor/datatables/dataTables.bootstrap4.min.js") }}"></script>

        <!-- Script js pour filiter les données du tableau -->
        <script>

            //initialisation du tableau
            $(document).ready(function () {
            var table = $('#dataTable').DataTable({
                //Filtre le nombre de ligne par pages
                lengthMenu: [[10,25,50,-1],[10,25,50,"Tout"]],
                //Langue du tableau (Francais)
                language:{
                    url:'//cdn.datatables.net/plug-ins/1.13.7/i18n/fr-FR.json',
                }
            })
                table.draw();
            });

        </script>
    {% endblock %}