templates/Articles/Article/afficher.html.twig line 1

Open in your IDE?
  1. {% extends "layout.html.twig" %}
  2. {% block title %}{{ article.reference }} : {{ article.libelle }}{% endblock %}
  3. {% block body %}
  4.     <script src="{{ asset('js_ep/epobi_article.js') }}"></script>
  5.     <!-- page content -->
  6.     <style>
  7.         @keyframes bounce {
  8.             0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
  9.             40% { transform: translateY(-5px); }
  10.             60% { transform: translateY(-3px); }
  11.         }
  12.     </style>
  13.     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  14.     <div class="right_col fiche_produit" role="main">
  16.         {% set images = dtc_image_article.getImages(article.id) %}
  17.         {% set slug = dtc_article.getslugifArticle(article) %}
  18.         <div class="col-lg-6 container_gallery_fiche_produit">
  19.             <div class="gallery-container-fiche-produit">
  20.                 <!-- Galerie principale -->
  21.                 <div class="swiper main">
  22.                     <div class="swiper-wrapper">
  24.                         {% if images|length > 0 %}
  25.                             {% for im in images  %}
  26.                                 {% set slugImage = dtc_article.getslugifImage(im) %}
  27.                                 {#  <img  src="{{ asset(im.getUploadDir ~ '/' ~ article.id ~ '/' ~ im.url) | imagine_filter('800x600') }}" alt=""> #}
  28.                                 <div class="swiper-slide"><img src="{{ url_image_distant }}/image/800/600/{{ im.ulid }}/{{ slugImage }}" alt="{{ slug }}"></div>
  29.                             {% endfor %}
  30.                         {% else %}
  31.                             <div class="swiper-slide"><img  src="{{ asset('images/defaut-img-product.jpg') }}" alt="{{ slug }}"></div>
  32.                         {% endif %}
  33.                     </div>
  34.                 </div>
  36.                 <!-- Miniatures -->
  37.                 <div class="swiper thumbs">
  38.                     <div class="swiper-wrapper">
  39.                         {% if images|length > 0 %}
  40.                             {% for im in images  %}
  41.                                 {% set slugImage = dtc_article.getslugifImage(im) %}
  42.                                 {# <div class="swiper-slide"><img src="{{ asset(im.getUploadDir ~ '/' ~ article.id ~ '/' ~ im.url) | imagine_filter('800x600') }}" alt=""></div>#}
  43.                                 <div class="swiper-slide"><img  src="{{ url_image_distant }}/image/800/600/{{ im.ulid }}/{{ slugImage }}" alt="{{ slug }}"></div>
  44.                             {% endfor %}
  45.                         {% else %}
  46.                             <div class="swiper-slide"><img src="{{ asset('images/defaut-img-product.jpg') }}" alt="{{ slug }}"></div>
  47.                         {% endif %}
  48.                     </div>
  49.                     <!-- Flèches miniatures -->
  50.                     {% if images|length > 1 %}
  51.                     <div class="swiper-thumbs-button-prev">&#10094;</div>
  52.                     <div class="swiper-thumbs-button-next">&#10095;</div>
  53.                     {% endif %}
  54.                 </div>
  55.             </div>
  56.          </div>
  57.         <script>
  58.             // Miniatures (thumbs) Swiper
  59.             const thumbsSwiper = new Swiper('.thumbs', {
  60.                 spaceBetween: 10,
  61.                 slidesPerView: 'auto', // permet de garder des carrés responsives
  62.                 watchSlidesProgress: true,
  63.                 navigation: {
  64.                     nextEl: '.swiper-thumbs-button-next',
  65.                     prevEl: '.swiper-thumbs-button-prev',
  66.                 },
  67.             });
  68.             // Galerie principale
  69.             const mainSwiper = new Swiper('.main', {
  70.                 spaceBetween: 10,
  71.                 effect: 'fade',
  72.                 loop: true,
  73.                 thumbs: {
  74.                     swiper: thumbsSwiper,
  75.                 },
  76.             });
  77.         </script>
  78.         <div class="col-lg-6 _x_panel" style="">
  79.             <h1 class="no-transform-text dark" style="margin-top:0px;">{{ article.libelle }}</h1>
  80.             <h2 class="no-transform-text dark" style="margin-top:0px;">{{ article.libelleSecondaire }}</h2>
  82.             <div style="margin-top:20px;">Référence : <b style='letter-spacing : 1px;font-family:"Helvetica Neue", Roboto, Arial, "Droid Sans", sans-serif';>{{ article.reference }}</b></div>
  85.             {% set remise = NULL %}
  86.             {% if app.user.id is defined  %}
  87.                 {% set remise = dtc_article.getRemisesPossibleArticleClient({'article':article},app.user.client) %}
  88.             {% endif %}
  91.             {% if remise.remiseId is not defined or remise.remiseId == ""  %}
  92.             <div class="" style="padding-left : 0px;">
  93.                 <div class="_col-12 price-container" style="margin-top:15px;margin-bottom:30px;padding-top:5px;width:auto;">
  94.                     <span class="new-price">
  95.                         {% if app.user.id is defined  %}
  98.                             <span class="no-transform-text">Tarif net :</span>  {{ article.prixVente|price|raw }}&nbsp;€<span class="price-ttc">HT</span>
  100.                         {% else %}
  101.                             {% set prix_ttc = dtc_article.getPrixVenteTtc(article) %}
  102.                             <span class="no-transform-text">Tarif net :</span> {{ prix_ttc|price|raw }}&nbsp;€<span class="price-ttc">TTC</span>
  103.                         {% endif %}
  104.                     </span>
  105.                 </div>
  106.                 <div class="clearfix"></div>
  107.                 {% if article.marque.id is defined  != "" and article.marque.logo != "" %}
  108.                <img class="logo_marque_page_article" src="{{ asset('/uploads/logos/marques/' ~ article.marque.id ~ '/' ~ article.marque.logo) | imagine_filter('H400x300') }}">
  109.                 {% endif %}
  110.             </div>
  111.             {% endif %}
  112.             <div class="both"></div>
  113.             {% if remise.remiseId is defined and remise.remiseId > 0 %}
  114.             <div class="col-lg-12 col-12" style="padding-left : 0px;">
  115.                 <div class=" price-container" style="margin-top:20px;margin-bottom:35px;">
  116.                     <div style="font-size:1.4em;">
  117.                         <span class="droite new-price gray" style="font-size:1em;"><span style="font-size:0.8em;">Tarif&nbsp;public&nbsp;<br></span> {{ article.prixVente|price|raw }}&nbsp;€<span class="price-ttc">HT</span></span>
  118.                     </div>
  119.                     <div class="both"></div>
  120.                     <div style="line-height: 1.05;">
  121.                         <span class="droite new-price" style="color:white;"><span style="font-size:0.55em;color:white;">Tarif&nbsp;remisé <br></span> {{ remise.prixRemise|price|raw }}&nbsp;€<span class="price-ttc">HT</span></span>
  122.                     </div>
  123.                     <div style="_position:absolute;" class="discount">-{{ remise.valeur }}%</div>
  124.                 </div>
  125.                 {% if article.marque.id is defined  != "" and article.marque.logo != "" %}
  126.                     <div><img class="both logo_marque_page_article" src="{{ asset('/uploads/logos/marques/' ~ article.marque.id ~ '/' ~ article.marque.logo) | imagine_filter('H400x300') }}" style=""></div>
  127.                 {% endif %}
  128.             </div>
  129.             {% endif %}
  133.             <div style="_min-height:100px;">
  135.                 <div class="both"></div>
  136.                 <ul class="quick-list" style="margin-top:5px;">
  138.                     {% if article.marque.id is defined %}
  139.                     <li><i class="fa fa-star"></i>{{ article.marque.libelle }}</li>
  140.                     {% endif %}
  142.                     {% if article.poids > 0 %}
  143.                         <li ><i class="fa fa-dashboard"></i><span id="ouvrir-notices" style="cursor:pointer;">{{ article.poids }} Kg</span></li>
  144.                     {% endif %}
  146.                     {% if article.largeur > 0 and article.hauteur > 0 and article.profondeur > 0 %}
  147.                         <li ><i class="fa fa-arrows"></i><span id="ouvrir-notices" style="cursor:pointer;">{{ article.largeur }} cm x {{ article.hauteur }} cm x {{ article.profondeur }} cm</span></li>
  148.                     {% endif %}
  151.                     <li class="no-transform-text"><i class="fa fa-envelope"></i><a data-link="{{ path ("dtc_contact_modal", {"article":article.id} ) }}" class="open-modal-form" data-taille="" data-target="#blocModal" data-toggle="modal" href="#">Demander des informations sur ce produit</a> </li>
  153.                     {% if 1!=1 and article.documents|length > 0 %}
  154.                         <li ><i class="fa fa-file-pdf-o"></i><span id="ouvrir-notices" style="cursor:pointer;">Notices</span></li>
  155.                     {% endif %}
  156.                     {% if 1!=1 and articleOptions|length > 0 %}
  157.                         <li ><i class="fa fa-cubes"></i><span id="ouvrir-options" style="cursor:pointer;">Options</span></li>
  158.                     {% endif %}
  159.                     {% if 1!=1 and articleComplements|length > 0 %}
  160.                         <li ><i class="fa fa-cubes"></i><span id="ouvrir-complements" style="cursor:pointer;">Compléments</span></li>
  161.                     {% endif %}
  162.                     {% if 1!=1 and articleComposants|length > 0 %}
  163.                         <li ><i class="fa fa-cubes"></i><span id="ouvrir-composants" style="cursor:pointer;">Composants</span></li>
  164.                     {% endif %}
  169.                     {% if article.dispo > 0 %}
  170.                         <li class="green etat_stock_en_stock"><i class="fa fa-circle etat_stock_en_stock"></i>En stock {% if app.user.id is defined %}({{ article.dispo }}){% endif %}</li>
  171.                     {% else %}
  172.                         {% set datesProchainesDispo = dtc_article.getDatesProchainesDispo(article.id) %}
  173.                         {% if datesProchainesDispo|length > 0 %}
  174.                             <li class="yellow etat_stock_reappro"><i class="fa fa-circle yellow etat_stock_reappro"></i>En approvisionement :
  175.                             {% if app.user.id is defined %}
  176.                                 {% for d in datesProchainesDispo %}
  177.                                     <div>{{ d.quantite }} entrée{% if d.quantite > 1 %}s{% endif %} en stock prévue{% if d.quantite > 1 %}s{% endif %} {% if d.date != "" %}le  {{ d.date|date("d/m/Y") }}{% else %} (date à confirmer){% endif %} </div>
  178.                                 {% endfor %}
  179.                                 {% endif %}
  180.                             </li>
  181.                         {% else %}
  182.                             <li class="etat_stock_sur_commande orange"><i class="etat_stock_sur_commande fa fa-circle orange"></i>Sur commande</li>
  183.                         {% endif %}
  184.                     {% endif %}
  190.                     {% if articleComplements|length > 0 %}
  191.                     <li class="off"><a id="articleComplements_{{ article.id }}" data-link="{{ path ("dtc_article_complement_modal", {"id":article.id} ) }}" class="open-modal-form" data-taille="modal-lg" data-target="#blocModal" data-toggle="modal" href="#"></a></li>
  192.                     {% endif %}
  194.                 </ul>
  196.                 {% if 1!=1 and catalogues|length >0  %}
  197.                     {% for p in catalogues %}
  198.                         {% if p.document.dossier == "catalogue" or  p.document.dossier == "fiche" %}
  200.                             {% set url_img = asset('uploads/societe/'~p.document.dossier~'/'~p.document.url) %}
  201.                             {% set url_img = url_img|replace({".pdf":".jpg"}) %}
  204.                             <div class="bloc-pdf-catalogue col-2 col-sm-4 col-md-3 col-lg-2 d-flex mb-1">
  205.                                 <div class="card pdf-card _h-100 w-100">
  206.                                     <a title="Télécharger le catalogue" target="_blank" href="{{ asset('uploads/societe/'~p.document.dossier~'/'~p.document.url) }}">
  207.                                         <img src="{{ url_img }}" class="img-responsive-custom card-img-top" alt="Miniature PDF">
  208.                                     </a>
  209.                                 </div>
  210.                             </div>
  214.                         {% endif %}
  215.                     {% endfor %}
  216.                     <div class="both"></div>
  217.                 {% endif %}
  220.             </div>
  223.             <div class="bloc_add_panier d-flex align-items-stretch mt-3" style="width:100%; max-width:320px;">
  224.                 <input id="quantite" name="quantite" type="number" class="mr-2 text-center form-control" style="width:100px;" value="1">
  225.                 {% if app.user.id is defined %}
  226.                 <button data-id="{{ article.id }}" href="" style="width:200px;" class="btn-ajouter-panier gauche bottom-link btn btn-success">
  227.                     <span class="fa fa fa-shopping-cart"></span> Ajouter au panier
  228.                 </button>
  229.                 {% else  %}
  230.                     <a href="/login" style="width:200px;" class="btn-ajouter-panier gauche bottom-link btn btn-success"><span class="fa fa fa-shopping-cart"></span> Ajouter au panier</a>
  231.                 {% endif %}
  233.             </div>
  234.         </div>
  240.         <div class="col-lg-12 x_panel container_tab_fiche_produit" style="margin-top:15px;">
  241.             <div class="tabs-scroll">
  242.             <ul class="nav nav-tabs bar_tabs " id="myTab" role="tablist">
  243.                 <li class="nav-item">
  244.                     <a class="nav-link active" id="description-tab" data-toggle="tab" href="#description" role="tab" aria-controls="description" aria-selected="true">Description</a>
  245.                 </li>
  246.                 <li class="nav-item">
  247.                     <a class="nav-link" id="applications-tab" data-toggle="tab" href="#applications" role="tab" aria-controls="applications" aria-selected="false">Compatibilité</a>
  248.                 </li>
  249.                 {% if
  250.                     article.referenceAppel1 != ""
  251.                     or
  252.                     article.referenceAppel2 != ""
  253.                     or
  254.                     article.referenceAppel3 != ""
  255.                     or
  256.                     article.referenceAppel4 != ""
  257.                     or
  258.                     article.referenceAppel5 != ""
  259.                     or
  260.                     article.referenceAppel6 != ""
  261.                     or
  262.                     article.referenceAppel7 != ""
  263.                     or
  264.                     article.referenceAppel8 != ""
  265.                     or
  266.                     article.referenceAppel9 != ""
  267.                     or
  268.                     article.referenceAppel10 != ""
  269.                 %}
  270.                 <li class="nav-item">
  271.                     <a class="nav-link" id="equivalences-tab" data-toggle="tab" href="#equivalences" role="tab" aria-controls="equivalences" aria-selected="false">Équivalences</a>
  272.                 </li>
  273.                 {% endif %}
  274.                 {% if article.documents|length > 0 %}
  275.                 <li class="nav-item">
  276.                     <a class="nav-link" id="notices-tab" data-toggle="tab" href="#notices" role="tab" aria-controls="notices" aria-selected="false">Notices ({{ article.documents|length }})</a>
  277.                 </li>
  278.                 {% endif %}
  279.                 {% if articleOptions|length > 0 %}
  280.                 <li class="nav-item">
  281.                     <a class="nav-link" id="options-tab" data-toggle="tab" href="#options" role="tab" aria-controls="options" aria-selected="false">Options ({{ articleOptions|length }})</a>
  282.                 </li>
  283.                 {% endif %}
  284.                 {% if articleComplements|length > 0 %}
  285.                 <li class="nav-item">
  286.                     <a class="nav-link" id="complements-tab" data-toggle="tab" href="#complements" role="tab" aria-controls="complements" aria-selected="false">Compléments ({{ articleComplements|length }})</a>
  287.                 </li>
  288.                 {% endif %}
  290.                 {% if articleComposants|length > 0 %}
  291.                 <li class="nav-item">
  292.                     <a class="nav-link" id="composants-tab" data-toggle="tab" href="#composants" role="tab" aria-controls="composants" aria-selected="false">Composants ({{ articleComposants|length }})</a>
  293.                 </li>
  294.                 {% endif %}
  296.                 {% if catalogues|length >0  %}
  297.                     <li class="nav-item">
  298.                         <a class="nav-link" id="catalogues-tab" data-toggle="tab" href="#catalogues" role="tab" aria-controls="catalogues" aria-selected="false">Catalogues ({{ catalogues|length }})</a>
  299.                     </li>
  300.                 {% endif %}
  302.             </ul>
  303.             </div>
  304.             <div class="tab-content" id="myTabContent">
  305.                 <div class="no-transform-text tab-pane fade show active" id="description" role="tabpanel" aria-labelledby="description-tab" style="padding-bottom:10px;">
  306.                     {{ article.description|raw }}
  307.                 </div>
  309.                 {% if catalogues|length > 0 %}
  310.                 <div class=" tab-pane fade" id="catalogues" role="tabpanel" aria-labelledby="catalogues-tab">
  311.                     {% for p in catalogues %}
  312.                         {% if p.document.dossier == "catalogue" or  p.document.dossier == "fiche" %}
  314.                             {% set url_img = asset('uploads/societe/'~p.document.dossier~'/'~p.document.url) %}
  315.                             {% set url_img = url_img|replace({".pdf":".jpg"}) %}
  318.                             <div class="bloc-pdf-catalogue col-4 col-sm-4 col-md-3 col-lg-1 d-flex mb-1">
  319.                                 <div class="card pdf-card _h-100 w-100">
  320.                                     <a title="Télécharger le catalogue" target="_blank" href="{{ asset('uploads/societe/'~p.document.dossier~'/'~p.document.url) }}">
  321.                                         <img src="{{ url_img }}" class="img-responsive-custom card-img-top" alt="Miniature PDF">
  322.                                     </a>
  323.                                 </div>
  324.                             </div>
  328.                         {% endif %}
  329.                     {% endfor %}
  330.                 </div>
  331.                 {% endif %}
  333.                 {% if articleComposants|length > 0 %}
  334.                 <div class=" tab-pane fade" id="composants" role="tabpanel" aria-labelledby="composants-tab">
  335.                     <ul id="liste_composants" class="list-group">
  336.                         {% for ac in articleComposants %}
  337.                         <!-- Composant 1 -->
  338.                         <li class="list-group-item">
  339.                             {% set slug = dtc_article.getslugifArticle(ac.article) %}
  340.                             <a href="{{ path("dtc_article_afficher" , { 'id': ac.article.id,'slug':slug }) }}">
  341.                                 {% set images = dtc_image_article.getImageDefaut(ac.article.id) %}
  342.                                 {% if images[0] is defined %}
  343.                                     {% set slugImage = dtc_article.getslugifImage(images[0].id) %}
  344.                                    {# <img class="card-img-top" alt="{{ ac.article.libelle }}" src="{{ asset(images[0].getUploadDir ~ '/' ~ ac.article.id ~ '/' ~ images[0].url) | imagine_filter('400x300') }}" style="max-width:100%;">#}
  345.                                     <img class="card-img-top" alt="{{ ac.article.libelle }}" src="{{ url_image_distant }}/image/400/300/{{ images[0].ulid }}/{{ slugImage }}" style="max-width:100%;">
  346.                                 {% else %}
  347.                                     <img class="card-img-top" src="{{ asset('images/defaut-img-product.jpg') }}" style="max-width:100%;">
  348.                                 {% endif %}
  349.                             </a>
  350.                             <div class="component-text flex-grow-1">
  351.                                 <div class="text-muted">  <a href="{{ path("dtc_article_afficher" , { 'id': ac.article.id,'slug':slug }) }}">Réf: {{ ac.article.reference }}</a></div>
  352.                                 <div class="no-transform-text dark">  <a href="{{ path("dtc_article_afficher" , { 'id': ac.article.id,'slug':slug }) }}">{{ ac.article.libelle }}</a></div>
  353.                             </div>
  354.                             <span class="badge badge-info badge-qty">Quantité: {{ ac.quantite }}</span>
  355.                         </li>
  356.                         {% endfor %}
  358.                     </ul>
  359.                 </div>
  360.                 {% endif %}
  361.                 <div class="tab-pane fade" id="applications" role="tabpanel" aria-labelledby="applications-tab">
  363.                     {% if article.universel == 1 %}
  364.                         <div style="padding-bottom:10px;">Produit compatible avec tous les types de véhicules.</div>
  365.                     {% endif %}
  367.                     {% set applications = dtc_article.getApplicationsArticle(article) %}
  368.                     {% if applications|length > 0 %}
  369.                         {% for app in applications %}
  370.                             <div>{{ app.libelle_marque }}</div>
  371.                             {% if app.modeles|length > 0 %}
  372.                                 <ul>
  373.                                     {% for m in app.modeles %}
  374.                                         <li><b>{{ m.libelle_modele }}</b></li>
  375.                                         {% if m.types|length > 0 %}
  376.                                             <ul>
  377.                                                 {% for t in m.types %}
  378.                                                     <li>{{ t.libelle_type }}</li>
  379.                                                 {% endfor  %}
  380.                                             </ul>
  381.                                         {% endif %}
  382.                                     {% endfor %}
  383.                                 </ul>
  384.                             {% endif  %}
  385.                             <div class="both" style="height:10px;"></div>
  386.                         {% endfor %}
  387.                     {% endif %}
  388.                 </div>
  389.                 <div class="tab-pane fade" id="options" role="tabpanel" aria-labelledby="options-tab">
  390.                     {% if articleOptions|length > 0 %}
  391.                     <div class="row">
  392.                         {% for o in articleOptions %}
  393.                             <div class="col-lg-2 col-md-6 mb-4 col-6">
  394.                                 <div class="card-options-fiche-produit h-100 shadow-sm">
  395.                                     {% set slug = dtc_article.getslugifArticle(o.enfant) %}
  396.                                     <a href="{{ path("dtc_article_afficher" , { 'id': o.enfant.id,'slug':slug }) }}">
  397.                                     {% set images = dtc_image_article.getImageDefaut(o.enfant.id) %}
  398.                                     {% if images[0] is defined %}
  399.                                         {# <img class="card-img-top" alt="{{ o.enfant.libelle }}" src="{{ asset(images[0].getUploadDir ~ '/' ~ o.enfant.id ~ '/' ~ images[0].url) | imagine_filter('400x300') }}" style="max-width:100%;">#}
  401.                                         {% set slugImage = dtc_article.getslugifImage(images[0].id) %}
  402.                                         {# <div class="swiper-slide"><img src="{{ asset(im.getUploadDir ~ '/' ~ article.id ~ '/' ~ im.url) | imagine_filter('800x600') }}" alt=""></div>#}
  403.                                         <img class="card-img-top" alt="{{ o.enfant.libelle }}" src="{{ url_image_distant }}/image/400/300/{{ images[0].ulid }}/{{ slugImage }}" style="max-width:100%;">
  404.                                     {% else %}
  405.                                         <img class="card-img-top" src="{{ asset('images/defaut-img-product.jpg') }}" style="max-width:100%;">
  406.                                     {% endif %}
  407.                                     </a>
  408.                                     <div class="card-body text-center">
  409.                                         <div class="d-flex align-items-center justify-content-center mb-2">
  410.                                             <span class="product-ref"><a href="{{ path("dtc_article_afficher" , { 'id': o.enfant.id,'slug':slug }) }}">Réf: {{ o.enfant.reference }}</a></span>
  411.                                         </div>
  412.                                         <h5 class="card-title dark" style="font-size:1em;"><a href="{{ path("dtc_article_afficher" , { 'id': o.enfant.id,'slug':slug }) }}">{{ o.enfant.libelle }}</a></h5>
  415.                                         {% set remise = NULL %}
  417.                                         {% if app.user.id is defined  %}
  418.                                             {% set remise = dtc_article.getRemisesPossibleArticleClient({'article':o.enfant},app.user.client) %}
  419.                                         {% endif %}
  422.                                         {% if remise.remiseId is defined and remise.remiseId > 0 %}
  423.                                             <div style="margin-bottom:10px;">
  424.                                                 <div class="old-price-parent">
  425.                                                     <span class="old-price" style="font-size:1.2em;"><b>{{ o.enfant.prixVente|price|raw }}&nbsp;€<span class="price-ttc">HT</span></b></span>
  426.                                                 </div>
  427.                                                 <div style="margin-top:5px;">
  428.                                                     <div class="discount" style="font-size:0.8em;display:inline;">Remise pro -{{ remise.valeur }}%</div>
  429.                                                 </div>
  430.                                                 <div style="margin-top:5px;">
  431.                                                     <span class=" new-price" style="font-size:1.2em;"><span style="font-size:1.4em;">{{ remise.prixRemise|price }}&nbsp;€<span class="price-ttc">HT</span></span></span>
  432.                                                     <div class="both"></div>
  433.                                                 </div>
  434.                                             </div>
  435.                                             <div class="both"></div>
  436.                                         {% else %}
  438.                                             <p class="card-text">
  439.                                             {% if app.user.id is defined  %}
  440.                                                 <span class="card-price">{{ o.enfant.prixVente|price|raw }}&nbsp;&euro; HT</span>
  441.                                             {% else %}
  442.                                                 {% set prix_ttc = dtc_article.getPrixVenteTtc(o.enfant) %}
  443.                                                 <span class="card-price">{{ prix_ttc|price|raw }}&nbsp;&euro; TTC</span>
  444.                                             {% endif %}
  445.                                             </p>
  446.                                         {% endif %}
  449.                                         {% if app.user.id is defined %}
  450.                                             <button data-texte="<span class='fa fa fa-shopping-cart'></span> Ajouter" data-id="{{ o.enfant.id }}" style="" class="btn-ajouter-panier btn btn-success btn-sm"><span class="fa fa fa-shopping-cart"></span> Ajouter</button>
  451.                                         {% else  %}
  452.                                             <a href="/login" class="btn-ajouter-panier btn btn-success btn-sm"><span class="fa fa fa-shopping-cart"></span> Ajouter</a>
  454.                                         {% endif %}
  459.                                     </div>
  460.                                 </div>
  461.                             </div>
  462.                         {% endfor %}
  463.                     </div>
  464.                     {% endif %}
  465.                 </div>
  467.                 <div class="tab-pane fade" id="complements" role="tabpanel" aria-labelledby="complements-tab">
  468.                     {% if articleComplements|length > 0 %}
  469.                         <div class="row">
  470.                             {% for o in articleComplements %}
  471.                                 <div class="col-lg-2 col-md-6 mb-4 col-6">
  472.                                     <div class="card-options-fiche-produit h-100 shadow-sm">
  473.                                         {% set slug = dtc_article.getslugifArticle(o.enfant) %}
  474.                                         <a href="{{ path("dtc_article_afficher" , { 'id': o.enfant.id,'slug':slug }) }}">
  475.                                             {% set images = dtc_image_article.getImageDefaut(o.enfant.id) %}
  476.                                             {% if images[0] is defined %}
  477.                                                 {% set slugImage = dtc_article.getslugifImage(images[0].id) %}
  478.                                                 <img class="card-img-top" alt="{{ o.enfant.libelle }}" src="{{ url_image_distant }}/image/400/300/{{ images[0].ulid }}/{{ slugImage }}" style="max-width:100%;">
  479.                                             {% else %}
  480.                                                 <img class="card-img-top" src="{{ asset('images/defaut-img-product.jpg') }}" style="max-width:100%;">
  481.                                             {% endif %}
  482.                                         </a>
  484.                                         <div class="card-body text-center">
  485.                                             <div class="d-flex align-items-center justify-content-center mb-2">
  486.                                                 <span class="product-ref"><a href="{{ path("dtc_article_afficher" , { 'id': o.enfant.id,'slug':slug }) }}">Réf: {{ o.enfant.reference }}</a></span>
  487.                                             </div>
  488.                                             <h5 class="card-title dark" style="font-size:1em;"><a href="{{ path("dtc_article_afficher" , { 'id': o.enfant.id,'slug':slug }) }}">{{ o.enfant.libelle }}</a></h5>
  491.                                             {% set remise = NULL %}
  493.                                             {% if app.user.id is defined  %}
  494.                                                 {% set remise = dtc_article.getRemisesPossibleArticleClient({'article':o.enfant},app.user.client) %}
  495.                                             {% endif %}
  498.                                             {% if remise.remiseId is defined and remise.remiseId > 0 %}
  499.                                                 <div style="margin-bottom:10px;">
  500.                                                     <div>
  501.                                                         <span class="old-price" style="font-size:1.2em;"><b>{{ o.enfant.prixVente|price|raw }}&nbsp;€<span class="price-ttc">HT</span></b></span>
  502.                                                     </div>
  503.                                                     <div style="margin-top:5px;">
  504.                                                         <div class="discount" style="font-size:0.8em;display:inline;">Remise pro -{{ remise.valeur }}%</div>
  505.                                                     </div>
  506.                                                     <div style="margin-top:5px;">
  507.                                                         <span class=" new-price" style="font-size:1.2em;"><span style="font-size:1.4em;">{{ remise.prixRemise|price }}&nbsp;€<span class="price-ttc">HT</span></span></span>
  508.                                                         <div class="both"></div>
  509.                                                     </div>
  510.                                                 </div>
  511.                                                 <div class="both"></div>
  512.                                             {% else %}
  513.                                                 <p class="card-text">
  516.                                                     {% if app.user.id is defined  %}
  517.                                                         <span class="card-price">{{ o.enfant.prixVente|price|raw }}&nbsp;&euro; HT</span>
  518.                                                     {% else %}
  519.                                                         {% set prix_ttc = dtc_article.getPrixVenteTtc(o.enfant) %}
  520.                                                         <span class="card-price">{{ prix_ttc|price|raw }}&nbsp;&euro; TTC</span>
  521.                                                     {% endif %}
  525.                                                 </p>
  526.                                             {% endif %}
  528.                                             <input id="quantite" name="quantite" type="hidden" class="gauche text-center form-control" style="width:100%;" value="{{ o.multiple}}">
  529.                                             <div class="both"></div>
  532.                                             {% if app.user.id is defined %}
  533.                                                 <button data-texte="<span class='fa fa fa-shopping-cart'></span> Ajouter" data-id="{{ o.enfant.id }}" style="" class="btn-ajouter-panier btn btn-success btn-sm"><span class="fa fa fa-shopping-cart"></span> Ajouter</button>
  534.                                             {% else  %}
  535.                                                 <a href="/login" class="btn-ajouter-panier btn btn-success btn-sm"><span class="fa fa fa-shopping-cart"></span> Ajouter</a>
  536.                                             {% endif %}
  539.                                         </div>
  540.                                     </div>
  541.                                 </div>
  542.                             {% endfor %}
  543.                         </div>
  544.                     {% endif %}
  545.                 </div>
  549.                 <div class="tab-pane fade" id="notices" role="tabpanel" aria-labelledby="notices-tab">
  551.                     {% if article.documents|length > 0 %}
  552.                         <ul class="list-group list-group-flush liste_notices">
  553.                         {% for im in article.documents  %}
  554.                             <li class="list-group-item d-flex justify-content-between align-items-center file-item">
  555.                                 <div><i class="fa fa-file-pdf-o  fa-file-pdf file-icon mr-2"></i> {{ im.url }}</div>
  556.                                 <a href="{{ asset(im.getUploadDir ~ '/' ~ article.id ~ '/' ~ im.url)  }}" class="btn btn-outline-primary btn-sm" download>
  557.                                     <i class="fa fa-download"></i> Télécharger
  558.                                 </a>
  559.                             </li>
  560.                         {% endfor %}
  561.                     </ul>
  562.                     {% endif %}
  565.                 </div>
  566.                 <div class="tab-pane fade" id="equivalences" role="tabpanel" aria-labelledby="equivalences-tab">
  568.                     <div id="liste_ref_equivalances">
  569.                         <ul class="list-group list-group-flush">
  571.                             {% if article.referenceAppel1  != "" %}
  572.                                 <li class="list-group-item">
  573.                                     <div class="list-left">
  574.                                         <div>
  575.                                             <p class="item-title">{{ article.referenceAppel1 }}</p>
  576.                                            {#  <p class="item-sub">.</p> #}
  577.                                         </div>
  578.                                     </div>
  579.                                 </li>
  580.                             {% endif %}
  582.                             {% if article.referenceAppel2  != "" %}
  583.                                 <li class="list-group-item">
  584.                                     <div class="list-left">
  585.                                         <div>
  586.                                             <p class="item-title">{{ article.referenceAppel2 }}</p>
  588.                                         </div>
  589.                                     </div>
  590.                                 </li>
  591.                             {% endif %}
  593.                             {% if article.referenceAppel3  != "" %}
  594.                                 <li class="list-group-item">
  595.                                     <div class="list-left">
  596.                                         <div>
  597.                                             <p class="item-title">{{ article.referenceAppel3 }}</p>
  598.                                             <p class="item-sub">.</p>
  599.                                         </div>
  600.                                     </div>
  601.                                 </li>
  602.                             {% endif %}
  604.                             {% if article.referenceAppel4  != "" %}
  605.                                 <li class="list-group-item">
  606.                                     <div class="list-left">
  607.                                         <div>
  608.                                             <p class="item-title">{{ article.referenceAppel4 }}</p>
  609.                                             <p class="item-sub">.</p>
  610.                                         </div>
  611.                                     </div>
  612.                                 </li>
  613.                             {% endif %}
  615.                             {% if article.referenceAppel5  != "" %}
  616.                                 <li class="list-group-item">
  617.                                     <div class="list-left">
  618.                                         <div>
  619.                                             <p class="item-title">{{ article.referenceAppel5 }}</p>
  621.                                         </div>
  622.                                     </div>
  623.                                 </li>
  624.                             {% endif %}
  626.                             {% if article.referenceAppel6  != "" %}
  627.                                 <li class="list-group-item">
  628.                                     <div class="list-left">
  629.                                         <div>
  630.                                             <p class="item-title">{{ article.referenceAppel6 }}</p>
  632.                                         </div>
  633.                                     </div>
  634.                                 </li>
  635.                             {% endif %}
  637.                             {% if article.referenceAppel7  != "" %}
  638.                                 <li class="list-group-item">
  639.                                     <div class="list-left">
  640.                                         <div>
  641.                                             <p class="item-title">{{ article.referenceAppel7 }}</p>
  643.                                         </div>
  644.                                     </div>
  645.                                 </li>
  646.                             {% endif %}
  648.                             {% if article.referenceAppel8  != "" %}
  649.                                 <li class="list-group-item">
  650.                                     <div class="list-left">
  651.                                         <div>
  652.                                             <p class="item-title">{{ article.referenceAppel8 }}</p>
  654.                                         </div>
  655.                                     </div>
  656.                                 </li>
  657.                             {% endif %}
  659.                             {% if article.referenceAppel9  != "" %}
  660.                                 <li class="list-group-item">
  661.                                     <div class="list-left">
  662.                                         <div>
  663.                                             <p class="item-title">{{ article.referenceAppel9 }}</p>
  665.                                         </div>
  666.                                     </div>
  667.                                 </li>
  668.                             {% endif %}
  670.                             {% if article.referenceAppel10  != "" %}
  671.                                 <li class="list-group-item">
  672.                                     <div class="list-left">
  673.                                         <div>
  674.                                             <p class="item-title">{{ article.referenceAppel10 }}</p>
  676.                                         </div>
  677.                                     </div>
  678.                                 </li>
  679.                             {% endif %}
  680.                         </ul>
  681.                     </div>
  682.                 </div>
  683.             </div>
  684.         </div>
  685.     </div>
  686.     <!-- /page content -->
  687. {% endblock %}