{% extends 'base.html.twig' %}
{% block title %}Zamówienia — Admin | TROPO{% endblock %}

{% block body %}
<div class="max-w-7xl mx-auto px-4 py-12">
    <div class="mb-8">
        <a href="{{ path('app_admin_dashboard') }}" class="text-sm text-gray-500 hover:text-dark transition">&larr; Dashboard</a>
        <h1 class="text-3xl font-bold mt-1">Zamówienia TROPO+</h1>
    </div>

    {% for type, messages in app.flashes %}
        {% for m in messages %}
            <div class="mb-4 rounded-xl px-4 py-3 text-sm font-medium {{ type == 'error' ? 'bg-red-50 text-red-700' : 'bg-echo/10 text-echo' }}">{{ m }}</div>
        {% endfor %}
    {% endfor %}

    <div class="grid grid-cols-3 gap-4 mb-6">
        <div class="bg-white rounded-2xl p-5 border border-gray-200">
            <p class="text-xs text-gray-500 font-medium uppercase tracking-wider">Opłacone</p>
            <p class="text-3xl font-extrabold text-dark mt-1 tabular-nums">{{ summary.active }}</p>
        </div>
        <div class="bg-white rounded-2xl p-5 border border-gray-200">
            <p class="text-xs text-gray-500 font-medium uppercase tracking-wider">Nieopłacone / porzucone</p>
            <p class="text-3xl font-extrabold text-dark mt-1 tabular-nums">{{ summary.pending }}</p>
        </div>
        <div class="bg-white rounded-2xl p-5 border border-gray-200">
            <p class="text-xs text-gray-500 font-medium uppercase tracking-wider">Przychód brutto</p>
            <p class="text-3xl font-extrabold text-dark mt-1 tabular-nums">{{ summary.revenue|number_format(0, ',', ' ') }} zł</p>
        </div>
    </div>

    <form method="get" class="flex gap-3 mb-4">
        <input name="q" value="{{ q }}" placeholder="Szukaj po mailu albo kodzie (TROPO-…)" class="flex-1 border border-gray-200 rounded-lg px-3 py-2 bg-white">
        <button class="px-4 py-2 bg-scout text-white rounded-lg text-sm font-semibold">Szukaj</button>
    </form>

    <div class="bg-white rounded-2xl border border-gray-200 overflow-x-auto">
        <table class="w-full text-sm">
            <thead class="text-left text-xs uppercase tracking-wider text-gray-500 border-b border-gray-200">
                <tr>
                    <th class="px-4 py-3">#</th><th class="px-4 py-3">Status</th><th class="px-4 py-3">Email</th><th class="px-4 py-3">Kod</th>
                    <th class="px-4 py-3">Zakup</th><th class="px-4 py-3">Zgoda</th><th class="px-4 py-3">Urządzenie</th><th class="px-4 py-3">Przeniesienia</th><th class="px-4 py-3"></th>
                </tr>
            </thead>
            <tbody>
            {% for o in orders %}
                <tr class="border-b border-gray-100 last:border-0 align-top">
                    <td class="px-4 py-3 tabular-nums">{{ o.id }}</td>
                    <td class="px-4 py-3">
                        {% if o.status == 'active' %}<span class="px-2 py-0.5 text-xs font-semibold rounded-full bg-echo/10 text-echo">opłacone</span>
                        {% else %}<span class="px-2 py-0.5 text-xs font-semibold rounded-full bg-gray-100 text-gray-500">{{ o.status == 'pending' ? 'nieopłacone' : o.status }}</span>{% endif %}
                    </td>
                    <td class="px-4 py-3">{{ o.buyerEmail ?? '—' }}</td>
                    <td class="px-4 py-3 font-mono">{{ o.activationCode }}</td>
                    <td class="px-4 py-3 tabular-nums">{{ o.purchasedAt ? o.purchasedAt|date('d.m.Y H:i') : '—' }}</td>
                    <td class="px-4 py-3 tabular-nums">{{ o.consentAt ? o.consentAt|date('d.m.Y H:i') : '—' }}</td>
                    <td class="px-4 py-3">
                        {% if o.deviceId %}<span class="font-mono text-xs" title="{{ o.deviceId }}">{{ o.deviceId|slice(0, 8) }}…</span>
                        <span class="block text-xs text-gray-400">{{ o.activatedAt ? 'aktywowano ' ~ o.activatedAt|date('d.m.Y') : '' }}</span>
                        {% else %}<span class="text-gray-400">nieaktywowany</span>{% endif %}
                    </td>
                    <td class="px-4 py-3 tabular-nums {{ o.transferCount >= 3 ? 'text-red-600 font-semibold' : '' }}">{{ o.transferCount }} / 3</td>
                    <td class="px-4 py-3">
                        <div class="flex gap-2 justify-end">
                            {% if o.status == 'active' %}
                            <form method="post" action="{{ path('app_admin_order_resend', {id: o.id}) }}">
                                <input type="hidden" name="_token" value="{{ csrf_token('admin_action') }}">
                                <input type="hidden" name="q" value="{{ q }}">
                                <button class="px-3 py-1.5 text-xs font-semibold rounded-lg bg-scout/10 text-scout hover:bg-scout/20 whitespace-nowrap">Wyślij kod</button>
                            </form>
                            {% endif %}
                            {% if o.deviceId %}
                            <form method="post" action="{{ path('app_admin_order_release', {id: o.id}) }}" data-controller="confirm" data-confirm-message-value="Odblokować kod? Obecne urządzenie straci pakiet przy następnej synchronizacji." data-confirm-confirm-label-value="Odblokuj" data-action="submit->confirm#submit">
                                <input type="hidden" name="_token" value="{{ csrf_token('admin_action') }}">
                                <input type="hidden" name="q" value="{{ q }}">
                                <button class="px-3 py-1.5 text-xs font-semibold rounded-lg bg-gray-100 text-gray-700 hover:bg-gray-200 whitespace-nowrap">Odblokuj kod</button>
                            </form>
                            {% endif %}
                        </div>
                    </td>
                </tr>
            {% else %}
                <tr><td colspan="9" class="px-4 py-12 text-center text-gray-400">{{ q ? 'Nic nie znaleziono.' : 'Brak zamówień.' }}</td></tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
    <p class="text-xs text-gray-400 mt-3">„Odblokuj kod” zwalnia kod do aktywacji na nowym urządzeniu i zeruje licznik przeniesień (Regulamin pkt VI — przeniesienie przez kontakt@tropo.city).</p>
</div>
{% endblock %}