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

{% block title %}{{ prestataire.raisonSociale }} - Prestataire - Association E-Cosplay{% endblock %}

{% block admin_content %}
<div class="page-container">
    <div class="flex items-center justify-between mb-6">
        <div>
            <h1 class="text-2xl font-bold heading-page">{{ prestataire.raisonSociale }}</h1>
            <p class="text-xs text-gray-400 mt-1">{{ prestataire.siret ?? 'Pas de SIRET' }}</p>
        </div>
        <div class="flex items-center gap-3">
            {% if prestataire.state == 'active' %}
                <span class="px-3 py-1 bg-green-500/20 text-green-700 font-bold uppercase text-xs">Actif</span>
            {% else %}
                <span class="px-3 py-1 bg-gray-100 text-gray-500 font-bold uppercase text-xs">Inactif</span>
            {% endif %}
            <a href="{{ path('app_admin_prestataires_index') }}" class="px-4 py-2 glass font-bold uppercase text-[10px] tracking-widest hover:bg-gray-900 hover:text-white transition-all">Retour</a>
        </div>
    </div>

    {% for flash in app.flashes('success') %}
        <div class="mb-4 p-3 bg-green-500/20 text-green-700 font-bold text-xs">{{ flash }}</div>
    {% endfor %}
    {% for flash in app.flashes('error') %}
        <div class="mb-4 p-3 bg-red-500/20 text-red-700 font-bold text-xs">{{ flash }}</div>
    {% endfor %}

    {# Infos prestataire #}
    <div class="glass p-5 mb-6">
        <h2 class="text-sm font-bold uppercase tracking-wider mb-4">Informations</h2>
        <form method="post" action="{{ path('app_admin_prestataires_edit', {id: prestataire.id}) }}">
            <div class="grid grid-cols-1 md:grid-cols-3 gap-3 mb-4">
                <div>
                    <label for="presta-edit-raisonSociale" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Raison sociale</label>
                    <input type="text" id="presta-edit-raisonSociale" name="raisonSociale" value="{{ prestataire.raisonSociale }}" required class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-edit-siret" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">SIRET</label>
                    <input type="text" id="presta-edit-siret" name="siret" value="{{ prestataire.siret }}" maxlength="14" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-edit-email" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Email</label>
                    <input type="email" id="presta-edit-email" name="email" value="{{ prestataire.email }}" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-edit-phone" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Telephone</label>
                    <input type="text" id="presta-edit-phone" name="phone" value="{{ prestataire.phone }}" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-edit-address" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Adresse</label>
                    <input type="text" id="presta-edit-address" name="address" value="{{ prestataire.address }}" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-edit-zipCode" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Code postal</label>
                    <input type="text" id="presta-edit-zipCode" name="zipCode" value="{{ prestataire.zipCode }}" maxlength="10" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-edit-city" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Ville</label>
                    <input type="text" id="presta-edit-city" name="city" value="{{ prestataire.city }}" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
            </div>
            <div class="flex gap-2">
                <button type="submit" class="btn-gold px-4 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900">Enregistrer</button>
                <form method="post" action="{{ path('app_admin_prestataires_delete', {id: prestataire.id}) }}" class="inline" data-confirm="Supprimer ce prestataire et toutes ses factures ?">
                    <button type="submit" class="px-4 py-2 bg-red-500/20 text-red-700 hover:bg-red-500 hover:text-white font-bold uppercase text-[10px] tracking-wider transition-all">Supprimer</button>
                </form>
            </div>
        </form>
    </div>

    {# Factures #}
    <div class="flex items-center justify-between mb-4">
        <h2 class="text-lg font-bold uppercase">Factures</h2>
        <button type="button" data-modal-open="modal-add-facture"
                class="btn-gold px-4 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900">
            Ajouter une facture
        </button>
    </div>

    {% if prestataire.factures|length > 0 %}
        <div class="glass overflow-x-auto overflow-hidden">
            <table class="w-full text-sm">
                <thead>
                    <tr class="glass-dark text-white">
                        <th class="px-4 py-3 text-left font-bold uppercase text-xs tracking-widest">Periode</th>
                        <th class="px-4 py-3 text-left font-bold uppercase text-xs tracking-widest">N Facture</th>
                        <th class="px-4 py-3 text-right font-bold uppercase text-xs tracking-widest">Montant HT</th>
                        <th class="px-4 py-3 text-right font-bold uppercase text-xs tracking-widest">Montant TTC</th>
                        <th class="px-4 py-3 text-center font-bold uppercase text-xs tracking-widest">Statut</th>
                        <th class="px-4 py-3 text-center font-bold uppercase text-xs tracking-widest">PDF</th>
                        <th class="px-4 py-3 text-center font-bold uppercase text-xs tracking-widest">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    {% for f in prestataire.factures %}
                        <tr class="border-b border-white/20 hover:bg-white/50">
                            <td class="px-4 py-3 font-bold text-xs">{{ f.periodLabel }}</td>
                            <td class="px-4 py-3 text-xs font-mono">{{ f.numFacture }}</td>
                            <td class="px-4 py-3 text-right font-bold text-xs">{{ f.montantHt|number_format(2, ',', ' ') }} &euro;</td>
                            <td class="px-4 py-3 text-right font-bold text-xs">{{ f.montantTtc|number_format(2, ',', ' ') }} &euro;</td>
                            <td class="px-4 py-3 text-center">
                                {% if f.isPaid %}
                                    <span class="px-2 py-0.5 bg-green-500/20 text-green-700 font-bold uppercase text-[10px]">Payee</span>
                                {% else %}
                                    <span class="px-2 py-0.5 bg-orange-500/20 text-orange-700 font-bold uppercase text-[10px]">A payer</span>
                                {% endif %}
                            </td>
                            <td class="px-4 py-3 text-center">
                                {% if f.facturePdf %}
                                    <a href="{{ vich_uploader_asset(f, 'facturePdfFile') }}" target="_blank"
                                       class="px-2 py-0.5 bg-gray-900 text-white hover:bg-[#fabf04] hover:text-gray-900 font-bold uppercase text-[10px] transition-all">
                                        Voir
                                    </a>
                                {% else %}
                                    <span class="text-[10px] text-gray-400">—</span>
                                {% endif %}
                            </td>
                            <td class="px-4 py-3 text-center">
                                <div class="flex items-center justify-center gap-1">
                                    {% if not f.isPaid %}
                                        <form method="post" action="{{ path('app_admin_prestataires_facture_paid', {id: prestataire.id, factureId: f.id}) }}" class="inline" data-confirm="Marquer cette facture comme payee ?">
                                            <button type="submit" class="px-2 py-0.5 bg-green-500/20 text-green-700 hover:bg-green-500 hover:text-white font-bold uppercase text-[10px] transition-all">Payer</button>
                                        </form>
                                    {% endif %}
                                    <form method="post" action="{{ path('app_admin_prestataires_facture_delete', {id: prestataire.id, factureId: f.id}) }}" class="inline" data-confirm="Supprimer cette facture ?">
                                        <button type="submit" class="px-2 py-0.5 bg-red-500/20 text-red-700 hover:bg-red-500 hover:text-white font-bold uppercase text-[10px] transition-all">Suppr</button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        <p class="mt-3 text-xs text-gray-400">{{ prestataire.factures|length }} facture(s)</p>
    {% else %}
        <div class="glass p-8 text-center text-gray-400 font-bold">Aucune facture pour ce prestataire.</div>
    {% endif %}
</div>

{# Modal ajout facture #}
<div id="modal-add-facture" class="hidden fixed inset-0 z-50 flex items-center justify-center bg-black/50">
    <div class="glass-heavy p-6 w-full max-w-lg">
        <h2 class="text-lg font-bold uppercase mb-4">Ajouter une facture</h2>
        <form method="post" action="{{ path('app_admin_prestataires_facture_add', {id: prestataire.id}) }}" enctype="multipart/form-data">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-3 mb-4">
                <div class="md:col-span-2">
                    <label for="presta-add-numFacture" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">N Facture *</label>
                    <input type="text" id="presta-add-numFacture" name="numFacture" required class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-add-month" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Mois *</label>
                    <select id="presta-add-month" name="month" required class="input-glass w-full px-3 py-2 text-xs font-bold">
                        {% for m in 1..12 %}
                            <option value="{{ m }}" {{ m == "now"|date("n") ? 'selected' }}>{{ m }} - {{ ["Janvier","Fevrier","Mars","Avril","Mai","Juin","Juillet","Aout","Septembre","Octobre","Novembre","Decembre"][m-1] }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div>
                    <label for="presta-add-year" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Annee *</label>
                    <input type="number" id="presta-add-year" name="year" value="{{ "now"|date("Y") }}" min="2020" max="2099" required class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-add-montantHt" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Montant HT</label>
                    <input type="number" id="presta-add-montantHt" name="montantHt" step="0.01" min="0" value="0.00" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="presta-add-montantTtc" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Montant TTC</label>
                    <input type="number" id="presta-add-montantTtc" name="montantTtc" step="0.01" min="0" value="0.00" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
                <div class="md:col-span-2">
                    <label for="presta-add-facturePdf" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Fichier PDF</label>
                    <input type="file" id="presta-add-facturePdf" name="facturePdf" accept=".pdf" class="input-glass w-full px-3 py-2 text-xs font-bold">
                </div>
            </div>
            <div class="flex justify-end gap-2">
                <button type="button" data-modal-close="modal-add-facture"
                        class="px-4 py-2 glass font-bold uppercase text-[10px] tracking-widest">Annuler</button>
                <button type="submit" class="btn-gold px-4 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900">Ajouter</button>
            </div>
        </form>
    </div>
</div>
{% endblock %}
