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

{% block commercial_title %}Comptes bancaires{% endblock %}

{% block commercial_content %}
<div class="supplier-index-page" data-controller="bank-account-index">
    <header class="capsule-heading">
        <div class="capsule-heading-main">
            <div class="capsule-heading-content">
                <h1 class="capsule-heading-title">Comptes bancaires</h1>
                <p class="capsule-heading-subtitle">Gérez les coordonnées bancaires utilisées sur vos factures et documents commerciaux.</p>
            </div>
        </div>
        <div class="capsule-heading-actions">
            <a class="capsule-button capsule-button--secondary" href="{{ path('billing_invoice_index') }}"><i class="ti ti-file-invoice"></i>Factures</a>
            <a class="capsule-button capsule-button--secondary" href="{{ path('commercial_bank_export', filters) }}" data-turbo="false"><i class="ti ti-file-export"></i>Exporter</a>
            {% if is_granted('COMMERCIAL_REFERENCE_MANAGE', company) %}<a class="capsule-button capsule-button--primary" href="{{ path('commercial_bank_new') }}"><i class="ti ti-plus"></i>Nouveau compte</a>{% endif %}
        </div>
    </header>

    <section class="data-kpis-5" aria-label="Indicateurs des comptes bancaires">
        <article class="data-kpi data-kpi--indigo">
            <span class="data-kpi__icon"><i class="ti ti-building-bank"></i></span>
            <div><span>Comptes actifs</span><strong>{{ view.kpis.active }}</strong><small>{% if view.kpis.new_count %}+{{ view.kpis.new_count }} ce mois{% endif %}</small></div>
        </article>
        <article class="data-kpi data-kpi--green">
            <span class="data-kpi__icon"><i class="ti ti-star-filled"></i></span>
            <div><span>Compte par défaut</span><strong>{{ view.kpis.default_name ? '1' : '0' }}</strong><small>{{ view.kpis.default_name ?: 'Non défini' }}</small></div>
        </article>
        <article class="data-kpi data-kpi--violet">
            <span class="data-kpi__icon"><i class="ti ti-file-invoice"></i></span>
            <div><span>Factures associées</span><strong>{{ view.kpis.documents }}</strong><small>Hors brouillons et annulations</small></div>
        </article>
        <article class="data-kpi data-kpi--orange">
            <span class="data-kpi__icon"><i class="ti ti-coins"></i></span>
            <div><span>Devises configurées</span><strong>{{ view.kpis.currencies }}</strong><small>{{ view.currencies|join(', ') ?: 'Aucune devise' }}</small></div>
        </article>
        <article class="data-kpi data-kpi--gray">
            <span class="data-kpi__icon"><i class="ti ti-archive"></i></span>
            <div><span>Comptes archivés</span><strong>{{ view.kpis.archived }}</strong><small>Non proposés sur les documents</small></div>
        </article>
    </section>

    <div class="supplier-content-layout">
        <main>
            <form id="bank-filter-form" class="supplier-filter-card" method="get">
                <div class="supplier-filter-search">
                    <label for="bank-search">Recherche</label>
                    <div><i class="ti ti-search"></i><input id="bank-search" class="form-control" name="q" value="{{ filters.q }}" placeholder="Compte, titulaire, IBAN, BIC…"></div>
                </div>
                <div>
                    <label for="bank-status">Statut</label>
                    <select id="bank-status" 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 for="bank-currency">Devise</label>
                    <select id="bank-currency" class="form-select" name="currency"><option value="">Toutes</option>{% for currency in view.currencies %}<option value="{{ currency }}" {{ filters.currency == currency ? 'selected' : '' }}>{{ currency }}</option>{% endfor %}</select>
                </div>
                <div>
                    <label for="bank-default">Usage</label>
                    <select id="bank-default" class="form-select" name="default"><option value="">Tous</option><option value="default" {{ filters.default == 'default' ? 'selected' : '' }}>Compte par défaut</option><option value="standard" {{ filters.default == 'standard' ? 'selected' : '' }}>Comptes secondaires</option></select>
                </div>
                <button class="btn btn-primary" type="submit"><i class="ti ti-filter-filled"></i>Filtrer</button>
                <a href="{{ path('commercial_bank_index') }}">Réinitialiser</a>
            </form>

            <section class="supplier-table-card">
                <div class="supplier-table-toolbar">
                    <div><strong>{{ view.total_rows }} compte{{ 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="bank-filter-form" data-action="change->bank-account-index#submitFilters">
                            <option value="default" {{ filters.sort == 'default' ? 'selected' : '' }}>Compte par défaut</option>
                            <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="documents_desc" {{ filters.sort == 'documents_desc' ? 'selected' : '' }}>Plus utilisé</option>
                            <option value="recent" {{ filters.sort == 'recent' ? 'selected' : '' }}>Modification récente</option>
                        </select>
                    </label>
                </div>

                <div class="table-responsive">
                    <table class="table supplier-table align-middle mb-0">
                        <thead><tr><th>Compte bancaire</th><th>Titulaire</th><th>IBAN</th><th>BIC</th><th>Devise</th><th>Factures</th><th>Total facturé TTC</th><th>Dernière utilisation</th><th>Statut</th><th>Actions</th></tr></thead>
                        <tbody>
                        {% for row in view.rows %}
                            {% set bank = row.bank %}
                            {% set initials = bank.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', '#13a7bd', '#8b5cf6', '#ef5a67', '#f2b705'], loop.index0) }}">{{ initials }}</span><div><strong>{{ bank.nom }}</strong><small>{% if bank.default %}<i class="ti ti-star-filled text-warning"></i> Compte par défaut{% else %}{{ bank.ville ?: 'Localisation non renseignée' }}{% endif %}</small></div></div></td>
                                <td>{{ bank.accountHolder ?: '—' }}</td>
                                <td><code>{{ bank.iban }}</code></td>
                                <td><code>{{ bank.bic }}</code></td>
                                <td><span class="supplier-type is-company"><i class="ti ti-currency-euro"></i>{{ bank.currency }}</span></td>
                                <td><strong>{{ row.document_count }}</strong></td>
                                <td><strong>{{ row.total_ttc|number_format(2, ',', ' ') }} {{ bank.currency == 'EUR' ? '€' : bank.currency }}</strong></td>
                                <td>{{ row.last_used ? row.last_used|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><div class="d-flex align-items-center gap-2">
                                    <a class="link" href="{{ path('commercial_bank_show', {idtoken: bank.idtoken}) }}" title="Voir" aria-label="Voir {{ bank.nom }}"><i class="ti ti-eye fs-5"></i></a>
                                    {% if is_granted('COMMERCIAL_REFERENCE_MANAGE', company) %}<a class="link" href="{{ path('commercial_bank_edit', {idtoken: bank.idtoken}) }}" title="Modifier" aria-label="Modifier {{ bank.nom }}"><i class="ti ti-edit fs-5"></i></a>{% endif %}
                                    {% if is_granted('COMMERCIAL_REFERENCE_MANAGE', company) and not row.archived and not bank.default %}
                                        <form method="post" action="{{ path('commercial_bank_default', {idtoken: bank.idtoken}) }}" data-action="submit->bank-account-index#confirmDefault"><input type="hidden" name="_token" value="{{ csrf_token('bank_default_' ~ bank.idtoken) }}"><button class="btn btn-sm text-warning p-0" type="submit" title="Définir par défaut" aria-label="Définir {{ bank.nom }} par défaut"><i class="ti ti-star fs-5"></i></button></form>
                                        <form method="post" action="{{ path('commercial_bank_archive', {idtoken: bank.idtoken}) }}" data-action="submit->bank-account-index#confirmArchive"><input type="hidden" name="_token" value="{{ csrf_token('bank_archive_' ~ bank.idtoken) }}"><button class="btn btn-sm text-danger p-0" type="submit" title="Archiver" aria-label="Archiver {{ bank.nom }}"><i class="ti ti-archive fs-5"></i></button></form>
                                    {% elseif is_granted('COMMERCIAL_REFERENCE_MANAGE', company) and bank.default %}<span class="text-muted" title="Le compte par défaut ne peut pas être archivé"><i class="ti ti-lock fs-5"></i></span>{% endif %}
                                </div></td>
                            </tr>
                        {% else %}
                            <tr><td colspan="10" class="text-center text-muted py-5">Aucun compte bancaire 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> comptes</span>
                    <nav>
                        {% if view.page > 1 %}<a href="{{ path('commercial_bank_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_bank_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_bank_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="bank-filter-form" data-action="change->bank-account-index#submitFilters">{% for size in [10, 25, 50] %}<option value="{{ size }}" {{ filters.perPage == size ? 'selected' : '' }}>{{ size }}</option>{% endfor %}</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('COMMERCIAL_REFERENCE_MANAGE', company) %}<a class="is-primary" href="{{ path('commercial_bank_new') }}"><i class="ti ti-building-bank"></i><span><strong>Ajouter un compte</strong><small>IBAN, BIC et titulaire</small></span></a>{% endif %}
                <a class="is-warning" href="{{ path('commercial_bank_index', {default: 'default'}) }}"><i class="ti ti-star"></i><span><strong>Compte par défaut</strong><small>{{ view.kpis.default_name ?: 'Aucun compte défini' }}</small></span></a>
                <a href="{{ path('billing_invoice_index') }}"><i class="ti ti-file-invoice"></i><span><strong>Consulter les factures</strong><small>{{ view.kpis.documents }} facture{{ view.kpis.documents > 1 ? 's' : '' }} associée{{ view.kpis.documents > 1 ? 's' : '' }}</small></span></a>
                <a href="{{ path('commercial_bank_index', {status: 'archived'}) }}"><i class="ti ti-archive"></i><span><strong>Comptes archivés</strong><small>{{ view.kpis.archived }} compte{{ view.kpis.archived > 1 ? 's' : '' }}</small></span></a>
            </section>
        </aside>
    </div>
</div>
{% endblock %}