templates/article/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/details-article.css') }}">
  5.     {% endblock %} 
  6.     {% block body %}
  7.         <div class="section-FAQ ">
  8.             <div class="container">
  9.                 <div class="row">
  10.                     <div class="col-md-12 text-center">
  11.                         <h5>{% trans %} details.article.articles{% endtrans %}</h5>
  12.                         <h2>Lorem ipsum dolor</h2>
  13.                         <p>Lorem ipsum dolor sit amet invidunt ut labore et sed diam voluptua. At vero eos et accusam et sed diam voluptua.</p>
  14.                     </div>
  15.                 </div>
  16.                 <div class="row justify-content-center mt-5">
  17.                     {% for article in articles %}
  18.                         <div class="col-md-6">
  19.                             <div class="card mb-3 section-Articles">
  20.                                 <div class="row g-0">
  21.                                     <div class="col-md-6">
  22.                                         <div class="card-img-top" style="background-image : url('{{ asset('imagees/galery/') }}{{ article.image }}'); height: 300px;background-size: cover;background-repeat: no-repeat; background-position: center"></div>
  23.                                         {# <img src="{{asset('imagees/galery/')}}{{article.image}}" class="card-img-top" alt="..."> #}
  24.                                     </div>
  25.                                     <div class="col-md-6">
  26.                                         <div class="card-body text-left">
  27.                                             <span class="bg-price {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">{{ article.prix }}
  28.                                                 {% trans %} details.article.TND{% endtrans %}</span>
  29.                                             <h6 class="card-title">{{ article.titre }}</h6>
  30.                                             <p class="card-text {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">{{ article.description|u.truncate(120, '...')|striptags }}</p>
  32.                                             {% if app.user and app.user.isVerified %}
  33.                                                 {% if app.user.roles[0]=='ROLE_PARTICULIER' or app.user.roles[0]=='ROLE_ENTREPRISES'  or app.user.roles[0]=='ROLE_PARTENAIRES_NATIONAUX'or app.user.roles[0]=='ROLE_PARTENAIRES_REGIONAUX' %}
  34.                                                     <div class="col-md-6 col-lg-6 col-xl-6 d-flex" id="qt-cmd">
  35.                                                         <button class="btn btn-link px-2" onclick="this.parentNode.querySelector('input[type=number]').stepDown()">
  36.                                                             <i class="fas fa-minus"></i>
  37.                                                         </button>
  38.                                                         <input id="article_{{ article.id }}" min="0" name="quantity" value="1" type="number" class="form-control form-control-sm quantity article_{{ article.id }}" data-id="{{ article.id }}"/>
  39.                                                         <button class="btn btn-link px-2" onclick="this.parentNode.querySelector('input[type=number]').stepUp()">
  40.                                                             <i class="fas fa-plus"></i>
  41.                                                         </button>
  42.                                                     </div>
  43.                                                     <a style="margin-top:10%; margin-bottom:10px;">
  44.                                                     {% if article.quantite > 0 %}
  45.                                                         <button class="btn-slider-text-cmd" onclick="addCommand({{ article.id }})" {% if article.quantite == 0 %} disabled {% endif %}>{% trans %} details.article.panier{% endtrans %}</button>
  46.                                                    {% endif %}
  48.                                                    {% if article.quantite == 0 %}
  49.                                                         <button class="btn-slider-text-article" onclick="addCommand({{ article.id }})" {% if article.quantite == 0 %} disabled {% endif %}>{% trans %} details.article.epuise {% endtrans %}</button>
  51.                                                     {% endif %}
  52.                                                     </a>
  53.                                                 {% endif %}
  54.                                             {% else %}
  55.                                                 <div class="col-md-6 col-lg-6 col-xl-6 d-flex" id="qt-cmdd">
  56.                                                     <button class="btn btn-link px-2" onclick="this.parentNode.querySelector('input[type=number]').stepDown()">
  57.                                                         <i class="fas fa-minus"></i>
  58.                                                     </button>
  59.                                                     <input id="article_{{ article.id }}" min="0" name="quantity" value="1" type="number" class="form-control form-control-sm quantity article_{{ article.id }}" data-id="{{ article.id }}"/>
  60.                                                     <button class="btn btn-link px-2" onclick="this.parentNode.querySelector('input[type=number]').stepUp()">
  61.                                                         <i class="fas fa-plus"></i>
  62.                                                     </button>
  63.                                                 </div>
  64.                                             <a style="margin-top:10%; margin-bottom:10px;">
  65.                                                     {% if article.quantite > 0 %}
  66.                                                       <a href="/login"> <button class="btn-slider-text-cmd"  {% if article.quantite == 0 %} disabled {% endif %}>{% trans %} details.article.panier{% endtrans %}</button></a>
  67.                                                    {% endif %}
  69.                                                    {% if article.quantite == 0 %}
  70.                                                         <button class="btn-slider-text-article" onclick="addCommand({{ article.id }})" {% if article.quantite == 0 %} disabled {% endif %}>Epu{% trans %} details.article.epuise{% endtrans %}isé</button>
  72.                                                     {% endif %}
  73.                                                     </a>
  75.                                             {% endif %}
  76.                                             <a href="{{ path('show_article_detail', { id: article.id }) }}">
  77.                                                 <button class="btn-slider-text-cmd {% if app.user != null and app.user.roles[0]=='ROLE_ADMIN' %} btn-slider-text-article2 {% endif %}">{% trans %} details.article.detail{% endtrans %}</button>
  78.                                             </a> 
  79.                                         </div>
  80.                                     </div>
  81.                                 </div>
  82.                             </div>
  83.                         </div>
  84.                     {% endfor %}
  85.                 </div>
  86.             </div>
  87.         </div>
  88.     {% endblock %}
  89.     {% block javascripts %}
  90.         {{ parent() }}
  91.         <script>
  92.             function addCommand(a) {
  93.                 let locale = '{{ app.request.locale }}'
  94.                 let quantity = $('.article_' + a).val()
  95.                 let item = {
  96.                     id: a,
  97.                     quantity: quantity
  98.                 }
  99.                 console.log(item)
  100.                 $.ajax({
  101.                     type: 'POST',
  102.                     url: "{{ path('make_command') }}",
  103.                     data: JSON.stringify(item),
  104.                     dataType: 'json',
  105.                     success: function (response) {
  106.                                    $.ajax({
  107.                                         url: "{{ path('count_command_article_by_user')}}",
  108.                                         type: "GET",
  109.                                         dataType: "json",
  110.                                         success: function (response) {
  111.                                             if(response.count > 0){
  112.                                             $('#notifCartSpan').html(`<i id="notifCart" aria-hidden="true" 
  113.                                             style=" padding-left: -70px !important; font-size: 12px;"><strong style="color:white !important">${response.count}</strong></i>`)
  115.                                             }
  116.                                             else {
  117.                                                 $('#notifCartSpan').html('')
  118.                                             }
  119.                                         }
  121.                                         });
  122.                         console.log(response)
  123.                         if (response.data != null && locale == 'ar_TN') {
  124.                                     Swal.fire('', 'لقد تم إرسال طلبك', 'success')
  126.                         }
  127.                         if (response.data != null && locale != 'ar_TN') {
  128.                                     Swal.fire('', 'Votre commande a été envoyée', 'success')                        }
  129.                     }
  130.                 })
  131.             }
  132.         </script>
  133.     {% endblock %}