{% extends 'app_base.html.twig' %}

{% block title %}Journal — Scan Inventaire{% endblock %}

{% set statusLabels = {'en_cours': 'En cours', 'a_valider': 'À valider', 'valide': 'Validé', 'annule': 'Annulé'} %}

{% block content %}
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-10 space-y-6">
    <div>
        <h1 class="font-display font-bold text-3xl text-gray-900 mb-2">Journal</h1>
        <p class="text-gray-500 text-sm">Trace des actions sensibles : statuts et concessions des scans, suppressions, imports, gestion des utilisateurs.</p>
    </div>

    {# Filtres #}
    <form method="get" action="{{ path('app_journal') }}" class="bg-white border border-gray-200 rounded-2xl p-4 shadow-sm grid grid-cols-1 sm:grid-cols-12 gap-3 items-end">
        <div class="sm:col-span-4">
            <label for="f-action" class="block text-xs font-medium text-gray-500 mb-1">Action</label>
            <select id="f-action" name="action" class="w-full text-sm border border-gray-300 rounded-lg px-2.5 py-2 bg-white">
                <option value="">Toutes</option>
                {% for key, label in actionLabels %}
                    <option value="{{ key }}" {{ filters.action == key ? 'selected' }}>{{ label }}</option>
                {% endfor %}
            </select>
        </div>
        <div class="sm:col-span-4">
            <label for="f-user" class="block text-xs font-medium text-gray-500 mb-1">Auteur</label>
            <select id="f-user" name="user" class="w-full text-sm border border-gray-300 rounded-lg px-2.5 py-2 bg-white">
                <option value="">Tous</option>
                {% for email in users %}
                    <option value="{{ email }}" {{ filters.user == email ? 'selected' }}>{{ email }}</option>
                {% endfor %}
            </select>
        </div>
        <div class="sm:col-span-3">
            <label for="f-scan" class="block text-xs font-medium text-gray-500 mb-1">ID de scan</label>
            <input id="f-scan" type="text" name="scan" value="{{ filters.scan }}" placeholder="uuid…"
                   class="w-full text-sm border border-gray-300 rounded-lg px-2.5 py-2 font-mono">
        </div>
        <div class="sm:col-span-1">
            <button type="submit" class="w-full px-3 py-2 text-sm font-medium bg-red-brand text-white rounded-lg hover:bg-red-brand-dark transition-colors">OK</button>
        </div>
    </form>

    <p class="text-xs text-gray-400">{{ total }} entrée(s){% if pages > 1 %} · page {{ page }} / {{ pages }}{% endif %}</p>

    {% if items is empty %}
        <div class="text-center py-16 bg-gray-50 border border-gray-200 rounded-2xl">
            <p class="text-gray-500 text-sm">Aucune entrée de journal{% if filters.scan or filters.user or filters.action %} pour ces filtres{% endif %}.</p>
        </div>
    {% else %}
        {# table-fixed + largeurs en % : le tableau tient toujours dans la largeur (pas de scroll horizontal),
           les contenus longs reviennent à la ligne au lieu d'élargir la page. #}
        <div class="bg-white border border-gray-200 rounded-2xl shadow-sm overflow-hidden">
            <table class="w-full text-sm table-fixed">
                <colgroup>
                    <col class="w-[5.5rem] sm:w-32">
                    <col class="w-28 sm:w-44">
                    <col class="w-32">
                    <col>
                    <col class="w-24 sm:w-40">
                </colgroup>
                <thead>
                    <tr class="text-left text-xs text-gray-500 uppercase tracking-wide border-b border-gray-200">
                        <th class="px-4 py-2.5 font-medium">Date</th>
                        <th class="px-4 py-2.5 font-medium">Action</th>
                        <th class="px-4 py-2.5 font-medium">Scan</th>
                        <th class="px-4 py-2.5 font-medium">Détail</th>
                        <th class="px-4 py-2.5 font-medium">Auteur</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-100">
                    {% for l in items %}
                        {% set d = l.details %}
                        <tr class="hover:bg-gray-50">
                            <td class="px-4 py-2 text-xs text-gray-500 font-mono align-top">{{ l.createdAt|date('d/m/Y')}}<br>{{ l.createdAt|date('H:i:s') }}</td>
                            <td class="px-4 py-2 align-top">
                                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium border break-words
                                    {% if l.action starts with 'user.' %}bg-purple-50 text-purple-700 border-purple-200
                                    {% elseif l.action starts with 'param.' %}bg-blue-50 text-blue-700 border-blue-200
                                    {% elseif l.action == 'scan.delete' or l.action == 'scan.delete_all' %}bg-red-50 text-red-700 border-red-200
                                    {% else %}bg-gray-100 text-gray-600 border-gray-200{% endif %}">{{ l.actionLabel }}</span>
                            </td>
                            <td class="px-4 py-2 align-top text-xs">
                                {% if l.scanLabel %}
                                    {% if l.scanId %}
                                        <a href="{{ path('app_inventaire_detail', {id: l.scanId}) }}" class="text-gray-900 font-medium hover:text-red-brand block truncate" title="{{ l.scanLabel }}">{{ l.scanLabel }}</a>
                                    {% else %}
                                        <span class="text-gray-900 font-medium block truncate" title="{{ l.scanLabel }}">{{ l.scanLabel }}</span>
                                    {% endif %}
                                {% else %}
                                    <span class="text-gray-300">—</span>
                                {% endif %}
                            </td>
                            <td class="px-4 py-2 text-gray-600 align-top break-words text-xs">
                                {% if l.action == 'scan.status' %}
                                    {{ statusLabels[d.from] ?? d.from }} <span class="text-gray-400">→</span> <span class="font-medium">{{ statusLabels[d.to] ?? d.to }}</span>
                                {% elseif l.action == 'scan.concessions' %}
                                    {{ (d.from ?? [])|concession_names|join(' / ')|default('—') }} <span class="text-gray-400">→</span> <span class="font-medium">{{ (d.to ?? [])|concession_names|join(' / ')|default('—') }}</span>
                                {% elseif l.action == 'scan.create' %}
                                    {{ d.vehicules ?? '?' }} véhicule(s) · {{ (d.concessions ?? [])|concession_names|join(' / ')|default('sans concession') }}
                                {% elseif l.action == 'scan.delete' %}
                                    « {{ d.label ?? '?' }} » (créé par {{ d.createur ?? '?' }}, statut {{ statusLabels[d.statut] ?? d.statut ?? '?' }})
                                {% elseif l.action == 'scan.delete_all' %}
                                    Scans personnels de {{ d.createur ?? '?' }} supprimés
                                {% elseif l.action == 'param.concessions_import' %}
                                    {{ d.concessions ?? '?' }} concession(s){% if d.fichier is defined %} — {{ d.fichier }}{% endif %}
                                {% elseif l.action == 'param.stock_import' %}
                                    {{ d.vehicules ?? '?' }} véhicule(s), {{ d.concessions ?? '?' }} concession(s){% if d.fichier is defined %} — {{ d.fichier }}{% endif %}
                                {% elseif l.action starts with 'user.' %}
                                    {{ d.compte ?? '?' }}{% if d.groupe is defined %} · {{ d.groupe }}{% endif %}{% if d.concessions is defined %} · {{ (d.concessions)|concession_names|join(' / ')|default('aucune concession') }}{% endif %}
                                {% endif %}
                            </td>
                            <td class="px-4 py-2 text-xs text-gray-500 align-top break-all">{{ l.userEmail }}</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>

        {% if pages > 1 %}
            <div class="flex items-center justify-center gap-2 pt-2">
                {% if page > 1 %}
                    <a href="{{ path('app_journal', filters|merge({page: page - 1})) }}" class="px-3 py-1.5 text-xs font-medium text-gray-700 border border-gray-300 rounded-lg hover:bg-gray-100 transition-colors">← Précédent</a>
                {% endif %}
                {% if page < pages %}
                    <a href="{{ path('app_journal', filters|merge({page: page + 1})) }}" class="px-3 py-1.5 text-xs font-medium text-gray-700 border border-gray-300 rounded-lg hover:bg-gray-100 transition-colors">Suivant →</a>
                {% endif %}
            </div>
        {% endif %}
    {% endif %}
</div>
{% endblock %}
