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

{% block body %}
<div class="flex flex-col w-full">
    <div class="flex flex-row w-full p-3 border-b text-white bg-bungalow-yellow">
        <a href="{{ path('plan_comptages') }}" class="text-white text-lg">
            <i class="{{ icon.get('gears') }}" style="color: #FFFF;"></i>
            Plans de Comptage
        </a>
        <span class="mx-2">-</span>
        <a href="{{ path('vue_plan_comptage', {plan_comptage_id: plan_comptage.id}) }}" class="text-white text-lg">{{ plan_comptage.hotel.nom }}</a>
        <span class="mx-2">-</span>
        <a class="text-white text-lg">Modification</a>
    </div>

    <div class="w-full max-h-[80vh] flex flex-col overflow-y-auto pl-5">
        {% include "./layouts/message_flash.html.twig" %}
        <form class="flex flex-col w-full p-5" method="post" action="{{ path('update_instru', {plan_comptage_id: plan_comptage.id})}}" enctype="multipart/form-data">
            {% include "./plan_comptage/form.html.twig" %}
            <div class="cursor-pointer flex items-center justify-between border-b-4 mb-10 rounded" data-dropdown-toggle="date_at">
                <h2 class="w-full text-left text-xl font-semibold">Date de création et envoi</h2>
                <i class="fas fa-chevron-up dropdown-icon"></i>
            </div>
            <div id="date_at" class="mb-4 flex flex-col w-full">
                <div class="flex flex-row justify-between">
                    <div class="flex flex-col w-2/5 mb-4">
                        <label for="created_at" class="block text-sm font-medium text-gray-700">Date de création</label>
                        <input type="datetime-local" name="created_at" id="created_at" value="{% if (plan_comptage is defined and plan_comptage.createdAt) %}{{plan_comptage.createdAt|date('Y-m-d H:i')}}{% endif %}" class="block w-full px-3 py-2 border rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
                    </div>
                    <div class="flex flex-col w-2/5 mb-4">
                        <label for="send_at" class="block text-sm font-medium text-gray-700">Date d'envoi</label>
                        <input type="datetime-local" name="send_at" id="send_at" value="{% if (plan_comptage is defined and plan_comptage.sendAt) %}{{plan_comptage.sendAt|date('Y-m-d H:i')}}{% endif %}" class="block w-full px-3 py-2 border rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
                    </div>
                </div>
            </div>
            <div class="modal-footer flex justify-end pt-2">
                <button type="submit" class="bg-bungalow-blue text-white font-bold uppercase text-sm px-6 py-2 rounded shadow hover:shadow-lg focus:outline-none focus:ring ml-2">
                    Sauvegarder
                </button>
            </div>
        </form>
    </div>
</div>
{% endblock %}

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