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

{% block body %}
    <div class="account-layout container-fluid">
        {% include 'front/account/_sidebar.html.twig' %}

        <div class="account-content">
            <div class="account-profil__header">
                <div class="account-profil__title-group">
                    <h2 class="account-profil__title">Mes commandes</h2>
                    <p class="account-profil__subtitle">Retrouvez ici toutes vos commandes passées, classées par année.</p>
                </div>
            </div>

            <form method="get" class="flex gap-2 items-center mb-6">
                <select name="year" class="form-control" onchange="this.form.submit()">
                    <option value="">Toutes les années</option>
                    {% for y in years %}
                        <option value="{{ y }}" {% if selectedYear == y %}selected{% endif %}>{{ y }}</option>
                    {% endfor %}
                </select>

                <select name="type" class="form-control" onchange="this.form.submit()">
                    <option value="">Tous types</option>
                    <option value="licence" {% if selectedType == 'licence' %}selected{% endif %}>Licences / Stages</option>
                    <option value="manifestation" {% if selectedType == 'manifestation' %}selected{% endif %}>Manifestations</option>
                </select>
            </form>


            {% if pagination|length > 0 %}
                <div class="space-y-6">
                    {% for row in pagination %}
                        {% if row.type == 'order' %}
                            {% set order = row.data %}
                    <a href="{{ path('account_orders_show', {reference: order.reference}) }}" class="block">
                    <div class="account-box relative border-l-4 pl-4
                                {% if (row.type == 'order' and not row.data.isPaid) or (row.type == 'manifestation' and not row.data.isPaid) %}
                                    border-red-600 bg-red-50
                                {% else %}
                                    border-green-600 bg-green-50
                                {% endif %}
">                                <div class="flex justify-between items-start flex-wrap gap-4">
                                    <div>
                                        <p class="text-sm text-gray-800 font-medium">Réf : {{ order.reference }}</p>
                                        <p class="text-sm text-gray-500">Commande du {{ order.createdAt|date('d/m/Y') }}</p>
                                        <p class="text-sm text-gray-500">Montant : {{ order.total|number_format(2, ',', ' ') }} €</p>
                                        <p class="text-sm mt-1">
                                            État :
                                            {% if order.state == constant('App\\Entity\\Order::STATE_CONFIRM') %}
                                                <span class="text-green-600 font-semibold">Confirmée</span>
                                            {% elseif order.state == constant('App\\Entity\\Order::STATE_PAYMENT_WAITING') %}
                                                <span class="text-yellow-500 font-semibold">En attente de paiement</span>
                                            {% else %}
                                                <span class="text-red-500 font-semibold">Annulée / Refusée</span>
                                            {% endif %}
                                        </p>
                                    </div>
                                    <div class="flex gap-2 mt-2 sm:mt-0">
                                        {% if not order.isPaid %}
                                            <a href="{{ path('cart_payment_reference', {reference: order.reference}) }}" class="btn btn-primary btn-small">Payer</a>
                                        {% endif %}
                                        <a href="{{ path('account_orders_invoice', {id: order.id}) }}" target="_blank" class="btn btn-secondary btn-small">Facture</a>
                                    </div>
                                </div>
                            </div>
                    </a>
                        {% elseif row.type == 'manifestation' %}
                            {% set reg = row.data %}
                    <a href="{{ path('account_orders_show', {reference: reg.reference}) }}" class="block">
                    <div class="account-box relative border-l-4 pl-4
                                {% if not reg.isPaid %}
                                    border-red-600 bg-red-50
                                {% else %}
                                    border-green-600 bg-green-50
                                {% endif %}
                            ">
                                <div class="flex justify-between items-start flex-wrap gap-4">
                                    <div>
                                        <p class="text-sm text-gray-800 font-medium">Réf : {{ reg.reference }}</p>
                                        <p class="text-sm text-gray-500">Inscription du {{ reg.createdAt|date('d/m/Y') }}</p>
                                        <p class="text-sm text-gray-500">Manifestation : {{ reg.manifestation.title }}</p>
                                        <p class="text-sm mt-1">
                                            État :
                                            {% if reg.state == constant('App\\Entity\\ManifestationRegistration::STATE_CONFIRM') %}
                                                <span class="text-green-600 font-semibold">Confirmée</span>
                                            {% elseif reg.state == constant('App\\Entity\\ManifestationRegistration::STATE_PAYMENT_WAITING') %}
                                                <span class="text-yellow-500 font-semibold">En attente de paiement</span>
                                            {% else %}
                                                <span class="text-red-500 font-semibold">Annulée / Refusée</span>
                                            {% endif %}
                                        </p>
                                    </div>
                                    {% if not reg.isPaid %}
                                        <div class="mt-2 sm:mt-0">
                                            <a href="{{ path('manifestation_payment_reference', {reference: reg.reference}) }}" class="btn btn-primary btn-small">Payer</a>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        {% endif %}
                    {% endfor %}
                    </a>
                </div>

                <div class="mt-6">
                    {{ knp_pagination_render(pagination) }}
                </div>
            {% else %}
                <p class="text-sm text-gray-500 mt-6">Aucune commande trouvée avec les filtres sélectionnés.</p>
            {% endif %}
        </div>
    </div>
{% endblock %}