templates/main/shop/index.html.twig line 1

Open in your IDE?
  1. {% extends base ~ "/base.html.twig" %}
  2. {% import "macros/category.html.twig" as categoryMacro %}
  4. {% block title %}Tous nos articles{% endblock %}
  5. {% block javascripts %}
  6. <script>
  7.     $(document).ready(function () {
  8.         $(document).on('change', '#sortby', function () {
  9.             let val = $(this).val();
  10.             window.location.href = "/change-sort/" + val;
  11.         });
  12.     })
  13. </script>
  14. {% endblock %}
  15. {% block main %}
  16. {% set route_name = app.request.get('_route') %}
  17. <main class="main">
  18.     <nav aria-label="breadcrumb" class="breadcrumb-nav mb-0">
  19.         <div class="container d-flex align-items-center">
  20.             <ol class="breadcrumb">
  21.                 <li class="breadcrumb-item">
  22.                     <a href="/">Accueil</a>
  23.                 </li>
  24.                 {% if route_name == 'articles' %}
  25.                     <li class="breadcrumb-item active" aria-current="page">{{'Store'|trans}}</li>
  26.                 {% elseif route_name  == 'articles_category' %}
  27.                 {% set filtre1 = categories.filtre1(app.request.get('category')) %}
  28.                 <li class="breadcrumb-item">
  29.                     <a href="{{ path('articles') }}">{{'Store'|trans}}</a>
  30.                 </li>
  31.                 <li class="breadcrumb-item">
  32.                     <a {{ categoryMacro.href_category(filtre1) }} >
  33.                         {{ filtre1.title}}
  34.                     </a>
  35.                 </li>
  36.                 {% endif %}
  37.             </ol>
  38.             <!-- End .pager-nav -->
  39.         </div>
  40.         <!-- End .container -->
  41.     </nav>
  42.     <div class="page-content pt-2">
  43.         <div class="container">
  44.             {% include "includes/_alerte.html.twig" %}
  45.             <div class="row">
  46.                 <div class="col-lg-9">
  47.                     <div class="toolbox">
  48.                         <div class="toolbox-left">
  49.                             <div class="toolbox-info">
  50.                                 {{'Showing'|trans}} <span>{{ articles|length}} {{'of'|trans}} {{ articles.totalItemCount }}</span>
  51.                                 {{'Products'|trans}}
  52.                             </div><!-- End .toolbox-info -->
  53.                         </div><!-- End .toolbox-left -->
  55.                         <div class="toolbox-right">
  56.                             <div class="toolbox-sort">
  57.                                 <label for="sortby">{{'Sort by'|trans}}:</label>
  58.                                 <div class="select-custom">
  59.                                     {% set sort_by = app.request.session.get('sort_by') %}
  60.                                     <select name="sortby" id="sortby" class="form-control">
  61.                                         <option {{ ((sort_by=='vide' ) or (sort_by is null) )? 'selected' :'' }} value="vide">
  62.                                             {# {{'No sort'|trans}} #}
  63.                                             Non trier
  64.                                         </option>
  65.                                         <option {{ (sort_by=='price:ASC' )? 'selected' :'' }} value='price:ASC'>
  66.                                             {{'    Ascending price'|trans}}
  67.                                             {# Prix Croissant #}
  68.                                         </option>
  69.                                         <option {{ (sort_by=='price:DESC' )? 'selected' :'' }} value='price:DESC'>
  70.                                             {{'Price Descending'|trans}}
  71.                                             {# Prix Déscroissant #}
  72.                                         </option>
  73.                                         {# <option {{ (sort_by=='created_at:ASC' )? 'selected' :'' }}
  74.                                             value='created_at:ASC'>
  75.                                             {{'Date Ascending'|trans}}
  76.                                         </option>
  77.                                         <option {{ (sort_by=='created_at:DESC' )? 'selected' :'' }}
  78.                                             value='created_at:DESC'>
  79.                                             {{'Descending Date'|trans}}
  80.                                         </option> #}
  81.                                     </select>
  82.                                 </div>
  83.                             </div><!-- End .toolbox-sort -->
  84.                             {% set cols_article = app.request.session.get('cols') %}
  85.                             <div class="toolbox-layout">
  86.                                 <a href="{{ path('cols',{cols:'list'}) }}"
  87.                                     class="btn-layout {{ ( cols_article == 'list' or cols_article is null) ? 'active':'' }}">
  88.                                     <svg width="16" height="10">
  89.                                         <rect x="0" y="0" width="4" height="4"></rect>
  90.                                         <rect x="6" y="0" width="10" height="4"></rect>
  91.                                         <rect x="0" y="6" width="4" height="4"></rect>
  92.                                         <rect x="6" y="6" width="10" height="4"></rect>
  93.                                     </svg>
  94.                                 </a>
  96.                                 {# <a href="{{ path('cols',{cols:'2cols'}) }}" class="btn-layout">
  97.                                     <svg width="10" height="10">
  98.                                         <rect x="0" y="0" width="4" height="4"></rect>
  99.                                         <rect x="6" y="0" width="4" height="4"></rect>
  100.                                         <rect x="0" y="6" width="4" height="4"></rect>
  101.                                         <rect x="6" y="6" width="4" height="4"></rect>
  102.                                     </svg>
  103.                                 </a> #}
  105.                                 {# <a href="{{ path('cols',{cols:'3cols'}) }}" class="btn-layout">
  106.                                     <svg width="16" height="10">
  107.                                         <rect x="0" y="0" width="4" height="4"></rect>
  108.                                         <rect x="6" y="0" width="4" height="4"></rect>
  109.                                         <rect x="12" y="0" width="4" height="4"></rect>
  110.                                         <rect x="0" y="6" width="4" height="4"></rect>
  111.                                         <rect x="6" y="6" width="4" height="4"></rect>
  112.                                         <rect x="12" y="6" width="4" height="4"></rect>
  113.                                     </svg>
  114.                                 </a> #}
  116.                                 <a href="{{ path('cols',{cols:'4cols'}) }}"
  117.                                     class="btn-layout {{ (cols_article == '4cols') ? 'active':'' }}">
  118.                                     <svg width="22" height="10">
  119.                                         <rect x="0" y="0" width="4" height="4"></rect>
  120.                                         <rect x="6" y="0" width="4" height="4"></rect>
  121.                                         <rect x="12" y="0" width="4" height="4"></rect>
  122.                                         <rect x="18" y="0" width="4" height="4"></rect>
  123.                                         <rect x="0" y="6" width="4" height="4"></rect>
  124.                                         <rect x="6" y="6" width="4" height="4"></rect>
  125.                                         <rect x="12" y="6" width="4" height="4"></rect>
  126.                                         <rect x="18" y="6" width="4" height="4"></rect>
  127.                                     </svg>
  128.                                 </a>
  129.                             </div><!-- End .toolbox-layout -->
  130.                         </div><!-- End .toolbox-right -->
  131.                     </div><!-- End .toolbox -->
  132.                     {% if cols_article == 'list' %}
  133.                     {% include base ~"/shop/_articles_list.html.twig" %}
  134.                     {% elseif cols_article == '4cols' %}
  135.                     {% include base ~"/shop/_articles_4cols.html.twig" %}
  136.                     {% else %}
  137.                     {% include base ~"/shop/_articles_list.html.twig" %}
  138.                     {% endif %}
  139.                 </div><!-- End .col-lg-9 -->
  140.                 
  141.                 <aside class="col-lg-3 order-lg-first">
  142.                     <div class="widget widget-categories">
  143.                         <h3 class="widget-title">{{ (route_name == 'articles_category')? app_name:'' }}</h3><!-- End .widget-title -->
  144.                             <a href="{{ path('articles') }}" class="article-all{{ (route_name == 'articles')? '-active':'' }}">
  145.                                 {{'All'|trans}}                    
  146.                             </a>    
  147.                         <div class="widget-body">    
  148.                             <div class="accordion" id="widget-cat-acc">
  149.                                 {% for category2 in categories.niveau2 %}
  150.                                 {% if category2.isActive %}
  151.                                     <div class="acc-item">
  152.                                         <h5>
  153.                                             <a role="button" data-toggle="collapse" href="#collapse-{{ category2.id }}" aria-expanded="false" aria-controls="collapse-{{ category2.id }}" class="collapsed">
  154.                                                 {{ category2.title}}
  155.                                             </a>
  156.                                         </h5>
  157.                                         <div id="collapse-{{ category2.id }}" class="collapse {{ (app.request.get('category2_slug') == category2.slug ) ? 'show':'' }}" data-parent="#widget-cat-acc" style="">
  158.                                             <div class="collapse-wrap">
  159.                                                 <ul>
  160.                                                 {% for category in category2.categorys %}
  161.                                                     {% if category.isActive %}
  162.                                                         
  163.                                                     <li><a {{ categoryMacro.href_category(category)}} class=" categorie {{ (app.request.get('category') == category.slug ) ? 'active':'' }}"> 
  164.                                                     {{ category.title }}  ( {{ categoryCount(category2.title, category.title)}} )
  165.                                                     
  166.                                                     </a></li>
  167.                                                     {% endif %}
  168.                                                 {% endfor %}
  169.                                                 </ul>
  170.                                             </div><!-- End .collapse-wrap -->
  171.                                         </div><!-- End .collapse -->
  172.                                     </div><!-- End .acc-item -->
  173.                                     {% endif %}
  174.                                 {% endfor %}
  175.                             </div><!-- End .accordion -->
  176.                             <ul>
  177.                                 <li>
  178.                                     <a href="/boutique/reductions" class="cat-select {{ app.request.attributes.get('category3') == "reductions"  ? 'active':'' }}">
  179.                                         Reductions
  180.                                     </a>
  181.                                 </li>
  182.                             </ul>
  183.                         </div><!-- End .widget-body -->
  184.                     </div>
  185.                     <div class="sidebar sidebar-shop">
  186.                         <div class="widget widget-clean">
  187.                             <label>Filters:</label>
  188.                             <a href="{{ path('articles') }}" class="sidebar-filter-clear">Annuler les filtres</a>
  189.                             {# <a href="#" class="">Clean All</a> #}
  190.                         </div><!-- End .widget widget-clean -->
  192.                         <div class="widget widget-collapsible">
  193.                             <form method="get">
  194.                             {% if app.request.get('mots') != '' %}
  195.                                 <input type="hidden" class="form-control" name="mots" value="{{app.request.get('mots')}}">
  196.                             {% endif %}
  197.                             
  198.                                 <div class="form-row">
  199.                                     <div class="form-group col-md-12 col-12">
  200.                                         <input type="number" id="minPrice" value="{{ app.request.get('minPrice') }}"
  201.                                             width="100px" name="minPrice" placeholder="Prix Min" class="form-control">
  202.                                     </div>
  203.                                     <div class="form-group col-md-12 col-12">
  204.                                         <input type="number" id="maxPrice" value="{{ app.request.get('maxPrice') }}"
  205.                                             width="100px" name="maxPrice" placeholder="Prix Max" class="form-control">
  206.                                     </div>
  208.                                     {# <div class="form-group col-md-12 col-12">
  209.                                         <select class="custom-select select2" style="height:41px;font-size:14px"
  210.                                             name="brand" id="brand">
  211.                                             <option value="">Toutes les Marques</option>
  212.                                             {% for item in brands %}
  213.                                             <option {{ app.request.get('brand')==item.name ? 'selected' :'' }}
  214.                                                 value="{{ item.name }}">{{ item.name }}</option>
  215.                                             {% endfor %}
  216.                                         </select>
  217.                                     </div> #}
  218.                                     {# <div class="form-group col-md-12 col-12">
  219.                                         <select class="custom-select" style="height:41px;font-size:14px" name="etat"
  220.                                             id="brand">
  221.                                             <option value="">Tous les états</option>
  222.                                             <option {{ app.request.get('etat')=='Neuf' ? 'selected' :'' }} value="Neuf">
  223.                                                 Neuf</option>
  224.                                             <option {{ app.request.get('etat')=='Reconditionné' ? 'selected' :'' }}
  225.                                                 value="Reconditionné">Reconditionné</option>
  226.                                             <option {{ app.request.get('etat')=='Occasion' ? 'selected' :'' }}
  227.                                                 value="Occasion">Occasion</option>
  228.                                         </select>
  229.                                     </div> #}
  230.                                     <div class="form-group col-md-2 col-12">
  231.                                         <button type="submit" width="90px" class="btn btn-primary">Appliquer</button>
  232.                                     </div>
  233.                                 </div>
  234.                             </form>
  235.                         </div><!-- End .widget -->
  236.                     </div><!-- End .sidebar sidebar-shop -->
  237.                 </aside><!-- End .col-lg-3 -->
  238.             </div><!-- End .row -->
  239.         </div><!-- End .container -->
  240.     </div><!-- End .page-content -->
  241. </main>
  242. <!-- End .main -->
  243. {% endblock %}