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

{% block title %}Comptabilite - Administration - Association E-Cosplay{% endblock %}

{% block admin_content %}
<div class="page-container">
    <h1 class="text-2xl font-bold heading-page mb-8">Comptabilite</h1>

    {% 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 %}
    {% for flash in app.flashes('warning') %}
        <div class="mb-4 p-3 bg-yellow-500/20 text-yellow-700 font-bold text-xs">{{ flash }}</div>
    {% endfor %}

    {# Selecteur de periode #}
    <div class="glass p-5 mb-8">
        <h2 class="text-sm font-bold uppercase tracking-wider mb-4">Periode d'export</h2>
        <div class="flex flex-wrap items-end gap-3" id="compta-period-form">
            <div>
                <label for="compta-period" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Periode</label>
                <select id="compta-period" class="input-glass px-3 py-2 text-xs font-bold">
                    <option value="current">Mois en cours</option>
                    <option value="previous">Mois precedent</option>
                    <option value="custom">Periode personnalisee</option>
                </select>
            </div>
            <div id="compta-custom-range" class="hidden flex items-end gap-3">
                <div>
                    <label for="compta-from" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Du</label>
                    <input type="date" id="compta-from" class="input-glass px-3 py-2 text-xs font-bold">
                </div>
                <div>
                    <label for="compta-to" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Au</label>
                    <input type="date" id="compta-to" class="input-glass px-3 py-2 text-xs font-bold">
                </div>
            </div>
            <div>
                <label for="compta-format" class="block text-[9px] font-bold uppercase tracking-wider text-gray-400 mb-1">Format</label>
                <select id="compta-format" class="input-glass px-3 py-2 text-xs font-bold">
                    <option value="csv">CSV (SAGE)</option>
                    <option value="json">JSON</option>
                </select>
            </div>
        </div>
    </div>

    {# Exports comptables #}
    <h2 class="text-lg font-bold uppercase mb-4">Exports comptables</h2>
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mb-8">

        {% set exports = [
            {key: 'journal-ventes', title: 'Journal des ventes', icon: 'document', url: path('app_admin_comptabilite_export_journal_ventes'), desc: 'Ecritures comptables de ventes avec comptes 706 et TVA. Compatible SAGE.', items: ['Comptes produits (706000)', 'Comptes clients (EC-xxxx)', 'Ecritures de reglement']},
            {key: 'grand-livre', title: 'Grand livre clients', icon: 'book', url: path('app_admin_comptabilite_export_grand_livre'), desc: 'Detail des mouvements par compte client avec statut et lettrage.', items: ['Mouvement par client', 'Statut paye/impaye', 'Lettrage automatique']},
            {key: 'fec', title: 'FEC', icon: 'shield', url: path('app_admin_comptabilite_export_fec'), desc: 'Fichier des Ecritures Comptables. Norme DGFiP obligatoire.', items: ['Norme DGFiP', '18 colonnes reglementaires', 'Compatible tous logiciels']},
            {key: 'balance-agee', title: 'Balance agee', icon: 'clock', url: path('app_admin_comptabilite_export_balance_agee'), desc: 'Creances clients par anciennete. Factures impayees en cours.', items: ['0-30 jours', '31-60 jours', '61-90 jours', '+90 jours']},
            {key: 'reglements', title: 'Reglements', icon: 'cash', url: path('app_admin_comptabilite_export_reglements'), desc: 'Paiements recus avec detail methode et compte bancaire.', items: ['Date de reglement', 'Methode (CB, SEPA, virement...)', 'Montants HT / TTC']}
        ] %}

        {% for export in exports %}
            <div class="glass overflow-hidden">
                <div class="px-4 py-3 glass-dark text-white">
                    <span class="font-bold text-sm uppercase tracking-wider">{{ export.title }}</span>
                </div>
                <div class="p-4">
                    <p class="text-xs text-gray-500 mb-3">{{ export.desc }}</p>
                    <ul class="text-[10px] text-gray-400 space-y-1 mb-4">
                        {% for item in export.items %}
                            <li>- {{ item }}</li>
                        {% endfor %}
                        {% if tva_enabled and export.key == 'journal-ventes' %}
                            <li>- TVA collectee (445710)</li>
                        {% endif %}
                    </ul>
                    <div class="flex gap-2">
                        <button type="button" class="compta-export-btn flex-1 btn-gold px-3 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900"
                                data-url="{{ export.url }}">
                            CSV / JSON
                        </button>
                        <button type="button" class="compta-pdf-btn flex-1 px-3 py-2 bg-gray-900 text-white hover:bg-[#fabf04] hover:text-gray-900 font-bold uppercase text-[10px] tracking-wider transition-all"
                                data-url="{{ path('app_admin_comptabilite_export_pdf', {type: export.key}) }}">
                            PDF
                        </button>
                        <button type="button" class="compta-sign-btn px-3 py-2 bg-purple-500/20 text-purple-700 hover:bg-purple-500 hover:text-white font-bold uppercase text-[10px] tracking-wider transition-all"
                                data-url="{{ path('app_admin_comptabilite_export_pdf_sign', {type: export.key}) }}"
                                title="PDF + Signature electronique">
                            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>
                        </button>
                    </div>
                </div>
            </div>
        {% endfor %}
    </div>

    {# Exports complementaires #}
    <h2 class="text-lg font-bold uppercase mb-4">Exports complementaires</h2>
    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">

        {# Commissions Stripe #}
        <div class="glass overflow-hidden">
            <div class="px-4 py-3 glass-dark text-white">
                <span class="font-bold text-sm uppercase tracking-wider">Commissions Stripe</span>
            </div>
            <div class="p-4">
                <p class="text-xs text-gray-500 mb-3">Detail des commissions Stripe prelevees sur chaque paiement (1,5% + 0,25 E par transaction).</p>
                <ul class="text-[10px] text-gray-400 space-y-1 mb-4">
                    <li>- Montant par transaction</li>
                    <li>- Commission calculee</li>
                    <li>- Net percu apres commission</li>
                    <li>- Methode de paiement</li>
                </ul>
                <div class="flex gap-2">
                    <button type="button" class="compta-export-btn flex-1 btn-gold px-3 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900"
                            data-url="{{ path('app_admin_comptabilite_export_commissions_stripe') }}">
                        CSV / JSON
                    </button>
                    <button type="button" class="compta-pdf-btn flex-1 px-3 py-2 bg-gray-900 text-white hover:bg-[#fabf04] hover:text-gray-900 font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_export_pdf', {type: 'commissions-stripe'}) }}">
                        PDF
                    </button>
                    <button type="button" class="compta-sign-btn px-3 py-2 bg-purple-500/20 text-purple-700 hover:bg-purple-500 hover:text-white font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_export_pdf_sign', {type: 'commissions-stripe'}) }}"
                            title="PDF + Signature electronique">
                        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>
                    </button>
                </div>
            </div>
        </div>

        {# Couts services #}
        <div class="glass overflow-hidden">
            <div class="px-4 py-3 glass-dark text-white">
                <span class="font-bold text-sm uppercase tracking-wider">Couts services E-Cosplay</span>
            </div>
            <div class="p-4">
                <p class="text-xs text-gray-500 mb-3">Couts payes par E-Cosplay pour chaque service (infra, prestataires, NDD...) vs CA genere.</p>
                <ul class="text-[10px] text-gray-400 space-y-1 mb-4">
                    <li>- E-Site (150 E/mois)</li>
                    <li>- E-Mail (70 E/mois)</li>
                    <li>- NDD (15 E/ligne)</li>
                    <li>- Marge par service</li>
                </ul>
                <div class="flex gap-2">
                    <button type="button" class="compta-export-btn flex-1 btn-gold px-3 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900"
                            data-url="{{ path('app_admin_comptabilite_export_couts_services') }}">
                        CSV / JSON
                    </button>
                    <button type="button" class="compta-pdf-btn flex-1 px-3 py-2 bg-gray-900 text-white hover:bg-[#fabf04] hover:text-gray-900 font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_export_pdf', {type: 'couts-services'}) }}">
                        PDF
                    </button>
                    <button type="button" class="compta-sign-btn px-3 py-2 bg-purple-500/20 text-purple-700 hover:bg-purple-500 hover:text-white font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_export_pdf_sign', {type: 'couts-services'}) }}"
                            title="PDF + Signature electronique">
                        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>
                    </button>
                </div>
            </div>
        </div>
        {# Echeanciers #}
        <div class="glass overflow-hidden">
            <div class="px-4 py-3 glass-dark text-white">
                <span class="font-bold text-sm uppercase tracking-wider">Echeanciers de paiement</span>
            </div>
            <div class="p-4">
                <p class="text-xs text-gray-500 mb-3">Export des echeanciers et echeances : reference, client, creance, majoration, paiements recus, statut SEPA.</p>
                <ul class="text-[10px] text-gray-400 space-y-1 mb-4">
                    <li>- Detail par echeance (date, montant, statut)</li>
                    <li>- Majoration 5% incluse</li>
                    <li>- Avis de paiement lie</li>
                </ul>
                <div class="flex gap-2">
                    <button type="button" class="compta-export-btn flex-1 btn-gold px-3 py-2 font-bold uppercase text-[10px] tracking-wider text-gray-900"
                            data-url="{{ path('app_admin_comptabilite_export_echeanciers') }}">
                        CSV / JSON
                    </button>
                    <button type="button" class="compta-pdf-btn flex-1 px-3 py-2 bg-gray-900 text-white hover:bg-[#fabf04] hover:text-gray-900 font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_export_pdf', {type: 'echeanciers'}) }}">
                        PDF
                    </button>
                    <button type="button" class="compta-sign-btn px-3 py-2 bg-purple-500/20 text-purple-700 hover:bg-purple-500 hover:text-white font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_export_pdf_sign', {type: 'echeanciers'}) }}"
                            title="PDF + Signature electronique">
                        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>
                    </button>
                </div>
            </div>
        </div>
    </div>

    {# Rapport financier public #}
    <h2 class="text-lg font-bold uppercase mb-4 mt-8">Rapport financier public</h2>
    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
        <div class="glass overflow-hidden">
            <div class="px-4 py-3 glass-dark text-white">
                <span class="font-bold text-sm uppercase tracking-wider">Rapport financier</span>
            </div>
            <div class="p-4">
                <p class="text-xs text-gray-500 mb-3">Document public synthetique sans donnees nominatives. Resume des recettes par service, depenses et bilan.</p>
                <ul class="text-[10px] text-gray-400 space-y-1 mb-4">
                    <li>- Recettes par type de service</li>
                    <li>- Commissions Stripe</li>
                    <li>- Infrastructure serveur</li>
                    <li>- Prestataires services numeriques</li>
                    <li>- Bilan : excedent / equilibre / deficit</li>
                </ul>
                <div class="flex gap-2">
                    <button type="button" class="compta-pdf-btn flex-1 px-3 py-2 bg-gray-900 text-white hover:bg-[#fabf04] hover:text-gray-900 font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_rapport_financier') }}">
                        Telecharger PDF
                    </button>
                    <button type="button" class="compta-sign-btn px-3 py-2 bg-purple-500/20 text-purple-700 hover:bg-purple-500 hover:text-white font-bold uppercase text-[10px] tracking-wider transition-all"
                            data-url="{{ path('app_admin_comptabilite_rapport_financier_sign') }}"
                            title="PDF + Signature electronique">
                        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    const periodSelect = document.getElementById('compta-period');
    const customRange = document.getElementById('compta-custom-range');

    periodSelect.addEventListener('change', function() {
        customRange.classList.toggle('hidden', this.value !== 'custom');
    });

    function buildUrl(baseUrl) {
        const url = new URL(baseUrl, window.location.origin);
        const period = periodSelect.value;

        url.searchParams.set('period', period);

        if (period === 'custom') {
            const from = document.getElementById('compta-from').value;
            const to = document.getElementById('compta-to').value;
            if (!from || !to) {
                alert('Veuillez renseigner les dates de debut et de fin.');
                return null;
            }
            url.searchParams.set('from', from);
            url.searchParams.set('to', to);
        }

        return url;
    }

    // Export CSV/JSON
    document.querySelectorAll('.compta-export-btn').forEach(function(btn) {
        btn.addEventListener('click', function() {
            const url = buildUrl(this.dataset.url);
            if (!url) return;
            url.searchParams.set('format', document.getElementById('compta-format').value);
            window.location.href = url.toString();
        });
    });

    // Export PDF (telechargement direct)
    document.querySelectorAll('.compta-pdf-btn').forEach(function(btn) {
        btn.addEventListener('click', function() {
            const url = buildUrl(this.dataset.url);
            if (!url) return;
            window.location.href = url.toString();
        });
    });

    // Export PDF + Signature DocuSeal
    document.querySelectorAll('.compta-sign-btn').forEach(function(btn) {
        btn.addEventListener('click', function() {
            const url = buildUrl(this.dataset.url);
            if (!url) return;
            if (confirm('Generer le PDF et le signer electroniquement via DocuSeal ?')) {
                window.location.href = url.toString();
            }
        });
    });
});
</script>
{% endblock %}
