{% extends 'accueil/accueil_admin.html.twig' %}

{% block title %}Consultation d'un Élève{% endblock %}

{% block body %}
<div class="content">
    <div class="consultation-container">
        <h2 class="consultation-title">Consultation de l'élève : {{ eleve.nom }} {{ eleve.prenom }}</h2>

        <div class="consultation-details">
            <table class="consultation-table">
                <tr>
                    <th>Id :</th>
                    <td>{{ eleve.id }}</td>
                </tr>
                <tr>
                    <th>Nom :</th>
                    <td>{{ eleve.nom }}</td>
                </tr>
                <tr>
                    <th>Prénom :</th>
                    <td>{{ eleve.prenom }}</td>
                </tr>
                <tr>
                    <th>Numéro rue :</th>
                    <td>{{ eleve.numRue }}</td>
                </tr>
                <tr>
                    <th>Rue :</th>
                    <td>{{ eleve.rue }}</td>
                </tr>
                <tr>
                    <th>Code Postal :</th>
                    <td>{{ eleve.copos }}</td>
                </tr>
                <tr>
                    <th>Ville :</th>
                    <td>{{ eleve.ville }}</td>
                </tr>
                <tr>
                    <th>Téléphone :</th>
                    <td>{{ eleve.tel }}</td>
                </tr>
                <tr>
                    <th>Email :</th>
                    <td>{{ eleve.mail }}</td>
                </tr>
                <tr>
                    <th>Responsable :</th>
                    <td>
                        {% if eleve.responsable is not null and eleve.responsable.nom is not empty and eleve.responsable.prenom is not empty %}
                            {{ eleve.responsable.nom }} {{ eleve.responsable.prenom }}
                        {% else %}
                            Aucun
                        {% endif %}
                    </td>
                </tr>
            </table>
        </div>
    </div>

    <div class="students-section">
        <br>
        <h3 class="section-title" style="margin-left: 30px;">Cours auxquels cet élève est inscrit :</h3>
        <table class="table">
            <thead>
                <tr>
                    <th>Libellé</th>
                    <th>Professeur</th>
                    <th>Horaires</th>
                    <th>Jour</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                {% for inscription in inscriptions %}
                    <tr class="row">
                        <td>{{ inscription.cours.libelle }}</td>
                        <td>{{ inscription.cours.professeur.nom }}</td>
                        <td>{{ inscription.cours.heureDebut|date('H:i') }} - {{ inscription.cours.heureFin|date('H:i') }}</td>
                        <td>{{ inscription.cours.jour.libelle }}</td>
                        <td> 
                            <a href="{{ path('app_desinscription', { 'eleveId': inscription.eleve.id, 'coursId': inscription.cours.id }) }}" onclick="return confirm('Êtes-vous sûr de vouloir vous désinscrire de ce cours ?');"> 
                                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="black" viewBox="0 0 24 24" stroke-width="2" class="icon icon-tabler icon-tabler-trash"> 
                                    <path stroke-linecap="round" stroke-linejoin="round" d="M3 6h18M9 6V4a2 2 0 0 1 2-2h2a 2 2 0 0 1 2 2v2M10 11v6M14 11v6M5 6l1 14h12l1-14"></path> 
                                </svg> 
                            </a> 
                        </td>
                    </tr>
                    <tr class="spacer"></tr>
                {% else %}
                    <tr>
                        <td colspan="3" style="text-align: center;">Aucun cours inscrit</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
        <br>
        <form action="{{ path('app_inscription', { 'eleveId': eleve.id }) }}" method="get">
            <button style="
                cursor:pointer;
                background-color: #181b22;
                color: #b3b3b3;
                padding: 12px 20px;
                text-decoration: none;
                display: inline-block;
                text-align: center;
                margin-left:30px;
            " type="submit">Inscrire l'élève à un ou plusieurs cours</button>
        </form>
    </div>
</div>
{% endblock %}