{% extends 'parents/_layout.html.twig' %}

{% block title %}Profil - {{ enfant.prenom }} {{ enfant.nom }}{% endblock %}

{% block page_title %}Profil - {{ enfant.prenom }} {{ enfant.nom }}{% endblock %}

{% block body %}
    <p class="text-muted fst-italic">Fiche en lecture seule. Pour toute correction, soumettez une demande de modification ci-dessous.</p>

    <div class="row g-5">
        <div class="col-md-6">
            <div class="card mb-5">
                <div class="card-header border-0 pt-6"><div class="card-title"><h3>Identité</h3></div></div>
                <div class="card-body pt-0">
                    <p>Né(e) le {{ enfant.dateNaissance|date('d/m/Y') }}</p>
                    <p>Groupe : {{ enfant.groupe ? enfant.groupe.nom : 'non affecté' }}</p>
                    {% if enfant.dateEntree %}<p class="mb-0">Entrée à la crèche : {{ enfant.dateEntree|date('d/m/Y') }}</p>{% endif %}
                </div>
            </div>

            <div class="card mb-5">
                <div class="card-header border-0 pt-6"><div class="card-title"><h3>Responsables légaux</h3></div></div>
                <div class="card-body pt-0">
                    <ul class="mb-0">
                        {% for lien in enfant.responsablesLegaux %}
                            <li>
                                {{ lien.responsableLegal.prenom }} {{ lien.responsableLegal.nom }} - {{ lien.statutAutoriteParentale.label }}
                                {% if lien.estPersonnePayeuse %}· personne payeuse{% endif %}
                                {% if lien.estContactUrgence %}· contact d'urgence{% endif %}
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>

            <div class="card">
                <div class="card-header border-0 pt-6"><div class="card-title"><h3>Personnes autorisées à récupérer l'enfant</h3></div></div>
                <div class="card-body pt-0">
                    {% if personnesAutorisees is empty %}
                        <div class="text-muted">Aucune personne autorisée active actuellement.</div>
                    {% else %}
                        <ul class="mb-0">
                            {% for personne in personnesAutorisees %}
                                <li>{{ personne.prenom }} {{ personne.nom }} - {{ personne.roleLabel }}</li>
                            {% endfor %}
                        </ul>
                    {% endif %}
                </div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="card mb-5">
                <div class="card-header border-0 pt-6"><div class="card-title"><h3>Alertes</h3></div></div>
                <div class="card-body pt-0">
                    {% if alertesVisibles is empty %}
                        <div class="text-muted">Aucune alerte active.</div>
                    {% else %}
                        <ul class="mb-0">
                            {% for alerte in alertesVisibles %}
                                <li><strong>{{ alerte.type.label }}</strong> - {{ alerte.description }}</li>
                            {% endfor %}
                        </ul>
                    {% endif %}
                </div>
            </div>

            <div class="card">
                <div class="card-header border-0 pt-6"><div class="card-title"><h3>Consentement image</h3></div></div>
                <div class="card-body pt-0">
                    {% if enfant.consentementsImage is empty %}
                        <div class="text-muted">Aucun consentement enregistré.</div>
                    {% else %}
                        <ul class="mb-0">
                            {% for consentement in enfant.consentementsImage %}
                                <li>{{ consentement.typeUsage.label }} : {{ consentement.accorde ? 'accordé' : 'refusé' }}</li>
                            {% endfor %}
                        </ul>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>

    <div class="card mt-5">
        <div class="card-header border-0 pt-6"><div class="card-title"><h3>Demandes de modification</h3></div></div>
        <div class="card-body pt-0">
            {% if demandesModification is not empty %}
                <div class="d-flex flex-column gap-2 mb-5">
                    {% for demande in demandesModification %}
                        {% set couleur = demande.statut.value == 'validee' ? 'success' : (demande.statut.value == 'refusee' ? 'danger' : (demande.statut.value == 'revoquee' ? 'secondary' : 'warning')) %}
                        <div class="d-flex align-items-center justify-content-between border border-{{ couleur }} border-2 rounded p-3 {{ demande.statut.value == 'revoquee' ? '' : 'bg-light-' ~ couleur }}">
                            <div>
                                <span class="text-muted fs-7">{{ demande.dateCreation|date('d/m/Y') }}</span> - {{ demande.description }}
                                <span class="badge badge-light-{{ couleur }} ms-2">{{ demande.statut.label }}</span>
                            </div>
                            {% if demande.statut.value == 'en_attente' %}
                                <form method="post" action="{{ path('parents_espace_annuler_demande_modification', {enfantId: enfant.id, id: demande.id}) }}" onsubmit="return confirm('Annuler cette demande ?');">
                                    <input type="hidden" name="_csrf_token" value="{{ csrf_token('parents_demande_modification_annuler_' ~ demande.id) }}">
                                    <button type="submit" class="btn btn-light-danger btn-sm">Annuler</button>
                                </form>
                            {% endif %}
                        </div>
                    {% endfor %}
                </div>
            {% endif %}
            <form method="post" action="{{ path('parents_espace_demander_modification', {enfantId: enfant.id}) }}">
                <input type="hidden" name="_csrf_token" value="{{ csrf_token('parents_demande_modification_' ~ enfant.id) }}">
                <div class="mb-3">
                    <label class="form-label">Décrivez la correction souhaitée *</label>
                    <textarea name="description" required class="form-control"></textarea>
                </div>
                <button type="submit" class="btn btn-primary">Envoyer la demande</button>
            </form>
        </div>
    </div>
{% endblock %}