{% extends '@InstallBois/index.html.twig' %}

{% block page_content_start %}
    {{ parent() }}
    <div class="page-title">
        <h1>
            <i class="fas fa-edit"></i>Création d'un client final
        </h1>
        <hr class="hr_grey">
    </div>

{% endblock %}

{% block page_content %}
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-12 col-md-12 col-lg-12" style="padding-right: 0!important;">
                {{ form_start(form) }}
                <div style="padding-right: 15px;" aria-hidden="true">
                    <div>
                        <div class="modal-content">
                            <div class="modal-header">
                                <h4 class="modal-title"><i class="fas fa-edit"></i>Création du client final</h4>
                            </div>
                            <div class="modal-body">
                                <div style="margin-top: 1%;">
                                    {{ form_widget(form) }}
                                </div>
                            </div>
                            <div class="modal-footer">
                                <a href="javascript:history.back()">
                                    <button type="button" class="btn btn-default pull-right">Annuler</button>
                                </a>
                                <button type="submit"
                                        class="btn btn-primary">{{ button_label|default('Enregistrer') }}</button>
                            </div>
                        </div>
                    </div>
                </div>
                {{ form_end(form) }}
            </div>
        </div>
    </div>
    <script type="application/javascript">
        $(document).ready(function () {
            $("#civility_name_input_id")[0].style.display = "block";

            let civilityChoiceInput = document.getElementById("final_customer_civility");
            civilityChoiceInput.addEventListener("change", function () {
                if (civilityChoiceInput.value === "Société") {
                    $("#civility_name_input_id")[0].style.display = "none";
                } else {
                    $("#civility_name_input_id")[0].style.display = "block";
                }
            });

            $(`#final_customer_address_country`).select2({
                width: '100%',
                placeholder: "-- Sélectionnez votre choix --",
                allowClear: false,
                language: "fr",
            });
            $(`#final_customer_agency`).select2({
                width: '100%',
                placeholder: "-- Sélectionnez votre choix --",
                allowClear: false,
                language: "fr",
            });

        });

    </script>
{% endblock %}