{% set productsCount = products|default([])|length %}{% if isNew|default(false) %} <script type="text/javascript" data-cookieconsent="ignore"> _config.datepicker = true; _config.additionalServices = true; </script> <div class="js-additional-services-datepicker"> <div class="js-additional-services-datepicker__picker mb-3" {{ availableDates|default(null) ? 'data-available-dates=' ~ availableDates|json_encode ~'' : '' }}></div> <input class="js-additional-services-datepicker__alt-field" type="hidden" id="date" name="date" value="{{ date }}"> </div> <div class="additional-services__date">{{ 'demi.additionalservice.products.selected-date'|trans }} <br> {{ elements_dateFormat(date, 'date-day_date_long') }}</div> <ul class="package-group list-unstyled {{ styleModifier|default('') }}"> {% if products|default([]) is empty or productsCount is same as 0 %} <div class="alert alert-danger">{{ "demi.additionalservice.products.no-products"|trans }}</div> {% else %} {# loop0 => count #} {% for productId, data in products %} {% set preparedData = demi_additionalGetProductData(data, productId, service) %} {% set optionsdata = demi_additionalGetProductDatesOptions(preparedData.getPrices, service.getMaxAvailability(), from) %} <li class="my-4 my-md-0"> <section {% if pimcore_device().isDesktop() %} class="card-body bg-white offer-teaser js-tracking js-tracking--impression" data-toggle="modal" data-target="#modal-{{ productId }}" data-focus="false" {% else %} class="card-body bg-white offer-teaser js-overlay__toggle js-tracking js-tracking--impression" data-target="#overlay-{{ productId }}" data-focus="false" {% endif %} data-tracking-name="{{ preparedData.product.parent.parent.name }}" data-tracking-id="{{ loop.index }}" data-tracking-category="{{ preparedData.product.type }}" data-tracking-position="1" data-tracking-brand="{{ preparedData.product.parent.parent.town.name }}" data-tracking-list="Zusatzleistungen" data-tracking-price="{{ optionsdata.price }}" data-tracking-variant="{{ preparedData.product.name }}>" > <div class="row row--gutter-width-20"> <div class="col-12 col-md"> <div class="row"> <div class="col-md-12 col ml-md-1"> <h3 class="text-primary package-group__title mb-1"> <button type="button" class="btn-no-styling">{{ preparedData.product.name }}</button> </h3> </div> <div class="col-md-12 col-auto d-md-none"> <div class="text-success fz23 font-medium package-group__price"> {% if optionsdata.price > 0 %} {{ 'demi.additionalservice.price-from'|trans }} <span class="price">{{ optionsdata.price }} {{ demi_paymentGetCurrency() }}</span> {% else %} <span class="price">{{ 'demi.additionalservice.price-free'|trans }}</span> {% endif %} </div> </div> </div> <div class="wysiwyg">{{ preparedData.text }}</div> </div> <div class="col col-md-12 col-auto d-flex flex-column {% if pimcore_device().isDesktop() %} {{ isAdditionalService|default(false) ? '' : 'border-left' }} pl-3{% endif %}"> <div class="text-success fz23 font-medium mb-2 package-group__price d-none d-md-block"> {% if optionsdata.price > 0 %} {{ 'demi.additionalservice.price-from'|trans }} <span class="price">{{ optionsdata.price }} {{ demi_paymentGetCurrency() }}</span> {% else %} <span class="price">{{ 'demi.additionalservice.price-free'|trans }}</span> {% endif %} </div> {% if not data.getPrices()[0].getBookable() %} <button class="btn btn-success mt-md-auto mt-2 package-group__btn" type="button"> <span class="mr-2" aria-hidden="true"></span> {{ 'demi.additionalservice.products.enquire'|trans }} </button> {% else %} <button class="btn btn-success mt-md-auto mt-2 package-group__btn" type="button"> <span class="btn__icon demi-icon demi-icon-cart mr-2" aria-hidden="true"></span> {{ 'demi.additionalservice.products.add-to-cart'|trans }} </button> {% endif%} </div> </div> </section> {% if pimcore_device().isDesktop() %} {{ include('@ElementsDemiFrontend/AdditionalService/includes/offer-detail.desktop.html.twig', { id: 'modal-' ~ productId, productId: productId, title: item|default([]) ? item.title : '', price: optionsdata.price, isPackage: false, position: loop.index, dateFrom: from, dateTo: to, acco: preparedData.product.parent.parent, }) }} {% else %} {{ include('@ElementsDemiFrontend/AdditionalService/includes/offer-detail.mobile.html.twig', { id: 'overlay-' ~ productId, productId: productId, title: item|default([]) ? item.title : '', price: optionsdata.price, isPackage: false, position: loop.index, dateFrom: from, dateTo: to, acco: preparedData.product.parent.parent, }) }} {% endif %} </li> {% endfor %} {% endif %} </ul>{% else %} <div> <section class=""> <div class=""> <div class=""> {% if products|default([]) is empty or products|length is same as 0 %} <div class="alert alert-danger">{{ "demi.additionalservice.products.no-products"|trans }}</div> {% endif %} </div> <div class="package-group" role="tablist"> {% if not products|default([]) is empty %} {% for productId, data in products %} {% set preparedData = demi_additionalGetProductData(data, productId, service) %} {% set maxCount = preparedData.maxCount %} <div class="js-package-container card-body bg-white offer-teaser" data-package-id="{{ productId }}" data-url="{{ demi_demiUrl({ path: document.fullPath }, 'demi_additionalservice_productlist_ajaxreload') }}" > <form action="{{ demi_demiUrl({ path: document.fullPath }, 'demi_additionalservice_add_additional_item') }}" class="js-additionalservice-add-form additionalservice-form js-package" data-tracking-id="{{ service.parent.id }}" data-tracking-name="{{ demi_impressionName(service.parent) }}" data-tracking-variant="{{ demi_impressionVariant(preparedData.product, null) }}>" data-tracking-category="{{ demi_impressionCategory(service.getParent(), null, null, null, preparedData.product) }}" data-tracking-brand="{{ demi_impressionBrand(service.getParent()) }}" data-tracking-price="{{ preparedData.getPrices[0].getPrice() }}" > <div class="row row--gutter-width-20"> <div> <input type="hidden" name="products[{{ productId }}][settlerCode]" value="{{ data.getSettlerCode( )}}"> <div class="card-header"> <div class="row row--gutter-with-0" role="tab" id="heading-{{ productId }}"> <div class="col-12 col-md"> {{ preparedData.product.name }} </div> </div> </div> <div class="card-body"> <div class="row row--gutter-with-0" role="tab" id="body-{{ productId }}"> <div class="col-md-4 col-12 align-self-center mb-2 mb-md-0"> <span class="float-left additionalservice-booking__price">{{ preparedData.getPrices[0].price is null ? '' : demi_paymentGetPriceObject(preparedData.getPrices[0].price) }}</span> </div> <div class="col-12 col-md-3 align-self-center mb-2 mb-md-0"> <select name="products[{{ productId }}][date]" id="package-{{ productId }}-Date" class="custom-select js-package__update form-control">{# Explanation: $this->services holds all the valid single dates that we can request within the given timerange set for the initial Demi request in the controller. Those dates will be put up for selection. The corresponding prices are not yet valid though. The deskline rule states that only the _one_ price is valid that belongs to the from-date in the request. This means that within a range of - let's say - Monday, 1.4 to Monday 1.5 we get 4 valid dates - one for every wednesday in between with a price of 15€ each. In this case, the 15€ for the first wednesday (3.4.) are not necessarily valid because the range-from-date (mon, 1.4) != first-valid-date (wed, 3.4). So we have to make a new request with the wednesday, 3.4. as from-date. If mon, 1.4 was a valid date already, then we can use the price initially without making a new request.#} {% set optionsdata = demi_additionalGetProductDatesOptions(preparedData.getPrices, service.getMaxAvailability(), from) %} {% if optionsdata.maxCount %}{# if null => no override #} {% set maxCount = optionsdata.maxCount %} {% endif %} {% set price = optionsdata.price %} {% set day = optionsdata.day %} {{ optionsdata.options|raw }} </select> <input type="hidden" name="products[{{ productId }}][durationType]" value="{{ productId }}" > </div> {% set durationPriceData = demi_additionalGetDurationPriceData(preparedData.product, day) %} {% if not durationPriceData is empty %} {% set price = price is numeric ? price : 1 %} {% if durationPriceData|length > 1 %} <div class="col-12 col-md-3"> <select name="products[{{ productId }}][days]" id="package-{{ productId }}-Days" class="custom-select form-control"> {% for numDays, pricePerUnit in durationPriceData %} {% set suffix = numDays == 1 ? 'demi.additionalservice.products.additionalservice.single-day'|trans : 'demi.additionalservice.products.additionalservice.multiple-days'|trans %} <option value="{{ numDays }};{{ pricePerUnit / price }};{{ pricePerUnit|number_format(2,'.', ',') }}" data-price="{{ pricePerUnit|number_format(2,'.', ',') }} CHF">{{ numDays }} {{ suffic }}> (CHF {{ (pricePerUnit/numDays)|number_format(2,'.', ',') }} {{ 'demi.additionalservice.products.additionalservice.per_unit'|trans }} ) </option> {% endfor %} </select> </div> {% else %} {% for numDays, pricePerUnit in durationPriceData %} <input type="hidden" name="products[{{ productId }}][days]" value="{{ numDays }};{{ pricePerUnit / price }};{{ pricePerUnit|number_format(2,'.', ',') }}" data-price="{{ pricePerUnit|number_format(2,'.', ',') }} CHF"> {% endfor %} {% endif %} {% endif %} <div class="col-12 col-md-2"> <label for="package-{{ productId }}-count" class="sr-only">{{ "sr.demi.additionalservice.products.additionalservice.product_count"|trans }} </label> <div class="js-number-spinner number-spinner"> <button type="button" class="btn btn-link js-number-spinner__down number-spinner__down" > <span class="icon icon-minus" aria-label="minus"></span> </button> <input name="products{{ productId }}][count]" id="package-{{ productId }}-count" type="text" class="form-control js-number-spinner__input spinner-input" readonly value="1" data-spinner-max="{{ maxCount }}"> <button type="button" class="btn btn-link js-number-spinner__up number-spinner__up"> <span class="icon icon-plus" aria-label="plus"></span> </button> </div> <script> _config.addPackages = true; _config.maxValue = {{ maxCount }}; </script> </div> {% if maxCount < service.getMaxAvailability() and maxCount >= 0 %} <div class="col-md-auto col-12 align-self-center mb-2 mb-md-0"> <span class="float-left additionalservice-booking__price"> {{ 'demi.additionalservice.products.units-free'|trans }}: {{ maxCount }} </span> </div> {% endif %} </div> </div> </div> </div> {% if maxCount > 0 or service.getMaxAvailability() <= 0 %} <div class="js-additionalservice-add-form__result additionalservice-add-form__result text-right mb-4"> <div class="text-right"> <a href="" class="js-additionalservice-add-form-btn btn btn-cta"> {{ 'demi.additionalservice.products.add-to-cart'|trans }} </a> </div> </div> {% endif %} </form> </div> {% endfor %} {% endif %} </div> </div> </section> </div>{% endif %}