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

{% block title %}Grille tarifaire{% endblock %}

{% block page_title %}Grille tarifaire{% endblock %}

{% block body %}
    <style>
        /* Chevron pivote selon l'état ouvert/fermé du panneau "Nouvelle ligne" (aria-expanded posé par Bootstrap collapse). */
        [data-bs-toggle="collapse"] .chevron-nouvelle-ligne { transition: transform 0.2s ease; }
        [data-bs-toggle="collapse"][aria-expanded="true"] .chevron-nouvelle-ligne { transform: rotate(180deg); }
    </style>

    <div class="card mb-5 mb-xl-8">
        <div class="card-header border-0 pt-6">
            <div class="card-title"><h3>Lignes tarifaires</h3></div>
        </div>
        <div class="card-body pt-0">
            {% if lignes is empty %}
                <div class="text-muted mb-4">Aucune ligne tarifaire.</div>
            {% else %}
                <div class="table-responsive mb-4">
                    <table class="table align-middle table-row-dashed fs-6 gy-5">
                        <thead>
                            <tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
                                <th>Libellé</th>
                                <th>Unité</th>
                                <th>Montant</th>
                                <th>Statut</th>
                                <th class="text-end">Actions</th>
                            </tr>
                        </thead>
                        <tbody class="fw-semibold text-gray-600">
                            {% for ligne in lignes %}
                                <tr>
                                    <td>{{ ligne.libelle }}</td>
                                    <td>{{ ligne.unite.label }}</td>
                                    <td>{{ ligne.montant|montant }} FCFA</td>
                                    <td>
                                        {% if ligne.actif %}
                                            <span class="badge badge-light-success">Actif</span>
                                        {% else %}
                                            <span class="badge badge-light">Désactivé</span>
                                        {% endif %}
                                    </td>
                                    <td class="text-end">
                                        <button type="button" class="btn btn-light btn-sm" data-bs-toggle="collapse" data-bs-target="#collapse-modifier-ligne-{{ ligne.id }}">Modifier</button>
                                    </td>
                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>

                {% for ligne in lignes %}
                    <div class="collapse mb-4" id="collapse-modifier-ligne-{{ ligne.id }}">
                        <form method="post" action="{{ path('comptabilite_grille_tarifaire_modifier', {id: ligne.id}) }}" class="row g-3 align-items-end border rounded p-4 m-0">
                            <input type="hidden" name="_csrf_token" value="{{ csrf_token('grille_tarifaire_modifier_' ~ ligne.id) }}">
                            <div class="col-md-3">
                                <label class="form-label">Libellé</label>
                                <input type="text" name="libelle" value="{{ ligne.libelle }}" required class="form-control">
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Unité</label>
                                <select name="unite" class="form-select">
                                    <option value="horaire" {{ ligne.unite.value == 'horaire' ? 'selected' }}>Horaire</option>
                                    <option value="journalier" {{ ligne.unite.value == 'journalier' ? 'selected' }}>Journalier</option>
                                    <option value="forfait_mensuel" {{ ligne.unite.value == 'forfait_mensuel' ? 'selected' }}>Forfait mensuel</option>
                                    <option value="forfait_unique" {{ ligne.unite.value == 'forfait_unique' ? 'selected' }}>Forfait unique</option>
                                    <option value="repas" {{ ligne.unite.value == 'repas' ? 'selected' }}>Par repas consommé</option>
                                </select>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label">Montant</label>
                                <input type="text" name="montant" value="{{ ligne.montant }}" required class="form-control">
                            </div>
                            <div class="col-md-2 form-check form-switch mb-2">
                                <input class="form-check-input" type="checkbox" name="actif" value="1" {% if ligne.actif %}checked{% endif %} id="ligne-actif-{{ ligne.id }}">
                                <label class="form-check-label" for="ligne-actif-{{ ligne.id }}">Actif</label>
                            </div>
                            <div class="col-md-2">
                                <button type="submit" class="btn btn-primary btn-sm">Enregistrer</button>
                            </div>
                        </form>
                    </div>
                {% endfor %}
            {% endif %}

            <div class="card border">
                <div class="card-header cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapse-nouvelle-ligne" aria-expanded="false">
                    <div class="card-title"><h4 class="m-0">Nouvelle ligne</h4></div>
                    <div class="card-toolbar">
                        <i class="ki-outline ki-down chevron-nouvelle-ligne fs-2"></i>
                    </div>
                </div>
                <div class="collapse" id="collapse-nouvelle-ligne">
                    <div class="card-body">
                        <form method="post" action="{{ path('comptabilite_grille_tarifaire_nouvelle') }}" class="row g-3 align-items-end">
                            <input type="hidden" name="_csrf_token" value="{{ csrf_token('grille_tarifaire_nouvelle') }}">
                            <div class="col-md-4">
                                <label class="form-label">Libellé *</label>
                                <input type="text" name="libelle" required class="form-control">
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Unité *</label>
                                <select name="unite" required class="form-select">
                                    <option value="horaire">Horaire</option>
                                    <option value="journalier">Journalier</option>
                                    <option value="forfait_mensuel">Forfait mensuel</option>
                                    <option value="forfait_unique">Forfait unique (tarif additionnel)</option>
                                    <option value="repas">Par repas consommé</option>
                                </select>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Montant *</label>
                                <input type="text" name="montant" required class="form-control">
                            </div>
                            <div class="col-md-2">
                                <button type="submit" class="btn btn-primary">Créer la ligne</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="card">
        <div class="card-header border-0 pt-6">
            <div class="card-title"><h3>Réduction fratrie</h3></div>
        </div>
        <div class="card-body pt-0">
            <p class="text-muted">
                {% if etablissement.reductionFratriePourcent is not null %}
                    Actuellement {{ etablissement.reductionFratriePourcent }}% à partir du 2e enfant d'une même famille.
                {% else %}
                    Aucune réduction fratrie configurée.
                {% endif %}
            </p>
            <form method="post" action="{{ path('comptabilite_grille_tarifaire_reduction_fratrie') }}" class="d-flex gap-2 align-items-end">
                <input type="hidden" name="_csrf_token" value="{{ csrf_token('grille_tarifaire_reduction_fratrie') }}">
                <div>
                    <label class="form-label">Pourcentage (0-100, vide = aucune réduction)</label>
                    <input type="number" name="pourcentage" min="0" max="100" value="{{ etablissement.reductionFratriePourcent }}" class="form-control">
                </div>
                <button type="submit" class="btn btn-primary">Enregistrer</button>
            </form>
        </div>
    </div>
{% endblock %}