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

{% block body %}
  <script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/3.0.7/flatpickr.js"></script>
  <link rel="stylesheet" href="/css/jquery-ui.min.css">
  <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
  <script type="text/javascript">
    $.datepicker.setDefaults(
            {
              altField: "#datepicker",
              closeText: 'Fermer',
              prevText: 'Précédent',
              nextText: 'Suivant',
              currentText: 'Aujourd\'hui',
              monthNames: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'],
              monthNamesShort: ['Janv.', 'Févr.', 'Mars', 'Avril', 'Mai', 'Juin', 'Juil.', 'Août', 'Sept.', 'Oct.', 'Nov.', 'Déc.'],
              dayNames: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'],
              dayNamesShort: ['Dim.', 'Lun.', 'Mar.', 'Mer.', 'Jeu.', 'Ven.', 'Sam.'],
              dayNamesMin: ['D', 'L', 'M', 'M', 'J', 'V', 'S'],
              weekHeader: 'Sem.',
              dateFormat: 'dd-mm-yy'
            }
    );
  </script>
  <script>
    $( function() {
      $( "#datepicker" ).datepicker();
    });
  </script>
  <div class="container_main">
    <div id="la_page">
         <span style="color:white;font-size:1.4rem;">
            CREATION D'UNE ANTENNE
         </span>
      <div class="container" style="color:white;padding:3rem; width:55rem;border:1px solid white;margin:auto;">
       <form action="" method="post">
          {{ csrf_input }}
          <div class="row">
            <div class="col-md-4">
              {{ field('antenne', item.name, "Nom de l'antenne") }}
            </div>
            <div class="col-md-4" style="max-width: 15rem;">
              <span style="margin-left:1rem;">REGION</span>
              <select id="region_select" name="region" class="form-control">
                <option class="list-group-item list-group-item-action" value="0">
                  Sélectionnez une région
                </option>
                  {% for item in listeRegions %}
                  <option class="list-group-item list-group-item-action" value="{{ item.id }}">
                      {{ item.name }}
                  </option>
                  {% endfor %}
              </select>
            </div>
              {{ field('updated_at', item.updatedAt, "", {type: 'hidden'}) }}
              {{  field('created_at', date(), "", {type: 'hidden'}) }}
              <div class="col-md-3">
                  <div style="margin-top:-0.4rem;float:left;min-width: 13rem;">
                      {{ field('datepicker', item.gmarcheAt, "Date Prochain G-marché", {class: 'datepicker'}) }}
                  </div>
              </div>
          </div>

          <div style="clear:both;">
            <div class="row" style="color:white;">
              <div class="col-md-12" style="margin-top:1rem;height:auto;">
                <div class="form-group">
                  <label for="comment">Annonce de présentation de l'antenne</label><p></p>
                  Ligne 1 <textarea id="edito1" class="form-control" rows="2" name="contenu1"></textarea>
                  Ligne 2 <textarea id="edito2" class="form-control" rows="2" name="contenu2"></textarea>
                  Ligne 3 <textarea id="edito3" class="form-control" rows="2" name="contenu3"></textarea>
                  Ligne 4 <textarea id="edito4" class="form-control" rows="2" name="contenu4"></textarea>
                </div>
              </div>
            </div>
            <button class="btn btn-primary" type="submit">Enregistrer</button>
          </div>
        </form>
      </div>
    </div>
  </div>
{% endblock %}