crm_ecosplay/templates/order/payment_confirmed.html.twig

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

{% block title %}Paiement enregistre - Association E-Cosplay{% endblock %}

{% block body %}
<main class="max-w-2xl mx-auto px-4 py-16">
    <div class="glass p-10 text-center">
        <div class="mx-auto mb-6 w-20 h-20 bg-green-500/20 flex items-center justify-center">
            <svg class="w-10 h-10 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7"/>
            </svg>
        </div>

        {% if method == 'stripe' %}
            <h1 class="text-3xl font-bold heading-page mb-3">Votre paiement a ete accepte !</h1>
        {% elseif method == 'virement' or method == 'cheque' %}
            <h1 class="text-3xl font-bold heading-page mb-3">Choix enregistre !</h1>
        {% else %}
            <h1 class="text-3xl font-bold heading-page mb-3">Paiement en traitement supplementaire</h1>
        {% endif %}

        {% if method == 'stripe' %}
            <p class="text-sm text-gray-600 leading-relaxed mb-6">
                Votre paiement a ete <strong style="color: #16a34a;">accepte</strong>.<br>
                Un recu vous sera envoye par email. Votre facture vous sera envoyee prochainement. Merci pour votre confiance.
            </p>

        {% elseif method == 'virement' %}
            <p class="text-sm text-gray-600 leading-relaxed mb-6">
                Vous avez choisi de regler par <strong>virement bancaire</strong>.<br>
                Un email avec les coordonnees bancaires vous a ete envoye.
            </p>
            <div class="glass p-6 text-left mb-6">
                <div class="grid grid-cols-1 sm:grid-cols-2 gap-3 text-xs">
                    <div>
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">Beneficiaire</span>
                        <p class="font-bold mt-1">Association E-Cosplay</p>
                    </div>
                    <div>
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">IBAN</span>
                        <p class="font-mono font-bold mt-1">IE33 SUMU 9903 6512 8327 44</p>
                    </div>
                    <div>
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">BIC</span>
                        <p class="font-mono font-bold mt-1">SUMUIE22</p>
                    </div>
                    <div>
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">Reference</span>
                        <p class="font-mono font-bold mt-1">{{ advert.orderNumber.numOrder }}</p>
                    </div>
                </div>
                <p class="text-[10px] text-gray-400 mt-3">Delai de traitement : 24h a 72h ouvrees apres reception du virement.</p>
            </div>

        {% elseif method == 'cheque' %}
            <p class="text-sm text-gray-600 leading-relaxed mb-6">
                Vous avez choisi de regler par <strong>cheque</strong>.<br>
                Un email de confirmation vous a ete envoye avec les instructions.
            </p>
            <div class="glass p-6 text-left mb-6">
                <div class="grid grid-cols-1 sm:grid-cols-2 gap-3 text-xs">
                    <div>
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">A l'ordre de</span>
                        <p class="font-bold mt-1">Association E-Cosplay</p>
                    </div>
                    <div>
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">Montant</span>
                        <p class="font-mono font-bold mt-1">{{ tva_enabled ? advert.totalTtc : advert.totalHt }} &euro;</p>
                    </div>
                    <div class="sm:col-span-2">
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">Adresse d'envoi</span>
                        <p class="font-bold mt-1">Association E-Cosplay - 42 rue de Saint-Quentin - 02800 Beautor</p>
                    </div>
                    <div class="sm:col-span-2">
                        <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">Reference au dos</span>
                        <p class="font-mono font-bold mt-1">{{ advert.orderNumber.numOrder }}</p>
                    </div>
                </div>
                <p class="text-[10px] text-gray-400 mt-3">Delai de traitement : 48h a 72h apres reception du cheque.</p>
            </div>
        {% endif %}

        <div class="glass p-4 text-xs mb-6">
            <div class="grid grid-cols-2 gap-4">
                <div>
                    <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">Avis de paiement</span>
                    <p class="font-mono font-bold text-base mt-1">{{ advert.orderNumber.numOrder }}</p>
                </div>
                <div>
                    <span class="font-bold uppercase tracking-widest text-[10px] text-gray-400">{% if tva_enabled %}Montant TTC{% else %}Montant{% endif %}</span>
                    <p class="font-mono font-bold text-base mt-1">{{ tva_enabled ? advert.totalTtc : advert.totalHt }} &euro;</p>
                </div>
            </div>
        </div>

        <p class="text-[10px] text-gray-400 uppercase tracking-widest">
            Une question ? <a href="mailto:client@e-cosplay.fr" class="text-[#fabf04] hover:underline">client@e-cosplay.fr</a>
        </p>
    </div>
</main>
{% endblock %}