{% 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 :</b> Marché {{ selectedMarche.name }} (<b>{{ nbrCommande }}</b>){% endblock %}
        {% block card_tools %}
            <a class="btn bg-gradient-gray btn-sm" href="{{ path('vendeur_panier') }}"><i class="fas fa-sign-in-alt"></i> Retour</a>
            <a class="deleteVendeurMarche btn bg-gradient-cyan btn-sm"><i class="fas fa-store"></i> Changer marché</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_before %}<form id="_Form_Client" method="post" enctype="multipart/form-data" role="form">{% 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>
            <div class="row">
                <input type="hidden" name="panier" id="panier">
                <input type="hidden" name="additionalProducts" id="additionalProducts">
                <input type="hidden" name="idClient" id="idClient">
                <input type="hidden" name="selectMarcheCom" id="selectMarcheCom" value="{{ selectedMarche.id }}">
                <div class="col-sm-6">
                    <div class="form-group has-feedback">
                        <input type="text" name="nom" id="nom" class="form-control" placeholder="Nom">
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <input type="text" name="prenom" id="prenom" class="form-control" placeholder="Prénom">
                    </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 %}
                                {% if fkMarche == marche.id %}{% set selected = 'selected' %}{% else %}{% set selected = '' %}{% endif %}
                                <option style="font-weight: bold;color: #000;"  value="{{ marche.id }}" {{ selected }}>{{ 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>
        {% endblock %}
        {% block card_footer %}
            <button type="submit" style="font-size: 20px;" id="panierValidateButton" class="btn btn-block bg-gradient-primary text-bold">
                <i class="fas fa-plus-circle"></i> Valider la commande
            </button>
        {% endblock %}
        {% block card_after %}</form>{% endblock %}
    {% endembed %}

    {% include('vendeur/commande/modals/modalSearchClient.html.twig') %}
{% endblock %}

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