custom/plugins/XioniXconfig/src/Resources/views/storefront/page/product-detail/buy-widget.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/page/product-detail/buy-widget.html.twig' %}
  3. {% block page_product_detail_buy_form %}
  4. {% endblock %}
  6. {% block page_product_detail_price %}
  7. {% set has_config = page.extensions.is_xconfig.has_configuration %}
  8. {% sw_include '@XioniXconfig/storefront/page/product-detail/x_breadcrumb.html.twig' with { context: context, category: page.product.seoCategory } only %}
  9.     <div class="x-product-detail-tabs">
  10.         <div class="x-product-detail-tab tab-price">
  11.             <button class="tab-button tab-active" type="button" value="price">Preis</button>
  12.         </div>
  13.         <div class="x-product-detail-tab tab-info">
  14.             <button class="tab-button" type="button" value="info">Kontakt</button>
  15.         </div>
  16.         <div class="x-product-detail-tab tab-manufacturer">
  17.             <button class="tab-button" type="button" value="manufacturer">Mengen %</button>
  18.         </div>
  19.     </div>
  20.     <div class="product-detail-tab-content" id="tab-price">
  21.         <div class="product-detail-price-container">
  22.             {% if page.product.productNumber %}
  23.                 <div class="product-detail-ordernumber-container">
  24.                     {% block page_product_detail_ordernumber_label %}
  25.                         <span class="product-detail-ordernumber-label">
  26.                             {{ "detail.productNumberLabel"|trans|sw_sanitize }}
  27.                         </span>
  28.                     {% endblock %}
  30.                     {% block page_product_detail_ordernumber %}
  31.                         <meta itemprop="productID"
  32.                               content="{{ page.product.id }}"/>
  33.                         <span class="product-detail-ordernumber"
  34.                               itemprop="sku">
  35.                             {{ page.product.productNumber }}
  36.                         </span>
  37.                     {% endblock %}
  38.                 </div>
  39.             {% endif %}    
  40.             <h1 class="x-product-atricle-name">{{ page.product.translated.name }}</h1>
  41.             <div class="netto-container">
  42.                 <div class="price-detail-netto-headline">Netto</div>
  43.                 {% sw_include '@Storefront/storefront/page/product-detail/buy-widget-price.html.twig' %}
  44.             </div>
  45.             <div class="brutto-container">
  46.                 <div class="price-detail-brutto-headline">Brutto</div>
  47.                 {% set brutto_price = page.product.calculatedPrice.unitPrice*1.19 %}
  48.                 <div class="product-detail-price-brutto">
  49.                     <span class="brutto-price-number">{{ brutto_price|currency }}</span> inkl. MwSt. inkl. Versandkosten
  50.                 </div>
  51.             </div>
  52.             <div class="product-detail-tax-container">
  53.                 {% if context.taxState == "gross" %}
  54.                     {% set taxText = "general.grossTaxInformation"|trans|sw_sanitize %}
  55.                 {% else %}
  56.                     {% set taxText = "general.netTaxInformation"|trans|sw_sanitize %}
  57.                 {% endif %}
  59.                 <p class="product-detail-tax">
  60.                     {% block page_product_detail_tax_link %}
  61.                         <a class="product-detail-tax-link"
  62.                            href="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}"
  63.                            title="{{ taxText }}"
  64.                            data-toggle="modal"
  65.                            data-url="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}">
  66.                             {{ taxText }}
  67.                         </a>
  68.                     {% endblock %}
  69.                 </p>
  70.             </div>
  71.             <div class="product-detail-delivery-information">
  72.             {% if page.product.productNumber == "TESTHEMD37001" %}
  73.                 <div class="dpp-title">
  74.                 <h2>DPP</h2>
  75.                 <p id="dpp_link">Link:</p>
  76.                 </div>
  77.             {% endif %}                 
  78.                 {% sw_include '@Storefront/storefront/component/delivery-information.html.twig' %} <p>Lieferzeit</p>
  79.             </div>
  80.             {% if page.product.productNumber == "parking3000" %}
  81.                 <p class="product-detail-start-add-hint"><span style="font-weight: bold">Hinweis:</span><br> Für die elektrischen Schranken empfehlen wir eine persönliche Beratung durch unsere Experten! 
  82.                 Sie sind Ihnen ebenso behilflich bei der Auswahl von Zubehör. Kontaktieren Sie uns direkt unter +49 (0) 2373 17809-0 oder per <a target="_blank" href="https://poller24.de/Shop-Service/Kontakt/">Kontaktformular</a>. 
  83.                 Gern können Sie auch erste Fragen im Konfigurator beantworten und uns Ihre Anfrage senden.</p>
  84.                 <span id="xconfig_start_description" style="font-weight: bold"></span>                
  85.             {% endif %}                 
  86.         </div>
  87.         {% if has_config %}
  88.         <div id="xconfig">
  89.             <div id="xconfig_body">
  90.             </div>
  91.             <div id="xconfig_footer">
  92.             </div>
  93.         </div>
  94.         {% endif %}
  95.         <div class="xconfig_end_block">
  96.             {% if has_config %}
  97.             <div class="x-chosen-article-box">
  98.                 <div class="table-detail-headline">Ausgewählte Produktvariante</div>
  99.                 <div class="x-chosen-article">
  100.                 Ausführung:
  101.                 <span class="xconfig_description"></span>
  102.                 </div>
  103.             </div>
  104. <!--             <div class="xprice_block">
  105.                 <div class="x-chosen-article-box">
  106.                     <div class="table-detail-headline">Übersicht</div>
  107.                     <div class="x-chosen-article">
  108.                     Ausführung:
  109.                     <span class="xconfig_description"></span>
  110.                     </div>
  111.                 </div> 
  112.             </div> -->
  113.             {% endif %}
  114.             <div class="col-14 x-buy-field" {% if not has_config %} style="position:inherit!important" {% endif %}>
  115.                 <div class="col-4 x-select" style="margin-right:0px!important">
  116.                     <select class="custom-select">
  117.                     {% for quantity in range(page.product.minPurchase, page.product.calculatedMaxPurchase, page.product.purchaseSteps) %}
  118.                         <option value="{{ quantity }}">
  119.                             {{ quantity }}
  120.                             {% if quantity == 1 %}
  121.                                 {% if page.product.translated.packUnit %} {{ page.product.translated.packUnit }}{% endif %}
  122.                             {% else %}
  123.                                 {% if page.product.translated.packUnitPlural %}
  124.                                     {{ page.product.translated.packUnitPlural }}
  125.                                 {% elseif page.product.translated.packUnit %}
  126.                                     {{ page.product.translated.packUnit }}
  127.                                 {% endif %}
  128.                             {% endif %}
  129.                         </option>
  130.                     {% endfor %}
  131.                     </select>  
  132.                 </div>
  133.             <div class="col-8 x-buttons">
  134.                     <button id="cart_primary" form="productDetailPageBuyProductForm" class="btn btn-primary btn-block btn-buy"
  135.                             title="{{ "detail.addProduct"|trans|striptags }}"
  136.                             aria-label="{{ "detail.addProduct"|trans|striptags }}">
  137.                         {{ "detail.addProduct"|trans|sw_sanitize }}
  138.                     </button>
  139.                     <a href="mailto:m.wette@pse-technik.de?subject=Anfrage für {{ page.product.translated.name }}&body=Ihr Firmenname: %0D%0A %0D%0A Ihr Vor- und Nachname: %0D%0A %0D%0A Ihre Telefonnummer: %0D%0A %0D%0A Ihre Nachricht: %0D%0A" id="detail-config-request" class="btn btn-primary btn-block btn-buy">
  140.                         Produkt anfragen {% sw_icon "envelope" %}</a>
  141.                     </a>
  142.             </div>   
  143.                 <div class="x-calc-table">
  144.                       <div class="x-calc-table-firstrow">
  145.                         <div class="x-calc-table-row1">Artikel</div>
  146.                         <div class="x-calc-table-row2">Menge</div>
  147.                         <div class="x-calc-table-row3">Preis</div>
  148.                         <div class="x-calc-table-row4"></div>
  149.                       </div>
  150.                       <div class="x-calc-table-secondrow lchline">
  151.                         <div class="x-calc-table-row1">{{ page.product.translated.name }}</div>
  152.                         <div id="x-main-article-qty" class="x-calc-table-row2">1</div>
  153.                         <div id="x-main-article-price" class="x-calc-table-row3">{{ page.product.calculatedPrice.unitPrice|currency }}*</div>
  154.                       </div>
  155.                 </div> 
  156.                 <div class="xprice-netto-row">
  157.                     <div class="price-detail-netto-headline-table">Gesamtpreis Netto</div>
  158.                     <div class="x-full-price">{{ page.product.calculatedPrice.unitPrice|currency }}*</div>
  159.                 </div>
  160.                 <div class="xprice-brutto-row">
  161.                     <div class="price-detail-brutto-headline-table">Gesamtpreis Brutto</div>
  162.                     <div class="x-full-price-brutto">{{ brutto_price|currency }}</div>
  163.                 </div>
  164.                 <div class="product-detail-tax-container-table">
  165.                     {% if context.taxState == "gross" %}
  166.                         {% set taxText = "general.grossTaxInformation"|trans|sw_sanitize %}
  167.                     {% else %}
  168.                         {% set taxText = "general.netTaxInformation"|trans|sw_sanitize %}
  169.                     {% endif %}
  171.                     <p class="product-detail-tax">
  172.                         <a class="product-detail-tax-link"
  173.                            href="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}"
  174.                            title="{{ taxText }}"
  175.                            data-toggle="modal"
  176.                            data-url="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}">
  177.                             {{ taxText }}
  178.                         </a>
  179.                     </p>
  180.                 </div>
  181.             </div>
  182.         {% if page.product.active %}
  183.             <div class="product-detail-form-container">
  184.                 {% sw_include '@Storefront/storefront/page/product-detail/buy-widget-form.html.twig' %}
  185.             </div>
  186.             <div class="product-detail-accessory-form-container">
  187.                 {% sw_include '@Storefront/storefront/page/product-detail/buy-widget-form-accessory.html.twig' %}
  188.             </div>    
  189.         {% endif %}
  190.         </div> 
  191.     </div>    
  192.     <div class="product-detail-tab-content" id="tab-info">
  193.         <p class="tab-info-headline">Ihre Ansprechpartner</p>
  194.         {% if page.product.productNumber == "parking" || page.product.productNumber == "industrial" ||
  195.         page.product.productNumber == "koloss" || page.product.productNumber == "solar" || page.product.productNumber == "parking3000" %}
  196.         <div class="tab-info-personcard">
  197.             <div class="tab-info-personcard-image">
  198.                 <img class="personcard-image" alt="Dubravka Bukna - Service, Wartung und Reparatur Bereich Absperrtechnik" src="/media/c9/6a/6e/1677056857/dubravka_bukna.jpg" alt="Frau Bukna" title="Frau Bukna">
  199.             </div>
  200.             <div class="tab-info-personcard-description">
  201.                 <p class="tab-info-personcard-description-name">Dubravka Bukna</p>
  202.                 <p class="tab-info-personcard-description-title">Ansprechpartner Absperrtechnik</p>
  203.                 <p class="tab-info-personcard-description-phone"><a title="+49 (0) 2373 17809-15" href="tel:+4923731780915">+49 (0) 2373 17809-15<br></a></p>
  204.                 <p class="tab-info-personcard-description-mail"><a title="E-Mail-Adresse Dubravka Bukna" href="mailto:d.bukna@pse-technik.de" target="_blank">d.bukna@pse-technik.de</a></p>
  205.             </div>
  206.         </div>
  207.         <div class="tab-info-personcard">
  208.             <div class="tab-info-personcard-image">
  209.                 <img class="personcard-image" alt="Sebastian Toth - Bereich Absperrtechnik/Zutrittskontrolle" src="/media/90/ef/af/1677056857/sebastian_toth.jpg" alt="Herr Toth" title="Herr Toth">
  210.             </div>
  211.             <div class="tab-info-personcard-description">
  212.                 <p class="tab-info-personcard-description-name">Sebastian Toth</p>
  213.                 <p class="tab-info-personcard-description-title">Ansprechpartner Absperrtechnik/Zutrittskontrolle</p>
  214.                 <p class="tab-info-personcard-description-phone"><a title="+49 (0) 2373 17809-10" href="tel:+4923731780910">+49 (0) 2373 17809-10<br></a></p>
  215.                 <p class="tab-info-personcard-description-mail"><a title="E-Mail-Adresse Sebastian Toth" href="mailto:s.toth@pse-technik.de" target="_blank">s.toth@pse-technik.de</a></p>
  216.             </div>
  217.         </div>        
  218.         {% else %}
  219.         <div class="tab-info-personcard">
  220.             <div class="tab-info-personcard-image">
  221.                 <img class="personcard-image" alt="Marion Wette - Produktmanagerin" src="/media/5f/67/80/1647334115/frau_wette.jpg" alt="Frau Wette" title="Frau Wette">
  222.             </div>
  223.             <div class="tab-info-personcard-description">
  224.                 <p class="tab-info-personcard-description-name">Marion Wette</p>
  225.                 <p class="tab-info-personcard-description-title">Produktmanagerin</p>
  226.                 <p class="tab-info-personcard-description-phone"><a title="+49 (0) 2373 17809-11" href="tel:+4923731780911">+49 (0) 2373 17809-11<br></a></p>
  227.                 <p class="tab-info-personcard-description-mail"><a title="E-Mail-Adresse Marion Wette" href="mailto:m.wette@pse-technik.de" target="_blank">m.wette@pse-technik.de</a></p>
  228.             </div>
  229.         </div>
  230.         <div class="tab-info-personcard">
  231.             <div class="tab-info-personcard-image">
  232.                 <img class="personcard-image" alt="Christian Preuß - Produktmanager" src="/media/f9/f0/29/1647334352/herr_preuss.jpg" alt="Herr Preuß" title="Herr Preuß">
  233.             </div>
  234.             <div class="tab-info-personcard-description">
  235.                 <p class="tab-info-personcard-description-name">Christian Preuß</p>
  236.                 <p class="tab-info-personcard-description-title">Produktmanager</p>
  237.                 <p class="tab-info-personcard-description-phone"><a title="+49 (0) 2373 17809-0" href="tel:+492373178090">+49 (0) 2373 17809-0
  238.                 </a></p>
  239.                 <p class="tab-info-personcard-description-mail"><a title="E-Mail-Adresse Christian Preuß" href="mailto:c.preuss@pse-technik.de" target="_blank">c.preuss@pse-technik.de</a><a title="+49 (0) 2373 17809-0" href="tel:+492373178090"></a></p>
  240.             </div>
  241.         </div>
  242.         {% endif %}
  243.         <div class="tab-info-personcard">
  244.             <div class="tab-info-personcard-image">
  245.                 <img class="personcard-image" alt="Florian Thier (Leiter Vetriebsinnendienst)" src="/media/cb/50/82/1647334507/herr_thier.jpg" alt="Herr Thier" title="Herr Thier">
  246.             </div>
  247.             <div class="tab-info-personcard-description">
  248.                 <p class="tab-info-personcard-description-name">Florian Thier</p>
  249.                 <p class="tab-info-personcard-description-title">Leiter Vetriebsinnendienst</p><p class="tab-info-personcard-description-phone"><a title="+49 (0) 2373 17809-0" href="tel:+492373178090">+49 (0) 2373 17809-0</a></p>
  250.                 <p class="tab-info-personcard-description-mail"><a title="E-Mail-Adresse Florian Thier" href="mailto:f.thier@pse-technik.de">f.thier@pse-technik.de</a><a title="+49 (0) 2373 17809-0" href="tel:+492373178090"></a></p>
  251.             </div>
  252.         </div>
  253.     </div>
  254.     
  255.     <div class="product-detail-tab-content" id="tab-manufacturer">
  256.         <p class="tab-info-headline">Fragen Sie unverbindlich die aktuellen Staffelpreise und Mengenrabatte für diesen Artikel an.</p>
  257.         <p></p>
  258.         <div class="discount-button-container">
  259.             <a href="mailto:m.wette@pse-technik.de?subject=Anfrage%20Mengenrabatt%20/%20Staffelpreise%20für%20Artikel%20{{ page.product.translated.name }} &amp;body=Guten%20Tag,%0D%0A%0D%0AAnfrage%20zu%20Artikel%20{{ page.product.translated.name }}.%0D%0A%0D%0AGewünschte%20Menge:">
  260.                 <button class="btn btn-primary btn-block btn-discount">E-Mail Anfrage stellen</button> 
  261.             </a>
  262.         </div>
  263.     </div>
  264.     {% if page.product.productNumber == "SchrankeS" || page.product.productNumber == "parking" || page.product.productNumber == "industrial" ||
  265.      page.product.productNumber == "koloss" || page.product.productNumber == "solar" %}
  266.     <script>
  267.         $("#cart_primary").hide();
  268.         $(".x-calc-table").hide();
  269.         $(".xprice-netto-row").hide();
  270.         $(".xprice-brutto-row").hide();
  271.         $(".x-select").hide();
  272.         $(".product-detail-tax-container-table").hide();
  273.         $(".netto-container").html('<meta itemprop="price" content="0"><p class="product-detail-price">Preis auf Anfrage</p><p>Wir erstellen Ihnen gern ein Angebot. Einfach konfigurieren und Produktberatung anfragen! Weitere Details klären wir in einem persönlichen Gespräch.</p>');
  274.         $(".netto-container").css({"float": "inherit", "width": "100%"});
  275.         //$(".netto-container").hide();
  276.         $(".brutto-container").hide();
  277.         $(".product-detail-delivery-information").hide();
  278.         $(".product-detail-tax-container").hide();
  279.         $(".xconfig_start_block").hide();
  280.         $(".x-chosen-article-box").hide();
  281.         $(".product-detail-ordernumber-container").hide();
  282.         $(".manufacturer-website").hide();
  283.         $("#detail-config-request").attr('href', 'mailto:d.bukna@pse-technik.de?subject=Anfrage für {{ page.product.translated.name }}&body=Ihr Firmenname: %0D%0A %0D%0A Ihr Vor- und Nachname: %0D%0A %0D%0A Ihre Telefonnummer: %0D%0A %0D%0A Ihre Nachricht: %0D%0A');
  284.         $( document ).ready(function() {
  285.             $("#x-order-tab").hide();
  286.         });
  288.     </script>
  289.     {% endif %}
  290.     {% if page.product.productNumber == "parking3000" %}
  291.     <script>
  292.         $("#detail-config-request").attr('href', 'mailto:d.bukna@pse-technik.de?subject=Anfrage für {{ page.product.translated.name }}&body=Ihr Firmenname: %0D%0A %0D%0A Ihr Vor- und Nachname: %0D%0A %0D%0A Ihre Telefonnummer: %0D%0A %0D%0A Ihre Nachricht: %0D%0A');
  293.         $(".manufacturer-website").hide();
  294.         $(".xconfig_start_block").hide();
  295.         $(".x-chosen-article-box").hide();
  296.     </script>
  297.     {% endif %}    
  298.     <script>
  299.     var groupIds     = new Array();
  300.     var groupValues    = new Array();
  301.     var start_variant = getSearchParams("xconfig");
  302.     var preconf = getSearchParams("preconf");
  303.     var num            = 0;    
  304.     var original_price = $(".product-detail-price").html();
  305.     var brutto_price = $(".product-detail-price-brutto").html();
  306.     var productnumber = "{{ page.product.productNumber }}";
  307.     var currency = "{{ context.currency.isoCode }}";                                                
  308.     var main_price = 0;
  309.     {% if not has_config %}
  310.     main_price = {{ page.product.calculatedPrice.unitPrice }};
  311.     {% endif %}
  312.     $( ".tab-button" ).click(function() {
  313.         var tab = $(this).attr("value");
  314.         $( ".tab-button" ).removeClass("tab-active");
  315.         $(this).addClass("tab-active");
  316.         $( ".product-detail-tab-content" ).css("display", "none");
  317.         $( "#tab-"+tab ).css("display", "block");
  318.         if (tab != "price") {
  319.             $( ".product-detail-form-container" ).hide();
  320.         } else {
  321.             $( ".product-detail-form-container" ).show();
  322.         }
  323.     });
  324.     
  325.     $( document ).ready(function() {
  326.         $.getScript("https://xconfig003.com/mvc_structure2/assets/js/jquery-ui.js", function() { 
  327.             getConfiguration(0, productnumber, groupIds, groupValues, start_variant);             
  328.         }); 
  329.         
  330.         $(".x-accessory-container:first .x-accessory-bottom-container").show(); 
  332.         $(".x-accessory-top-header-container").click(function () {
  333.             $(this).next(".x-accessory-bottom-container").slideToggle("slow");
  334.             $(".x-accessory-bottom-container").not($(this).next()).slideUp("slow");
  335.         }); 
  336.         
  337.          
  338.         $(".x-tab-accessory-top-header-container").click(function () {
  339.                 $(this).next(".x-tab-accessory-bottom-container").slideToggle("slow");
  340.             $(".x-tab-accessory-bottom-container").not($(this).next()).slideUp("slow");
  341.         }); 
  342.     });
  343.     
  344.     function getConfiguration(id, productnumber, option_ids, value_ids, start_variant) {
  345.         $.ajax({
  346.             url:"https://xconfig003.com/mvc_structure2/get_configuration_poller_new_config_DEV.php",
  347.             type:'POST',
  348.             dataType: 'json',
  349.             data: { id: id, productnumber: productnumber, option_ids: option_ids, value_ids: value_ids , start_variant: start_variant},
  350.             success: function(data){
  351.                 var main_tpl = decodeURIComponent(escape(window.atob(data.config_main_tpl)));
  352.                 var footer_tpl = decodeURIComponent(escape(window.atob(data.config_footer_tpl)));
  353.                 $('#xconfig_body').html(main_tpl);
  354.                 $('#xconfig_footer').html(footer_tpl);
  355.                 $('#xconfigDesc').val(data.config_description);
  356.                 var buy_btn = $('.btn-buy');
  357.                 var text = data.config_description;
  358.                 //text = text.replace("$$", "");
  359.                 //var newchar = ", %0D%0A";
  360.                 //text = text.split("$$").join(newchar);
  361.                 text = text.replaceAll(",", ", %0D%0A");
  362.                 if (text != "") {
  363.                     if (productnumber == "SchrankeS" || productnumber == "parking" || productnumber == "industrial" ||
  364.                         productnumber == "koloss" || productnumber == "solar" || productnumber == "parking3000") {
  365.                         $("#detail-config-request").attr('href',"mailto:d.bukna@pse-technik.de?subject=Anfrage für {{ page.product.translated.name }}&body=Ihr Firmenname: %0D%0A %0D%0A Ihr Vor- und Nachname: %0D%0A %0D%0A Ihre Telefonnummer: %0D%0A %0D%0A Ihre Konfiguration: %0D%0A"+ text + "%0D%0A Ihre Nachricht: %0D%0A");
  366.                     } else {
  367.                         $("#detail-config-request").attr('href',"mailto:m.wette@pse-technik.de?subject=Anfrage für {{ page.product.translated.name }}&body=Ihr Firmenname: %0D%0A %0D%0A Ihr Vor- und Nachname: %0D%0A %0D%0A Ihre Telefonnummer: %0D%0A %0D%0A Ihre Konfiguration: %0D%0A"+ text + "%0D%0A Ihre Nachricht: %0D%0A");
  368.                     }
  369.                     if (productnumber == "parking3000") {
  370.                         $("#cart_primary").hide();
  371.                         $(".x-calc-table").hide();
  372.                         $(".xprice-netto-row").hide();
  373.                         $(".xprice-brutto-row").hide();
  374.                         $(".x-select").hide();
  375.                         $(".product-detail-tax-container-table").hide();
  376.                         $(".netto-container").html('<p class="product-detail-price">Preis auf Anfrage</p><p>Wir erstellen Ihnen gern ein Angebot. Einfach konfigurieren und Produktberatung anfragen! Weitere Details klären wir in einem persönlichen Gespräch.</p>');
  377.                         $(".netto-container").css({"float": "inherit", "width": "100%"});
  378.                         //$(".netto-container").hide();
  379.                         $(".brutto-container").hide();
  380.                         $(".product-detail-delivery-information").hide();
  381.                         $(".product-detail-tax-container").hide();
  382.                         $(".xconfig_start_block").hide();
  383.                         $(".x-chosen-article-box").hide();
  384.                         $(".product-detail-ordernumber-container").hide();
  385.                         $(".manufacturer-website").hide();
  386.                         $( document ).ready(function() {
  387.                             $("#x-order-tab").hide();
  388.                         });                        
  389.                     }                    
  390.                 }
  391.                 value_ids.forEach (function (value_id, index) {
  392.                     if (value_id) {
  393.                         $( ".config--has-summary" ).show();
  394.                     }               
  395.                 });
  396.                 if(value_ids.length == 0) {
  397.                     $( ".config--has-summary" ).hide();
  398.                     if (preconf !== undefined) {
  399.                         searchAndTrigger(preconf);
  400.                     }                    
  401.                 }
  402.                 if(data.config_complete) {
  403.                     buy_btn.removeAttr('disabled');
  404.                 } else {
  405.                     buy_btn.attr('disabled', 'disabled');
  406.                 }
  407.                 if(productnumber == "TESTHEMD37001") {
  408.                     $("#dpp_link").html('Link: <a target="_blank" href="'+ data.dpp + '">Zum Produktpass</a>'); 
  409.                 }
  410.                 //if (data.variant_product_productnumber != null) {
  411.                 //    $("#xconfigProductNumber").html(data.variant_product_productnumber;
  412.                 //}
  413.                 //if (data.variant_product_ean != null) {
  414.                 //    $("#xconfigEan").html(data.variant_product_ean;
  415.                 //}
  416.                 var buy_form = $("#productDetailPageBuyProductForm");
  417.                 buy_form.attr("action", "/checkout/xconfig-line-item/add");
  418.                 if (productnumber != "parking3000") {
  419.                     if (data.variant_product_price1.raw != null) {
  420.                         main_price = data.variant_product_price1.raw;
  421.                         if (currency == "CHF") {
  422.                             $(".product-detail-price").html(data.variant_product_price1_chf.formatted);
  423.                             $("#x-main-article-price").html(data.variant_product_price1_chf.formatted);
  424.                             $(".product-detail-price-brutto").html("<span class='brutto-price-number'>" + data.variant_product_price1_brutto_chf.formatted + "</span><br>inkl. MwSt.");                   
  425.                         } else {
  426.                             $(".product-detail-price").html(data.variant_product_price1.formatted);
  427.                             $("#x-main-article-price").html(data.variant_product_price1.formatted);
  428.                             $(".product-detail-price-brutto").html("<span class='brutto-price-number'>" + data.variant_product_price1_brutto.formatted + "</span><br>inkl. MwSt.");
  429.                         }
  430.                         calcprice();
  431.                     }
  432.                 }
  433.                 $(".xconfig_description").html(data.config_product_description);
  434.                 // if (data.variant_product_media != "") {
  435.                     // var gallery_image = $(".gallery-slider-image").first();
  436.                     // $('#xconfigMedia').val(data.variant_product_media[0].media_path);
  437.                     // gallery_image.attr("src", data.variant_product_media[0].media_path.replace(/ /g, '%20'));
  438.                     // gallery_image.attr("srcset", data.variant_product_media[0].media_path.replace(/ /g, '%20')+" 1921w, "+data.variant_product_media[0].media_path.replace(/ /g, '%20')+" 1920w, "+data.variant_product_media[0].media_path.replace(/ /g, '%20')+" 800w, "+data.variant_product_media[0].media_path.replace(/ /g, '%20')+" 400w");
  439.                     // gallery_image.attr("data-full-image", data.variant_product_media[0].media_path.replace(/ /g, '%20'));
  440.                     // $( ".product-media-append" ).hide();
  441.                 // } else {
  442.                 //if(data.config_complete) {
  443.                 //    $( ".product-media-append" ).show();
  444.                 //} else {
  445.                 //    $( ".product-media-append" ).hide();
  446.                 //}
  447.                 
  448.                 // }
  449.                 if (productnumber == "SchrankeS" || productnumber == "parking" || productnumber == "industrial" ||
  450.                     productnumber == "koloss" || productnumber == "solar" || productnumber == "parking3000") {
  451.                 
  452.                 } else {
  453.                     var item_pdf = "";
  454.                     if (data.variant_product_media != "") {
  455.                         data.variant_product_media.forEach(function(item){
  456.                             if(item.media_path.includes('pdf')) {
  457.                                 item_pdf = item_pdf +  '<a class="pdf-media-download" target="_blank" rel="noopener noreferrer" href="'+ item.media_path +'">Download: '+ item.media_name +'.pdf</a> <br />';  
  458.                             }
  459.                         });
  460.                         $("#pdf-media").html(item_pdf);                
  461.                     }
  462.                     if (item_pdf == "") {
  463.                         $("#pdf-media").html('Leider gibt es für diesen Artikel bzw. für die von Ihnen gewählte Variante bisher keine Datenblätter. Sie können jedoch unter 0 23 73 / 1 78 09-11 oder <a href="mailto:m.wette@pse-technik.de" target="_self">m.wette@pse-technik.de</a> bei Frau Wette eine Anfrage für ein Datenblatt stellen oder weitere Informationen zu diesem Produkt einholen.');
  464.                     }
  465.                 }
  466.                 if(data.variant_product_start_config.values != "" && data.variant_product_start_config.options != "") {
  467.                     $("#xStartGroupValues").val(data.variant_product_start_config.values);
  468.                     $("#xStartGroupIds").val(data.variant_product_start_config.options); 
  469.                     $("#xconfig_start_description").html(data.variant_product_start_config_description);
  470.                     $('#xconfigStartDesc').val(data.variant_product_start_config_description);                    
  471.                     $('#startCartBtn').removeAttr('disabled');
  473.                     $("#xGroupIds").val(data.variant_product_start_config.values);
  474.                     $("#xGroupValues").val(data.variant_product_start_config.options); 
  475.                     $('#xconfigDesc').val(data.variant_product_start_config_description);                    
  476.                     buy_btn.removeAttr('disabled');                    
  477.                 } else {
  478.                     $('#startCartBtn').attr('disabled', 'disabled');
  479.                     $('.xconfig_start_block').hide();
  480.                 }
  481.                 if (main_tpl == "") {
  482.                     $('#startCartBtn').hide();
  483.                     $('.xconfig_start_block').hide();
  484.                 }
  485.                 //$(".accessory-hidden-input-id").each(function(e){
  486.                 //    this.value = data.variant_id + $(this).attr("originalid");
  487.                 //});
  488.                 $('.x-accessory-item-container').hide();
  489.                 $('.x-accessories-headline').hide();
  490.                 
  491.                 // if (data.product_accessories != "") {
  492.                     // //$('.x-accessory-item-container').hide();
  493.                     // data.product_accessories.forEach(function(item){
  494.                         // var product_number = item.product.base.product_number;
  495.                         // product_number = product_number.replace(".", "_")
  496.                         // $('#accessory_'+product_number).show();
  497.                         // $('.x-accessories-headline').show();
  498.                     // });
  499.                 // }
  500.                 
  501.                 if (data.variant_product_accessories != "") {
  502.                     //$('.x-accessory-item-container').hide();
  503.                     data.variant_product_accessories.forEach(function(item){
  504.                         var product_number = item.product.base.product_number;
  505.                         product_number = product_number.replace(".", "_")
  506.                         $('#accessory_'+product_number).show();
  507.                         $('.x-accessories-headline').show();
  508.                     });
  509.                 }                
  510.                 // if (data.variant_product_accessories == "" || data.product_accessories == "") {
  511.                     // $('.x-accessories-headline').hide();
  512.                     // $('.x-accessory-item-container').hide();
  513.                 // }
  514.                 $("#xVariantId").val(data.variant_id);
  515.                 $(".accessory-variant-id").val(data.variant_id);
  516.                 
  517.                 if (productnumber == "SchrankeS" || productnumber == "parking" || productnumber == "industrial" ||
  518.                     productnumber == "koloss" || productnumber == "solar") {
  519.                     $(".product--headline").html("Konfigurieren Sie jetzt Ihre Anfrage:");
  520.                 }
  521.                 
  522.                 if (productnumber == "parking3000") {
  523.                     $(".product--headline").html("Konfigurieren Sie jetzt Ihren Anfrage:");
  524.                     buy_btn.removeAttr('disabled');
  525.                 }
  526.                 var steps = value_ids.filter(obj => obj != "").length;
  527.                 if (steps != 0) {
  528.                     gtag('event', 'Konfigurator: '+productnumber, {'event_category': 'configuration','event_label': 'Schritt:'+steps,'value': true});
  529.                     //gtag('event', 'Konfigurator: '+productnumber, {
  530.                     //  'SCHRITT': steps
  531.                     //});                    
  532.                 }                 
  533.             }
  534.         });    
  535.     }    
  536.     
  537.     function submitXData() {
  538.         $("#xconfig_body :input[name^='group']").each(function(e){
  539.             if(this.type == "hidden" || this.type == "text")
  540.             {
  541.                 string = this.name;
  542.                 string = string.substring(string.lastIndexOf("[")+1,string.lastIndexOf("]"));
  543.                 groupIds[num] = string;
  544.                 groupValues[num] = this.value;
  545.                 num++;
  546.             }
  547.         });
  549.         $("#xGroupIds").val(groupIds);
  550.         $("#xGroupValues").val(groupValues);
  551.         
  552.         getConfiguration(0, productnumber, groupIds, groupValues);
  553.         
  554.         groupIds = [];
  555.         groupValues = [];
  556.         num = 0;
  558.         return false;
  559.     }
  560.     function getSearchParams(k){
  561.         var p={};
  562.         location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){p[k]=v})
  563.         return k?p[k]:p;
  564.     }                                
  565.     
  566.     function submitRestart() {
  567.         var groupIds     = new Array();
  568.         var groupValues = new Array();
  569.         config_count = 0;
  570.         getConfiguration(0, productnumber, groupIds, groupValues);
  571.         $('#startCartBtn').removeAttr('disabled');
  572.         $('.xconfig_start_block').show();
  573.         $(".product-detail-price").html(original_price);   
  574.         $("#x-main-article-price").html(original_price);   
  575.         $(".product-detail-price-brutto").html(brutto_price);   
  576.     }
  577.     
  578.     function calcprice() {
  579.         var main_qty = $( ".custom-select option:selected" ).text();
  580.         var fullprice = main_qty * main_price;
  581.         $('.x-accessory-item').each(function() {
  582.             if($( this ).hasClass("active")) {
  583.                 accessory_price = $( this ).attr("data-price");
  584.                 accessory_qty = $( this ).attr("data-qty");
  585.                 full_accessory = accessory_price * accessory_qty;
  586.                 fullprice = fullprice + full_accessory;
  587.             } 
  588.         });
  589.         if (currency == "CHF") {
  590.             fullprice_brutto = fullprice * 1.077;
  591.             fullprice_brutto = formatPrice(fullprice_brutto, "CHF")
  592.             fullprice = formatPrice(fullprice, "CHF*")
  593.         } else {
  594.             fullprice_brutto = fullprice * 1.19;
  595.             fullprice_brutto = formatPrice(fullprice_brutto, "€")
  596.             fullprice = formatPrice(fullprice, "€*")            
  597.         }
  598.         $(".x-full-price").html(fullprice);  
  599.         $(".x-full-price-brutto").html(fullprice_brutto);  
  600.     }
  601.         
  602.     function formatPrice(num, currency) { 
  603.         var p = Number(num).toFixed(2).split("."); 
  604.         return p[0].split("").reverse().reduce(function(acc, num, i, orig) 
  605.         { 
  606.             return num + (i && !(i % 3) ? "." : "") + acc; 
  607.         } , "") + "," + p[1] + " "+ currency; 
  608.     } 
  610.     // Function to search for the option and trigger onchange if found
  611.     function searchAndTrigger(preconf) {
  612.         var selectElements = document.querySelectorAll('.config_select'); // Select by class name
  613.         var searchterm;
  614.         if (preconf == "of") {
  615.             searchTerm = 'ortsfest';
  616.         }
  617.         if (preconf == "hn") {
  618.             searchTerm = 'herausnehmbar';
  619.         } 
  620.         if (preconf == "ul") {
  621.             searchTerm = 'umlegbar';
  622.         }         
  623.         var triggered = false;
  624.         selectElements.forEach(function (selectElement) {
  625.             if (triggered) {
  626.                 return;
  627.             }
  628.             // Enable the select field temporarily
  629.             selectElement.disabled = false;
  630.             for (var i = 0; i < selectElement.options.length; i++) {
  631.                 var option = selectElement.options[i];
  632.                 if (option.innerHTML.toLowerCase().includes(searchTerm)) {
  633.                     // Option found, trigger onchange
  634.                     selectElement.value = option.value;
  635.                     xSend(selectElement); // Pass the select element as a parameter
  636.                     triggered = true; // Set the flag to true
  637.                     break;
  638.                 }
  639.             }
  640.         });
  641.     }
  642.     
  643.     $("#x_info_click").click(function () {
  644.         $('#x_info_modal').addClass("show"); 
  645.     });
  647.     $(".x-modal-dialog .x-dialog-close").click(function(){
  648.         
  649.         $(this).closest(".x-modal-dialog").removeClass("show");
  650.         
  651.     });    
  652. </script>       
  653. {% endblock %}
  655. {% block page_product_detail_delivery_informations %}
  656. {% endblock %}
  658. {% block page_product_detail_tax %}
  659. {% endblock %}
  662. {% block page_product_detail_ordernumber_container %} 
  663.     {% for shop_detail in page.extensions.xconfig.product.data.shop_details %}
  664.         {% if shop_detail.type_id == "2" %}
  665.             <button class="xaccordion">{{ shop_detail.item_name }}</button>
  666.             <div class="xpanel">
  667.                 <p>{{ shop_detail.item_value|raw }}</p>
  668.             </div>                            
  669.         {% endif %}
  670.     {% endfor %}    
  671. <script>
  672. var icon_delete_html = '<span class="icon icon-trash" title="entfernen"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="#f01d4a" fill-rule="evenodd" d="M5 21c0 .5523.4477 1 1 1h12c.5523 0 1-.4477 1-1V9H5v12zM17 3h2c1.6569 0 3 1.3431 3 3v2c0 .5523-.4477 1-1 1v12c0 1.6569-1.3431 3-3 3H6c-1.6569 0-3-1.3431-3-3V9c-.5523 0-1-.4477-1-1V6c0-1.6569 1.3431-3 3-3h2c0-1.6569 1.3431-3 3-3h4c1.6569 0 3 1.3431 3 3zM7 13v5c0 .5523.4477 1 1 1s1-.4477 1-1v-5c0-.5523-.4477-1-1-1s-1 .4477-1 1zm4 0v5c0 .5523.4477 1 1 1s1-.4477 1-1v-5c0-.5523-.4477-1-1-1s-1 .4477-1 1zm4 0v5c0 .5523.4477 1 1 1s1-.4477 1-1v-5c0-.5523-.4477-1-1-1s-1 .4477-1 1zM10 2c-.5523 0-1 .4477-1 1h6c0-.5523-.4477-1-1-1h-4zM4 7h16V6c0-.5523-.4477-1-1-1H5c-.5523 0-1 .4477-1 1v1z"/></svg></span>';
  673. $( ".xaccordion" ).click(function() {
  674.     this.classList.toggle("xactive");
  675.     var panel = this.nextElementSibling;
  676.     if (panel.style.maxHeight) {
  677.       panel.style.maxHeight = null;
  678.     } else {
  679.       panel.style.maxHeight = panel.scrollHeight + "px";
  680.     }
  681. });
  683. $('.cms-element-').css({                      
  684.     position: 'sticky',
  685.     top: '140px'
  686. });
  688. $( ".gallery-slider-image" ).click(function() {
  689.     $('.cms-element-').css({                      
  690.         position: 'relative'
  691.     });
  692. });
  694. $( ".modal-close" ).click(function() {
  695.     $('.cms-element-').css({                      
  696.         position: 'sticky'
  697.     });
  698. });
  700. $( ".custom-select" ).change(function() {
  701.     $('#x-main-article-qty').html(this.value);
  702.     $('#main_article_quantity_form').val(this.value);
  703.     calcprice();
  704. });
  706. // $( ".x-accessory-item-select" ).change(function() {
  707.     // var parent = $( this ).parents(".x-accessory-item");
  708.     // parent.attr("data-qty", this.value)
  709.     // $( "#x-acc-article-qty-"+ parent.attr("data-id") ).html(this.value);
  710.     // calcprice();
  711. // });
  712. // $(".x-accessory-item-input").click(function() {
  713.     // var parent = $( this ).parents(".x-accessory-item");
  714.     // acc_qty = parent.attr("data-qty");
  715.     // acc_price = parent.attr("data-price");
  716.     // acc_price = formatPrice(acc_price, "€*");
  717.     // acc_name = parent.attr("data-name");
  718.     // acc_id = parent.attr("data-id");    
  719.     // if(!parent.hasClass("active")) {
  720.         // parent.addClass("active");
  721.         // parent.find(".accessory-hidden-input").each(function() { 
  722.             // $( this ).removeAttr("disabled");
  723.         // });
  724.         
  725.         // $('.x-calc-table').append('<div class="x-acc-article lchline visible" id="x-acc-article-'+ acc_id +'"><div class="x-acc-article-name" id="x-acc-article-name'+ acc_id +'">'+ acc_name +'</div><div class="x-acc-article-qty" id="x-acc-article-qty-'+ acc_id +'">'+ acc_qty +'</div><div class="x-acc-article-price" id="x-acc-article-price'+ acc_id +'">'+ acc_price +'</div><div style="cursor: pointer;" onclick="article_delete('+ "'" + acc_id + "'" +')" class="x-article-delete"><span class="x-article-icon-delete"'+ icon_delete_html +'</span></div></div>');        
  726.     // } else {
  727.         // parent.removeClass("active");
  728.         // parent.find(".accessory-hidden-input").each(function() {
  729.             // $( this ).attr("disabled", true);
  730.         // });
  731.         // $( "#x-acc-article-"+ acc_id ).remove();
  733.     // }
  734.     // calcprice();  
  735. // }); 
  737. function article_delete(acc_id) {
  738.     $("#acc_input_"+ acc_id ).click();
  739. }    
  741.     
  742. $( "#show-more-accessory" ).click(function() {
  743.   $( '.x-accessories-rest' ).show( "slow" );
  744.   $( '#show-more-accessory' ).hide();
  745. });
  747. $( "#show-less-accessory" ).click(function() {
  748.   $( '.x-accessories-rest' ).hide( "slow" );
  749.   $( '#show-more-accessory' ).show();
  750.   $('html, body').animate({
  751.         scrollTop: parseInt($('.x-accessories-headline').offset().top)
  752.     }, 500);
  753. });
  754.     
  755. function accessoryCheck() {
  756.   let total = document.querySelectorAll('.x-accessory-item-input:checked').length;
  757.   document.getElementById("totalaccessory").innerHTML = "ausgewählte Zubehörartikel: " + total;
  758. }
  759. </script>
  760. {% endblock %}