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

{% block title %}Suivis individuels — retour d'assiettes{% endblock %}

{% block body %}
<div class="d-flex align-items-center justify-content-between mb-4">
    <div>
        <h1 class="h4 fw-bold page-title mb-0">
            <i class="fas fa-user-clock me-2"></i>Suivis individuels
        </h1>
        <small class="text-muted">Suivi médical du retour d'assiettes (dénutrition, appétit…)</small>
    </div>
    <div class="d-flex gap-2">
        <a href="{{ path('tenant_dechets_index') }}" class="btn btn-outline-secondary btn-sm">
            <i class="fas fa-arrow-left me-1"></i>Déchets
        </a>
        {% if is_granted('ROLE_TENANT_GESTIONNAIRE') %}
        <a href="{{ path('tenant_dechets_suivis_new') }}" class="btn btn-primary btn-sm">
            <i class="fas fa-plus me-1"></i>Nouveau suivi
        </a>
        {% endif %}
    </div>
</div>

{# ── Flash messages ────────────────────────────────────────────────────────── #}
{% for type, messages in app.flashes(['success','error','warning','info']) %}
    {% for msg in messages %}
    <div class="alert alert-{{ type == 'error' ? 'danger' : type }} alert-dismissible fade show mb-3">
        {{ msg }}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
    {% endfor %}
{% endfor %}

{# ── Suivis en cours ───────────────────────────────────────────────────────── #}
<div class="d-flex align-items-center gap-2 mb-3">
    <h6 class="fw-semibold text-success mb-0">
        <i class="fas fa-circle-dot me-1"></i>En cours
    </h6>
    <span class="badge bg-success">{{ actifs|length }}</span>
</div>

{% if actifs is empty %}
<div class="card border-0 shadow-sm mb-4">
    <div class="card-body text-center py-5 text-muted">
        <i class="fas fa-user-check fa-2x mb-3 d-block opacity-25"></i>
        Aucun suivi individuel actif
        {% if is_granted('ROLE_TENANT_GESTIONNAIRE') %}
        <div class="mt-3">
            <a href="{{ path('tenant_dechets_suivis_new') }}" class="btn btn-primary btn-sm">
                <i class="fas fa-plus me-1"></i>Créer un premier suivi
            </a>
        </div>
        {% endif %}
    </div>
</div>
{% else %}
<div class="row g-3 mb-4">
    {% for s in actifs %}
    <div class="col-md-6 col-xl-4">
        <div class="card border-0 shadow-sm h-100" style="border-left: 4px solid #198754 !important;">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-start mb-2">
                    <div>
                        <h6 class="fw-bold mb-1">{{ s.nom_personne }}</h6>
                        <span class="badge bg-light text-dark border">
                            {% if s.type_personne == 'eleve' %}🏫 Élève
                            {% elseif s.type_personne == 'resident' %}🏠 Résident
                            {% elseif s.type_personne == 'patient' %}🏥 Patient
                            {% else %}👤 Autre{% endif %}
                        </span>
                        {% if s.groupe_service %}
                            <span class="badge bg-secondary-subtle text-secondary border ms-1">{{ s.groupe_service }}</span>
                        {% endif %}
                    </div>
                    <span class="badge bg-success"><i class="fas fa-circle" style="font-size:.5rem"></i> Actif</span>
                </div>

                {% if s.motif %}
                <p class="small text-muted fst-italic mb-2 border-start border-info ps-2">
                    {{ s.motif|slice(0, 100) }}{% if s.motif|length > 100 %}…{% endif %}
                </p>
                {% endif %}

                <div class="small text-muted">
                    <i class="fas fa-calendar-start me-1"></i>Depuis le {{ s.date_debut|date('d/m/Y') }}
                </div>
                <div class="small text-muted mb-3">
                    <i class="fas fa-list-check me-1"></i><strong>{{ s.nb_releves }}</strong> relevé(s)
                    {% if s.dernier_releve %}
                    &bull; Dernier : {{ s.dernier_releve|date('d/m/Y') }}
                    {% endif %}
                </div>

                <a href="{{ path('tenant_dechets_suivis_show', {id: s.id}) }}"
                   class="btn btn-sm btn-success w-100">
                    <i class="fas fa-eye me-1"></i>Voir la fiche
                </a>
            </div>
        </div>
    </div>
    {% endfor %}
</div>
{% endif %}

{# ── Suivis archivés ───────────────────────────────────────────────────────── #}
{% if archives is not empty %}
<div class="d-flex align-items-center gap-2 mb-3 mt-2">
    <h6 class="fw-semibold text-secondary mb-0">
        <i class="fas fa-box-archive me-1"></i>Archivés
    </h6>
    <span class="badge bg-secondary">{{ archives|length }}</span>
</div>

<div class="card border-0 shadow-sm">
    <div class="card-body p-0">
        <table class="table table-sm mb-0 align-middle">
            <thead class="table-light">
                <tr>
                    <th>Personne</th>
                    <th>Type</th>
                    <th>Groupe</th>
                    <th>Période</th>
                    <th class="text-end">Relevés</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                {% for s in archives %}
                <tr class="text-muted">
                    <td class="fw-semibold text-body">{{ s.nom_personne }}</td>
                    <td>
                        {% if s.type_personne == 'eleve' %}Élève
                        {% elseif s.type_personne == 'resident' %}Résident
                        {% elseif s.type_personne == 'patient' %}Patient
                        {% else %}Autre{% endif %}
                    </td>
                    <td class="small">{{ s.groupe_service ?: '—' }}</td>
                    <td class="small">
                        {{ s.date_debut|date('d/m/Y') }}
                        → {{ s.date_fin ? s.date_fin|date('d/m/Y') : '?' }}
                    </td>
                    <td class="text-end">{{ s.nb_releves }}</td>
                    <td class="text-end">
                        <a href="{{ path('tenant_dechets_suivis_show', {id: s.id}) }}"
                           class="btn btn-sm btn-outline-secondary">
                            <i class="fas fa-eye"></i>
                        </a>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
{% endif %}
{% endblock %}