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

{% block page_content_start %}
    {{ parent() }}
    <div class="page-title">
        <h4 class="page-title-h4">
            Clients | Fiche client
        </h4>
    </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 class="box box-warning">
                    <div>
                        <div class="modal-content" style="margin-top: 1%">
                            <div class="modal-body">
                                <p><span style="font-size: 18px;">Nom (Société) : </span><span
                                            style="font-size: 15px;font-weight: bold">{{ final_customer.name }}</span>
                                </p>
                                <div style="margin-top: 1%;">
                                    {{ form_widget(form) }}
                                </div>
                            </div>
                            <div class="modal-footer">
                                <a href="javascript:history.back()">
                                    <button type="button" class="btn boutonRetour pull-right">Annuler</button>
                                </a>
                                <button type="submit"
                                        class="btn boutonAction">{{ button_label|default('Enregistrer') }}</button>
                            </div>
                        </div>
                    </div>
                </div>
                {{ form_end(form) }}
            </div>
        </div>
    </div>
    <script type="application/javascript">
        $(document).ready(function () {
            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 %}