{% extends 'layout.twig' %}
{% block title "Ğ1-Marché - Recherches" %}

{% block body %}
    <script type="text/javascript" src="/js/script.js"></script>
    <div class="container_main">
        <!-- Fil d'Ariane -->
        <div class="breadcrumbs" >
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ gmarchePrefix }}">France</a></li>
                    <li class="breadcrumb-item"><a href="{{ gmarchePrefix }}france/{{ region_slug }}">{{ region_name }}</a></li>
                    <li class="breadcrumb-item active">G-Marché de {{ antenne_name }}</li>

                        <div class="toggle_radio">
                            <input type="radio" class="toggle_option" id="first_toggle" name="toggle_option">
                            <input style="color:black;" type="radio" checked class="toggle_option" id="second_toggle" name="toggle_option">
                            <label for="first_toggle">
                                <a style="color:black;" href="{{ gmarchePrefix }}france/{{ region_slug }}/{{ antenne_slug }}/produits">PRODUITS</a>
                            </label>
                            <label for="second_toggle">
                                <p>RECHERCHES</p>
                            </label>
                            <div class="toggle_option_slider">
                            </div>
                        </div>
                </ol>
            </nav>
        </div>
        <div id="la_page">
            {% if antenne_name == 'Paris' %}
                <script type="text/javascript">
                   $('.fond').css('background-image', "url('/images/toureiffel.jpeg')");
                </script>
            {%  endif %}
            <div class="container">

              <div class="row">
                <div class="col-md-12">
                    <div class="container" style="font-size:18px; color:white;line-height:1.4rem;">
                        <div>
                            {{ edito1 }}
                            <p>{{ edito2 }}</p>
                            {{ edito3 }}
                            <p>{{ edito4 }}</p>
                    </div>
                    <p>
                        {% if affiche_username() != '' or (sess.connecte != '' and sess.connecte != '---') %}
                            <button style="color:white; font-size: 14px;" class="btn btn-primary" data-toggle="modal" data-target="#add_new_record_modal">Ajouter un bien ou service
                        {% else %}
                            <p>
                                <span style="color:lightgray;">Veuillez vous identifier dans la barre à droite
                                       ci-dessus pour ajouter/modifier/supprimer des éléments</span>
                            </p>
                        {% endif %}
                        </button>
                    </p>
                    <div class="records_content2"></div>
                </div>
              </div>
            </div>
                <div class="modal fade" id="add_new_record_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                  <div class="modal-dialog" role="document" style="color: black;">
                    <div class="modal-content"  style="text-align: left;">
                      <div class="modal-header">
                        <h4 class="modal-title" id="myModalLabel">Ajouter un bien/service que vous recherchez</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                      </div>
                      <div class="modal-body">
                         <div class="form-group">
                              <label for="acheteur">Acheteur</label>
                              <input type="text" id="acheteur" disabled="disabled" placeholder="{{ nom_user }}" value="{{ nom_user }}" class="form-control"/>
                         </div>

                         <div class="form-group">
                             <label for="produit">Bien / service recherché</label>
                             <input type="text" id="produit" placeholder="Bien / service que vous recherchez" class="form-control"/>
                         </div>
                         <div class="form-group row">
                              <div class="col-md-7">
                                  <form method='post' action='' enctype="multipart/form-data">
                                      Choisir l'image : <input type='file' name='file' id='add_image' class='form-control' ><br>
                                  </form>
                              </div>
                              <div class="col-md-5">
                                  <div id="add_preview" style="border:1px solid black;width:160px;height:160px;">&nbsp;</div>
                              </div>
                         </div>
                         <div class="form-group">
                             <label for="cle_pub">Clé publique</label>
                             <input type="text" id="cle_pub" placeholder="Clé publique" class="form-control"/>
                         </div>
                         <div class="form-group">
                             <label for="quantite">Quantité</label>
                             <input type="number" id="quantite" placeholder="Quantité" class="form-control"/>
                         </div>
                         <div class="form-group has-error has-feedback">
                             <label for="prix">Prix en junes</label>
                             <input type="number" id="prix" placeholder="prix" class="form-control"/>
                         </div>
                         <div class="alert alert-block alert-danger" style="display:none">
                             <h4>Erreur !</h4>
                             Vous devez entrer un nombre !
                         </div>
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
                        <button type="button" class="btn btn-primary"
                                onclick="addRecord2('{{ antenne_slug }}','{{ antenne_id }}','{{ nom_user }}','{{ user_id }}')">Ajouter</button>
                      </div>
                    </div>
                  </div>
                </div>
              <div class="modal fade" id="update_user_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                  <div class="modal-dialog" role="document" style="color: black;">
                      <div class="modal-content" style="text-align: left;">
                          <div class="modal-header">
                              <h4 class="modal-title" id="myModalLabel">Mettre à jour</h4>
                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                          </div>
                          <div class="modal-body">
                              <div class="form-group">
                              <label for="update_acheteur">Acheteur</label>
                                  <input type="input" disabled="disabled" id="update_acheteur" placeholder="Acheteur" class="form-control"/>
                              </div>
                              <div class="form-group">
                                  <label for="update_produit">Bien ou service</label>
                                  <input type="text" id="update_produit" placeholder="Bien ou service proposé" class="form-control"/>
                              </div>
                              <div class="form-group row">
                                  <div class="col-md-7">
                                      <form method='post' action='' enctype="multipart/form-data">
                                          Choisir l'image : <input type='file' name='file' id='image' class='form-control' ><br>
                                      </form>
                                  </div>
                                  <div class="col-md-5">
                                       <div id="preview" style="border:1px solid black;width:160px;height:160px;">&nbsp;</div>
                                  </div>
                              </div>
                              <div class="form-group has-error has-feedback">
                                  <label for="update_quantite">Quantité</label>
                                  <input type="number" id="update_quantite" placeholder="Quantité" class="form-control"/>
                              </div>
                              <div class="form-group has-error has-feedback">
                                  <label for="update_prix">Prix en junes</label>
                                  <input type="number" id="update_prix" placeholder="Prix" class="form-control"/>
                              </div>
                          </div>
                          <div class="modal-footer">
                              <button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
                              <button type="button" class="btn btn-primary" onclick="UpdateRecherchesDetails('{{ nom_user }}')" >Sauvegarder</button>
                              <input type="hidden" id="hidden_user_id_r">
                              <input type="hidden" id="hidden_antenne_slug_r">
                              <input type="hidden" id="hidden_image_name_r">
                          </div>
                      </div>
                  </div>
              </div>
             <!--crochet% set token_input = csrf_input %crochet

             paginate(items, routePrefix ~ '.index', {id: item.id, region: explodeUrl()[2],
              slug: explodeUrl()[3], antenne: explodeUrl()[4]}) -->
      </div>
  </div>
{% endblock %}