{% extends estXHR ? 'page-xhr-modal.html.twig' : 'page.html.twig' %}

{% block title %}Editer composant{% endblock %}

{% block style %}
    <link rel="stylesheet" type="text/css" is="custom-style"
          href="{{ app.request.getBaseURL() }}/assets/css/composants/delete.css">
{% endblock %}

{% block page %}
    <div style="background-color: white;">
        <h5 style="text-align: center;">
            Passer le composant
            <span class="composant">{{ composant.nom }}</span>
            du statut
            <span class="type">{{ statuts[composant.statut] }}</span>
            à
            <span class="type">{{ statuts[statutSuivant] }}</span>
        </h5>
        <ul>
            {% for enfant in listeIdHierarchise %}
                {% for composantNiveau in enfant %}
                    <li>{{ composants[composantNiveau].nom }} <span class="type">({{ composants[composantNiveau].idTypeComposant.libelle }})</span></li>
                {% endfor %}
            {% endfor %}
        </ul>

        <div class="form">

            {{ form_start(form, {'action': path('composants_valider', {'statut': statutSuivant, 'id': composant.id})}) }}
                Voulez-vous valider aussi les enfants ? {{ form_widget(form.validerEnfants) }}
                <paper-button onclick="soumettreFormulaire(this)">Valider</paper-button>
            {{ form_end(form) }}
        </div>
    </div>
{% endblock %}