templates/produit/produits.html.twig line 1

  1. {% extends 'base.html.twig' %}
  3. {% block stylesheets %}
  4.     <link rel="stylesheet" href="{{ asset('assets/css/produit.min.css') }}" />
  5.     <link rel="stylesheet" href="{{ asset('assets/css/accueil.min.css') }}" />
  6. {% endblock %}
  8. {% block javascript %}
  9.     <script src="{{ asset('assets/js/produit/produit.js') }}"></script>
  10.     <script src="{{ asset('assets/js/accueil/accueil.js') }}"></script>
  11. {% endblock %}
  13. {% block title %}
  14.     {% for content in contents %}
  15.         {{ content.name|raw }}
  16.     {% endfor %}
  17. {% endblock %}
  19. {% block description %}
  20. {% endblock %}
  22. {% block content %}
  23.     <div class="row px-4 mt-3">
  24.         {% if instrumentation is not defined %}
  25.             <div class="col-md-3 col-12">
  26.                 <form action="#" id="layered_form">
  27.                     <div id="enabled_filters" class="d-none">
  28.                         <span class="layered_subtitle" style="float: none;"> {{ 'active.filter'|trans({}, 'configurateur')|raw }} : </span>
  29.                         <ul class="p-0 m-0 border" style="list-style: none;">
  30.                         </ul>
  31.                     </div>
  32.                     <div id="layered_block_left">
  33.                         <div class="layered_filter">
  34.                             <div class="layered_subtitle_heading block-borderbox">
  35.                                 <div class="title_block"><span>{{ 'capacite'|trans({}, 'configurateur')|raw }}</span></div>
  36.                             </div>
  37.                             <ul id="ul_layered_id_attribute_group_4" class="col-lg-12 layered_filter_ul filtercapacite">
  38.                                 {% for category in categories|filter(c => c.id_attribute_group == 4) %}
  39.                                     <li class="nomargin hiddable col-lg-12">
  40.                                         <input type="checkbox" class="filtercheckbox" name="layered_id_attribute_group_{{ category.id_attribute }}" id="layered_id_attribute_group_{{ category.id_attribute }}" value="{{ category.id_attribute }}_{{ category.id_attribute_group }}">
  41.                                             <label for="layered_id_attribute_group_{{ category.id_attribute }}">
  42.                                             <div class="cat">{{ category.name }}<span class="product_count"> ({{ category.product_count }})</span></div>
  43.                                         </label>
  44.                                     </li>
  45.                                 {% endfor %}
  46.                             </ul>
  47.                         </div>
  48.                         <div class="layered_filter">
  49.                             <div class="layered_subtitle_heading block-borderbox">
  50.                                 <div class="title_block"><span>{{ 'precision'|trans({}, 'configurateur')|raw }}</span></div>
  51.                             </div>
  52.                             <ul id="ul_layered_id_attribute_group_5" class="col-lg-12 layered_filter_ul filterprecision">
  53.                                 {% for category in categories|filter(c => c.id_attribute_group == 5) %}
  54.                                     <li class="nomargin hiddable col-lg-12">
  55.                                         <input type="checkbox" class="filtercheckbox" name="layered_id_attribute_group_{{ category.id_attribute }}" id="layered_id_attribute_group_{{ category.id_attribute }}" value="{{ category.id_attribute }}_{{ category.id_attribute_group }}">
  56.                                             <label for="layered_id_attribute_group_{{ category.id_attribute }}">
  57.                                             <div class="cat">{{ category.name }}<span class="product_count"> ({{ category.product_count }})</span></div>
  58.                                         </label>
  59.                                     </li>
  60.                                 {% endfor %}
  61.                             </ul>
  62.                         </div>
  63.                         <div class="layered_filter">
  64.                             <div class="layered_subtitle_heading block-borderbox">
  65.                                 <div class="title_block"><span>{{ 'sens.travail'|trans({}, 'configurateur')|raw }}</span></div>
  66.                             </div>
  67.                             <ul id="ul_layered_id_feature_532" class="col-lg-12 layered_filter_ul filterfeature">
  68.                                 {% for feature in features %}
  69.                                     <li class="nomargin hiddable col-lg-12">
  70.                                         <input type="checkbox" class="filtercheckbox" name="layered_id_attribute_group_{{ feature.id_feature }}" id="layered_id_attribute_group_{{ feature.id_feature }}" value="{{ feature.id_feature }}">
  71.                                             <label for="layered_id_attribute_group_{{ feature.id_feature }}">
  72.                                             <div class="cat">{{ feature.value }}<span class="product_count"> ({{ feature.product_count }})</span></div>
  73.                                         </label>
  74.                                     </li>
  75.                                 {% endfor %}
  76.                             </ul>
  77.                         </div>
  78.                     </div>
  79.                 </form>
  80.             </div>
  81.         {% endif %}
  82.         <div class="{{ instrumentation is defined ? 'col-md-12' : 'col-md-9' }} col-12">
  83.             {% for content in contents %}
  84.                 <div class="BoxCatName" style="background-image: url('/ps/img/c/{{ content.id_category }}-0_thumb.jpg')">
  85.                     <h1>{{ content.name }}</h1>
  86.                     <h2>{{ content.subtitle }}</h2>
  87.                 </div>
  88.                 <div class="row mt-3">
  89.                     <div id="DescriptionCategory" class="col-8 position-relative ps-0">
  90.                         <div class="overflow-hidden">
  91.                             <div class="fadeout"></div>
  92.                                 {{ content.description|raw }}
  93.                             <div id="ReadMore" style="">{{ 'savoir.plus'|trans({}, 'configurateur')|raw }} <i class="fa-solid fa-angle-down fa-sm"></i></div>
  94.                             <div id="ReadLess" style="display: none;">{{ 'reduire'|trans({}, 'configurateur')|raw }}</div>
  95.                         </div>
  96.                     </div>
  97.                     <div class="col-4">
  98.                         <div id="BoutonDown" data-product-id="26" data-shop-id="{{ content.id_shop }}">
  99.                             <a href="{{ content.pdflink }}" target="_blank" class="d-flex">
  100.                                 <i class="fas fa-download" style="color: #fff;"></i>
  101.                                 <div>
  102.                                     <span>PDF</span><br>
  103.                                     <span class="LigneDeux">PRODUCT OVERVIEW</span>
  104.                                 </div>
  105.                             </a>
  106.                         </div>
  107.                     </div>
  108.                 </div>
  109.                 <div class="list-unstyled nopadding product_list products-block grid clearfix style1 row ms-0 me-1">
  110.                     {% set varFilter = instrumentation is defined ? null : 18 %}
  111.                     {% for product in products|filter(p => p.category_default != varFilter) %}
  112.                         <div class="product owl-wrapper col-xs-cus-12 col-xs-4 col-sm-3 col-md-3 col-lg-3 p-0" data-col-lg="3" data-col-md="3" data-col-sm="3" data-col-xs="4">
  113.                             <div class="item clearfix">
  114.                                 <div class="ajax_block_product">
  115.                                     <div class="product-block position-relative" itemscope="" itemtype="https://schema.org/Product" style="position: static; margin-right: 0px; margin-left: 0px;">
  116.                                         <div class="product-container">
  117.                                             <div class="Certifications">
  118.                                                 {% for supplier in product.suppliers|split(',') %}
  119.                                                     {% set imagePath = '../../../ps/img/su/' ~ product.id_suppliers|split(',')[loop.index0] %}
  120.                                                     {% set imageName = product.id_suppliers|split(',')[loop.index0] %}
  121.                                                     {% set imageExtension = (imageName == '4') ? 'png' : 'jpg' %}
  123.                                                     <img width="20px" height="20px" src="{{ imagePath ~ '.' ~ imageExtension }}" alt="{{ supplier }}" title="{{ supplier }}">
  124.                                                 {% endfor %}
  125.                                             </div>
  126.                                             <div class="left-block">
  127.                                                 <div class="product-image-container image">
  128.                                                     <a class="img product_img_link" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" title="{{ product.name }}" itemprop="url">
  129.                                                         <img class="replace-2x img-responsive pts-image" src="https://www.sensy.com/{{ product.id_image1 }}-home_default/{{ product.link_rewrite }}.jpg" alt="{{ product.legend1 }}" title="{{ product.legend1 }}" itemprop="image">
  130.                                                     </a>
  131.                                                     {% if product.id_image2 %}
  132.                                                         <span class="hover-image">
  133.                                                             <a class="img-back product_img_link" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" title="{{ product.name }}">
  134.                                                                 <img class="replace-2x img-responsive pts-image" src="https://www.sensy.com/{{ product.id_image2 }}-home_default/{{ product.link_rewrite }}.jpg" alt="{{ product.legend2 }}" title="{{ product.legend2 }}" width="370" height="340">
  135.                                                             </a>
  136.                                                         </span>
  137.                                                     {% endif %}
  138.                                                 </div>
  139.                                                 <div class="product-label-wrap"></div>
  140.                                                 <div class="color-list-container product-colors"></div>
  141.                                             </div>
  142.                                             <div class="right-block">
  143.                                                 <div class="product-meta">
  144.                                                     <h4 class="name" itemprop="sku"> <a class="product-name" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" title="{{ product.name }}" itemprop="url">{{ product.reference }}</a></h4>
  145.                                                     <div class="product-desc description" itemprop="name"> {{ product.name }}</div>
  146.                                                     <div class="clearfix product-box"></div>
  147.                                                 </div>
  148.                                                 <div class="button-container action" style="padding-left: 20%;">
  149.                                                     <div>
  150.                                                         <div class="pts-atchover"><a class="btn" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" data-id-product="{{ product.id_product }}" title="{{ 'details'|trans({}, 'configurateur')|raw }}"><i class="fas fa-search"></i></a></div>
  151.                                                         <div class="pts-atchover"><a class="btn " href="//files.sensy.com/datasheets/{{ product.file_name }}" target="_blank" title="{{ 'datasheet'|trans({}, 'configurateur')|raw }}"><i class="fas fa-download"></i></a></div>
  152.                                                         <div class="pts-atchover"><a class="btn add_to_compare" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" data-id-product="{{ product.id_product }}" title="{{ 'add.compare'|trans({}, 'configurateur')|raw }}"><i class="fas fa-sync-alt"></i></a></div>
  153.                                                     </div>
  154.                                                 </div>
  155.                                             </div>
  156.                                         </div>
  157.                                         <div class="SousProduit ShadowBox" style="display: none;">
  158.                                             <table class="mx-1">
  159.                                                 <tbody>
  160.                                                     {% if product.attr_prec %}
  161.                                                         <tr class="precision" data-id={{ product.id_attr_prec }}>
  162.                                                             <td>{{ 'precision'|trans({}, 'configurateur')|raw }}</td>
  163.                                                             <td>{{ product.attr_prec|replace({',': ', '})|truncate(25) }}</td>
  164.                                                         </tr>
  165.                                                     {% endif %}
  166.                                                     {% if product.attr_cap %}
  167.                                                         <tr class="capacite" data-id={{ product.id_attr_cap }}>
  168.                                                             <td>{{ 'capacite'|trans({}, 'configurateur')|raw }}</td>
  169.                                                             <td>{{ product.attr_cap|replace({',': ', '})|truncate(25) }}</td>
  170.                                                         </tr>
  171.                                                     {% endif %}
  172.                                                     {% if product.id_feat %}
  173.                                                         <tr class="feature d-none" data-id={{ product.id_feat }}></tr>
  174.                                                     {% endif %}
  175.                                                     <tr>
  176.                                                         <td colspan="2" class="TableDescription" itemprop="description">{{ product.description|raw }}</td>
  177.                                                     </tr>
  178.                                                 </tbody>
  179.                                             </table>
  180.                                         </div>
  181.                                         <div itemprop="brand" itemscope="" itemtype="https://schema.org/Brand">
  182.                                             <meta itemprop="name" content="SENSY">
  183.                                         </div>
  184.                                         <div itemprop="offers" itemscope="" itemtype="https://schema.org/Offer">
  185.                                             <meta itemprop="price" content="">
  186.                                             <meta itemprop="priceCurrency" content="EUR">
  187.                                             <link itemprop="availability" href="https://schema.org/InStock">
  188.                                             <meta itemprop="url" content="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}">
  189.                                         </div>
  190.                                     </div>
  191.                                 </div>
  192.                             </div>
  193.                         </div>
  194.                     {% endfor %}
  195.                 </div>
  196.                 {% if instrumentation is not defined %}
  197.                     <div class="pts-container">
  198.                         <div class="pts-inner container">
  199.                             <div class="row-inner row-level-1">
  200.                                 <div class="row clearfix">
  201.                                     <div class="col-lg-12 col-md-12 col-sm-12 col-12 p-0">
  202.                                         <div class="col-inner space-60">
  203.                                             <div class="widget-bloglatest">
  204.                                                 <div class="pts-widget">
  205.                                                     <div class="widget-latestblog block block-borderbox">
  206.                                                         <h3 class="title_block"><span>{{ 'electronique'|trans({}, 'configurateur')|raw }}</span></h3>
  207.                                                         <div class="block_content border-0">
  208.                                                             <div class=" boxcarousel widget-content owl-carousel-play" data-ride="owlcarousel">
  209.                                                                 <div class="carousel-controls">
  210.                                                                     <div class="left carousel-control left_carousel disabled">
  211.                                                                         <i class="fa-solid fa-angle-left fa-sm"></i>
  212.                                                                     </div>
  213.                                                                     <div class="right carousel-control right_carousel">
  214.                                                                         <i class="fa-solid fa-angle-right fa-sm"></i>
  215.                                                                     </div>
  216.                                                                 </div>
  217.                                                                 <div class="owl-carousel grid owl-theme" data-columns="3" data-pagination="false" data-navigation="true" data-desktop="[1200,3]" data-desktopsmall="[992,2]" data-tablet="[768,1]" data-mobile="[480,1]">
  218.                                                                     <div class="owl-wrapper-outer" style="height: 430px;">
  219.                                                                         <div class="owl-wrapper">
  220.                                                                             {% for product in products|filter(p => p.category_default == 18) %}
  221.                                                                                 <div class="owl-item {{ loop.first ? 'active' : '' }}" style="width: 250px;">
  222.                                                                                     <div class="item">
  223.                                                                                         <div class="blog_container grid clearfix">
  224.                                                                                             <div class="product-block position-relative" itemscope="" itemtype="https://schema.org/Product" style="position: static; margin-right: 0px; margin-left: 0px;">
  225.                                                                                                 <div class="product-container">
  226.                                                                                                     <div class="Certifications">
  227.                                                                                                         {% for supplier in product.suppliers|split(',') %}
  228.                                                                                                             {% set imagePath = '../../../ps/img/su/' ~ product.id_suppliers|split(',')[loop.index0] %}
  229.                                                                                                             {% set imageName = product.id_suppliers|split(',')[loop.index0] %}
  230.                                                                                                             {% set imageExtension = (imageName == '4') ? 'png' : 'jpg' %}
  232.                                                                                                             <img width="20px" height="20px" src="{{ imagePath ~ '.' ~ imageExtension }}" alt="{{ supplier }}" title="{{ supplier }}">
  233.                                                                                                         {% endfor %}
  234.                                                                                                     </div>
  235.                                                                                                     <div class="left-block">
  236.                                                                                                         <div class="product-image-container image">
  237.                                                                                                             <a class="img product_img_link" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" title="{{ product.name }}" itemprop="url">
  238.                                                                                                                 <img class="replace-2x img-responsive pts-image" src="https://www.sensy.com/{{ product.id_image1 }}-home_default/{{ product.link_rewrite }}.jpg" alt="{{ product.legend1 }}" title="{{ product.legend1 }}" itemprop="image">
  239.                                                                                                             </a>
  240.                                                                                                             {% if product.id_image2 %}
  241.                                                                                                                 <span class="hover-image"> 
  242.                                                                                                                     <a class="img-back product_img_link" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" title="{{ product.name }}">
  243.                                                                                                                         <img class="replace-2x img-responsive pts-image" src="https://www.sensy.com/{{ product.id_image2 }}-home_default/{{ product.link_rewrite }}.jpg" alt="{{ product.legend2 }}" title="{{ product.legend2 }}" width="370" height="340">
  244.                                                                                                                     </a>
  245.                                                                                                                 </span>
  246.                                                                                                             {% endif %}
  247.                                                                                                         </div>
  248.                                                                                                         <div class="product-label-wrap"></div>
  249.                                                                                                         <div class="color-list-container product-colors"></div>
  250.                                                                                                     </div>
  251.                                                                                                     <div class="right-block">
  252.                                                                                                         <div class="product-meta">
  253.                                                                                                             <h4 class="name" itemprop="sku"> <a class="product-name" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" title="{{ product.name }}" itemprop="url">{{ product.reference }}</a></h4>
  254.                                                                                                             <div class="product-desc description" itemprop="name"> {{ product.name }}</div>
  255.                                                                                                             <div class="clearfix product-box"></div>
  256.                                                                                                         </div>
  257.                                                                                                         <div class="button-container action" style="padding-left: 20%;">
  258.                                                                                                             <div>
  259.                                                                                                                 <div class="pts-atchover"><a class="btn" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" data-id-product="{{ product.id_product }}" title="{{ 'details'|trans({}, 'configurateur')|raw }}"><i class="fas fa-search"></i></a></div>
  260.                                                                                                                 <div class="pts-atchover"><a class="btn " href="//files.sensy.com/datasheets/{{ product.file_name }}" target="_blank" title="{{ 'datasheet'|trans({}, 'configurateur')|raw }}"><i class="fas fa-download"></i></a></div>
  261.                                                                                                                 <div class="pts-atchover"><a class="btn add_to_compare" href="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}" data-id-product="{{ product.id_product }}" title="{{ 'add.compare'|trans({}, 'configurateur')|raw }}"><i class="fas fa-sync-alt"></i></a></div>
  262.                                                                                                             </div>
  263.                                                                                                         </div>
  264.                                                                                                     </div>
  265.                                                                                                 </div>
  266.                                                                                                 <div class="SousProduit ShadowBox" style="display: none;">
  267.                                                                                                     <table class="mx-1">
  268.                                                                                                         <tbody>
  269.                                                                                                             {% if product.attr_prec %}
  270.                                                                                                                 <tr>
  271.                                                                                                                     <td>{{ 'precision'|trans({}, 'configurateur')|raw }}</td>
  272.                                                                                                                     <td>{{ product.attr_prec|replace({',': ', '})|truncate(25) }}</td>
  273.                                                                                                                 </tr>
  274.                                                                                                             {% endif %}
  275.                                                                                                             {% if product.attr_cap %}
  276.                                                                                                                 <tr>
  277.                                                                                                                     <td>{{ 'capacite'|trans({}, 'configurateur')|raw }}</td>
  278.                                                                                                                     <td>{{ product.attr_cap|replace({',': ', '})|truncate(25) }}</td>
  279.                                                                                                                 </tr>
  280.                                                                                                             {% endif %}
  281.                                                                                                             <tr>
  282.                                                                                                                 <td colspan="2" class="TableDescription" itemprop="description">{{ product.description|raw }}</td>
  283.                                                                                                             </tr>
  284.                                                                                                         </tbody>
  285.                                                                                                     </table>
  286.                                                                                                 </div>
  287.                                                                                                 <div itemprop="brand" itemscope="" itemtype="https://schema.org/Brand">
  288.                                                                                                     <meta itemprop="name" content="SENSY">
  289.                                                                                                 </div>
  290.                                                                                                 <div itemprop="offers" itemscope="" itemtype="https://schema.org/Offer">
  291.                                                                                                     <meta itemprop="price" content="">
  292.                                                                                                     <meta itemprop="priceCurrency" content="EUR">
  293.                                                                                                     <link itemprop="availability" href="https://schema.org/InStock">
  294.                                                                                                     <meta itemprop="url" content="/{{ lang }}/{{ content.link_rewrite }}/{{ product.link_rewrite }}">
  295.                                                                                                 </div>
  296.                                                                                             </div>
  297.                                                                                         </div>
  298.                                                                                     </div>
  299.                                                                                 </div>
  300.                                                                             {% endfor %}
  301.                                                                         </div>
  302.                                                                     </div>
  303.                                                                 </div>
  304.                                                             </div>
  305.                                                         </div>
  306.                                                     </div>
  307.                                                 </div>
  308.                                             </div>
  309.                                         </div>
  310.                                     </div>
  311.                                 </div>
  312.                             </div>
  313.                         </div>
  314.                     </div>
  315.                 {% endif %}
  316.             {% endfor %}
  317.         </div>
  318.     </div>
  319. {% endblock %}