templates/commande/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block title %}{% endblock %}
  3. {% block stylesheets %}
  4.     <link rel="stylesheet" href="{{ asset('/css/liste-commande.css') }}">
  5.  
  6.     {% endblock %}
  7. {% block body %}
  8. <main class="section-services">  </main>
  9. <div class="section-FAQ">
  10.     <div class="container">
  11.       <div class="row">
  12.         <div class="col-md-12 text-center">
  13.           <h5>{% trans %} details.commande.index.cart{% endtrans %}</h5>
  14.           <h2>{% trans %} details.commande.index.list{% endtrans %}</h2>
  15.           <p>Lorem ipsum dolor sit amet invidunt ut labore et sed diam voluptua. At vero eos et accusam et sed diam voluptua.</p>
  16.           <p id="sommeList" class="col-md-10"></p>
  17.           <form class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" action="{{ path('make_command_confirm') }}" method="post">
  18.             {% include 'partials/csrf_field.html.twig' with { token_id: 'submit' } %}
  19.             <div class="d-inherit  justify-content-center">
  20.             {% if app.user %}
  21.               <div class="input-group mb-3">
  22.               <div class="input-group-prepend">
  23.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.adress{% endtrans %}:</span>
  24.               </div>
  25.               <input type="text" class="form-control" name="adresse" value="{% if app.user.adresses | length > 0 %}{{ app.user.adresses[0].adresse }} {% endif %}" aria-describedby="basic-addon1" required>
  26.             </div>
  27.             <div class="input-group mb-3">
  28.               <div class="input-group-prepend"  id="text-tele">
  29.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.tel{% endtrans %}:</span>
  30.               </div>
  31.               <input type="text" class="form-control" name="tel" value="{% if app.user.tel != null %} {{ app.user.tel }} {% endif %}" aria-describedby="basic-addon1" required>
  32.             </div>
  33.             <div class="input-group mb-3">
  34.               <div class="input-group-prepend"  id="text-tele">
  35.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.email{% endtrans %}:</span>
  36.               </div>
  37.               <input type="text" class="form-control" name="email" value="{% if app.user.email != null %} {{ app.user.email }} {% endif %}" aria-describedby="basic-addon1" required>
  38.             </div>
  39.                   <div class="input-group mb-4">
  40.               <div class="input-group-prepend"  id="text-tele">
  41.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.gov{% endtrans %} :</span>
  42.               </div>
  43.               <select type="text" class="form-control" name="gouvernourat" id="gouvernourat" required>
  44.              
  45.              
  46.               </select>
  47.             </div>
  48.               {% else %}
  49.               <div class="input-group mb-3">
  50.               <div class="input-group-prepend">
  51.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.adress{% endtrans %}:</span>
  52.               </div>
  53.               <input type="text" class="form-control" name="adresse" value="" aria-describedby="basic-addon1">
  54.             </div>
  55.             <div class="input-group mb-3">
  56.               <div class="input-group-prepend" id="text-tele">
  57.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.tel{% endtrans %}:</span>
  58.               </div>
  59.               <input type="text" class="form-control" name="tel" value="" aria-describedby="basic-addon1">
  60.             </div>
  61.             <div class="input-group mb-3">
  62.               <div class="input-group-prepend"  id="text-tele">
  63.                 <span class="input-group-text" id="basic-addon1">{% trans %} details.commande.index.email{% endtrans %}:</span>
  64.               </div>
  65.               <input type="text" class="form-control" name="tel" value="" aria-describedby="basic-addon1">
  66.             </div>
  67.               {% endif %}
  68.             </div>
  69.              <span class="btn-slider-text" id="somme">{{ somme }} {% trans %} details.commande.index.TND{% endtrans %} </span>
  70.              <a id="confirm" class="col-md-10" style="margin-top:10%; margin-bottom:10px;"><button id="confirmer" type="submit" class="btn-slider-text"> {% trans %} details.commande.index.confirm {% endtrans %}  </button></a>
  71.           </form>
  72.           {% for message in app.flashes('success') %}
  73.             <div class="alert alert-success">
  74.                 {{ message }}
  75.             </div>
  76.           {% endfor %}
  77.         </div>
  78.       </div>
  79.       <div class="row justify-content-center mt-5">
  80.         <div id="cardList" class="col-md-10">
  81.           <div class="col-md-12 ">
  82.             {% for elem in listCommand %}
  83.             <div class="d-flex mt-5 g-0" id="commande">
  84.                 <div class="card-img-top" style="background-image : url('{{asset('imagees/galery/')}}{{elem.article.image}}');height: 300px;background-size: cover;background-repeat: no-repeat;background-position: center;border-top-right-radius: 0 !important;border-bottom-right-radius: 0 !important;">
  85.                 </div>
  86.                 <div class="col-md-6">
  87.                   <div class="card-body text-left">
  88.                     <span>{{elem.article.prix}} {% trans %} details.commande.index.TND{% endtrans %}</span>
  89.                     <h6 class="card-title">{{ elem.article.titre }}</h6>
  90.                     <div class="col-md-6 col-lg-6 col-xl-6 d-flex" id="btn-number">
  91.                       <button class="btn btn-link px-2"
  92.                         onclick="this.parentNode.querySelector('input[type=number]').stepDown()">
  93.                         <i class="fas fa-minus"></i>
  94.                       </button>
  96.                       <input id="article_{{ elem.article.id }}" min="0" name="quantity" value="{{ elem.quantite }}" type="number"
  97.                         class="form-control form-control-sm quantity article_{{ elem.article.id }}" data-id="{{ elem.article.id }}" />
  99.                       <button class="btn btn-link px-2"
  100.                         onclick="this.parentNode.querySelector('input[type=number]').stepUp()">
  101.                         <i class="fas fa-plus"></i>
  102.                       </button>
  103.                   </div>
  104.                   <a id="href-modifier"><button class="btn-slider-text mt-5" onclick="addCommand({{ elem.article.id }})" id="modifier"> <i class="fa-solid fa-pen-to-square"></i> </button></a>
  105.                     <a id="href-supprimer" class="col-md-10" style="margin-top:10%; margin-bottom:10px;"><button id="supprimer" onclick="supprimerCommand({{ elem.article.id }})" class="btn-slider-text"> <i id="add-adresss" name="deleteAdresse" onclick="deleteAdresses(0)" class="fa-sharp fa-solid fa-trash"></i> </button></a>`
  106.                   </div>
  107.                 </div>
  108.               </div>
  109.             {% endfor %}
  110.         </div>
  111.       </div>
  112.     </div>
  113.   </div>
  114. {% endblock %}
  115. {% block javascripts %}
  116. {{ parent() }}
  117. <script>
  118.    
  120.   function supprimerCommand(a){
  121.     Swal.fire({
  122.   title: 'Êtes-vous sûr?',
  123.   text: "Vous ne pourrez pas revenir en arrière !",
  124.   icon: 'warning',
  125.   showCancelButton: true,
  126.   confirmButtonColor: '#3085d6',
  127.   cancelButtonColor: '#d33',
  128.   confirmButtonText: 'Oui, supprimez-le!'
  129. }).then((result) => {
  130.   if (result.isConfirmed) {
  131.     $.ajax({
  132.       type: 'POST',
  133.       url: '/make/command/delete/' + a,
  134.       success: function () {
  135.         location.reload();
  136.       }
  137.     });
  138.   }
  139. })
  140.   }
  141.     function addCommand(a){
  142.       let quantity = $('.article_'+a).val();
  143.       let item ={id:a, quantity: quantity}
  144.       console.log(item);
  145.       $.ajax({
  146.       type: "POST",
  147.       url: "{{ path('make_command') }}",
  148.       data: JSON.stringify(item),
  149.       dataType:"json",
  150.       success: function(response){
  151.       console.log(response);
  152.         location.reload()
  153.         }
  154.       });
  155.     }
  159.             jQuery.ajax({
  160.                 dataType: 'json',
  161.                 url: "/admin/get-gouvernorats",
  162.                 type: "GET",
  163.                 success: function (response) {
  164.                     var list = JSON.parse(response);
  165.                     var options = '';
  166.                     if (list.length > 0) {
  167.                         for (var i = 0; i < list.length; i++) {
  168.                             options += '<option value="' + list[i]['id'] + '">' + list[i]['libelle'] + '</option>';
  169.                         }
  170.                     }
  171.                     $(`#gouvernourat`).append(options)
  172.                 }
  173.             });
  174.         
  175. </script>
  176. {% endblock %}