{% extends 'base.html.twig' %}

{% block title %}Bilan d'accompagnement - {{ beneficiaire.nom }} {{ beneficiaire.prenom }}{% endblock %}

{% block body %}
    <div class="d-flex">
        <!-- Include de la sidebar -->
        {% include '_sidebar.html.twig' with {
            'beneficiaire': beneficiaire,
            'sectionActive': 'bilan'
        } %}

        <!-- Contenu principal avec marge pour la sidebar -->
        <div class="main-content">
            <!-- Header avec thème cohérent -->
            <div class="dossier-header">
                <div class="d-flex justify-content-between align-items-center">
                    <!-- Section gauche : Nom bénéficiaire -->
                    <div class="d-flex align-items-center">
                        <div class="beneficiaire-info text-header">
                            <h4 class="mb-0">
                                {{ beneficiaire.civilite ? beneficiaire.civilite|lower|title ~ ' ' : '' }}
                                {{ beneficiaire.nom }} {{ beneficiaire.prenom }}
                            </h4>
                            <small class="sous-titre">
                                Modification du bilan d'accompagnement
                            </small>
                        </div>
                    </div>
                    <div class="header-actions">
                        <a href="{{ path('app_bilan_show', {beneficiaireId: beneficiaire.id}) }}" class="btn-action btn-retour">
                            <i class="fa-solid fa-x"></i> Annuler
                        </a>
                    </div>
                </div>
            </div>

            <!-- Contenu de la section avec container -->
            <div class="container-fluid p-4">
                <div class="card mb-3">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6">
                                <p class="mb-1"><strong>Bénéficiaire :</strong> {{ beneficiaire.civilite ? beneficiaire.civilite|lower|title ~ ' ' : '' }}{{ beneficiaire.nom }} {{ beneficiaire.prenom }}</p>
                                <p class="mb-1"><strong>Nom du psychologue :</strong> {{ bilan.auteur ? bilan.auteur.prenom ~ ' ' ~ bilan.auteur.nom : 'Non renseigné' }}</p>
                            </div>
                            <div class="col-md-6">
                                <p class="mb-1"><strong>Structure :</strong> {{ beneficiaire.prescripteurStructure|default('Non renseigné') }}</p>
                                <p class="mb-1"><strong>Évaluation source :</strong> Évaluation du {{ bilan.evaluationSource.dateEvaluation|date('d/m/Y') }} par {{ bilan.evaluationSource.evaluateur.prenom }} {{ bilan.evaluationSource.evaluateur.nom }}</p>
                            </div>
                        </div>
                    </div>
                </div>

            <form method="post">
                {% set compteur = 0 %}
                {% for sectionKey, objectifs in objectifsParSection %}
                    {% if objectifs|length > 0 %}
                    <div class="card mb-4">
                        <div class="card-header text-white purple">
                            <h5 class="mb-0">{{ objectifs[0].texteQuestion }}</h5>
                        </div>
                        <div class="card-body p-0">
                            <div class="table-responsive">
                                <table class="table table-bordered mb-0">
                                    <thead class="table-light">
                                        <tr>
                                            <th style="width: 35%">Résultats atteints à la fin de l'accompagnement</th>
                                            <th style="width: 10%" class="text-center">Abordé</th>
                                            <th style="width: 25%">Préconisations</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for objectif in objectifs %}
                                        <tr>
                                            <td>{{ objectif.texteObjectif }}</td>
                                            <td class="text-center align-middle">
                                                <input type="checkbox" 
                                                       name="objectifs[{{ compteur }}][aborde]"
                                                       class="form-check-input"
                                                       style="width: 20px; height: 20px;"
                                                       {{ objectif.aborde ? 'checked' : '' }}>
                                            </td>
                                            <td>
                                                <textarea name="objectifs[{{ compteur }}][preconisations]" 
                                                          class="form-control" 
                                                          rows="3"
                                                          placeholder="Ajoutez des préconisations...">{{ objectif.preconisations }}</textarea>
                                            </td>
                                            
                                            {# Champs cachés pour conserver les métadonnées #}
                                            <input type="hidden" name="objectifs[{{ compteur }}][section]" value="{{ objectif.section }}">
                                            <input type="hidden" name="objectifs[{{ compteur }}][codeQuestion]" value="{{ objectif.codeQuestion }}">
                                            <input type="hidden" name="objectifs[{{ compteur }}][texteQuestion]" value="{{ objectif.texteQuestion }}">
                                            <input type="hidden" name="objectifs[{{ compteur }}][texteObjectif]" value="{{ objectif.texteObjectif }}">
                                            <input type="hidden" name="objectifs[{{ compteur }}][indexObjectif]" value="{{ objectif.indexObjectif }}">
                                        </tr>
                                        {% set compteur = compteur + 1 %}
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    {% endif %}
                {% endfor %}

                    <div class="d-flex justify-content-between mt-4 mb-4">
                        <button type="submit" class="btn btn-save-inline mb-0">
                            <i class="fas fa-save me-2"></i> Sauvegarder
                        </button>
                        <a href="{{ path('app_bilan_show', {beneficiaireId: beneficiaire.id}) }}" class="btn-action btn-retour d-flex">
                            <i class="fa-solid fa-x"></i> Annuler
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>

<style>
    .table td, .table th {
        vertical-align: middle;
    }

    .card-header {
        font-weight: bold;
    }

    textarea.form-control {
        resize: vertical;
        min-height: 60px;
    }
</style>
{% endblock %}