templates/default/product_overview.html.twig line 1

Open in your IDE?
  1. <html lang="de" style="font-size: 13px">
  2. <head>
  3.     <link rel="preconnect" href="https://fonts.googleapis.com">
  4.     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  5.     <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
  6.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
  7.     <link rel="stylesheet" href="https://unpkg.com/swiper@7/swiper-bundle.min.css" />
  9.     <link rel="stylesheet" type="text/css" href="/assets/css/bootstrap.min.css" />
  10.     <link rel="stylesheet" type="text/css" href="/assets/css/nice-select.css" />
  11.     <link rel="stylesheet" type="text/css" href="/assets/css/base.css" />
  12.     <link rel="stylesheet" type="text/css" href="/assets/css/media.css" />
  13. </head>
  14. <script>
  15. function inIframe () {
  16.     try {
  17.         return window.self !== window.top;
  18.     } catch (e) {
  19.         return true;
  20.     }
  21. }
  22. </script>
  23. <body>
  24.     <div class="loadercontainer">
  25.         <div class="loader">
  26.             <img src="/assets/img/loader.svg" />
  27.         </div>
  28.     </div>
  29.     <div class="container-fluid">
  30.         {# {{ dump(filters)  }} #}
  31.         <div class="row" style="padding: 0px 25px;">
  32.             {# FILTERS #}
  33.             <div class="col-sm-3 filterheading" style="border-bottom:1px solid #707070;">
  34.                 <div class="row">
  35.                     <div class="col-md-12 prheading" style="text-align:left;">
  36.                         FILTER
  37.                         <br>&nbsp;<br>
  38.                     </div>
  39.                 </div>
  40.             </div>
  42.             {# PRODUCTS #}
  43.             <div class="col-sm-9" style="border-bottom:1px solid #707070;">
  44.                 <div class="row">
  45.                     <div id="filtericon"><i class="fa fa-2x fa-filter" aria-hidden="true"></i></div>
  46.                     <div class="col-md-12 prheading filtersortcontainer" style="text-align:center">
  47.                         ARTIKEL
  48.                         <br>&nbsp;<br>
  49.                         <select id="sortselect" data-url="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial }}{{ filters.collection is defined ? "&collection="~filters.collection }}">
  50.                             <option value="actual" {{ filters.sort is defined and filters.sort == "actual" ? "selected" : "" }}>Aktuelle zuerst</option>
  51.                             <option value="priceasc" {{ filters.sort is defined and filters.sort == "priceasc" ? "selected" : "" }}>Niedrigster Preis</option>
  52.                             <option value="pricedesc" {{ filters.sort is defined and filters.sort == "pricedesc" ? "selected" : "" }}>Höchster Preis</option>
  53.                             <option value="name" {{ filters.sort is defined and filters.sort == "name" ? "selected" : "" }}>Artikelbezeichnung</option>
  54.                         </select>
  55.                     </div>
  56.                 </div>
  57.             </div>
  58.         </div>
  60.         <div class="row" style="padding: 0px 25px;">
  61.             {# FILTERS #}
  62.             {% if filters.brand is defined %}
  63.                 {% set brandid = filters.brand %}
  64.                 {% set brandpath = pimcore_object(brandid).geto_path %}
  65.             {% endif %}
  66.             {% if jewellerycat is defined and jewellerycat is not null %}
  67.                 {% set brandpath = jewellerycat.geto_path %}
  68.             {% endif %}
  69.             {% if "Schmuck" not in brandpath and (filters.brand is not defined or (filters.brand is defined and (filters.brand != 83 and filters.brand != 89 and filters.brand != 1933))) %}
  70.                 <div class="col-sm-3" style="padding: 0px;">
  71.                 <div class="filterContainer">
  72.                     <div class="col-md-12" style="border-right: 1px solid #707070; padding: 40px 20px; border-bottom: 1px solid #707070;">
  73.                         <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial }}">
  74.                         <p class="filterHeading">KOLLEKTIONEN</p>
  75.                         </a>
  76.                         <div class="collapsFilter"><i class="fas fa-minus"></i></div>
  77.                         
  78.                         <ul class="filterValues">
  79.                             {% set brandCollections = filters.brandCollections %}
  80.                             {% for collection in brandCollections %}
  81.                                 {% set productcount = collection.dependencies.requiredby|length %}
  82.                                 {% if productcount > 0 %}
  83.                                     <li {{ filters.collection is defined and filters.collection == collection.id ? 'class="active"' : '' }}>
  84.                                         <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined and filters.collection == collection.id ? '' : "&collection="~collection.id }}{{ filters.type is defined ? "&type="~filters.type : "" }}">{{ collection.title }}</a>
  85.                                     </li>
  86.                                 {% endif %}
  87.                             {% endfor %}
  88.                         </ul>
  89.                         
  90.                     </div>
  91.                     <div class="col-md-12" style="border-right: 1px solid #707070; padding: 40px 20px; border-bottom: 1px solid #707070;">
  92.                         <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial }}">
  93.                             <p class="filterHeading">TYP</p>
  94.                         </a>
  95.                         <div class="collapsFilter"><i class="fas fa-minus"></i></div>
  96.                         <ul class="filterValues">
  97.                             <li {{ filters.type is defined and filters.type == 195 ? 'class="active"' : '' }}>
  98.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined and filters.type == 195 ? '' : "&type=195" }}">Damenmodelle</a>
  99.                             </li>
  100.                             <li {{ filters.type is defined and filters.type == 194 ? 'class="active"' : '' }}>
  101.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined and filters.type == 194 ? '' : "&type=194" }}">Herrenmodelle</a>
  102.                             </li>
  103.                         </ul>
  104.                     </div>
  105.                     {# <div class="col-md-12" style="border-right: 1px solid #707070; padding: 40px 20px; border-bottom: 1px solid #707070;">
  106.                         <p class="filterHeading">UHRWERK</p>
  107.                         <div class="collapsFilter"><i class="fas fa-minus"></i></div>
  108.                         <ul class="filterValues">
  109.                             <li class="active">Automatik</li>
  110.                             <li>Manuell</li>
  111.                         </ul>
  112.                     </div> #}
  113.                     <div class="col-md-12" style="border-right: 1px solid #707070; padding: 40px 20px; border-bottom: 1px solid #707070;">
  114.                         
  115.                         <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}">
  116.                         <p class="filterHeading">GEHÄUSE</p>
  117.                         </a>
  118.                         <div class="collapsFilter"><i class="fas fa-minus"></i></div>
  119.                         <ul class="filterValues">
  120.                             <li {{ filters.casematerial is defined and filters.casematerial == 'gold' ? 'class="active"' : '' }}>
  121.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined and filters.casematerial == 'gold' ? '' : "&casematerial=gold" }}">Gold</a>
  122.                             </li>
  123.                             <li {{ filters.casematerial is defined and filters.casematerial == 'stahl' ? 'class="active"' : '' }}>
  124.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined and filters.casematerial == 'stahl' ? '' : "&casematerial=stahl" }}">Edelstahl</a>
  125.                             </li>
  126.                             <li {{ filters.casematerial is defined and filters.casematerial == 'keramik' ? 'class="active"' : '' }}>
  127.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined and filters.casematerial == 'keramik' ? '' : "&casematerial=keramik" }}">Keramik</a>
  128.                             </li>
  129.                             <li {{ filters.casematerial is defined and filters.casematerial == 'titan' ? 'class="active"' : '' }}>
  130.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined and filters.casematerial == 'titan' ? '' : "&casematerial=titan" }}">Titan</a>
  131.                             </li>
  132.                         </ul>
  133.                     </div>
  134.                     
  135.                     {% if debug is defined and debug == "true" %}
  136.                     <div class="col-md-12" style="border-right: 1px solid #707070; padding: 40px 20px; border-bottom: 1px solid #707070;">
  137.                         
  138.                         <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}">
  139.                         <p class="filterHeading">PREIS</p>
  140.                         </a>
  141.                         <div class="collapsFilter"><i class="fas fa-minus"></i></div>
  142.                         <ul class="filterValues">
  143.                             <li {{ filters.price is defined and filters.price == 'until2500' ? 'class="active"' : '' }}>
  144.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial : "" }}{{ filters.price is defined and filters.price == 'until2500' ? "" : "&price=until2500" }}"> € 2.500,-</a>
  145.                             </li>
  146.                             <li {{ filters.price is defined and filters.price == 'from2500until5000' ? 'class="active"' : '' }}>
  147.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial : "" }}{{ filters.price is defined and filters.price == 'from2500until5000' ? "" : "&price=from2500until5000" }}">€ 2.500,- bis € 5.000,-</a>
  148.                             </li>
  149.                             <li {{ filters.price is defined and filters.price == 'from5000until10000' ? 'class="active"' : '' }}>
  150.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial : "" }}{{ filters.price is defined and filters.price == 'from5000until10000' ? "" : "&price=from5000until10000" }}">€ 5.000,- bis € 10.000,-</a>
  151.                             </li>
  152.                             <li {{ filters.price is defined and filters.price == 'from100000until150000' ? 'class="active"' : '' }}>
  153.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial : "" }}{{ filters.price is defined and filters.price == 'from100000until150000' ? "" : "&price=from100000until150000" }}">€ 10.000,- bis € 15.000,-</a>
  154.                             </li>
  155.                             <li {{ filters.price is defined and filters.price == 'from15000until20000' ? 'class="active"' : '' }}>
  156.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial : "" }}{{ filters.price is defined and filters.price == 'from15000until20000' ? "" : "&price=from15000until20000" }}">€ 15.000,- bis € 20.000,-</a>
  157.                             </li>
  158.                             <li {{ filters.price is defined and filters.price == 'from20000' ? 'class="active"' : '' }}>
  159.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined ? "&collection="~filters.collection : "" }}{{ filters.type is defined ? "&type="~filters.type : "" }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial : "" }}{{ filters.price is defined and filters.price == 'from20000' ? "" : "&price=from20000" }}">> € 20.000,-</a>
  160.                             </li>
  161.                         </ul>
  162.                     </div>
  163.                     {% endif %}
  164.                     
  165.                 </div>
  166.             </div>
  167.             {% elseif brandpath == "/PIM/02 Schmuck/01 Marken/" %}
  168.                     <div class="col-sm-3" style="padding: 0px;">
  169.                         <div class="filterContainer">
  170.                             <div class="col-md-12" style="border-right: 1px solid #707070; padding: 40px 20px; border-bottom: 1px solid #707070;">
  171.                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial }}">
  172.                                 <p class="filterHeading">KOLLEKTIONEN</p>
  173.                                 </a>
  174.                                 <div class="collapsFilter"><i class="fas fa-minus"></i></div>
  175.                                 
  176.                                 <ul class="filterValues">
  177.                                     {% set brandCollections = filters.brandCollections %}
  178.                                     {% for collection in brandCollections %}
  179.                                         {% set productcount = collection.dependencies.requiredby|length %}
  180.                                         {% if productcount > 0 %}
  181.                                             <li {{ filters.collection is defined and filters.collection == collection.id ? 'class="active"' : '' }}>
  182.                                                 <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.collection is defined and filters.collection == collection.id ? '' : "&collection="~collection.id }}{{ filters.type is defined ? "&type="~filters.type : "" }}">{{ collection.title }}</a>
  183.                                             </li>
  184.                                         {% endif %}
  185.                                     {% endfor %}
  186.                                 </ul>
  187.                                 
  188.                             </div>
  189.                         </div>
  190.                     </div>
  191.             {% else %}
  192.                 <div class="col-sm-3" style="padding: 0px;"></div>
  193.             {% endif %}
  194.             {# PRODUCTS #}
  195.             <div class="col-sm-9">
  196.                 
  197.                 <div class="row">
  198.                     {% set counter = 0 %}
  199.                     {% for product in products %}
  200.                     {% set counter = counter + 1 %}
  201.                     <div class="col-md-4">
  202.                         <div class="productElement">
  203.                             <div class="productPicture openproduct" data-id="{{product.id}}/{{ product.brand.name|replace({" " : "-"}) }}/{{ product.model|replace({"/" : "-", " " : "-"}) }}/{{ product.articleNumber|replace({"/" : "-", " " : "-"}) }}" style="background-image:url('{{product.frontimage}}'); cursor:pointer">
  204.                             </div>
  205.                             <p class="prElHeading">{{product.model}}</p>
  206.                             {% if product.brand is defined and product.brand is not null %}
  207.                             <p class="prElSubHeading">{{product.brand.name}}</p>
  208.                             {% else %}
  209.                             {# {{dump(product.id)}}     #}
  210.                             {% endif %}
  211.                             
  212.                             {# <a href="/produkt/{{product.id}}"> #}
  213.                                 <button class="primary openproduct" data-id="{{product.id}}/{{ product.brand.name|replace({" " : "-"}) }}/{{ product.model|replace({"/" : "-", " " : "-"}) }}/{{ product.articleNumber|replace({"/" : "-", " " : "-"}) }}" style="margin-top:15px">MEHR ERFAHREN</button>
  214.                             {# </a> #}
  215.                         </div>
  216.                     </div>
  217.                     {% if counter % 3 == 0 %}
  218.                         </div>
  219.                         <div class="row">
  220.                     {% endif %}
  221.                     {% endfor %}
  222.                     
  223.                 </div>
  224.                 
  225.                 <div class="row">
  226.                     <div class="spacer-md">
  227.                     </div>
  228.                 </div>
  229.                 
  230.                 {% if filters.page is defined and filters.page is not null %}
  231.                 <div class="row">
  232.                     <div class="col-md-2"></div>
  233.                     <div class="col-md-8" style="text-align:center;">
  234.                         <a href="/productoverview?{{ filters.brand is defined ? "brand="~filters.brand : "" }}{{ filters.type is defined ? "&type="~filters.type }}{{ filters.casematerial is defined ? "&casematerial="~filters.casematerial }}{{ filters.collection is defined ? "&collection="~filters.collection }}{{ filters.sort is defined ? "&sort="~filters.sort }}"><button class="primary">MEHR ANZEIGEN</button></a>
  235.                     </div>
  236.                     <div class="col-md-2"></div>
  237.                 </div>
  238.                 {% endif %}    
  239.             </div>
  240.         </div>
  242.         <div class="row">
  243.             <div class="spacer-md">
  244.             </div>
  245.         </div>
  247.     </div>
  248.     <script>
  249.         window.onload = function() {
  250.             document.getElementsByClassName('loadercontainer')[0].style.visibility = 'hidden';
  251.         }
  252.     </script>
  253.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  254.     <script src="https://unpkg.com/swiper@7/swiper-bundle.min.js"></script>
  255.     <script src="/assets/js/bootstrap.min.js"></script>
  256.     <script src="/assets/js/jquery.nice-select.js"></script>
  257.     <script src="/assets/js/base.js"></script>
  258. </body>
  260. </html>