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

{% block body %}
<div class="w-full flex flex-col min-h-full overflow-y-auto">
    <div class="flex flex-row w-full p-3 border-b items-center justify-between text-white bg-bungalow-yellow">
        <span class="text-white text-lg">
            <i class="{{ icon.get('gears') }}" style="color: #FFFF;"></i>
            Plans de Comptage
        </span>
        {% if not is_granted('ROLE_WIIFOR') %}
            <div class="w-fit text-right text-sm">
                <a href="{{ path('create_instru') }}" class="bg-bungalow-blue mx-2 p-2 px-4 rounded-full">Ajouter</a>
            </div>
        {% endif %}
    </div>

    {% if plan_comptages|length == 0 %}
        <div class="h-1/2 w-full p-4 items-center flex flex-col justify-evenly">
            <p class="text-gray-600 text-center text-5xl">Aucun plans de comptage</p>
        </div>
    {% else %}
    <div class="p-4 max-h-[80vh] min-h-[80vh] overflow-y-auto">
        {% include "./layouts/message_flash.html.twig" %}
        <div id="datatable" class="shadow-xl rounded-lg">
            <table class="table-fixed w-full text-md text-left rtl:text-right text-gray-500">
                <thead class="bg-gray-50">
                    <tr>
                        <th scope="col" class="px-2 py-3 border-r">Hôtel</th>
                        <th scope="col" class="px-2 py-3 border-r">Réf-Projet</th>
                        <th scope="col" class="px-2 py-3 border-r">SIRET</th>
                        <th scope="col" class="px-2 py-3 border-r">Version</th>
                        <th scope="col" class="px-2 py-3 border-r">Mis à jour le</th>
                        <th scope="col" class="px-2 py-3 border-r">Envoyé le</th>
                        <th scope="col" class="px-2 py-3">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    {% for plan_comptage in plan_comptages %}
                    <tr class="odd:bg-white even:bg-gray-100 border-b">
                        <th scope="row" class="px-2 py-4 font-medium text-gray-900 whitespace-nowrap border-r text-wrap">
                            <div class="text-sm font-medium text-gray-900">{{ plan_comptage.hotel.nom }}</div>
                            <div class="text-sm text-gray-500">{{ plan_comptage.hotel.adresse.ville }}</div>
                        </th>
                        <td class="px-2 py-4 border-r text-wrap text-center">{{ plan_comptage.refProjet ?? "-----" }}</th>
                        <td class="px-2 py-4 border-r text-wrap text-center">{{ plan_comptage.hotel.siret != "" ? plan_comptage.hotel.siret : "-----" }}</th>
                        <td class="px-2 py-4 border-r text-wrap text-center">V{{ plan_comptage.version ?? "-----" }}</th>
                        <td class="px-2 py-4 border-r text-wrap text-center">{{ plan_comptage.updateAt ? plan_comptage.updateAt|date('d/m/Y H:i') : "-----" }}</th>
                        <td class="px-2 py-4 border-r text-wrap text-center">{{ plan_comptage.sendAt ? plan_comptage.sendAt|date('d/m/Y H:i') : "-----" }}</th>
                        <td class="px-2 py-4 text-center">
                            <a href="{{ path('vue_plan_comptage', {plan_comptage_id: plan_comptage.id}) }}" class="bg-green-500 text-white font-medium p-2 rounded hover:bg-green-700 inline-flex items-center">
                                <i class="{{ icon.get('eye') }}"></i>
                            </a>
                            {% if not is_granted('ROLE_WIIFOR') %}
                                <button data-plan-id="{{ plan_comptage.id }}" class="bg-blue-500 text-white font-medium p-2 rounded hover:bg-blue-700 inline-flex items-center email-btn">
                                    <i class="{{ icon.get('email') }}"></i>
                                </button>
                                <a href="{{ path('delete_instru', {plan_comptage_id: plan_comptage.id}) }}" class="bg-red-500 text-white font-medium p-2 rounded hover:bg-red-700 inline-flex items-center delete-btn">
                                    <i class="{{ icon.get('trash') }}"></i>
                                </a>
                            {% endif %}
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
    {% endif %}
</div>
{% endblock %}

{% block modals %}
    {% if is_granted('ROLE_ADMIN') %}
        {% include "./hotel/client/modals/verifications.html.twig" %}
    {% endif %}
{% endblock %}

{% block javascripts %}
    {{ encore_entry_script_tags('plan_comptage_datatable') }}
{% endblock %}