{% extends 'layout/app.html.twig' %}

{% block title %}Demandes - Portail{% endblock %}
{% block breadcrumb %}Demandes{% endblock %}

{% block app_content %}
    <div class="flex flex-wrap items-center justify-between gap-3">
        <div>
            <h1 class="font-display text-2xl text-pepite-ink">Demandes</h1>
            <p class="mt-1 font-structure text-sm text-pepite-ink/60">Les produits recherchés, importés du Radar. Chaque sourceur ne voit que les demandes qui lui sont adressées.</p>
        </div>
        <a href="{{ path(app.environment in ['dev', 'test'] ? 'app_radar_sync' : 'app_admin_request_import') }}" class="rounded-md bg-pepite-navy px-4 py-2 font-structure text-sm font-medium text-white hover:bg-pepite-navy-light">{{ app.environment in ['dev', 'test'] ? 'Synchronisation Radar' : 'Importer un JSON Radar' }}</a>
    </div>

    <p class="mt-3 text-sm text-pepite-ink/60">{{ requests|length }} produit(s) · <a class="underline" href="{{ path('app_admin_request_import') }}">Import JSON manuel</a></p>
    {% if requests is empty %}
        <div class="mt-8 rounded-md border border-dashed border-gray-300 bg-white px-6 py-10 text-center text-sm text-pepite-ink/60">Aucune demande pour le moment. Reliez le Radar pour importer les produits en Sourcing, ou utilisez l’import JSON manuel.</div>
    {% else %}
        <div class="mt-6 overflow-x-auto rounded-md border border-gray-200 bg-white">
            <table class="min-w-full text-sm">
                <thead class="bg-pepite-soft font-structure text-xs uppercase tracking-wide text-pepite-ink/60">
                    <tr>
                        <th class="px-4 py-2"></th>
                        <th class="px-4 py-2 text-left">Référence</th>
                        <th class="px-4 py-2 text-left">Produit</th>
                        <th class="px-4 py-2 text-left">Sourceurs assignés</th>
                        <th class="px-4 py-2 text-left">Propositions</th>
                        <th class="px-4 py-2 text-left">Importée le</th>
                        <th class="px-4 py-2 text-left">Statut</th>
                        <th class="px-4 py-2"></th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-100">
                    {% for item in requests %}
                        {% set photo = item.mainPhoto %}
                        {% set assigned = item.activeAssignments %}
                        <tr class="{{ item.open ? '' : 'text-pepite-ink/40' }}">
                            <td class="px-4 py-2">
                                {% if photo %}<img src="{{ path('app_request_photo', { id: item.id, photoId: photo.id }) }}" alt="" class="h-10 w-10 rounded border border-gray-200 object-contain" loading="lazy">{% endif %}
                            </td>
                            <td class="px-4 py-2 font-structure font-medium text-pepite-ink">{{ item.externalReference }}</td>
                            <td class="px-4 py-2">{{ item.title }}</td>
                            <td class="px-4 py-2">
                                {% if assigned is empty %}<span class="text-pepite-ink/40">à adresser</span>
                                {% else %}{{ assigned|map(a => a.sourcer.name)|join(', ') }}{% endif %}
                            </td>
                            <td class="px-4 py-2" data-role="proposals">
                                {# États calculés à la lecture, jamais stockés. #}
                                {% set states = item.assignments|filter(a => a.proposal)|map(a => a.proposal.state.value) %}
                                {% set parts = [] %}
                                {% for value, label in { pending: 'à traiter', adjustment_requested: 'en ajustement', accepted: 'acceptée', rejected: 'refusée' } %}
                                    {% set count = states|filter(s => s == value)|length %}
                                    {% if count > 0 %}{% set parts = parts|merge([count ~ ' ' ~ label ~ (count > 1 and value in ['accepted', 'rejected'] ? 's' : '')]) %}{% endif %}
                                {% endfor %}
                                {% if parts is empty %}<span class="text-pepite-ink/40">—</span>{% else %}{{ parts|join(' · ') }}{% endif %}
                            </td>
                            <td class="px-4 py-2">{{ item.importedAt|date('d/m/Y') }}</td>
                            <td class="px-4 py-2">
                                <span class="rounded-full px-2 py-0.5 font-structure text-xs font-semibold {{ item.open ? 'bg-emerald-100 text-emerald-800' : 'bg-gray-200 text-gray-700' }}">{{ item.status.label }}</span>
                            </td>
                            <td class="px-4 py-2 text-right"><a href="{{ path('app_admin_request_show', { id: item.id }) }}" class="text-pepite-navy hover:underline">Ouvrir</a></td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    {% endif %}
{% endblock %}