{% extends '@Commercial/commercial/layout.html.twig' %}

{% block commercial_title %}Fournisseurs{% endblock %}

{% block commercial_content %}
{% set month_names = {1:'Janvier',2:'Février',3:'Mars',4:'Avril',5:'Mai',6:'Juin',7:'Juillet',8:'Août',9:'Septembre',10:'Octobre',11:'Novembre',12:'Décembre'} %}
<div class="supplier-index-page" data-controller="supplier-index">
    <header class="capsule-heading">
        <div class="capsule-heading-main">
            <div class="capsule-heading-content">
                <h1 class="capsule-heading-title">Fournisseurs</h1>
                <p class="capsule-heading-subtitle">Gérez les fournisseurs utilisés dans les dépenses.</p>
            </div>
        </div>

        <div class="capsule-heading-actions">
            {% if is_granted('SUPPLIER_EDIT', company) %}
                <button class="capsule-button capsule-button--secondary" type="button" data-bs-toggle="modal" data-bs-target="#supplier-import-modal"><i class="ti ti-file-import"></i>Importer</button>
            {% endif %}
            <a class="capsule-button capsule-button--secondary" href="{{ path('commercial_supplier_export', filters) }}" data-turbo="false"><i class="ti ti-file-export"></i>Exporter</a>
            {% if is_granted('SUPPLIER_EDIT', company) %}
                <a class="capsule-button capsule-button--primary" href="{{ path('commercial_supplier_new') }}"><i class="ti ti-plus"></i>Nouveau fournisseur</a>
            {% endif %}
        </div>
    </header>

     <section class="data-kpis-5" aria-label="Indicateurs des dépenses">
        <article class="data-kpi data-kpi--indigo">
            <span class="data-kpi__icon"><i class="ti ti-truck-delivery"></i></span>
            <div>
                <span>Fournisseurs actifs</span>
                <strong>{{ view.kpis.active }}</strong>
                <small>{% if view.kpis.new_count %}<span>+{{ view.kpis.new_count }} ce mois</span>{% endif %}</small>
            </div>
        </article>

        <article class="data-kpi data-kpi--violet">
            <span class="data-kpi__icon"><i class="ti ti-building"></i></span>
            <div>
                <span>Entreprises</span>
                <strong>{{ view.kpis.companies }}</strong>
            </div>
        </article>

        <article class="data-kpi data-kpi--orange">
            <span class="data-kpi__icon"><i class="ti ti-user"></i></span>
            <div>
                <span>Particuliers</span>
                <strong>{{ view.kpis.individuals }}</strong>
            </div>
        </article>

        <article class="data-kpi data-kpi--gray">
            <span class="data-kpi__icon"><i class="ti ti-archive"></i></span>
            <div>
                <span>Archivés</span>
                <strong>{{ view.kpis.archived }}</strong>
            </div>
        </article>

         <article class="data-kpi data-kpi--green">
            <span class="data-kpi__icon"><i class="ti ti-currency-euro"></i></span>
            <div>
                <span>Fournisseurs actifs</span>
                <strong>{{ view.kpis.monthly_total|number_format(2, ',', ' ') }} €</strong>
                <small>{{ month_names['now'|date('n')] }} {{ 'now'|date('Y') }}</small>
            </div>
        </article>

    </section>

    <div class="supplier-content-layout">
        <main>
            <form id="supplier-filter-form" class="supplier-filter-card" method="get">
                <div class="supplier-filter-search"><label>Recherche</label><div><i class="ti ti-search"></i><input class="form-control" name="q" value="{{ filters.q }}" placeholder="Rechercher par nom, SIRET, ville…"></div></div>
                <div><label>Type</label><select class="form-select" name="type"><option value="">Tous</option><option value="company" {{ filters.type == 'company' ? 'selected' : '' }}>Entreprise</option><option value="individual" {{ filters.type == 'individual' ? 'selected' : '' }}>Particulier</option></select></div>
                <div><label>Statut</label><select class="form-select" name="status"><option value="active" {{ filters.status == 'active' ? 'selected' : '' }}>Actifs</option><option value="archived" {{ filters.status == 'archived' ? 'selected' : '' }}>Archivés</option><option value="all" {{ filters.status == 'all' ? 'selected' : '' }}>Tous</option></select></div>
                <div><label>Ville</label><select class="form-select" name="city"><option value="">Toutes</option>{% for city in view.cities %}<option value="{{ city }}" {{ filters.city == city ? 'selected' : '' }}>{{ city }}</option>{% endfor %}</select></div>
                <button class="btn btn-primary" type="submit"><i class="ti ti-filter-filled"></i>Filtrer</button><a href="{{ path('commercial_supplier_index') }}">Réinitialiser</a>
            </form>

            <section class="supplier-table-card">
                <div class="supplier-table-toolbar"><div><strong>{{ view.total_rows }} fournisseur{{ view.total_rows > 1 ? 's' : '' }}</strong><span>trouvé{{ view.total_rows > 1 ? 's' : '' }}</span></div><label>Trier par : <select class="form-select form-select-sm" name="sort" form="supplier-filter-form" data-action="change->supplier-index#submitFilters"><option value="name" {{ filters.sort == 'name' ? 'selected' : '' }}>Nom A–Z</option><option value="name_desc" {{ filters.sort == 'name_desc' ? 'selected' : '' }}>Nom Z–A</option><option value="amount_desc" {{ filters.sort == 'amount_desc' ? 'selected' : '' }}>Dépenses décroissantes</option><option value="recent" {{ filters.sort == 'recent' ? 'selected' : '' }}>Dernière dépense</option></select></label></div>
                <div class="table-responsive"><table class="table supplier-table align-middle mb-0"><thead><tr><th>Fournisseur</th><th>Type</th><th>SIRET / SIREN</th><th>Ville</th><th>Email</th><th>Téléphone</th><th>Total dépenses</th><th>Dernière dépense</th><th>Statut</th><th></th></tr></thead><tbody>
                {% for row in view.rows %}{% set supplier = row.supplier %}{% set initials = supplier.nom|split(' ')|map(word => word|slice(0,1))|join|slice(0,2)|upper %}<tr class="{{ row.archived ? 'is-archived' : '' }}"><td><div class="supplier-name"><span style="--supplier-color:{{ cycle(['#3b82f6','#ef5a67','#f2b705','#13a7bd','#8b5cf6'], loop.index0) }}">{{ initials }}</span><div><strong>{{ supplier.nom }}</strong><small>{{ supplier.specialty ?: 'Activité non renseignée' }}</small></div></div></td><td><span class="supplier-type is-{{ supplier.supplierType }}"><i class="ti {{ supplier.supplierType == 'individual' ? 'ti-user-filled' : 'ti-building' }}"></i>{{ supplier.supplierType == 'individual' ? 'Particulier' : 'Entreprise' }}</span></td><td>{% if supplier.legalIdentifier %}<code>{{ supplier.legalIdentifier }}</code>{% else %}<em>Non renseigné</em>{% endif %}</td><td>{% if supplier.city %}<i class="ti ti-map-pin-filled text-muted me-1"></i>{{ supplier.city }}{% else %}—{% endif %}</td><td>{% if supplier.email %}<a href="mailto:{{ supplier.email }}">{{ supplier.email }}</a>{% else %}—{% endif %}</td><td>{{ supplier.phone ?: '—' }}</td><td><strong>{{ row.total|number_format(2, ',', ' ') }} €</strong></td><td>{{ row.last_expense ? row.last_expense|date('d/m/Y') : '—' }}</td><td><span class="supplier-status {{ row.archived ? 'is-archived' : 'is-active' }}"><i></i>{{ row.archived ? 'Archivé' : 'Actif' }}</span></td><td><a class="link" href="{{ path('commercial_supplier_show', {idtoken: supplier.idtoken}) }}"><i class="ti ti-eye fs-5"></i></a></td></tr>{% else %}<tr><td colspan="10" class="text-center text-muted py-5">Aucun fournisseur ne correspond aux filtres.</td></tr>{% endfor %}
                </tbody></table></div>
                <footer class="supplier-table-footer"><span>Affichage de <strong>{{ view.first_row }}–{{ view.last_row }}</strong> sur <strong>{{ view.total_rows }}</strong> fournisseurs</span><nav>{% if view.page > 1 %}<a href="{{ path('commercial_supplier_index', filters|merge({page:view.page - 1})) }}"><i class="ti ti-chevron-left"></i></a>{% endif %}{% for page in 1..view.page_count %}{% if page == 1 or page == view.page_count or (page >= view.page - 1 and page <= view.page + 1) %}<a class="{{ page == view.page ? 'is-active' : '' }}" href="{{ path('commercial_supplier_index', filters|merge({page:page})) }}">{{ page }}</a>{% elseif page == 2 or page == view.page_count - 1 %}<span>…</span>{% endif %}{% endfor %}{% if view.page < view.page_count %}<a href="{{ path('commercial_supplier_index', filters|merge({page:view.page + 1})) }}"><i class="ti ti-chevron-right"></i></a>{% endif %}</nav><label>Par page : <select class="form-select form-select-sm" name="perPage" form="supplier-filter-form" data-action="change->supplier-index#submitFilters"><option value="10" {{ filters.perPage == 10 ? 'selected' : '' }}>10</option><option value="25" {{ filters.perPage == 25 ? 'selected' : '' }}>25</option><option value="50" {{ filters.perPage == 50 ? 'selected' : '' }}>50</option></select></label></footer>
            </section>
        </main>

        <aside class="supplier-quick-card"><div><span><i class="ti ti-bolt"></i></span><h2>Actions rapides</h2></div><section>{% if is_granted('SUPPLIER_EDIT', company) %}<a class="is-primary" href="{{ path('commercial_supplier_new') }}"><i class="ti ti-building"></i><span><strong>Créer fournisseur entreprise</strong><small>avec SIRET / SIREN</small></span></a>{% endif %}<a class="is-warning" href="{{ path('commercial_expense_index', {supplierMissing: 1}) }}"><i class="ti ti-receipt"></i><span><strong>Dépenses sans fournisseur</strong><small>{{ view.kpis.unlinked_expenses }} dépense{{ view.kpis.unlinked_expenses > 1 ? 's' : '' }} non liée{{ view.kpis.unlinked_expenses > 1 ? 's' : '' }}</small></span></a><a href="{{ path('commercial_supplier_index') }}"><i class="ti ti-archive"></i><span><strong>Fournisseurs</strong><small>{{ view.kpis.active }} actifs · {{ view.kpis.archived }} archivés</small></span></a></section></aside>
    </div>

    {% if is_granted('SUPPLIER_EDIT', company) %}<div class="modal fade" id="supplier-import-modal" tabindex="-1" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><form class="modal-content" method="post" enctype="multipart/form-data" action="{{ path('commercial_supplier_import') }}"><input type="hidden" name="_token" value="{{ csrf_token('supplier_import') }}"><div class="modal-header"><h2 class="modal-title fs-5">Importer des fournisseurs</h2><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div><div class="modal-body"><label class="form-label">Fichier CSV</label><input class="form-control" type="file" name="file" accept=".csv,text/csv" required data-supplier-index-target="importFile" data-action="change->supplier-index#fileSelected"><div class="form-text" data-supplier-index-target="fileHelp">Colonnes reconnues : nom, type, SIRET, ville, email, téléphone, activité.</div></div><div class="modal-footer"><button class="btn btn-outline-secondary" type="button" data-bs-dismiss="modal">Annuler</button><button class="btn btn-primary" type="submit"><i class="ti ti-file-import"></i>Importer</button></div></form></div></div>{% endif %}
</div>
{% endblock %}