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

{% block body %}
    <section class="container">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-lg-3 mb-3">
                    <div class="card">
                        <div class="card-header">
                            <h1 class="h5">{{ 'Réservation'|trans }}</h1>
                        </div>
                        <div class="card-body">
                            {{ form_start(bookingForm) }}
                            <div class="row">
                                <div class="col-12 mb-3">
                                    {{ form_row(bookingForm.dateRange) }}
                                    <b id="js-booking_rooms_available"
                                       class="{{ availableRooms.className|default('') }}">{{ availableRooms.text|default('') }}</b>
                                </div>
                                <div class="col-6">{{ form_label(bookingForm.adults) }}</div>
                                <div class="col-6">{{ form_widget(bookingForm.adults) }}</div>
                                <div class="col-6">{{ form_label(bookingForm.children) }}</div>
                                <div class="col-6">{{ form_widget(bookingForm.children) }}</div>
                                <div class="col-6">{{ form_label(bookingForm.nbRooms) }}</div>
                                <div class="col-6">{{ form_widget(bookingForm.nbRooms) }}</div>
                                <div class="col-12 mb-3">
                                    {{ form_help(bookingForm.nbRooms) }}
                                </div>
                                <div class="flex-between-center col-6 mt-3">{{ form_label(bookingForm.catering) }}</div>
                                <div class="flex-between-center col-6 mt-3">{{ form_widget(bookingForm.catering) }}</div>
                                <div class="flex-between-center col-12 ">{{ form_help(bookingForm.catering) }}</div>
                                {#                                <div class="flex-between-center col-6 mt-3">{{ form_label(bookingForm.requestedRoomType) }}</div> #}
                                {#                                <div class="flex-between-center col-6 mt-3">{{ form_widget(bookingForm.requestedRoomType) }}</div> #}
                                <div class="col-12 mt-3">{{ form_widget(bookingForm.options) }}</div>
                                <div class="col-12 mt-3">{{ form_row(bookingForm.comment) }}</div>
                            </div>
                            <div class="flex-between-center">
                                <button type="reset" class="btn btn-sm btn-secondary">{{ 'Effacer'|trans }}</button>
                                <button type="submit" class="btn btn-primary">{{ 'Mettre à jour'|trans }}</button>
                            </div>
                            {{ form_errors(bookingForm) }}
                            {{ form_end(bookingForm) }}
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-9">
                    <div class="card">
                        <div class="card-header">
                            <h2 class="h5">{{ 'Résumé de votre réservation'|trans }}</h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col col-lg-6 col-xl-4">
                                    <ul class="list-group mb-3">
                                        <li class="list-group-item flex-between-center">
                                            <span>{{ 'Séjour'|trans }}</span>
                                            <span><b>{{ booking.dateRange }}</b></span>
                                        </li>
                                        <li class="list-group-item flex-between-center">
                                            <span><b>{{ booking.duration }}</b> {{ 'nuits'|trans }}</span>
                                            <span><b>{{ booking.nbRooms }}</b> {{ 'chambre(s)'|trans }}</span>
                                        </li>
                                        <li class="list-group-item flex-between-center">
                                            <span><b>{{ booking.adults }}</b> {{ 'adulte(s)'|trans }}</span>
                                            <span><b>{{ booking.children }}</b> {{ 'enfant(s)'|trans }}</span>
                                        </li>
                                    </ul>
                                    <ul class="list-group mb-3">
                                        <li class="list-group-item flex-between-center">
                                            <span>{{ 'Restauration'|trans }} : <b>{{ booking.displayCatering|trans }}</b></span>
                                        </li>
                                        {% for bookingOption in bookingOptions %}
                                            <li class="list-group-item flex-between-center">
                                                <span>{{ 'Option'|trans }} : <b>{{ bookingOption.name }}</b></span>
                                            </li>
                                        {% endfor %}
                                    </ul>
                                    <div>Votre message : <i>{{ booking.comment|default('-- NC --') }}</i></div>
                                </div>
                                <div class="col col-lg-6 col-xl-4">
                                    <ul class="list-group mb-3">
                                        <li class="list-group-item flex-between-center">
                                            <span>{{ 'Total adultes'|trans }}</span>
                                            <span><b>{{ resumeBooking.totalPriceAdults|formatPriceDevise }}</b></span>
                                        </li>
                                        <li class="list-group-item flex-between-center">
                                            <span>{{ 'Total enfants'|trans }}</span>
                                            <span><b>{{ resumeBooking.totalPriceChildren|formatPriceDevise }}</b></span>
                                        </li>
                                        <li class="list-group-item flex-between-center">
                                            <span>{{ 'Total options'|trans }}</span>
                                            <span><b>{{ resumeBooking.totalPriceOptions|formatPriceDevise }}</b></span>
                                        </li>
                                        <li class="list-group-item flex-between-center">
                                            <span>{{ 'Total réservation'|trans }}</span>
                                            <span><b>{{ resumeBooking.totalPrice|formatPriceDevise }}</b></span>
                                        </li>
                                    </ul>
                                </div>
                                <div class="col col-lg-12 col-xl-4">
                                    <p><b id="js-booking_rooms_available"
                                          class="{{ availableRooms.className|default('') }}">{{ availableRooms.text|default('') }}</b>
                                    </p>
                                    {% if availableRooms.hasAvailableRooms %}
                                        <div>
                                            <p>Pour finaliser votre réservation, un règlement est nécessaire. Ce
                                                paiement
                                                garantit la disponibilité de votre séjour et permet de valider
                                                définitivement
                                                votre demande.</p>
                                            <p> Une fois effectué, vous recevrez une confirmation par email.</p>
                                            <p>Merci de votre confiance !</p>
                                            <div class="w-100">
                                                <div>
                                                    <form action="{{ path('@Booking_confirm') }}" method="post">
                                                        <div class="form-check">
                                                            <input class="form-check-input" type="checkbox" value=""
                                                                   id="checkRules" name="checkRules" required>
                                                            <label class="form-check-label" for="checkRules">
                                                                J’accepte la <a target="_blank"
                                                                                href="{{ path('@CMS_show', {'slug':'charte-de-vie-ete-hiver'}) }}"
                                                                >charte de vie du chalet</a>
                                                            </label>
                                                        </div>
                                                        <div>
                                                            <input type="submit" name="payment"
                                                                   value="{{ 'Payer'|trans }}"
                                                                   class="btn btn-primary">
                                                        </div>
                                                        {% if app.user.profile and app.user.profile.hasEstimate %}
                                                            <div class="mt-3">
                                                                <input type="submit" name="estimate"
                                                                       value="{{ 'Demander un devis'|trans }}"
                                                                       class="btn btn-secondary">
                                                            </div>
                                                        {% endif %}
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="card my-3">
                        <div class="card-header">
                            <h2 class="h5">{{ 'Les activités locales'|trans }}</h2>
                        </div>
                        <div class="card-body">
                            <div class="row row-cols-2 row-cols-md-1 row-cols-lg-2 row-cols-xl-4"
                                 id="js-home_booking_activites">
                                {{ include('@Booking/front/activity/_card_activities.html.twig') }}
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-header">
                            <h2 class="h5">{{ 'Nos chambres'|trans }}</h2>
                        </div>
                        <div class="card-body">
                            <div class="row row-cols-1 row-cols-lg-2 row-cols-xl-4" id="js-home_booking_rooms">
                                {{ include('@Booking/front/room/_card_items.html.twig') }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
{% endblock %}