e-ticket/templates/order/public.html.twig

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

{% block title %}Commande {{ order.orderNumber }} - E-Ticket{% endblock %}

{% block body %}
<div class="page-container">
    <h1 class="text-3xl font-black uppercase tracking-tighter italic heading-page">Ma commande</h1>
    <p class="font-bold text-gray-600 italic mb-2">Commande {{ order.orderNumber }} — {{ order.event.title }}</p>

    <div class="card-brutal overflow-hidden mb-6">
        <div class="section-header">
            <h2 class="text-[10px] font-black uppercase tracking-widest text-white">Evenement</h2>
        </div>
        <div class="p-6">
            <p class="font-black uppercase text-lg tracking-tighter mb-2">{{ order.event.title }}</p>
            <div class="space-y-1 text-sm font-bold text-gray-600">
                <p>{{ order.event.startAt|date('d/m/Y') }} — {{ order.event.startAt|date('H:i') }} a {{ order.event.endAt|date('H:i') }}</p>
                <p>{{ order.event.address }}, {{ order.event.zipcode }} {{ order.event.city }}</p>
                <p class="text-gray-400">Par {{ order.event.account.companyName ?? (order.event.account.firstName ~ ' ' ~ order.event.account.lastName) }}</p>
            </div>
        </div>
    </div>

    <div class="flex flex-col lg:flex-row gap-8">
        <div class="flex-1">
            <div class="card-brutal overflow-hidden mb-6">
                <div class="section-header">
                    <h2 class="text-[10px] font-black uppercase tracking-widest text-white">Acheteur</h2>
                </div>
                <div class="p-6 space-y-2">
                    <p class="text-sm font-bold">{{ order.firstName }} {{ order.lastName }}</p>
                    <p class="text-sm font-bold text-gray-500">{{ order.email }}</p>
                    <p class="text-sm font-bold">
                        {% if order.status == 'paid' %}
                            <span class="badge-green text-xs font-black uppercase">Payee</span>
                        {% elseif order.status == 'pending' %}
                            <span class="badge-yellow text-xs font-black uppercase">En attente</span>
                        {% else %}
                            <span class="badge-red text-xs font-black uppercase">Annulee</span>
                        {% endif %}
                    </p>
                    {% if order.paymentMethod %}
                    <p class="text-xs font-bold text-gray-400 mt-2">
                        Paiement : {{ order.paymentMethod }}
                        {% if order.cardBrand and order.cardLast4 %}
                            — {{ order.cardBrand|upper }} **** {{ order.cardLast4 }}
                        {% endif %}
                    </p>
                    {% endif %}
                    {% if order.status == 'paid' %}
                    <div class="mt-3">
                        <a href="{{ path('app_order_invoice', {orderNumber: order.orderNumber, token: order.accessToken}) }}" class="px-3 py-2 border-2 border-gray-900 bg-white text-xs font-black uppercase hover:bg-indigo-600 hover:text-white transition-all" target="_blank">
                            Telecharger la facture
                        </a>
                    </div>
                    {% endif %}
                </div>
            </div>

            {% if tickets|length > 0 %}
            <div class="card-brutal overflow-hidden">
                <div class="section-header">
                    <h2 class="text-[10px] font-black uppercase tracking-widest text-white">Vos billets</h2>
                </div>
                <div class="p-6">
                    {% for ticket in tickets %}
                    <div class="flex flex-wrap items-center gap-4 py-3 {{ not loop.last ? 'border-b border-gray-200' : '' }}">
                        <div class="flex-1 min-w-0">
                            <p class="font-black uppercase text-sm">{{ ticket.billetName }}</p>
                            <p class="text-xs font-mono text-gray-400">{{ ticket.reference }}</p>
                        </div>
                        <span class="font-black text-sm text-indigo-600">{{ ticket.unitPriceHTDecimal|number_format(2, ',', ' ') }} &euro;</span>
                        {% if ticket.state == 'valid' %}
                            <span class="badge-green text-[10px] font-black uppercase">Valide</span>
                        {% elseif ticket.state == 'expired' %}
                            <span class="badge-yellow text-[10px] font-black uppercase">Expire</span>
                        {% else %}
                            <span class="badge-red text-[10px] font-black uppercase">Invalide</span>
                        {% endif %}
                        <a href="{{ path('app_order_download_ticket', {orderNumber: order.orderNumber, token: order.accessToken, ticketReference: ticket.reference}) }}" class="px-3 py-1 border-2 border-gray-900 bg-white text-xs font-black uppercase hover:bg-indigo-600 hover:text-white transition-all" target="_blank">
                            Telecharger PDF
                        </a>
                    </div>
                    {% endfor %}
                </div>
            </div>
            {% endif %}
        </div>

        <div class="w-full lg:w-[350px] flex-shrink-0">
            {% include 'order/_summary.html.twig' %}
        </div>
    </div>
</div>
{% endblock %}