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

{% block container %}
    {% embed 'views/macro_card.html.twig' with {'color': 'dark', 'type': 'outline'} %}
        {% block card_title %}<i class="fas fa-store"></i> <b>Commande réf :</b> {{ selectedCommande.ref }}{% endblock %}
        {% block card_tools %}
            <a class="btn bg-gradient-maroon btn-sm" href="{{ path('vendeur_commande') }}"><i class="fas fa-list"></i> Liste des commandes</a>
            <a class="btn bg-gradient-yellow btn-sm" href="{{ path('security_logout') }}"><i class="fas fa-sign-out-alt"></i> Déconnecter</a>
        {% endblock %}
        {% block card_body %}
            <table class="table table-bordered table-responsive-lg">
                <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">{{ additionalProducts }}</textarea>
                    </td>
                </tr>
                </tbody>
            </table>
        {% endblock %}
        {% block card_footer %}
            <table class="border-0 table-responsive-lg" style="width: 100%">
                <tr>
                    <td>
                        <button style="font-size: 20px;" id="panierSaveButton" class="btn btn-block bg-gradient-primary text-bold">
                            <i class="fas fa-save"></i> Enregistrer et sortir
                        </button>
                    </td>
                    <td>   </td>
                    <td>
                        <button style="font-size: 20px;" id="panierSuivantButton" class="btn btn-block bg-gradient-primary text-bold">
                            <i class="fas fa-edit"></i> Suivant ( Modifier le marché de livraison )
                        </button>
                    </td>
                </tr>
            </table>
        {% endblock %}
    {% endembed %}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        let sessionProducts = {{ product|json_encode()|raw }};
        let additionnalProducts = {{ additionalProducts|json_encode()|raw }};
        let fkCommande = {{ selectedCommande.id }};
    </script>
    {{ encore_entry_script_tags('paniersEdit') }}
{% endblock %}