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

{% block title %}Deville | Liste des références{% endblock %}

{% block body %}
    <section class="grid" style="margin-top: 150px; margin-bottom: 150px;">
        <h1 class="text-center text-uppercase mb-5">Liste des références</h1>

        <!-- Formulaire de sélection des catégories -->
        <form method="get" action="{{ path('admin_reference_list') }}" class="mb-4">
            <div class="form-group d-flex justify-content-end">
                <select name="category" class="form-select form-control" onchange="this.form.submit()" style="width: max-content;">
                    <option value="all" {% if app.request.get('category') == 'all' %}selected{% endif %}>Tous</option>
                    {% for category in categories %}
                        <option value="{{ category.id }}" {% if app.request.get('category') == category.id %}selected{% endif %}>
                            {{ category.name }}
                        </option>
                    {% endfor %}
                </select>
            </div>
        </form>

        <a href="{{ path('admin_reference_new') }}" class="btn btn-success mb-3">Ajouter une référence</a>

        <table class="table table-striped">
            <thead>
            <tr>
                <th>#</th>
                <th>Titre</th>
                <th>Catégorie</th>
                <th>Photo</th>
                <th>Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for reference in references %}
                <tr>
                    <td>{{ reference.id }}</td>
                    <td style="max-width: 360px;">{{ reference.title }}</td>
                    <td>{{ reference.category.name }}</td>
                    <td>
                        {% if reference.photo %}
                            <a href="{{ asset(reference.photo) }}" target="_blank"><img src="{{ asset(reference.photo) }}" alt="Photo" width="50"></a>
                        {% else %}
                            Aucune photo
                        {% endif %}
                    </td>
                    <td>
                        <a href="{{ path('admin_reference_edit', {id: reference.id}) }}" class="btn btn-sm btn-outline-warning">
                            ✏️
                        </a>
                        <form action="{{ path('admin_reference_delete', {id: reference.id}) }}" method="post" style="display:inline;">
                            <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ reference.id) }}">
                            <button type="submit" class="btn btn-sm btn-outline-danger" onclick="return confirm('Are you sure you want to delete this reference?');">
                                🗑️
                            </button>
                        </form>
                    </td>
                </tr>
            {% else %}
                <tr>
                    <td colspan="5">Aucune référence trouvée.</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>

        {% if references is not empty %}
            <div class="d-flex justify-content-end">
                {{ knp_pagination_render(references) }}
            </div>
        {% endif %}

        <a href="{{ path('admin_reference_new') }}" class="btn btn-success">Ajouter une référence</a>
    </section>

{% endblock %}