{% extends '@App/app.html.twig' %}

{% block title %}Rapports d'erreurs{% endblock %}

{% block content %}
    <form method="get" class="card border-0 shadow-sm mb-4">
        <div class="card-body p-3">
            <div class="row g-3 align-items-center">
                <div class="col-12 col-xl-5">
                    <input type="text" class="form-control" name="q" value="{{ filters.q }}" placeholder="Rechercher par message, URL ou utilisateur...">
                </div>
                <div class="col-12 col-md-3 col-xl-2">
                    <select class="form-select" name="status_code">
                        <option value="">Tous les codes</option>
                        {% for code in statusCodeOptions %}
                            <option value="{{ code }}" {{ filters.status_code == (code ~ '') ? 'selected' : '' }}>{{ code }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-12 col-md-3 col-xl-2">
                    <select class="form-select" name="period">
                        {% for value, label in periodOptions %}
                            <option value="{{ value }}" {{ filters.period == value ? 'selected' : '' }}>{{ label }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-12 col-md-3 col-xl-1">
                    <select class="form-select" name="email_sent">
                        <option value="">Email</option>
                        <option value="1" {{ filters.email_sent == '1' ? 'selected' : '' }}>Envoyé</option>
                        <option value="0" {{ filters.email_sent == '0' ? 'selected' : '' }}>Non envoyé</option>
                    </select>
                </div>
                <div class="col-12 col-md-3 col-xl-2">
                    <select class="form-select" name="handled">
                        <option value="0" {{ filters.handled == '0' ? 'selected' : '' }}>Non traitées</option>
                        <option value="1" {{ filters.handled == '1' ? 'selected' : '' }}>Traitées</option>
                        <option value="" {{ filters.handled == '' ? 'selected' : '' }}>Toutes</option>
                    </select>
                </div>
                <div class="col-12 d-flex justify-content-end gap-2">
                    <a href="{{ path('app_admin_error_report_index') }}" class="btn btn-light border">Réinitialiser</a>
                    <button type="submit" class="btn btn-primary">Filtrer</button>
                </div>
            </div>
        </div>
    </form>

    <div class="row g-3 mb-4">
        <div class="col-12 col-md-6 col-xl-3">
            <div class="card border-0 shadow-sm"><div class="card-body"><div class="text-muted fw-semibold small mb-2">Dernières 24h</div><div class="h2 mb-0">{{ stats.last24h }}</div></div></div>
        </div>
        <div class="col-12 col-md-6 col-xl-3">
            <div class="card border-0 shadow-sm"><div class="card-body"><div class="text-muted fw-semibold small mb-2">Erreurs 500</div><div class="h2 mb-0">{{ stats.errors500 }}</div></div></div>
        </div>
        <div class="col-12 col-md-6 col-xl-3">
            <div class="card border-0 shadow-sm"><div class="card-body"><div class="text-muted fw-semibold small mb-2">Utilisateurs impactés</div><div class="h2 mb-0">{{ stats.uniqueUsers }}</div></div></div>
        </div>
        <div class="col-12 col-md-6 col-xl-3">
            <div class="card border-0 shadow-sm"><div class="card-body"><div class="text-muted fw-semibold small mb-2">Emails envoyés</div><div class="h2 mb-0">{{ stats.emailSentRate }}%</div></div></div>
        </div>
    </div>

    <div class="card border-0 shadow-sm overflow-hidden">
        <div class="table-responsive">
            <table class="table align-middle mb-0">
                <thead class="table-light">
                <tr>
                    <th>Date</th>
                    <th>Code</th>
                    <th>Message</th>
                    <th>URL</th>
                    <th>Utilisateur</th>
                    <th>Email</th>
                    <th>Traitement</th>
                    <th class="text-end">Action</th>
                </tr>
                </thead>
                <tbody>
                {% for report in reports %}
                    {% set handledAtValue = report.handledAt %}
                    <tr>
                        <td><strong>{{ report.createdAt|date('d/m/Y') }}</strong><div class="text-muted small">{{ report.createdAt|date('H:i:s') }}</div></td>
                        <td><span class="badge {{ report.statusCode >= 500 ? 'bg-danger-subtle text-danger' : report.statusCode == 404 ? 'bg-warning-subtle text-warning' : 'bg-light text-dark border' }}">{{ report.statusCode }}</span></td>
                        <td style="min-width:260px;"><div class="fw-semibold text-truncate" style="max-width:340px;">{{ report.exceptionMessage }}</div><div class="text-muted small">{{ report.exceptionClass|split('\\\\')|last }}</div></td>
                        <td><code class="small">{{ report.path ?: report.url }}</code></td>
                        <td><div class="fw-semibold">{{ report.userDisplayName ?: 'Utilisateur inconnu' }}</div><div class="text-muted small">{{ report.userEmail ?: 'Non connecté' }}</div></td>
                        <td><span class="badge {{ report.isEmailSent ? 'bg-success-subtle text-success' : 'bg-secondary-subtle text-secondary' }}">{{ report.isEmailSent ? 'Envoyé' : 'Non envoyé' }}</span></td>
                        <td>{% if handledAtValue %}<span class="badge bg-success-subtle text-success">Traitée</span>{% else %}<span class="badge bg-warning-subtle text-warning">À traiter</span>{% endif %}</td>
                        <td class="text-end">
                            <div class="d-inline-flex gap-2">
                                <a href="{{ path('app_admin_error_report_show', {id: report.id}) }}" class="btn btn-sm btn-outline-primary">Détails</a>
                                {% if not handledAtValue %}
                                    <form method="post" action="{{ path('app_admin_error_report_handle', {id: report.id}) }}">
                                        <input type="hidden" name="_token" value="{{ csrf_token('handle_error_report_' ~ report.id) }}">
                                        <button type="submit" class="btn btn-sm btn-success">Marquer traitée</button>
                                    </form>
                                {% endif %}
                            </div>
                        </td>
                    </tr>
                {% else %}
                    <tr><td colspan="8" class="text-center py-5 text-muted">Aucun rapport d’erreur ne correspond aux filtres.</td></tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        <div class="d-flex flex-wrap justify-content-between align-items-center gap-3 p-3 border-top">
            <div class="text-muted">Affichage de {{ reports is not empty ? ((page - 1) * perPage) + 1 : 0 }} à {{ ((page - 1) * perPage) + reports|length }} sur {{ total }} erreurs</div>
            <div class="d-flex gap-2">
                {% set previousPage = page > 1 ? page - 1 : 1 %}
                {% set nextPage = page < totalPages ? page + 1 : totalPages %}
                <a href="{{ path('app_admin_error_report_index', filters|merge({page: previousPage})) }}" class="btn btn-light border {{ page <= 1 ? 'disabled' : '' }}">Précédent</a>
                <a href="{{ path('app_admin_error_report_index', filters|merge({page: nextPage})) }}" class="btn btn-primary {{ page >= totalPages ? 'disabled' : '' }}">Suivant</a>
            </div>
        </div>
    </div>
{% endblock %}