{% extends "base.html" %}

{% block body %}
<article class="order">
<h3>{{ delivery.producer }} — Commande de «{{ person }}»</h3>
{% include "includes/delivery_head.html" %}
<form method="post">
    <table class="order">
        <tr><th class="product">Produit</th><th class="price">Prix</th><th class="amount">Quantité</th></tr>
        {% for product in delivery.products %}
        <tr>
            <th class="product">{{ product.name }}
                <label for="toggleControl{{ loop.index }}" class="toggle-label">(Détails)</label>
                <input type="checkbox" id="toggleControl{{ loop.index }}" class="toggle">
                <div class="toggle-container">
                    <p>{{ product.description }}</p>
                    <p>{% if product.img %}
                        <img src="{{ product.img }}">
                    {% else %}
                        <img src="/static/img/default_product.svg">
                    {% endif %}</p>
                    <label for="toggleControl{{ loop.index }}" class="toggle-label">Fermer</label>
                </div>
            </th>
            <td>{{ product.price }} €</td><td class="with-input"><input type="number" name="{{ product.ref }}" value="{{ order.get_quantity(product) }}"></td></tr>
        {% endfor %}
    </table>
    <p>Total: {{ order.total(delivery.products) if order else 0 }} €</p>
    <input type="hidden" name="email" value="{{ person }}">
    <input type="submit" value="Valider la commande">
</form>
</article>
{% endblock body %}