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

{% block title %}Nouvelle formation {% endblock %}

{% block body %}
    {{ form_start(form) }}
<div class="grid grid-cols-1 gap-3">
    <div class="bg-gray-100 rounded-xl p-5">
        <h2 class="uppercase mb-5"> Nouvelle feuille d'émergement</h2>
        <div class="grid grid-cols-3 gap-3">
            <div>
                <p>Choisir une facture</p>
                <div class="mt-2">
                    {{ form_widget(form.invoice) }}
                </div>
            </div>
            <div>
                <p>Choisir un formateur</p>
                <div class="mt-2">
                    {{ form_widget(form.formateur) }}
                </div>
            </div>
            <div>
                <p>Durée des sessions</p>
                <div class="mt-2">
                    {{ form_widget(form.duration) }}
                </div>
            </div>
        </div>
        <div class="mt-3">
            <div class="grid grid-cols-3 gap-3 sessions "
                 data-index="{{ form.sessions|length > 0 ? form.sessions|last.vars.name + 1 : 0 }}"
                 data-prototype="{{ form_widget(form.sessions.vars.prototype)|e('html_attr') }}">
            </div>
        </div>
        <button id="addSession" type="button" class="add_item_link m-5 border" data-collection-holder-class="sessions">+ AJOUTER UNE SEANCE</button>
    </div>
    <div class="flex justify-center">
        <div class="mt-5">
            {{ form_widget(form.Sauvegarder) }}
        </div>
    </div>

    {{ form_end(form) }}
</div>
{% endblock %}

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