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

{% block title %}Commandes{% endblock %}
{% block sub_title %}<small><i class="fas fa-shopping-bag"></i></small> Commandes{% endblock%}

{% block container %}
    <div class="row">
        <div class="col-sm-12">
            {% embed 'views/macro_card.html.twig' with {'color': 'dark', 'type': 'outline'} %}
                {% block card_title %}<i class="fas fa-plus-square"></i> Veuillez choisir les paniers{% endblock %}
                {% block card_tools %}
                    <a class="btn bg-gradient-white btn-xs" href="{{ path('commande') }}"><i class="fas fa-sign-out-alt"></i> Retour aux commandes</a>
                {% endblock %}
                {% block card_body %}
                    <table class="table table-bordered">
                        <thead>
                        <tr>
                            <th class="align-middle text-center text-bold" style="font-size: 20px;">Quantité par panier</th>
                            {% for number in numbers %}
                                <th class="align-middle text-center bg-gradient-lightblue text-bold" style="font-size: 25px;">
                                    N°{{ number[1] }}
                                </th>
                            {% endfor %}
                        </tr>
                        </thead>
                        <tbody>
                        {% for quantity in quantities %}
                            <tr>
                                <td class="align-middle text-center bg-warning bg-gradient-yellow text-bold text" style="font-size: 25px;">{{ quantity[1] }} Huîtres</td>
                                {% for number in numbers %}
                                    <td class="h-100">
                                        {% set _price = huitre_service.huitrePrice(number[1], quantity[1]) %}
                                        {% if _price is not same as(null) %}
                                            <button style="font-size: 25px;" id="{{ number[1] }}{{ quantity[1] }}"
                                                    data-number="{{ number[1] }}" data-quantity="{{ quantity[1] }}"
                                                    class="addToPanier align-middle text-center text-bold btn btn-block bg-gradient-success">
                                                {{ _price|number_format(2, '.', ',') }} €
                                                (<span id="number_{{ number[1]~quantity[1] }}">0</span>)
                                            </button>
                                        {% endif %}
                                    </td>
                                {% endfor %}
                            </tr>
                        {% endfor %}
                        <tr>
                            <td colspan="{{ (quantities|length)+2 }}"
                                class="align-middle text-center bg-cyan bg-gradient-cyan text-bold text mt-5"
                            >Commandes supplémentaires</td>
                        </tr>
                        <tr>
                            <td colspan="{{ (quantities|length)+2 }}">
                        <textarea id="additionnal_products"
                                  name="additionnal_order"
                                  class="w-100"
                                  maxlength="200"
                                  cols="33"
                                  placeholder="Décrivez ici votre commande supplémentaire"></textarea>
                            </td>
                        </tr>
                        </tbody>
                    </table>

                {% endblock %}
            {% endembed %}
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            {% embed 'views/macro_card.html.twig' with {'color': 'dark', 'type': 'outline'} %}
                {% block card_title %}<i class="fas fa-user-plus"></i> Ajouter ou associer un client{% endblock %}
                {% block card_tools %}
                    <a class="btn bg-gradient-white btn-xs" href="{{ path('commande') }}"><i class="fas fa-sign-out-alt"></i> Retour aux commandes</a>
                {% endblock %}
                {% block card_body %}
                    <p>
                        <button class="searchClientCommande btn bg-gradient-purple btn-sm" {% if countClient == 0 %}disabled{% endif %}>
                            <i class="fas fa-search-plus"></i> Trouver un client existant
                        </button>
                    </p>
                    <form id="_Form_Add_Client_Commande">
                        <input type="hidden" name="idClient" id="idClient" value="">
                        <div class="row">
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <input type="text" name="nom" id="nom" class="form-control" placeholder="Nom" required>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <input type="text" name="prenom" id="prenom" class="form-control" placeholder="Prénom" required>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-6">
                                <div class="input-group mb-3">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="fas fa-envelope"></i></span>
                                    </div>
                                    <input type="email" name="email" id="email" class="form-control" placeholder="Adresse email">
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="input-group mb-3">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="fas fa-phone"></i></span>
                                    </div>
                                    <input type="text" name="phone" id="phone" class="form-control" placeholder="Téléphone">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <select name="selectMarche" id="selectMarche"
                                            class="selectMarchePicker selectPicker form-control"
                                            title="Veuillez choisir le marché de livraison">
                                        {% for marche in listMarche %}
                                            <option style="font-weight: bold;color: #000;"  value="{{ marche.id }}">{{ marche.name }}</option>
                                        {% endfor %}
                                    </select>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <input type="text" name="dateLivraison" id="dateLivraison" class="form-control datePicker" placeholder="Date de livraison" autocomplete="off">
                                </div>
                            </div>
                        </div>
                    </form>
                {% endblock %}
            {% endembed %}
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            {% embed 'views/macro_card.html.twig' with {'color': 'dark', 'type': 'outline'} %}
                {% block card_body %}
                    <div id="isErrorMessage" class="callout callout-danger text-danger text-bold" style="display: none"></div>
                    <input type="button" id="savedCommande" name="savedCommande" class="savedCommande btn btn-block bg-gradient-blue text-bold" value="Enregistrer la commande">
                {% endblock %}
            {% endembed %}
        </div>
    </div>
    {% include('admin/commande/modals/modalSearchClient.html.twig') %}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {{ encore_entry_script_tags('adminCommandesCreate') }}
{% endblock %}