{% block hueb_accessories_accordion_content %} {% sw_include '@HuebertAccessoriesDirectlyBundling/storefront/page/product-detail/hueb-bundle-view.html.twig' ignore missing %} <div class="huebert-direct-accessories-block my-4" data-add-accessory="true"> {% block hueb_accessories_accordion_head %} {% if page.crossSellings.elements|length > 0 %} {% for crossSelling in page.crossSellings.elements %}{% if not break %} {% if crossSelling.crossSelling.display == "everywhere" or crossSelling.crossSelling.display == "pluginOnly" or not crossSelling.crossSelling.display %} <div class="h3"> {% if page.product.customFields.huebert_accessory_directly_title %} {{ page.product.translated.customFields.huebert_accessory_directly_title|sw_sanitize }} {% elseif not page.HuebertAccessoriesDirectly.config.showHeadline %} {{ "huebert-acessories-directly.product-detail.accessory-headline"|trans|sw_sanitize }} {% endif %} </div> <p> {% if page.product.customFields.huebert_accessory_directly_subtitle %} {{ page.product.translated.customFields.huebert_accessory_directly_subtitle|sw_sanitize }} {% elseif not page.HuebertAccessoriesDirectly.config.showDescription %} {{ "huebert-acessories-directly.product-detail.accessory-text"|trans|sw_sanitize }} {% endif %} </p> {% set break = true %} {% endif %} {% endif %}{% endfor %} {% endif %} {% endblock %} {% block hueb_accessories_accordion_elements %} <div class="accordion" id="accessoryAccordion"> {% for crossSelling in page.crossSellings.elements %} {% if crossSelling.crossSelling.display == "everywhere" or crossSelling.crossSelling.display == "pluginOnly" or crossSelling.crossSelling.display == "accessoriesOnly" or ( not crossSelling.crossSelling.display and not crossSelling.crossSelling.huebBundle) %} {% set products = crossSelling.products.elements %} <div class="card"> {% set sameQuantityAsMainProduct = crossSelling.crossSelling.sameQuantityAsMainProduct %}{# {% if crossSelling.crossSelling.selectableAmount === true %}#}{# {% if sameQuantityAsMainProduct === null or sameQuantityAsMainProduct === false %}#}{# <input type="hidden" name="same-and-selectable" class="same-and-selectable">#}{# {% else %}#}{# <input type="hidden" name="same-quantity" class="same-quantity-input" value="1">#}{# <input type="hidden" name="same-and-selectable" class="same-and-selectable" value="1">#}{# {% endif %}#}{# {% else %}#}{# <input type="hidden" name="accessory-quantity-as-main" class="accessory-quantity-as-main" value="1">#}{# <input type="hidden" name="lineItems[{{ product.id }}][sameQuantity]" value="1">#}{# <input type="hidden" name="same-and-selectable" class="same-and-selectable">#}{# {% endif %}#} {% block hueb_accessories_accordion_card_header %} <div class="card-header" id="heading-{{ crossSelling.crossSelling.id }}"> <div style="margin-bottom: -10px" class="row"> <div class="col-lg-8"> <div class="h4"> <button class="btn btn-accordion btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#accessories-{{ crossSelling.crossSelling.id }}"> {% sw_icon 'arrow-head-up' %}{% sw_icon 'arrow-head-down' %} {{ crossSelling.crossSelling.name ?: huebert_load_parent_language_name(crossSelling.crossSelling, context.context) }} </button> </div> </div> <div class="col-lg-4"> {% block hueb_accessories_accordion_bundling %} {% if crossSelling.crossSelling.huebBundle %} {% sw_include '@HuebertAccessoriesDirectlyBundling/storefront/page/product-detail/hueb-bundle-header.html.twig' ignore missing %} {% endif %} {% endblock %} </div> </div> </div> {% endblock %} {% block hueb_accessories_accordion_card_body %} <div id="accessories-{{ crossSelling.crossSelling.id }}" class="collapse {% if page.acessoryOptions.alwaysShow %}show{% endif %}" aria-labelledby="heading-{{ crossSelling.crossSelling.id }}" data-parent="#accessoryAccordion"> <div class="card-body"> {% for product in products %} {% set huebQuantity = 0 %} {% for assignedProduct in crossSelling.crossSelling.assignedProducts %} {% if assignedProduct.productId == product.id %} {% set huebQuantity = assignedProduct.huebQuantity %} {% endif %} {% endfor %} {% if product.stock >= 0 or (product.isCloseout === false and product.stock <= 0) or product.productConfigurator|length > 0 %} {% set buyable = product.available and product.childCount <= 0 and product.calculatedMaxPurchase > 0 %} {% if buyable %} {% if product.maxPurchase is null %} {% set mp = 100 %} {% else %} {% set mp = product.maxPurchase %} {% endif %} {% set accessoryConfig = { accessory: { productId: product.id, minPurchase: product.minPurchase , maxPurchase: mp, purchaseSteps: product.purchaseSteps } } %} {% set pricing = null %} {% set pricingTop = null %} {% set referencePricing = null %} {% set pricing %} {#{{% if product.calculatedListingPrice.from.unitPrice != product.calculatedListingPrice.to.unitPrice and product.calculatedPrices|length > 1 %} { product.calculatedListingPrice.from.unitPrice|currency }} - {{ product.calculatedListingPrice.to.unitPrice|currency }}{{ "general.star"|trans|sw_sanitize }} {% set pricingTop = product.calculatedListingPrice.to.unitPrice %} {% if product.calculatedListingPrice.from.referencePrice.price %} {% set referencePricing %} ({{ product.calculatedListingPrice.from.referencePrice.price|currency }} - {{ product.calculatedListingPrice.to.referencePrice.price|currency }}{{ "general.star"|trans|sw_sanitize }} / {{ product.calculatedListingPrice.from.referencePrice.referenceUnit }} {{ product.calculatedListingPrice.from.referencePrice.unitName }}) {% endset %} {% endif %}#} {% if product.calculatedPrices|length > 1 %} {% set priceFrom = product.calculatedPrices|last %} {% set priceTo = product.calculatedPrices|first %} {% set loopPrice = product.calculatedPrices|first.unitPrice %} {% for element in product.calculatedPrices %} {% if element.unitPrice <= loopPrice %} {% set priceFrom = element %} {% elseif element.unitPrice > loopPrice %} {% set priceTo = element %} {% endif %} {% set loopPrice = element.unitPrice %} {% endfor %} {{ priceFrom.unitPrice|currency }} - {{ priceTo.unitPrice|currency }}{{ "general.star"|trans|sw_sanitize }} {% set pricingTop = priceTo.unitPrice|currency %} {% if priceFrom.referencePrice.price %} {% set referencePricing %} ({{ priceFrom.referencePrice.price|currency }} - {{ priceTo.referencePrice.price|currency }}{{ "general.star"|trans|sw_sanitize }} / {{ priceFrom.referencePrice.referenceUnit }} {{ priceFrom.referencePrice.unitName }}) {% endset %} {% endif %} {% elseif product.calculatedPrices|length == 1 %} {{ product.calculatedPrices.first.unitPrice|currency }}{{ "general.star"|trans|sw_sanitize }} {% set pricingTop = product.calculatedPrices.first.unitPrice %} {% if product.calculatedPrices.first.referencePrice.price %} {% set referencePricing %} ({{ product.calculatedPrices.first.referencePrice.price|currency }}{{ "general.star"|trans|sw_sanitize }} / {{ product.calculatedPrices.first.referencePrice.referenceUnit }} {{ product.calculatedPrices.first.referencePrice.unitName }}) {% endset %} {% endif %} {% else %} {{ product.calculatedPrice.unitPrice|currency }}{{ "general.star"|trans|sw_sanitize }} {# {% if product.calculatedPrice.listPrice.percentage > 0 %}#} {# <span class="list-price">#} {# {{ product.calculatedPrice.listPrice.price|currency }}{{ "general.star"|trans|sw_sanitize }}#} {# </span>#} {# {% endif %}#} {% set pricingTop = product.calculatedPrice.unitPrice %} {% if product.calculatedPrice.referencePrice.price %} {% set referencePricing %} ({{ product.calculatedPrice.referencePrice.price|currency }}{{ "general.star"|trans|sw_sanitize }} / {{ product.calculatedPrice.referencePrice.referenceUnit }} {{ product.calculatedPrice.referencePrice.unitName }}) {% endset %} {% endif %} {% endif %} {% endset %} {% block hueb_accessories_accordion_view %} {% set cover = product.cover.media %} {% set displayMode = 'minimal' %} {% set viewClass = "col-xs-12 col-lg-10" %} {% if page.HuebertAccessoriesDirectly.config.accessoryViewStatic %} {% set viewClass = "col-xs-12 col-lg-6" %} {% if config('HuebertAccessoriesDirectly.config.globalSelectableAmount') == '0' %} {% set viewClass = "col-xs-12 col-lg-" %} {% endif %} {% else %} {% if config('HuebertAccessoriesDirectly.config.globalSelectableAmount') == '0' %} {% set viewClass = "col-xs-12 col-lg-9" %} {% endif %} {% endif %} {% if crossSelling.crossSelling.huebBundle %} {% set viewClass = "col-8" %} {% endif %} {% set selectableAmount = crossSelling.crossSelling.selectableAmount %} {% if selectableAmount == 0 %} {% set selectableAmount = false %} {% set viewClass = "col-xs-12 col-lg-10" %} {% endif %} {% if selectableAmount == 1 %} {% set selectableAmount = true %} {% set viewClass = "col-xs-12 col-lg-7" %} {% endif %} {% if config('HuebertAccessoriesDirectly.config.globalSelectableAmount') == '0' %} {% set selectableAmount = false %} {% set viewClass = "col-xs-12 col-lg-10" %} {% endif %} {% if config('HuebertAccessoriesDirectly.config.globalSelectableAmount') == '1' %} {% set selectableAmount = true %} {% set viewClass = "col-xs-12 col-lg-9" %} {% endif %} <div class="huebert-accessory {% if selectableAmount %}hue-selectableAmount{% else %}hue-checkbox{% endif %}" data-product-id="{{ product.id }}" data-cross-selling-id="{{ crossSelling.crossSelling.id }}"> {% block hueb_accessories_accordion_view_hover %} {% if page.HuebertAccessoriesDirectly.config.accessoryViewHover and cover.url %} <div class="huebert-accessory-hover"> {% set attributes = { 'class': 'product-image is-'~displayMode, 'alt': (cover.translated.alt ?: name), 'title': (cover.translated.title ?: name) } %} {% if displayMode == 'cover' or displayMode == 'contain' %} {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %} {% endif %} {% sw_thumbnails 'product-image-thumbnails' with { media: cover, sizes: { 'xs': '501px', 'sm': '315px', 'md': '427px', 'lg': '333px', 'xl': '284px' } } %} </div> {% endif %} {% endblock %} <div class="row my-2"> <div class="{% if selectableAmount %}col-lg-3{% else %}col-lg-2{% endif %} p-lg-0"> <div class="row"> {% if page.HuebertAccessoriesDirectly.config.accessoryViewStatic %} <div style="padding: 0;" class="col-2 viewport-small"> {{ block('hueb_accessories_accordion_view_thumbnail') }} </div> {% endif %} <div class="col-12"> {% if selectableAmount == 1 %} <div class="viewport-small"> {{ block('hueb_accessories_accordion_view_product_info') }} </div> {% endif %} <div class="row"> {% block hueb_accessories_accordion_view_amount %} {% if not crossSelling.crossSelling.huebBundle %} <div class="{% if selectableAmount %}col-8 col-sm-4 col-lg-12 pr-lg-0 {% else %}checkbox-mobile-wrapper col-lg-12{% endif %}"> <div class="input-group huebert-accessory_input-wrapper {{ not selectableAmount ? 'huebert-checkbox' }}" data-huebert-add-accessory-config="{{ accessoryConfig|json_encode }}" data-huebert-pricing="{{ pricingTop }}"> {% if selectableAmount %} {% if sameQuantityAsMainProduct is same as(null) or sameQuantityAsMainProduct is same as(false) %} <div class="input-group-prepend"> <button type="button" class="input-group-text quantity-dn" name="quantity-down[{{product.id}}]" >{% sw_icon 'minus-circle' %} <span class="sr-only">{{ "huebert-acessories-directly.product-detail.button.minus"|trans|sw_sanitize }}</span> </button> </div> <input class="form-control accessory-quantity" type="text" placeholder="0" name="lineItems[{{ product.id }}][quantity]" aria-label="{{ product.translated.name }} quantity" {% if sameQuantityAsMainProduct %}disabled{% endif %}> <div class="input-group-append"> <button type="button" class="input-group-text quantity-up" name="quantity-up[{{product.id}}]" >{% sw_icon 'plus-circle' %} <span class="sr-only">{{ "huebert-acessories-directly.product-detail.button.plus"|trans|sw_sanitize }}</span> </button> </div> <input type="hidden" name="same-and-selectable" class="same-and-selectable"> {% else %} <div class="form-control same-quantity border-0"><span class="same-quantity-as-main">1</span> x</div> <input type="hidden" name="lineItems[{{ product.id }}][quantity]" class="accessory-quantity"> <input type="hidden" name="same-quantity" class="same-quantity-input" value="1"> <input type="hidden" name="same-and-selectable" class="same-and-selectable" value="1"> {% endif %} {% else %} <input type="hidden" name="lineItems[{{ product.id }}][quantity]" class="accessory-quantity"> <input type="checkbox" class="accessory-checkbox"> <input type="hidden" name="accessory-quantity-as-main" class="accessory-quantity-as-main" value="1"> <input type="hidden" name="lineItems[{{ product.id }}][sameQuantity]" value="1"> <input type="hidden" name="same-and-selectable" class="same-and-selectable"> {% endif %} </div> </div> {% else %} <div class="col-2"> <div style="width: 50px" class="input-group hueb-accessories-bundle-quantity" data-huebert-add-accessory-config="{{ accessoryConfig|json_encode }}" data-huebert-pricing="{{ pricingTop }}"> <input readonly="readonly" class="form-control accessory-quantity" value="{{ huebQuantity }}" autocomplete="off" name="lineItems[{{ product.id }}][quantity]" aria-label="{{ product.translated.name }} quantity"> </div> </div> {% endif %} {% endblock %} {% if selectableAmount == 0 %} <div class="viewport-small hue-product-title"> {{ block('hueb_accessories_accordion_view_product_info') }} </div> {% endif %} <div class="col-4 viewport-small no-pad hue-price-wrapper"> {{ block('hueb_accessories_accordion_view_product_price') }} </div> </div> </div> </div> </div> {% block hueb_accessories_accordion_view_product %} <div class="{{ viewClass }} viewport-default hue-title-price"> {% block hueb_accessories_accordion_view_product_info %} <a href="{{ seoUrl('frontend.detail.page', {'productId': product.id}) }}" data-modal-class="quickview-modal" class="" data-toggle="modal" data-url="{{ seoUrl('widgets.quickview.minimal', {'productId': product.id}) }}" title="{{ product.translated.name }}" > {% if product.customFields.huebert_accessory_directly_customtext %} {{ product.customFields.huebert_accessory_directly_customtext }} {% else %} {{ product.translated.name }} {% endif %} </a> {% if product.productConfigurator|length <=0 or page.acessoryOptions.activateVariants == false or crossSelling.crossSelling.huebBundle %} <div class="product-variant-characteristics huebert-accessory_variants"> <div class="product-variant-characteristics-text"> {% for variation in product.variation %} {{ variation.group }}: <span class="product-variant-characteristics-option"> {{ variation.option }} </span> {% if product.variation|last != variation %} {{ " | " }} {% endif %} {% endfor %} </div> </div> {% endif %} {% endblock %} {% block hueb_accessories_accordion_view_product_price %} {% if product.productConfigurator|length <=0 or page.acessoryOptions.activateVariants == false or crossSelling.crossSelling.huebBundle %} <div class="product-price huebert-accessory_pricing"> {{ "huebert-acessories-directly.product-detail.accessory-price"|trans( {'%price%': pricing} )|sw_sanitize }} </div> {% if page.acessoryOptions.showUnits%} {% if product.purchaseUnit %} {% block buy_widget_price_unit %} <div class="product-detail-price-unit"> {% block buy_widget_price_unit_label %} <span class="price-unit-label"> {{ "detail.priceUnitName"|trans|sw_sanitize }} </span> {% endblock %} {% block buy_widget_price_unit_content %} <span class="price-unit-content"> {{ product.purchaseUnit }} {{ product.unit.name }} {{ referencePricing }} </span> {% endblock %} </div> {% endblock %} {% endif %} {% endif %} {% if referencePricing %}{# <div class="product-detail-price-unit huebert-accessory_pricing-reference">#}{# <span class="price-unit-label">#}{# {{ "detail.priceUnitName"|trans|sw_sanitize }}#}{# </span>#}{# <span class="price-unit-content">#}{# {{ product.calculatedPrice.referencePrice.purchaseUnit }} {{ product.calculatedPrice.referencePrice.unitName }}#}{# </span>#}{# <span class="price-unit-reference-content">#}{# {{ referencePricing }}#}{# </span>#}{# </div>#} {% endif %} {% endif %} {% endblock %} </div> {% if (page.HuebertAccessoriesDirectly.config.showDelivery and product.productConfigurator|length <= 0) or (page.acessoryOptions.activateVariants == false and page.HuebertAccessoriesDirectly.config.showDelivery) %} <div class="{% if selectableAmount %}col-lg-3{% else %}col-lg-2{% endif %}"></div> <div class="{% if selectableAmount %}col-lg-9{% else %}col-lg-10{% endif %} huebert-acessory_deliveryTime"> {% if product.availableStock >= product.minPurchase and product.deliveryTime %} <p class="delivery-information"> <span class="delivery-status-indicator bg-success"></span> {{ "detail.deliveryTimeAvailable"|trans({ '%name%': product.deliveryTime.translation('name') })|sw_sanitize }} </p> <input type="hidden" class="stock-huebert" value=""> {% elseif product.isCloseout and product.availableStock < product.minPurchase %} <p class="delivery-information"> <span class="delivery-status-indicator bg-danger"></span> {{ "detail.soldOut"|trans|sw_sanitize }} </p> <input type="hidden" class="stock-huebert" value="true"> {% elseif product.availableStock < product.minPurchase and product.deliveryTime and product.restockTime %} <p class="delivery-information"> <span class="delivery-status-indicator bg-warning"></span> {{ "detail.deliveryTimeRestock"|trans({ '%count%': product.restockTime, '%restockTime%': product.restockTime, '%name%': product.deliveryTime.translation('name') })|sw_sanitize }} </p> <input type="hidden" class="stock-huebert" value=""> {% endif %} </div> {% endif %} {% endblock %} {% if page.HuebertAccessoriesDirectly.config.accessoryViewStatic %} <div class="col-lg-2 viewport-default thumbnails-view"> {% block hueb_accessories_accordion_view_thumbnail %} {% if cover.url %} {% set attributes = { 'class': 'product-image is-'~displayMode, 'alt': (cover.translated.alt ?: name), 'title': (cover.translated.title ?: name) } %} {% if displayMode == 'cover' or displayMode == 'contain' %} {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %} {% endif %} {% sw_thumbnails 'product-image-thumbnails' with { media: cover, sizes: { 'xs': '501px', 'sm': '315px', 'md': '427px', 'lg': '333px', 'xl': '284px' } } %} {% endif %} {% endblock %} </div> {% endif %} </div> {% if not crossSelling.crossSelling.huebBundle %} <div class="row"> <div class="{% if selectableAmount %}col-lg-3{% else %}col-lg-2{% endif %}"></div> <div class="{% if selectableAmount %}col-lg-9{% else %}col-lg-10{% endif %} product-configurator-variants"> {% block page_product_detail_configurator_include %} {% if page.acessoryOptions.activateVariants %} {% if product.parentId and product.productConfigurator|length > 0 %} <div class="product-detail-configurator-container"> {% sw_include '@Storefront/storefront/page/product-detail/configurator-cross-selling.html.twig' %} </div> {% endif %} {% endif %} {% endblock %} </div> </div> {% endif %} <input type="hidden" class="generated-variant"value=""> <input type="hidden" class="stock-huebert" value=""> </div> {% endblock %} {% endif %} {% endif %} {% endfor %} </div> </div> {% endblock %} </div> {% endif %} {% endfor %} </div> {% endblock %} </div>{% endblock %}