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

{% block title %}{{'Products'|trans}}{% endblock %}
{% block page_title %}{{'Products'|trans}}{% endblock %}
{% block breadcrumb %}
    <li class="breadcrumb-item active" aria-current="page">{{'Products'|trans}}</li>
{% endblock %}

{% block buttons %}
    <a href="{{ path('product') }}" class="btn btn-outline-primary"><i class="bi bi-plus-square"></i> {{'Add'|trans}}</a>
{% endblock %}

{% block body %}

{% block alert %}
    {% for label, messages in app.flashes %}
        <div class="alert alert-{{ label }}">
            {% for message in messages %}
                <p>{{ message }}</p>
            {% endfor %}
        </div>
    {% endfor %}
{% endblock %}

<div class="card bg-white border-0 rounded-3 mb-4">
    <div class="card-body p-4">
        <table class="table">
            <thead>
                <tr>
                    <th>#</th>
                    <th class="text-center" style="width: 5%;">{{'Statut'|trans}}</th>
                    <th class="col-md-1">{{'Référence'|trans}}</th>
                    <th>{{'EAN'|trans}}</th>
                    <th>{{'Name'|trans}}</th>
                    <th>{{'Poids'|trans}}</th>
                    <th>{{'Price TTC'|trans}}</th>
                    <th>{{'Prix d\'achat'|trans}}</th>
                    <th class="text-right" width="20%">{{'Actions'|trans}}</th>
                </tr>
            </thead>
            <tbody>
                {% for product in products %}
                    <tr>
                        <td>{{ product.id }}</td>
                        <td class="text-center">
                            {% if product.status == 1 %}
                                <button type="button" class="btn btn-sm btn-success btn-block">{{'Actif'|trans}}</button>
                            {% else %}
                                <button type="button" class="btn btn-sm btn-outline-dark btn-block">{{'Inactif'|trans}}</button>
                            {% endif %}
                        </td>
                        <td><a href="{{ path('product', {'id': product.id}) }}">{{ product.reference }}</a></td>
                        <td>{{ product.ean }}</td>
                        <td>{{ product.name }}</td>
                        <td>{{ product.weight }} kg</td>
                        <td>{{ product.price|format_currency('EUR') }}</td>
                        <td>{{ product.pricepurchase|format_currency('EUR') }}</td>
                        <td class="text-right">
                            <a href="{{ path('product', {'id': product.id}) }}" class="btn btn-sm btn-primary"><i class="bi bi-pen"></i> {{'Edit'|trans}}</a>
                            <a href="{{ path('delete_product', {'id': product.id}) }}" class="btn btn-sm btn-danger"><i class="bi bi-trash"></i> {{'Delete'|trans}}</a>
                        </td>                
                    </tr>
                {% endfor %}
            </tbody>
        </table>

        <nav class="text-center" aria-label="Page navigation example">
            <div class="pagination justify-content-center"> 
                {% if currentPage > 1 %}
                    <li class="page-item"><a class="page-link" href="?page={{ currentPage - 1 }}">Précédent</a></li>
                {% endif %}

                {% for i in 1..totalPages %}
                    <li class="page-item {{currentPage == i ? 'active"  aria-current="page"' : '"' }}><a class="page-link" href="?page={{ i }}">{{ i }}</a></li>
                {% endfor %}

                {% if currentPage < totalPages %}
                    <li class="page-item"><a class="page-link" href="?page={{ currentPage + 1 }}">Suivant</a></li>
                {% endif %}
            </div>
        </nav>
    </div>
</div>
{% endblock %}