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">Hersteller</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>
  50.                     {% if page.product.calculatedPrice.unitPrice >= 50.00 %}
  51.                         inkl. MwSt. inkl. Versandkosten
  52.                     {% else %}
  53.                         inkl. MwSt. zzgl. Versandkosten
  54.                     {% endif %}
  55.                 </div>
  56.             </div>
  57.             <div class="product-detail-tax-container">
  58.                 {% if context.taxState == "gross" %}
  59.                     {% set taxText = "general.grossTaxInformation"|trans|sw_sanitize %}
  60.                 {% else %}
  61.                     {% set taxText = "general.netTaxInformation"|trans|sw_sanitize %}
  62.                 {% endif %}
  64.                 <p class="product-detail-tax">
  65.                     {% block page_product_detail_tax_link %}
  66.                         <a class="product-detail-tax-link"
  67.                                 href="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}"
  68.                                 title="{{ taxText }}"
  69.                                 data-toggle="modal"
  70.                                 data-url="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}">
  71.                         {% if page.product.calculatedPrice.unitPrice >= 50.00 %}
  72.                             inkl. MwSt. inkl. Versandkosten
  73.                         {% else %}
  74.                             {{ taxText }}
  75.                         {% endif %}
  76.                         </a>
  77.                     {% endblock %}
  78.                 </p>
  79.             </div>
  80.             <div class="product-detail-delivery-information">
  81.                 {% sw_include '@Storefront/storefront/component/delivery-information.html.twig' %}
  82.             </div>
  83.             {% if page.product.productNumber == "parking3000" %}
  84.                 <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!
  85.                 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>.
  86.                 Gern können Sie auch erste Fragen im Konfigurator beantworten und uns Ihre Anfrage senden.</p>
  87.                 <span id="xconfig_start_description" style="font-weight: bold"></span>
  88.             {% endif %}
  89.             <div class="xconfig_start_block">
  90.                 <div id="x_info_modal" class="x-modal-dialog">
  91.                     <div>
  92.                       <a href="#close" title="Close" class="x-dialog-close">x</a>
  93.                       <h2>Informationen zur Konfiguration</h2>
  94.                       <p>Der Ihnen gezeigte Preis basiert auf einer voreingestellten Konfiguration.</p>
  95.                       <p>Das Produkt können Sie in dieser Variante mit einem Klick auf das Einkaufswagensymbol {% sw_icon "shoppingcart-small" style {"pack" : "xicons"} %}, rechts neben dem Konfigurationstext, in den Warenkorb legen.</p>
  96.                       <p>Natürlich können Sie auch das Produkt mit dem Konfigurator nach ihrem Belieben anpassen.</p>
  97.                     </div>
  98.                 </div>
  99.                 <p class="product-detail-start-add-hint"><a href="#" id="x_info_click">{% sw_icon "info" %}</a> Preis auf Basis folgender Konfiguration:</p>
  100.                 <span id="xconfig_start_description" style="font-weight: bold"></span>
  101.                 <form
  102.                         id="xProductForm"
  103.                         action="{% block page_product_detail_buy_form_action %}{{ path('frontend.checkout.line-item.add') }}{% endblock %}"
  104.                         method="post"
  105.                         class="buy-widget"
  106.                         data-add-to-cart="true">
  107.                     {% block page_product_detail_buy_form_inner_csrf %}
  108.                         {{ sw_csrf('frontend.checkout.line-item.add') }}
  109.                     {% endblock %}
  110.                     <input type="hidden"
  111.                             name="redirectTo"
  112.                             value="frontend.detail.page">
  113.                     <input type="hidden"
  114.                             name="redirectParameters"
  115.                             data-redirect-parameters="true"
  116.                             value='{"productId": "{{ page.product.id }}"}'>
  117.                     <input type="hidden"
  118.                             name="lineItems[{{ page.product.id }}][id]"
  119.                             value="{{ page.product.id }}">
  120.                     <input type="hidden"
  121.                             name="lineItems[{{ page.product.id }}][type]"
  122.                             value="product">
  123.                     <input type="hidden"
  124.                             name="lineItems[{{ page.product.id }}][referencedId]"
  125.                             value="{{ page.product.id }}">
  126.                     <input type="hidden"
  127.                             name="lineItems[{{ page.product.id }}][stackable]"
  128.                             value="1">
  129.                     <input type="hidden"
  130.                             name="lineItems[{{ page.product.id }}][removable]"
  131.                             value="1">
  132.                     <input type="hidden"
  133.                             name="lineItems[{{ page.product.id }}][xProductNumber]"
  134.                             value="{{ page.product.productNumber }}">
  135.                     <input type="hidden"
  136.                             name="lineItems[{{ page.product.id }}][quantity]"
  137.                             value="1">
  138.                     <input type="hidden"
  139.                             name="lineItems[{{ page.product.id }}][xconfig]"
  140.                             value="1">
  141.                     <input type="hidden"
  142.                             id="xconfigStartDesc"
  143.                             name="lineItems[{{ page.product.id }}][xconfigDesc]"
  144.                             value="">
  145.                     <input type="hidden"
  146.                             id="xconfigStartMedia"
  147.                             name="lineItems[{{ page.product.id }}][xconfigMedia]"
  148.                             value="">
  149.                     <input type="hidden"
  150.                             id="xStartGroupIds"
  151.                             name="lineItems[{{ page.product.id }}][xGroupIds]"
  152.                             value="">
  153.                     <input type="hidden"
  154.                             id="xStartGroupValues"
  155.                             name="lineItems[{{ page.product.id }}][xGroupValues]"
  156.                             value="">
  157.                     <button class="btn header-actions-btn" id="startCartBtn"
  158.                             title="{{ "detail.addProduct"|trans|striptags }}"
  159.                             aria-label="{{ "detail.addProduct"|trans|striptags }}">
  160.                         {% sw_icon "shoppingcart" style {"pack" : "xicons"} %}
  161.                     </button>
  162.                 </form>
  163.             </div>
  164.         </div>
  165.         {% if has_config %}
  166.             <div id="xconfig">
  167.             <div id="xconfig_body">
  168.             </div>
  169.             <div id="xconfig_footer">
  170.             </div>
  171.         </div>
  172.         {% endif %}
  173.         <div class="xconfig_end_block">
  174.             {% if has_config %}
  175.                 <div class="x-chosen-article-box">
  176.                 <div class="table-detail-headline">Ausgewählte Produktvariante</div>
  177.                 <div class="x-chosen-article">
  178.                 Ausführung:
  179.                 <span class="xconfig_description"></span>
  180.                 </div>
  181.             </div>
  182.                 <!--             <div class="xprice_block">
  183.                                 <div class="x-chosen-article-box">
  184.                                     <div class="table-detail-headline">Übersicht</div>
  185.                                     <div class="x-chosen-article">
  186.                                     Ausführung:
  187.                                     <span class="xconfig_description"></span>
  188.                                     </div>
  189.                                 </div>
  190.                             </div> -->
  191.             {% endif %}
  192.             <div class="col-14 x-buy-field" {% if not has_config %} style="position:inherit!important" {% endif %}>
  193.                 <div class="col-4 x-select" style="margin-right:0px!important">
  194.                     <select class="custom-select">
  195.                     {% for quantity in range(page.product.minPurchase, page.product.calculatedMaxPurchase, page.product.purchaseSteps) %}
  196.                         <option value="{{ quantity }}">
  197.                             {{ quantity }}
  198.                             {% if quantity == 1 %}
  199.                                 {% if page.product.translated.packUnit %} {{ page.product.translated.packUnit }}{% endif %}
  200.                             {% else %}
  201.                                 {% if page.product.translated.packUnitPlural %}
  202.                                     {{ page.product.translated.packUnitPlural }}
  203.                                 {% elseif page.product.translated.packUnit %}
  204.                                     {{ page.product.translated.packUnit }}
  205.                                 {% endif %}
  206.                             {% endif %}
  207.                         </option>
  208.                     {% endfor %}
  209.                     </select>
  210.                 </div>
  211.             <div class="col-8 x-buttons">
  212.                     <button id="cart_primary" form="productDetailPageBuyProductForm" class="btn btn-primary btn-block btn-buy"
  213.                             title="{{ "detail.addProduct"|trans|striptags }}"
  214.                             aria-label="{{ "detail.addProduct"|trans|striptags }}">
  215.                         {{ "detail.addProduct"|trans|sw_sanitize }}
  216.                     </button>
  217.                     <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">
  218.                         Produkt anfragen {% sw_icon "envelope" %}</a>
  219.                 </a>
  220.             </div>
  221.                 <div class="x-calc-table">
  222.                       <div class="x-calc-table-firstrow">
  223.                         <div class="x-calc-table-row1">Artikel</div>
  224.                         <div class="x-calc-table-row2">Menge</div>
  225.                         <div class="x-calc-table-row3">Preis</div>
  226.                         <div class="x-calc-table-row4"></div>
  227.                       </div>
  228.                       <div class="x-calc-table-secondrow lchline">
  229.                         <div class="x-calc-table-row1">{{ page.product.translated.name }}</div>
  230.                         <div id="x-main-article-qty" class="x-calc-table-row2">1</div>
  231.                         <div id="x-main-article-price" class="x-calc-table-row3">{{ page.product.calculatedPrice.unitPrice|currency }}*</div>
  232.                       </div>
  233.                 </div>
  234.                 <div class="xprice-netto-row">
  235.                     <div class="price-detail-netto-headline-table">Gesamtpreis Netto</div>
  236.                     <div class="x-full-price">{{ page.product.calculatedPrice.unitPrice|currency }}*</div>
  237.                 </div>
  238.                 <div class="xprice-brutto-row">
  239.                     <div class="price-detail-brutto-headline-table">Gesamtpreis Brutto</div>
  240.                     <div class="x-full-price-brutto">{{ brutto_price|currency }}</div>
  241.                 </div>
  242.                 <div class="product-detail-tax-container-table">
  243.                     {% if context.taxState == "gross" %}
  244.                         {% set taxText = "general.grossTaxInformation"|trans|sw_sanitize %}
  245.                     {% else %}
  246.                         {% set taxText = "general.netTaxInformation"|trans|sw_sanitize %}
  247.                     {% endif %}
  249.                     <p class="product-detail-tax">
  250.                         <a class="product-detail-tax-link"
  251.                                 href="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}"
  252.                                 title="{{ taxText }}"
  253.                                 data-toggle="modal"
  254.                                 data-url="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}">
  255.                             {{ taxText }}
  256.                         </a>
  257.                     </p>
  258.                 </div>
  259.             </div>
  260.             {% if page.product.active %}
  261.                 <div class="product-detail-form-container">
  262.                 {% sw_include '@Storefront/storefront/page/product-detail/buy-widget-form.html.twig' %}
  263.             </div>
  264.             {% endif %}
  265.         </div>
  266.     </div>
  267.     <div class="product-detail-tab-content" id="tab-info">
  268.         <p class="tab-info-headline">Ihre Ansprechpartner</p>
  269.         {% if page.product.productNumber == "parking" || page.product.productNumber == "industrial" ||
  270.             page.product.productNumber == "koloss" || page.product.productNumber == "solar" || page.product.productNumber == "parking3000" %}
  271.             <div class="tab-info-personcard">
  272.             <div class="tab-info-personcard-image">
  273.                 <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">
  274.             </div>
  275.             <div class="tab-info-personcard-description">
  276.                 <p class="tab-info-personcard-description-name">Sebastian Toth</p>
  277.                 <p class="tab-info-personcard-description-title">Ansprechpartner Absperrtechnik/Zutrittskontrolle</p>
  278.                 <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>
  279.                 <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>
  280.             </div>
  281.         </div>
  282.         {% else %}
  283.             <div class="tab-info-personcard">
  284.             <div class="tab-info-personcard-image">
  285.                 <img class="personcard-image" alt="Marion Wette - Produktmanagerin" src="/media/5f/67/80/1647334115/frau_wette.jpg" alt="Frau Wette" title="Frau Wette">
  286.             </div>
  287.             <div class="tab-info-personcard-description">
  288.                 <p class="tab-info-personcard-description-name">Marion Wette</p>
  289.                 <p class="tab-info-personcard-description-title">Produktmanagerin</p>
  290.                 <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>
  291.                 <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>
  292.             </div>
  293.         </div>
  294.             <div class="tab-info-personcard">
  295.             <div class="tab-info-personcard-image">
  296.                 <img class="personcard-image" alt="Christian Preuß - Produktmanager" src="/media/f9/f0/29/1647334352/herr_preuss.jpg" alt="Herr Preuß" title="Herr Preuß">
  297.             </div>
  298.             <div class="tab-info-personcard-description">
  299.                 <p class="tab-info-personcard-description-name">Christian Preuß</p>
  300.                 <p class="tab-info-personcard-description-title">Produktmanager</p>
  301.                 <p class="tab-info-personcard-description-phone"><a title="+49 (0) 2373 17809-0" href="tel:+492373178090">+49 (0) 2373 17809-0
  302.                 </a></p>
  303.                 <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>
  304.             </div>
  305.         </div>
  306.         {% endif %}
  307.     </div>
  309.     <div class="product-detail-tab-content" id="tab-manufacturer">
  310.         <img src="{{ page.product.manufacturer.media.url }}" class="manufacturer-image" alt="{{ page.product.manufacturer.name }}">
  311.         {{ page.product.manufacturer.description }}<br><br>
  312.         <p class="manufacturer-website">Webseite: <a titel="{{ page.product.manufacturer.name }}" href="{{ page.product.manufacturer.link }}" target="_blank" alt="{{ page.product.manufacturer.name }}" >{{ page.product.manufacturer.link }}</a></p>
  313.     </div>
  314.     {% if page.product.productNumber == "SchrankeS" || page.product.productNumber == "parking" || page.product.productNumber == "industrial" ||
  315.         page.product.productNumber == "koloss" || page.product.productNumber == "solar" %}
  316.         <script>
  317.         $("#cart_primary").hide();
  318.         $(".x-calc-table").hide();
  319.         $(".xprice-netto-row").hide();
  320.         $(".xprice-brutto-row").hide();
  321.         $(".x-select").hide();
  322.         $(".product-detail-tax-container-table").hide();
  323.         $(".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>');
  324.         $(".netto-container").css({"float": "inherit", "width": "100%"});
  325.         //$(".netto-container").hide();
  326.         $(".brutto-container").hide();
  327.         $(".product-detail-delivery-information").hide();
  328.         $(".product-detail-tax-container").hide();
  329.         $(".xconfig_start_block").hide();
  330.         $(".x-chosen-article-box").hide();
  331.         $(".product-detail-ordernumber-container").hide();
  332.         $(".manufacturer-website").hide();
  333.         $("#detail-config-request").attr('href', 'mailto:s.toth@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');
  334.         $( document ).ready(function() {
  335.           $("#x-order-tab").hide();
  336.         });
  338.     </script>
  339.     {% endif %}
  340.     {% if page.product.productNumber == "parking3000" %}
  341.         <script>
  342.         $("#detail-config-request").attr('href', 'mailto:s.toth@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');
  343.         $(".manufacturer-website").hide();
  344.         $(".xconfig_start_block").hide();
  345.         $(".x-chosen-article-box").hide();
  346.     </script>
  347.     {% endif %}
  348.     <script>
  349.     var groupIds     = new Array();
  350.     var groupValues    = new Array();
  351.     var start_variant = getSearchParams("xconfig");
  352.     var num            = 0;
  353.     var original_price = $(".product-detail-price").html();
  354.     var brutto_price = $(".product-detail-price-brutto").html();
  355.     var productnumber = "{{ page.product.productNumber }}";
  356.     var currency = "{{ context.currency.isoCode }}";
  357.     var main_price = 0;
  358.     var sitelink = 'https://'+window.location.hostname+window.location.pathname;
  359.     {% if not has_config %}
  360.     main_price = {{ page.product.calculatedPrice.unitPrice }};
  361.     {% endif %}
  362.     $( ".tab-button" ).click(function() {
  363.       var tab = $(this).attr("value");
  364.       $( ".tab-button" ).removeClass("tab-active");
  365.       $(this).addClass("tab-active");
  366.       $( ".product-detail-tab-content" ).css("display", "none");
  367.       $( "#tab-"+tab ).css("display", "block");
  368.       if (tab != "price") {
  369.         $( ".product-detail-form-container" ).hide();
  370.       } else {
  371.         $( ".product-detail-form-container" ).show();
  372.       }
  373.     });
  375.     $( document ).ready(function() {
  376.       $.getScript("https://xconfig003.com/mvc_structure2/assets/js/jquery-ui.js", function() {
  377.         getConfiguration(0, productnumber, groupIds, groupValues, start_variant);
  378.       });
  379.       var data_mail = $("#x_share_mail").attr("data");
  380.       var data_facebook = $("#x_share_facebook").attr("data");
  381.       var data_twitter = $("#x_share_twitter").attr("data");
  382.       var data_linkedin = $("#x_share_linkedin").attr("data");
  383.       $("#x_share_mail").attr("href", data_mail + sitelink);
  384.       $("#x_share_facebook").attr("href", data_facebook + sitelink);
  385.       $("#x_share_twitter").attr("href", data_twitter + sitelink);
  386.       $("#x_share_linkedin").attr("href", data_linkedin + sitelink);
  387.     });
  389.     function getConfiguration(id, productnumber, option_ids, value_ids, start_variant) {
  390.       $.ajax({
  391.         url:"https://xconfig003.com/mvc_structure2/get_configuration_poller.php",
  392.         type:'POST',
  393.         dataType: 'json',
  394.         data: { id: id, productnumber: productnumber, option_ids: option_ids, value_ids: value_ids , start_variant: start_variant},
  395.         success: function(data){
  396.           $('.x-accessory-item-container').hide();
  397.           $('.x-accessories-headline').hide();
  398.           var main_tpl = decodeURIComponent(escape(window.atob(data.config_main_tpl)));
  399.           var footer_tpl = decodeURIComponent(escape(window.atob(data.config_footer_tpl)));
  400.           $('#xconfig_body').html(main_tpl);
  401.           $('#xconfig_footer').html(footer_tpl);
  402.           $('#xconfigDesc').val(data.config_description);
  403.           var buy_btn = $('.btn-buy');
  404.           var text = data.config_description;
  405.           //text = text.replace("$$", "");
  406.           //var newchar = ", %0D%0A";
  407.           //text = text.split("$$").join(newchar);
  408.           text = text.replaceAll(",", ", %0D%0A");
  409.           if (text != "") {
  410.             if (productnumber == "SchrankeS" || productnumber == "parking" || productnumber == "industrial" ||
  411.               productnumber == "koloss" || productnumber == "solar" || productnumber == "parking3000") {
  412.               $("#detail-config-request").attr('href',"mailto:s.toth@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");
  413.             } else {
  414.               $("#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");
  415.             }
  416.             if (productnumber == "parking3000") {
  417.               $("#cart_primary").hide();
  418.               $(".x-calc-table").hide();
  419.               $(".xprice-netto-row").hide();
  420.               $(".xprice-brutto-row").hide();
  421.               $(".x-select").hide();
  422.               $(".product-detail-tax-container-table").hide();
  423.               $(".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>');
  424.               $(".netto-container").css({"float": "inherit", "width": "100%"});
  425.               //$(".netto-container").hide();
  426.               $(".brutto-container").hide();
  427.               $(".product-detail-delivery-information").hide();
  428.               $(".product-detail-tax-container").hide();
  429.               $(".xconfig_start_block").hide();
  430.               $(".x-chosen-article-box").hide();
  431.               $(".product-detail-ordernumber-container").hide();
  432.               $(".manufacturer-website").hide();
  433.               $( document ).ready(function() {
  434.                 $("#x-order-tab").hide();
  435.               });
  436.             }
  437.           }
  438.           value_ids.forEach (function (value_id, index) {
  439.             if (value_id) {
  440.               $( ".config--has-summary" ).show();
  441.             }
  442.           });
  443.           if(value_ids.length == 0) {
  444.             $( ".config--has-summary" ).hide();
  445.           }
  446.           if(data.config_complete) {
  447.             buy_btn.removeAttr('disabled');
  448.           } else {
  449.             buy_btn.attr('disabled', 'disabled');
  450.           }
  452.           //if (data.variant_product_productnumber != null) {
  453.           //    $("#xconfigProductNumber").html(data.variant_product_productnumber;
  454.           //}
  455.           //if (data.variant_product_ean != null) {
  456.           //    $("#xconfigEan").html(data.variant_product_ean;
  457.           //}
  458.           var buy_form = $("#productDetailPageBuyProductForm");
  459.           buy_form.attr("action", "/checkout/xconfig-line-item/add");
  460.           if (productnumber != "SchrankeS" && productnumber != "parking" && productnumber != "industrial" &&
  461.             productnumber != "koloss" && productnumber != "solar" && productnumber != "parking3000") {
  462.             if (data.variant_product_price1.raw != null) {
  463.               main_price = data.variant_product_price1.raw;
  464.               if (main_price >= 50) {
  465.                 var vk_text = "</span><br>inkl. MwSt. inkl. Versandkosten"
  466.                 $(".product-detail-tax-link").html("exkl. MwSt. inkl. Versandkosten");
  467.               } else {
  468.                 var vk_text = "</span><br>inkl. MwSt. zzgl. Versandkosten"
  469.                 $(".product-detail-tax-link").html("exkl. MwSt. zzgl. Versandkosten");
  470.               }
  471.               if (currency == "CHF") {
  472.                 $(".product-detail-price").html(data.variant_product_price1_chf.formatted);
  473.                 $("#x-main-article-price").html(data.variant_product_price1_chf.formatted);
  474.                 $(".product-detail-price-brutto").html("<span class='brutto-price-number'>" +data.variant_product_price1_brutto_chf.formatted + vk_text);
  475.               } else {
  476.                 $(".product-detail-price").html(data.variant_product_price1.formatted);
  477.                 $("#x-main-article-price").html(data.variant_product_price1.formatted);
  478.                 $(".product-detail-price-brutto").html("<span class='brutto-price-number'>" +data.variant_product_price1_brutto.formatted + vk_text);
  479.               }
  480.               calcprice();
  481.             }
  482.           }
  483.           $(".xconfig_description").html(data.config_product_description);
  484.           // if (data.variant_product_media != "") {
  485.           // var gallery_image = $(".gallery-slider-image").first();
  486.           // $('#xconfigMedia').val(data.variant_product_media[0].media_path);
  487.           // gallery_image.attr("src", data.variant_product_media[0].media_path.replace(/ /g, '%20'));
  488.           // 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");
  489.           // gallery_image.attr("data-full-image", data.variant_product_media[0].media_path.replace(/ /g, '%20'));
  490.           // $( ".product-media-append" ).hide();
  491.           // } else {
  492.           //if(data.config_complete) {
  493.           //    $( ".product-media-append" ).show();
  494.           //} else {
  495.           //    $( ".product-media-append" ).hide();
  496.           //}
  498.           // }
  499.           if (productnumber == "SchrankeS" || productnumber == "parking" || productnumber == "industrial" ||
  500.             productnumber == "koloss" || productnumber == "solar" || productnumber == "parking3000") {
  502.           } else {
  503.             var item_pdf = "";
  504.             if (data.variant_product_media != "") {
  505.               data.variant_product_media.forEach(function(item){
  506.                 if(item.media_path.includes('pdf')) {
  507.                   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 />';
  508.                 }
  509.               });
  510.               $("#pdf-media").html(item_pdf);
  511.             }
  512.             if (item_pdf == "") {
  513.               $("#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.');
  514.             }
  515.           }
  516.           if(data.variant_product_start_config.values != "" && data.variant_product_start_config.options != "") {
  517.             $("#xStartGroupValues").val(data.variant_product_start_config.values);
  518.             $("#xStartGroupIds").val(data.variant_product_start_config.options);
  519.             $("#xconfig_start_description").html(data.variant_product_start_config_description);
  520.             $('#xconfigStartDesc').val(data.variant_product_start_config_description);
  521.             $('#startCartBtn').removeAttr('disabled');
  523.             $("#xGroupIds").val(data.variant_product_start_config.values);
  524.             $("#xGroupValues").val(data.variant_product_start_config.options);
  525.             $('#xconfigDesc').val(data.variant_product_start_config_description);
  526.             buy_btn.removeAttr('disabled');
  527.           } else {
  528.             $('#startCartBtn').attr('disabled', 'disabled');
  529.             $('.xconfig_start_block').hide();
  530.           }
  531.           if (main_tpl == "") {
  532.             $('#startCartBtn').hide();
  533.             $('.xconfig_start_block').hide();
  534.           }
  535.           $(".accessory-hidden-input-id").each(function(e){
  536.             this.value = data.variant_id + $(this).attr("originalid");
  537.           });
  538.           if (data.product_accessories != "") {
  539.             data.product_accessories.forEach(function(item){
  540.               var product_number = item.product.base.product_number;
  541.               product_number = product_number.replace(".", "_")
  542.               $('#accessory_'+product_number).show();
  543.               $('.x-accessories-headline').show();
  544.             });
  545.           }
  547.           if (data.variant_product_accessories != "") {
  548.             data.variant_product_accessories.forEach(function(item){
  549.               var product_number = item.product.base.product_number;
  550.               product_number = product_number.replace(".", "_")
  551.               $('#accessory_'+product_number).show();
  552.               $('.x-accessories-headline').show();
  553.             });
  554.           }
  556.           $("#xVariantId").val(data.variant_id);
  557.           $(".accessory-variant-id").val(data.variant_id);
  559.           if (productnumber == "SchrankeS" || productnumber == "parking" || productnumber == "industrial" ||
  560.             productnumber == "koloss" || productnumber == "solar") {
  561.             $(".product--headline").html("Konfigurieren Sie jetzt Ihre Anfrage:");
  562.           }
  564.           if (productnumber == "parking3000") {
  565.             $(".product--headline").html("Konfigurieren Sie jetzt Ihren Anfrage:");
  566.             buy_btn.removeAttr('disabled');
  567.           }
  568.           var steps = value_ids.filter(obj => obj != "").length;
  569.           if (steps != 0) {
  570.             gtag('event', 'Konfigurator: '+productnumber, {'event_category': 'configuration','event_label': 'Schritt:'+steps,'value': true});
  571.             //gtag('event', 'Konfigurator: '+productnumber, {
  572.             //  'SCHRITT': steps
  573.             //});
  574.           }
  575.         }
  576.       });
  577.     }
  579.     function submitXData() {
  580.       $("#xconfig_body :input[name^='group']").each(function(e){
  581.         if(this.type == "hidden" || this.type == "text")
  582.         {
  583.           string = this.name;
  584.           string = string.substring(string.lastIndexOf("[")+1,string.lastIndexOf("]"));
  585.           groupIds[num] = string;
  586.           groupValues[num] = this.value;
  587.           num++;
  588.         }
  589.       });
  591.       $("#xGroupIds").val(groupIds);
  592.       $("#xGroupValues").val(groupValues);
  594.       getConfiguration(0, productnumber, groupIds, groupValues);
  596.       groupIds = [];
  597.       groupValues = [];
  598.       num = 0;
  600.       return false;
  601.     }
  602.     function getSearchParams(k){
  603.       var p={};
  604.       location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){p[k]=v})
  605.       return k?p[k]:p;
  606.     }
  608.     function submitRestart() {
  609.       var groupIds     = new Array();
  610.       var groupValues = new Array();
  611.       config_count = 0;
  612.       getConfiguration(0, productnumber, groupIds, groupValues);
  613.       $('#startCartBtn').removeAttr('disabled');
  614.       $('.xconfig_start_block').show();
  615.       $(".product-detail-price").html(original_price);
  616.       $("#x-main-article-price").html(original_price);
  617.       $(".product-detail-price-brutto").html(brutto_price);
  618.     }
  620.     function calcprice() {
  621.       var main_qty = $( ".custom-select option:selected" ).text();
  622.       var fullprice = main_qty * main_price;
  623.       $('.x-accessory-item').each(function() {
  624.         if($( this ).hasClass("active")) {
  625.           accessory_price = $( this ).attr("data-price");
  626.           accessory_qty = $( this ).attr("data-qty");
  627.           full_accessory = accessory_price * accessory_qty;
  628.           fullprice = fullprice + full_accessory;
  629.         }
  630.       });
  631.       if (currency == "CHF") {
  632.         fullprice_brutto = fullprice * 1.077;
  633.         fullprice_brutto = formatPrice(fullprice_brutto, "CHF")
  634.         fullprice = formatPrice(fullprice, "CHF*")
  635.       } else {
  636.         fullprice_brutto = fullprice * 1.19;
  637.         fullprice_brutto = formatPrice(fullprice_brutto, "€")
  638.         fullprice = formatPrice(fullprice, "€*")
  639.       }
  640.       $(".x-full-price").html(fullprice);
  641.       $(".x-full-price-brutto").html(fullprice_brutto);
  642.     }
  644.     function formatPrice(num, currency) {
  645.       var p = Number(num).toFixed(2).split(".");
  646.       return p[0].split("").reverse().reduce(function(acc, num, i, orig)
  647.       {
  648.         return num + (i && !(i % 3) ? "." : "") + acc;
  649.       } , "") + "," + p[1] + " "+ currency;
  650.     }
  652.     $("#x_info_click").click(function () {
  653.       $('#x_info_modal').addClass("show");
  654.     });
  656.     $(".x-modal-dialog .x-dialog-close").click(function(){
  658.       $(this).closest(".x-modal-dialog").removeClass("show");
  660.     });
  661. </script>
  662. {% endblock %}
  664. {% block page_product_detail_delivery_informations %}
  665. {% endblock %}
  667. {% block page_product_detail_tax %}
  668. {% endblock %}
  671. {% block page_product_detail_ordernumber_container %}
  672.     {% for shop_detail in page.extensions.xconfig.product.data.shop_details %}
  673.         {% if shop_detail.type_id == "2" %}
  674.             <button class="xaccordion">{{ shop_detail.item_name }}</button>
  675.             <div class="xpanel">
  676.                 <p>{{ shop_detail.item_value|raw }}</p>
  677.             </div>
  678.         {% endif %}
  679.     {% endfor %}
  680.     <script>
  681. 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>';
  682. $( ".xaccordion" ).click(function() {
  683.   this.classList.toggle("xactive");
  684.   var panel = this.nextElementSibling;
  685.   if (panel.style.maxHeight) {
  686.     panel.style.maxHeight = null;
  687.   } else {
  688.     panel.style.maxHeight = panel.scrollHeight + "px";
  689.   }
  690. });
  692. $('.cms-element-').css({
  693.   position: 'sticky',
  694.   top: '140px'
  695. });
  697. $( ".gallery-slider-image" ).click(function() {
  698.   $('.cms-element-').css({
  699.     position: 'relative'
  700.   });
  701. });
  703. $( ".modal-close" ).click(function() {
  704.   $('.cms-element-').css({
  705.     position: 'sticky'
  706.   });
  707. });
  709. $( ".custom-select" ).change(function() {
  710.   $('#x-main-article-qty').html(this.value);
  711.   $('#main_article_quantity_form').val(this.value);
  712.   calcprice();
  713. });
  715. $( ".x-accessory-item-select" ).change(function() {
  716.   var parent = $( this ).parents(".x-accessory-item");
  717.   parent.attr("data-qty", this.value)
  718.   $( "#x-acc-article-qty-"+ parent.attr("data-id") ).html(this.value);
  719.   calcprice();
  720. });
  721. $(".x-accessory-item-input").click(function() {
  722.   var parent = $( this ).parents(".x-accessory-item");
  723.   acc_qty = parent.attr("data-qty");
  724.   acc_price = parent.attr("data-price");
  725.   acc_price = formatPrice(acc_price, "€*");
  726.   acc_name = parent.attr("data-name");
  727.   acc_id = parent.attr("data-id");
  728.   if(!parent.hasClass("active")) {
  729.     parent.addClass("active");
  730.     parent.find(".accessory-hidden-input").each(function() {
  731.       $( this ).removeAttr("disabled");
  732.     });
  734.     $('.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>');
  735.   } else {
  736.     parent.removeClass("active");
  737.     parent.find(".accessory-hidden-input").each(function() {
  738.       $( this ).attr("disabled", true);
  739.     });
  740.     $( "#x-acc-article-"+ acc_id ).remove();
  742.   }
  743.   calcprice();
  744. });
  746. function article_delete(acc_id) {
  747.   $("#acc_input_"+ acc_id ).click();
  748. }
  751. $( "#show-more-accessory" ).click(function() {
  752.   $( '.x-accessories-rest' ).show( "slow" );
  753.   $( '#show-more-accessory' ).hide();
  754. });
  756. $( "#show-less-accessory" ).click(function() {
  757.   $( '.x-accessories-rest' ).hide( "slow" );
  758.   $( '#show-more-accessory' ).show();
  759.   $('html, body').animate({
  760.     scrollTop: parseInt($('.x-accessories-headline').offset().top)
  761.   }, 500);
  762. });
  764. function accessoryCheck() {
  765.   let total = document.querySelectorAll('.x-accessory-item-input:checked').length;
  766.   document.getElementById("totalaccessory").innerHTML = "ausgewählte Zubehörartikel: " + total;
  767. }
  768. </script>
  769. {% endblock %}