{% extends 'admin/base.twig' %}
{% block title %}AG (Assemblée Générale){% endblock %}
{% block page_title %}AG (Assemblée Générale){% endblock %}

{% block body %}
    <div class="p-4 sm:p-6 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 min-h-screen">

        <div class="flex justify-between items-center mb-6 border-b pb-2 border-gray-200 dark:border-gray-700">
            <h1 class="text-2xl font-bold">Liste des AG</h1>

            {# NOUVEAU BOUTON: CRÉER UNE AG #}
            <a href="{{ path('admin_ag_new') }}"
               class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 dark:bg-green-500 dark:hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500">
                + Créer une AG
            </a>
        </div>

        {% for ag in ags %}
            <div class="mb-6 p-4 border rounded-lg shadow-md bg-gray-50 dark:bg-gray-700 dark:border-gray-600 hover:shadow-lg transition duration-300">

                {# NOUVEAU CONTENEUR FLEX POUR DISPOSITION LATÉRALE #}
                <div class="flex justify-between items-start">

                    {# BLOC GAUCHE: Détails de l'AG #}
                    <div class="flex-grow pr-4">
                        <div class="flex justify-between items-start mb-2">
                            <p class="text-lg font-semibold text-indigo-600 dark:text-indigo-400">
                                {{ ag.agDateAt|date('d/m/Y H:i') }}
                                <span class="ml-2 px-3 py-1 text-xs font-medium rounded-full
                                    {% if ag.type == 'Extraordinaire' %}
                                        bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-300
                                    {% else %}
                                        bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-300
                                    {% endif %}">
                                    {{ ag.type }}
                                </span>
                            </p>
                        </div>

                        <p class="text-sm">
                            <strong>Président:</strong> {{ ag.president.pseudo }} /
                            <strong>Secrétaire:</strong> {{ ag.secretaire.pseudo }}
                        </p>

                        <div class="mt-2 text-sm text-gray-600 dark:text-gray-300">
                            <strong>Lieu:</strong> {{ ag.locate }}
                            {{ ag.locateZipcode }} {{ ag.locateCity }}
                        </div>

                        <div class="mt-3 pt-3 border-t border-gray-200 dark:border-gray-600 text-sm">
                            <p>
                                <strong>Membres principaux:</strong> <span class="font-medium">{{ ag.mainMembers.count }}</span>
                            </p>
                            <p>
                                <strong>Ordres du jour:</strong> <span class="font-medium">{{ ag.orders.count }}</span>
                            </p>
                        </div>
                    </div>
                    {# FIN BLOC GAUCHE #}

                    {# BLOC DROIT: QR CODE #}
                    <div class="flex-shrink-0 pt-1">
                        <p class="text-xs text-gray-500 dark:text-gray-400 text-center mb-1">Détails AG</p>

                        <img src="{{ path('admin_ag',{idQrCode:ag.id}) }}" alt="QR Code pour {{ ag.type }} du {{ ag.agDateAt|date('d/m/Y') }}" class="w-54 h-54 border border-gray-300 dark:border-gray-600 rounded-md p-1"/>
                    </div>
                    {# FIN BLOC DROIT #}

                </div>

                {# BLOC ACTIONS (GARDÉ EN DESSOUS DES DÉTAILS) #}
                {% if ag.closed == false or ag.closed == null %}
                    <div class="mt-4 pt-4 border-t border-gray-200 dark:border-gray-600 flex space-x-3">
                        <a href="{{ path('admin_ag', {'idGenerate': ag.id}) }}"
                           class="inline-flex items-center px-3 py-1.5 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-cyan-600 hover:bg-cyan-700 dark:bg-cyan-500 dark:hover:bg-cyan-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                            Générer le pdf
                        </a>
                        {% if ag.attestation == null or ag.attestation == false %}
                        <a href="{{ path('admin_ag', {'idConvocation': ag.id}) }}"
                           class="inline-flex items-center px-3 py-1.5 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-purple-600 hover:bg-purple-700 dark:bg-purple-500 dark:hover:bg-purple-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                            Envoyée les Convocation
                        </a>
                        {% endif %}
                        {# Bouton Modifier #}
                        <a href="{{ path('admin_ag_edit', {'id': ag.id}) }}"
                           class="inline-flex items-center px-3 py-1.5 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 dark:bg-indigo-500 dark:hover:bg-indigo-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                            Modifier
                        </a>

                        {# Bouton Supprimer #}
                        <form method="POST" action="{{ path('admin_ag_delete', {'id': ag.id}) }}" onsubmit="return confirm('Êtes-vous sûr de vouloir supprimer cette Assemblée Générale ?');">
                            <input type="hidden" name="_method" value="DELETE">

                            <button type="submit"
                                    class="inline-flex items-center px-3 py-1.5 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-red-600 hover:bg-red-700 dark:bg-red-500 dark:hover:bg-red-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500">
                                Supprimer
                            </button>
                        </form>
                    </div>
                {% else %}
                    {% if ag.isSigned == true %}
                        <div class="mt-4 pt-4 border-t border-gray-200 dark:border-gray-600 flex space-x-3">
                            <a download="ag_ecosplay_{{ ag.agDateAt|date('d/m/Y') }}.pdf" href="{{ vich_uploader_asset(ag,'ag') }}"
                               class="inline-flex items-center px-3 py-1.5 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-cyan-600 hover:bg-cyan-700 dark:bg-cyan-500 dark:hover:bg-cyan-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                                Télécharger le pdf
                            </a>
                        </div>
                    {% else %}
                        <div class="mt-4 pt-4 border-t border-gray-200 dark:border-gray-600 flex space-x-3">
                            <a href="{{ path('admin_ag',{id:ag.id,idSign:true}) }}"
                               class="inline-flex items-center px-3 py-1.5 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-cyan-600 hover:bg-cyan-700 dark:bg-cyan-500 dark:hover:bg-cyan-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                                Signature le pdf
                            </a>
                        </div>
                    {% endif %}
                {% endif %}
            </div>
        {% endfor %}

    </div>
{% endblock %}
