@apicart/vue-components
Version:
Apicart Vue.Js components for simple e-commerce platform development
617 lines (584 loc) • 57.9 kB
JavaScript
/**
* @apicart/vue-components v1.0.0-alpha7
* (c) 2018-2020 Apicart Company
* Released under the MIT License.
*/
import Apicart from '@apicart/core-sdk';
import { Translator } from '../..';
import { ApicartBuyButtonWithQuantity, ApicartButton, ApicartLoader, ApicartPaymentMethodsList, ApicartShippingMethodsList } from './..';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
function __awaiter(thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
}
function __generator(thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
}
var store;
var translator = Apicart.VueComponentsTranslator || Translator;
var i18n = translator.getI18n();
function getDataForTemplate() {
return __awaiter(this, void 0, void 0, function () {
var products, vat, taxBase, totalPrice, cart, cartEntity;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
products = [];
vat = 0;
taxBase = 0;
totalPrice = 0;
if (!(store && store.hasCartHash())) return [3, 4];
return [4, store.getCart()];
case 1:
cart = _a.sent();
return [4, cart.getEntity()];
case 2:
cartEntity = _a.sent();
return [4, cartEntity.getItems()];
case 3:
products = _a.sent();
Apicart.Utils.Loops.forEach(products, function (cartItem) {
var itemEntity = cartItem.getItem();
var itemPrice = cartItem.getTotalPrice();
var itemTaxRate = itemEntity.getTaxRate();
var tax = itemTaxRate / 100 * itemPrice;
taxBase += itemPrice - tax;
vat += tax;
});
totalPrice = cartEntity.getTotalPrice();
_a.label = 4;
case 4:
this.products = products;
this.vat = vat;
this.taxBase = taxBase;
this.totalPrice = totalPrice;
return [2];
}
});
});
}
var windowIsDefined = typeof window !== 'undefined';
var script = {
name: 'apicart-cart-overview',
i18n: i18n,
components: {
'apicart-buy-button-with-quantity': windowIsDefined && window.ApicartBuyButtonWithQuantity
? window.ApicartBuyButtonWithQuantity
: ApicartBuyButtonWithQuantity
},
data: function () {
return {
products: [],
taxBase: 0,
vat: 0,
totalPrice: 0
};
},
methods: {
removeItem: function (event) {
return __awaiter(this, void 0, void 0, function () {
var cart, target;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4, store.getCart()];
case 1:
cart = _a.sent();
target = event.target;
cart.removeItem(target.getAttribute('data-product-url'));
return [2];
}
});
});
}
},
created: function () {
return __awaiter(this, void 0, void 0, function () {
var _this = this;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
store = Apicart.getConfigParameter('store');
return [4, getDataForTemplate.call(this)];
case 1:
_a.sent();
Apicart.Utils.EventDispatcher.addListener('apicart-cart-overview-' + this._uid, 'apicart:cart:updated', function () {
getDataForTemplate.call(_this);
});
return [2];
}
});
});
}
};
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = ".apicart-cart-overview{position:relative;margin-bottom:24px}@media (min-width:992px){.apicart-cart-overview{margin-bottom:48px}}.apicart-cart-overview__empty-cart{text-align:center;padding:20px 0}.apicart-cart-overview__title{text-align:center;margin-bottom:12px;font-size:34px}.apicart-cart-overview__items{border:1px solid #e6e6e7;margin-bottom:20px;border-radius:2px}.apicart-cart-overview__item{display:flex;min-height:100px;flex-direction:row;align-items:flex-start;border-bottom:1px solid #e6e6e7;border-radius:2px}@media (min-width:768px){.apicart-cart-overview__item{align-items:center}}.apicart-cart-overview__item:last-child{border-bottom:0}.apicart-cart-overview__item-image-wrapper{width:100px;max-height:100px;padding:8px;justify-content:center;display:flex}@media (min-width:768px){.apicart-cart-overview__item-image-wrapper{padding:10px}}.apicart-cart-overview__item-image{max-width:100%;max-height:60px}.apicart-cart-overview__item-info{display:flex;flex-wrap:wrap;flex-direction:column;align-items:flex-start;flex:1;padding:10px 0}@media (min-width:768px){.apicart-cart-overview__item-info{flex-direction:row;align-items:center}}.apicart-cart-overview__item-name{flex-grow:1;margin-bottom:8px;font-weight:500;font-size:14px}@media (min-width:576px){.apicart-cart-overview__item-name{flex-grow:1;max-width:30%}}@media (min-width:768px){.apicart-cart-overview__item-name{font-size:18px;flex-grow:1;margin-bottom:0;max-width:44%;display:flex}}.apicart-cart-overview__item-details{white-space:nowrap;flex:1;display:flex;align-items:center;flex-wrap:wrap;flex-direction:row;justify-content:space-between}.apicart-cart-overview__item-detail-info{margin:0 8px 8px 8px}@media (min-width:576px){.apicart-cart-overview__item-detail-info{margin:0 8px}}.apicart-cart-overview__item-price-per-piece{text-align:center;white-space:nowrap;font-size:14px}@media (min-width:768px){.apicart-cart-overview__item-price-per-piece{width:18%;font-size:18px}}.apicart-cart-overview__item-total-price{text-align:center;white-space:nowrap;font-weight:500;font-size:14px}@media (min-width:768px){.apicart-cart-overview__item-total-price{width:18%;font-size:18px}}.apicart-cart-overview__item-remove-button{display:flex;padding:1px;font-size:24px;justify-content:center;align-items:center;height:50px;text-align:center;width:50px;cursor:pointer}.apicart-cart-overview__summary{position:relative;display:flex;justify-content:flex-end}.apicart-cart-overview__summary-items{display:inline-flex;flex-direction:column;width:200px}.apicart-cart-overview__summary-item{display:flex;margin-bottom:4px;justify-content:space-between}.apicart-cart-overview__summary-item--total-price{font-size:20px}";
styleInject(css_248z);
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
if (typeof shadowMode !== 'boolean') {
createInjectorSSR = createInjector;
createInjector = shadowMode;
shadowMode = false;
}
// Vue.extend constructor export interop.
const options = typeof script === 'function' ? script.options : script;
// render functions
if (template && template.render) {
options.render = template.render;
options.staticRenderFns = template.staticRenderFns;
options._compiled = true;
// functional template
if (isFunctionalTemplate) {
options.functional = true;
}
}
// scopedId
if (scopeId) {
options._scopeId = scopeId;
}
let hook;
if (moduleIdentifier) {
// server build
hook = function (context) {
// 2.3 injection
context =
context || // cached call
(this.$vnode && this.$vnode.ssrContext) || // stateful
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__;
}
// inject component styles
if (style) {
style.call(this, createInjectorSSR(context));
}
// register component module identifier for async chunk inference
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier);
}
};
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook;
}
else if (style) {
hook = shadowMode
? function (context) {
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
}
: function (context) {
style.call(this, createInjector(context));
};
}
if (hook) {
if (options.functional) {
// register for functional component in vue file
const originalRender = options.render;
options.render = function renderWithStyleInjection(h, context) {
hook.call(context);
return originalRender(h, context);
};
}
else {
// inject component registration as beforeCreate hook
const existing = options.beforeCreate;
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
}
}
return script;
}
/* script */
const __vue_script__ = script;
/* template */
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{attrs:{"id":_vm.$t('checkout.cartOverview.id')}},[_c('div',{staticClass:"apicart-cart-overview__items"},[_vm._l((_vm.products),function(product){return _c('div',{staticClass:"apicart-cart-overview__item"},[(product.getItem().getParameterValue('images').primary.url)?_c('div',{staticClass:"apicart-cart-overview__item-image-wrapper"},[_c('img',{staticClass:"apicart-cart-overview__item-image",attrs:{"src":product.getItem().getParameterValue('images').primary.url,"loading":"lazy","alt":""}})]):_vm._e(),_c('div',{staticClass:"apicart-cart-overview__item-info"},[_c('div',{staticClass:"apicart-cart-overview__item-name"},[_vm._v(" "+_vm._s(product.getItem().getName())+" ")]),_c('div',{staticClass:"apicart-cart-overview__item-details"},[_c('div',{staticClass:"apicart-cart-overview__item-detail-info apicart-cart-overview__item-price-per-piece"},[_vm._v(" "+_vm._s(_vm.$n(product.getItem().getPrice(), 'currency'))+" ")]),_c('div',{staticClass:"apicart-cart-overview__item-detail-info"},[_c('apicart-buy-button-with-quantity',{attrs:{"quantity":product.getQuantity(),"productUrl":product.getItem().getDataUrl()}})],1),_c('div',{staticClass:"apicart-cart-overview__item-detail-info apicart-cart-overview__item-total-price"},[_vm._v(" "+_vm._s(_vm.$n(product.getTotalPrice(), 'currency'))+" ")])])]),_c('div',{staticClass:"apicart-cart-overview__item-remove-button-wrapper"},[_c('a',{staticClass:"apicart-cart-overview__item-remove-button",attrs:{"role":"button","data-product-url":product.getItem().getDataUrl()},on:{"click":_vm.removeItem}},[_c('span',{staticClass:"apicart-icon-x"})])])])}),(!_vm.products.length)?_c('div',{staticClass:"apicart-cart-overview__empty-cart"},[_vm._v(_vm._s(_vm.$t('checkout.cartOverview.emptyCart')))]):_vm._e()],2),_c('div',{staticClass:"apicart-cart-overview__summary"},[_c('div',{staticClass:"apicart-cart-overview__summary-items"},[_c('div',{staticClass:"apicart-cart-overview__summary-item"},[_c('span',[_vm._v(_vm._s(_vm.$t('checkout.cartOverview.taxBase'))+": ")]),_c('span',[_vm._v(_vm._s(_vm.$n(_vm.taxBase, 'currency')))])]),_c('div',{staticClass:"apicart-cart-overview__summary-item"},[_c('span',[_vm._v(_vm._s(_vm.$t('checkout.cartOverview.vat'))+":")]),_c('span',[_vm._v(_vm._s(_vm.$n(_vm.vat, 'currency')))])]),_c('div',{staticClass:"apicart-cart-overview__summary-item apicart-cart-overview__summary-item--total-price"},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.cartOverview.totalPrice'))+":")]),_c('strong',[_vm._v(_vm._s(_vm.$n(_vm.totalPrice, 'currency')))])])])])])};
var __vue_staticRenderFns__ = [];
/* style */
const __vue_inject_styles__ = undefined;
/* scoped */
const __vue_scope_id__ = undefined;
/* module identifier */
const __vue_module_identifier__ = undefined;
/* functional template */
const __vue_is_functional_template__ = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__ = normalizeComponent(
{ render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
__vue_inject_styles__,
__vue_script__,
__vue_scope_id__,
__vue_is_functional_template__,
__vue_module_identifier__,
false,
undefined,
undefined,
undefined
);
var store$1;
var translator$1 = Apicart.VueComponentsTranslator || Translator;
var i18n$1 = translator$1.getI18n();
var windowIsDefined$1 = typeof window !== 'undefined';
var script$1 = {
name: 'apicart-contact-information-form',
i18n: i18n$1,
components: {
'apicart-button': windowIsDefined$1 && window.ApicartButton ? window.ApicartButton : ApicartButton,
},
data: function () {
return {
shippingInfoVisible: false,
errors: [],
billingAddress: {
email: '',
firstName: '',
lastName: '',
city: '',
zip: '',
streetAndNumber: ''
},
shippingAddress: {
firstName: '',
lastName: '',
city: '',
zip: '',
streetAndNumber: ''
}
};
},
methods: {
validateForm: function () {
var _this = this;
var errors = [];
Apicart.Utils.Loops.forEach(this.billingAddress, function (value) {
if (!value) {
errors.push(_this.$t('checkout.contactInformationForm.validation.requiredFields'));
return false;
}
});
this.errors = errors;
return this.errors.length === 0;
},
getContactInfoData: function (fillMissingShippingInfo) {
var _this = this;
if (fillMissingShippingInfo === void 0) { fillMissingShippingInfo = true; }
var shippingAddress = this.shippingAddress;
if (fillMissingShippingInfo) {
Apicart.Utils.Loops.forEach(this.shippingAddress, function (value, key) {
if (!value) {
shippingAddress[key] = _this.billingAddress[key];
}
});
}
return {
billingAddress: this.billingAddress,
shippingAddress: shippingAddress
};
}
},
created: function () {
store$1 = Apicart.getConfigParameter('store');
}
};
var css_248z$1 = ".apicart-contact-information-form__section{margin-bottom:24px}.apicart-contact-information-form__title{font-size:34px;margin-top:0;margin-bottom:12px;text-align:center}.apicart-contact-information-form__finish-order-button-wrapper{text-align:center}.apicart-contact-information-form textarea{resize:vertical;max-height:200px;min-height:100px}.apicart-contact-information-form__label{margin-bottom:8px;display:inline-block}.apicart-contact-information-form__field{display:block;outline:0;width:100%;padding:6px 12px;font-size:1rem;line-height:1.5;color:#121212;background-color:#fff;background-clip:padding-box;border:1px solid rgba(18,18,18,.3);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;border-radius:2px}.apicart-contact-information-form__show-shipping-form{position:relative;padding-left:32px;display:flex;align-items:center}.apicart-contact-information-form__show-shipping-form input{display:none}.apicart-contact-information-form__show-shipping-form input:checked+.apicart-contact-information-form__show-shipping-form-input-placeholder{background-color:#121212}.apicart-contact-information-form__show-shipping-form-input-placeholder{position:absolute;left:0;display:inline-block;border:2px solid #b3b3b3;display:block;width:14px;height:14px;pointer-events:none;user-select:none;background-color:#e6e6e7;background-repeat:no-repeat;background-position:center center;background-size:90%;box-shadow:0;transition:background-color .3s}.apicart-contact-information-form__field-wrapper{margin-top:0;margin-bottom:12px}.apicart-contact-information-form__fields-pair{display:flex;flex-direction:column;justify-content:space-between}@media (min-width:576px){.apicart-contact-information-form__fields-pair{flex-direction:row}}@media (min-width:576px){.apicart-contact-information-form__fields-pair .apicart-contact-information-form__field-wrapper{width:49%}}.apicart-contact-information-form__loading{opacity:0;transition:opacity .1s;text-align:center;margin-top:14px}.apicart-contact-information-form__loading--visible{opacity:1}";
styleInject(css_248z$1);
/* script */
const __vue_script__$1 = script$1;
/* template */
var __vue_render__$1 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('form',{staticClass:"apicart-contact-information-form",attrs:{"id":_vm.$t('checkout.contactInformationForm.id'),"onsubmit":"return false;"},on:{"submit":function($event){$event.preventDefault();return _vm.finishOrder($event)}}},[_c('div',{staticClass:"apicart-contact-information-form__section",attrs:{"id":_vm.$t('checkout.contactInformationForm.billing.id')}},[_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"billing-address-email"}},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.billing.email'))+"*")])]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.billingAddress.email),expression:"billingAddress.email"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"billing-address-email","type":"email","required":""},domProps:{"value":(_vm.billingAddress.email)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.billingAddress, "email", $event.target.value);}}})]),_c('div',{staticClass:"apicart-contact-information-form__fields-pair"},[_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"billing-address-first-name"}},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.billing.firstName'))+"*")])]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.billingAddress.firstName),expression:"billingAddress.firstName"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"billing-address-first-name","type":"text","required":""},domProps:{"value":(_vm.billingAddress.firstName)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.billingAddress, "firstName", $event.target.value);}}})]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"billing-address-last-name"}},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.billing.lastName'))+"*")])]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.billingAddress.lastName),expression:"billingAddress.lastName"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"billing-address-last-name","type":"text","required":""},domProps:{"value":(_vm.billingAddress.lastName)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.billingAddress, "lastName", $event.target.value);}}})])]),_c('div',{staticClass:"apicart-contact-information-form__fields-pair"},[_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"billing-address-city"}},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.billing.town'))+"*")])]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.billingAddress.city),expression:"billingAddress.city"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"billing-address-city","type":"text","required":""},domProps:{"value":(_vm.billingAddress.city)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.billingAddress, "city", $event.target.value);}}})]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"billing-address-zip"}},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.billing.zip'))+"*")])]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.billingAddress.zip),expression:"billingAddress.zip"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"billing-address-zip","type":"text","required":""},domProps:{"value":(_vm.billingAddress.zip)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.billingAddress, "zip", $event.target.value);}}})])]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"billing-address-street-and-number"}},[_c('strong',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.billing.streetAndNumber'))+"*")])]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.billingAddress.streetAndNumber),expression:"billingAddress.streetAndNumber"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"billing-address-street-and-number","type":"text","required":""},domProps:{"value":(_vm.billingAddress.streetAndNumber)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.billingAddress, "streetAndNumber", $event.target.value);}}})])]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__show-shipping-form"},[_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingInfoVisible),expression:"shippingInfoVisible"}],staticClass:"apicart-contact-information-form__show-shipping-form-checkbox",attrs:{"type":"checkbox"},domProps:{"checked":Array.isArray(_vm.shippingInfoVisible)?_vm._i(_vm.shippingInfoVisible,null)>-1:(_vm.shippingInfoVisible)},on:{"change":function($event){var $$a=_vm.shippingInfoVisible,$$el=$event.target,$$c=$$el.checked?(true):(false);if(Array.isArray($$a)){var $$v=null,$$i=_vm._i($$a,$$v);if($$el.checked){$$i<0&&(_vm.shippingInfoVisible=$$a.concat([$$v]));}else {$$i>-1&&(_vm.shippingInfoVisible=$$a.slice(0,$$i).concat($$a.slice($$i+1)));}}else {_vm.shippingInfoVisible=$$c;}}}}),_c('span',{staticClass:"apicart-contact-information-form__show-shipping-form-input-placeholder"}),_c('span',[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.fillShippingInfoButton')))])])]),_c('div',{directives:[{name:"show",rawName:"v-show",value:(_vm.shippingInfoVisible),expression:"shippingInfoVisible"}],staticClass:"apicart-contact-information-form__section",attrs:{"id":_vm.$t('checkout.contactInformationForm.shipping.id')}},[_c('h2',{staticClass:"apicart-contact-information-form__title"},[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.shipping.title')))]),_c('div',{staticClass:"apicart-contact-information-form__fields-pair"},[_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"shipping-address-name"}},[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.shipping.firstName')))]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingAddress.firstName),expression:"shippingAddress.firstName"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"shipping-address-name","type":"text"},domProps:{"value":(_vm.shippingAddress.firstName)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.shippingAddress, "firstName", $event.target.value);}}})]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"shipping-address-surname"}},[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.shipping.lastName')))]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingAddress.lastName),expression:"shippingAddress.lastName"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"shipping-address-surname","type":"text"},domProps:{"value":(_vm.shippingAddress.lastName)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.shippingAddress, "lastName", $event.target.value);}}})])]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"shipping-address-company"}},[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.shipping.company')))]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingAddress.company),expression:"shippingAddress.company"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"shipping-address-company","type":"text"},domProps:{"value":(_vm.shippingAddress.company)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.shippingAddress, "company", $event.target.value);}}})]),_c('div',{staticClass:"apicart-contact-information-form__fields-pair"},[_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"shipping-address-city"}},[_vm._v(_vm._s(('checkout.contactInformationForm.shipping.town')))]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingAddress.city),expression:"shippingAddress.city"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"shipping-address-city","type":"text"},domProps:{"value":(_vm.shippingAddress.city)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.shippingAddress, "city", $event.target.value);}}})]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"shipping-address-zip"}},[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.shipping.zip')))]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingAddress.zip),expression:"shippingAddress.zip"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"shipping-address-zip","type":"text"},domProps:{"value":(_vm.shippingAddress.zip)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.shippingAddress, "zip", $event.target.value);}}})])]),_c('p',{staticClass:"apicart-contact-information-form__field-wrapper"},[_c('label',{staticClass:"apicart-contact-information-form__label",attrs:{"for":"shipping-address-street-and-number"}},[_vm._v(_vm._s(_vm.$t('checkout.contactInformationForm.shipping.streetAndNumber')))]),_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.shippingAddress.streetAndNumber),expression:"shippingAddress.streetAndNumber"}],staticClass:"apicart-contact-information-form__field",attrs:{"id":"shipping-address-street-and-number","type":"text"},domProps:{"value":(_vm.shippingAddress.streetAndNumber)},on:{"input":function($event){if($event.target.composing){ return; }_vm.$set(_vm.shippingAddress, "streetAndNumber", $event.target.value);}}})])]),_c('p',[_c('em',{domProps:{"innerHTML":_vm._s(_vm.$t('checkout.contactInformationForm.requiredFields'))}})])])};
var __vue_staticRenderFns__$1 = [];
/* style */
const __vue_inject_styles__$1 = undefined;
/* scoped */
const __vue_scope_id__$1 = undefined;
/* module identifier */
const __vue_module_identifier__$1 = undefined;
/* functional template */
const __vue_is_functional_template__$1 = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$1 = normalizeComponent(
{ render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
__vue_inject_styles__$1,
__vue_script__$1,
__vue_scope_id__$1,
__vue_is_functional_template__$1,
__vue_module_identifier__$1,
false,
undefined,
undefined,
undefined
);
var store$2;
var translator$2 = Apicart.VueComponentsTranslator || Translator;
var i18n$2 = translator$2.getI18n();
var windowIsDefined$2 = typeof window !== 'undefined';
var script$2 = {
name: 'apicart-checkout',
i18n: i18n$2,
components: {
'apicart-button': windowIsDefined$2 && window.ApicartButton ? window.ApicartButton : ApicartButton,
'apicart-contact-information-form': windowIsDefined$2 && window.ApicartContactInformationForm
? window.ApicartContactInformationForm : __vue_component__$1,
'apicart-cart-overview': windowIsDefined$2 && window.ApicartCartOverview
? window.ApicartCartOverview
: __vue_component__,
'apicart-loader': windowIsDefined$2 && window.ApicartLoader ? window.ApicartLoader : ApicartLoader,
'apicart-payment-methods-list': windowIsDefined$2 && window.ApicartPaymentMethodsList
? window.ApicartPaymentMethodsList : ApicartPaymentMethodsList,
'apicart-shipping-methods-list': windowIsDefined$2 && window.ApicartShippingMethodsList
? window.ApicartShippingMethodsList : ApicartShippingMethodsList
},
data: function () {
return {
step: 1,
errors: [],
productsLength: 0,
paymentMethod: null,
shippingMethod: null,
showLoaderOverlay: false,
totalPrice: 0,
taxBase: 0,
vat: 0
};
},
computed: {
paymentAndShippingMethodsLoadingEnabled: function () {
return this.step === 2;
}
},
methods: {
continueShopping: function () {
this.$emit('continue-shopping');
},
validateCheckout: function () {
return __awaiter(this, void 0, void 0, function () {
var errors, contactInformationFormIsValid, cart;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
errors = [];
contactInformationFormIsValid = this.$refs.contactInformationForm.validateForm();
if (!contactInformationFormIsValid) {
errors = errors.concat(this.$refs.contactInformationForm.errors);
}
if (!this.paymentMethod) {
errors.push(this.$t('checkout.validation.missingPaymentMethod'));
}
if (!this.shippingMethod) {
errors.push(this.$t('checkout.validation.missingShippingMethod'));
}
return [4, store$2.getCart()];
case 1:
cart = _a.sent();
return [4, cart.getItems()];
case 2:
if ((_a.sent()).length === 0) {
errors.push(this.$t('checkout.validation.emptyCart'));
}
this.errors = errors;
return [2, errors.length === 0];
}
});
});
},
finishOrder: function () {
return __awaiter(this, void 0, void 0, function () {
var checkoutValidationPasses, checkoutTabsWrapper, contactInformation, contactInformationBillingAddress, cart, customer;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4, this.validateCheckout()];
case 1:
checkoutValidationPasses = _a.sent();
if (!checkoutValidationPasses) {
checkoutTabsWrapper = this.$el.querySelector('.apicart-checkout__step-tabs');
checkoutTabsWrapper.scrollTop = checkoutTabsWrapper.scrollHeight;
return [2];
}
this.showLoaderOverlay = true;
contactInformation = this.$refs.contactInformationForm.getContactInfoData();
contactInformationBillingAddress = contactInformation.billingAddress;
return [4, store$2.getCart()];
case 2:
cart = _a.sent();
return [4, store$2.getCustomer()];
case 3:
customer = _a.sent();
return [4, Promise.all([
cart.addParameters(contactInformation),
customer.addParameters({
email: contactInformationBillingAddress.email,
firstName: contactInformationBillingAddress.firstName,
lastName: contactInformationBillingAddress.lastName,
city: contactInformationBillingAddress.city,
zip: contactInformationBillingAddress.zip,
streetAndNumber: contactInformationBillingAddress.streetAndNumber,
phone: contactInformationBillingAddress.phone
})
])];
case 4:
_a.sent();
return [4, cart.finish()];
case 5:
_a.sent();
this.showLoaderOverlay = false;
return [2];
}
});
});
},
setStep: function (number) {
this.step = number;
this.$el.querySelector('.apicart-checkout__step-tabs').scrollTop = 0;
},
updatePaymentMethod: function (paymentMethod) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
this.paymentMethod = paymentMethod;
return [2];
});
});
},
updateShippingMethod: function (shippingMethod) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
this.shippingMethod = shippingMethod;
return [2];
});
});
},
updateContactInformation: function () {
return __awaiter(this, void 0, void 0, function () { return __generator(this, function (_a) {
return [2];
}); });
},
getDataForSummary: function (cart) {
if (cart === void 0) { cart = null; }
return __awaiter(this, void 0, void 0, function () {
var productsLength, vat, taxBase, totalPrice, _a, cartEntity, products;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
productsLength = 0;
vat = 0;
taxBase = 0;
totalPrice = 0;
if (!(store$2 && store$2.hasCartHash())) return [3, 5];
_a = cart;
if (_a) return [3, 2];
return [4, store$2.getCart()];
case 1:
_a = (_b.sent());
_b.label = 2;
case 2:
cart = _a;
return [4, cart.getEntity()];
case 3:
cartEntity = _b.sent();
return [4, cartEntity.getItems()];
case 4:
products = _b.sent();
productsLength = products.length;
Apicart.Utils.Loops.forEach(products, function (cartItem) {
var itemEntity = cartItem.getItem();
var itemPrice = cartItem.getTotalPrice();
var itemTaxRate = itemEntity.getTaxRate();
var tax = itemTaxRate / 100 * itemPrice;
taxBase += itemPrice - tax;
vat += tax;
});
totalPrice = cartEntity.getTotalPrice();
_b.label = 5;
case 5:
this.productsLength = productsLength;
this.vat = vat;
this.taxBase = taxBase;
this.totalPrice = totalPrice;
return [2];
}
});
});
},
},
created: function () {
return __awaiter(this, void 0, void 0, function () {
var _this = this;
return __generator(this, function (_a) {
store$2 = Apicart.getConfigParameter('store');
this.getDataForSummary();
Apicart.Utils.EventDispatcher.addListener('apicart-checkout-summary-' + this._uid, 'apicart:cart:updated', function (cart) {
_this.getDataForSummary(cart);
});
return [2];
});
});
}
};
var css_248z$2 = ".apicart-checkout{font-family:-apple-system,\"Segoe UI\",Roboto,Oxygen,Ubuntu,Cantarell,\"Helvetica Neue\",Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";-webkit-font-smoothing:antialiased;box-sizing:border-box;outline:0}.apicart-checkout *{box-sizing:border-box;outline:0}.apicart-checkout{position:relative}.apicart-checkout__stepper{display:flex;align-items:stretch;justify-content:space-between;margin-bottom:8px}@media (min-width:768px){.apicart-checkout__stepper{margin-bottom:24px}}.apicart-checkout__stepper-divider{display:flex;margin:0 10px;height:1px;max-width:100%;min-width:20px;margin:26px -26px 0 -26px;flex:1;border:1px solid #e6e6e7;transition:border-color .3s}.apicart-checkout__stepper-step{display:flex;flex-direction:column;padding:10px;text-align:center;width:calc(100% * 1/3);max-width:138px;align-items:center;cursor:pointer}@media (min-width:768px){.apicart-checkout__stepper-step{max-width:180px}}.apicart-checkout__stepper-step-label{color:#9e9e9e;transition:color .3s;font-size:12px}.apicart-checkout__stepper-step-number{color:#fff;text-align:center;display:inline-block;background:rgba(18,18,18,.4);margin-bottom:8px;font-weight:500;font-size:16px;width:26px;border-radius:100%;line-height:26px;transition:background-color .3s}.apicart-checkout__stepper-step--active .apicart-checkout__stepper-step-label{color:#121212}.apicart-checkout__stepper-step--active .apicart-checkout__stepper-step-number{background-color:#121212}.apicart-checkout__stepper-divider--active{border-color:#121212}.apicart-checkout__errors{color:#721c24;background-color:#f8d7da;border-color:#f5c6cb;padding:12px 16px 12px 16px;border-radius:2px}@media (min-width:768px){.apicart-checkout__errors{padding:12px 30px 12px 30px}}.apicart-checkout__errors-title{margin-top:0;font-size:16px;margin-bottom:8px}@media (min-width:768px){.apicart-checkout__errors-title{font-size:18px}}.apicart-checkout__errors-list{line-height:24px;font-weight:700;padding-left:18px;margin-bottom:0;margin-top:0;font-size:12px}@media (min-width:768px){.apicart-checkout__errors-list{font-size:14px}}.apicart-checkout__step-tabs{position:relative;min-height:460px;display:flex;flex-grow:1;overflow:auto;margin-bottom:8px}@media (min-width:768px){.apicart-checkout__step-tabs{margin-bottom:24px}}.apicart-checkout__step-tab{position:absolute;left:0;top:0;width:100%;z-index:1;opacity:1;transition:opacity .3s}.apicart-checkout__step-tab-enter,.apicart-checkout__step-tab-leave-active{opacity:0}.apicart-checkout__step-tab-enter,.apicart-checkout__step-tab-leave-to{opacity:0}.apicart-checkout__footer-buttons-wrapper{display:flex;flex-direction:column;opacity:1;transition:opacity .3s}@media (min-width:576px){.apicart-checkout__footer-buttons-wrapper{flex-direction:row;justify-content:space-between;align-items:center}}.apicart-button.apicart-checkout__footer-button{margin-bottom:8px}@media (min-width:576px){.apicart-button.apicart-checkout__footer-button{margin-bottom:0}}.apicart-checkout__footer-button-icon{font-size:24px}.apicart-checkout__footer-button-icon--prev{margin-right:4px}@media (min-width:576px){.apicart-checkout__footer-button-icon--prev{margin-right:8px}}.apicart-checkout__footer-button-icon--next{margin-left:4px}@media (min-width:576px){.apicart-checkout__footer-button-icon--next{margin-left:8px}}.apicart-checkout__payment-and-shipping-methods-wrapper{display:flex;flex-direction:column}@media (min-width:768px){.apicart-checkout__payment-and-shipping-methods-wrapper{align-items:flex-start;flex-direction:row;justify-content:space-between}}@media (min-width:768px){.apicart-checkout__payment-and-shipping-methods-wrapper .apicart-payment-methods-list,.apicart-checkout__payment-and-shipping-methods-wrapper .apicart-shipping-methods-list{max-width:49%}}.apicart-checkout__step-tab--contact-information-content{display:flex;flex-direction:column}@media (min-width:768px){.apicart-checkout__step-tab--contact-information-content{flex-direction:row;justify-content:space-between;align-items:flex-start}}.apicart-checkout__contact-information-form-wrapper{margin-bottom:12px}@media (min-width:768px){.apicart-checkout__contact-information-form-wrapper{max-width:50%;margin-bottom:0}}.apicart-checkout__order-summary{width:100%;background-color:rgba(18,18,18,.03);padding:12px;border-radius:2px}@media (min-width:768px){.apicart-checkout__order-summary{max-width:49%;min-width:320px;width:auto;padding:22px}}.apicart-checkout__order-summary-title{text-align:center;margin-top:0;font-size:22px}.apicart-checkout__order-summary-table{width:100%}.apicart-checkout__order-summary-table-row{line-height:22px;font-size:14px}.apicart-checkout__order-summary-table-cell{text-align:left}.apicart-checkout__order-summary-table-cell--right{text-align:right}.apicart-checkout__order-summary-table-row--total-price{font-size:18px;font-weight:500}.apicart-checkout__order-summary-table-row--total-price .apicart-checkout__order-summary-table-cell{padding-top:12px}.apicart-checkout__loader-overlay{position:absolute;top:0;left:0;z-index:1;width:100%;background:rgba(255,255,255,.8);height:100%;transition:opacity .3s}.apicart-checkout__loader-overlay .apicart-loader{display:block;width:100%;top:50%;position:absolute;text-align:center;transform:translateY(-50%)}.apicart-checkout__loader-overlay-enter{opacity:0}.apicart-checkout__loader-overlay-active{opacity:0}";
styleInject(css_248z$2);
/* script */
const __vue_script__$2 = script$2;
/* template */
var __vue_render__$2 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"apicart-checkout"},[_c('h1',{staticStyle:{"text-align":"center"}},[_vm._v(_vm._s(_vm.$t('checkout.title')))]),_c('div',{staticClass:"apicart-checkout__stepper"},[_c('a',{class:[{'apicart-checkout__stepper-step--active': _vm.step >= 1}, 'apicart-checkout__stepper-step'],attrs:{"role":"button"},on:{"click":function($event){return _vm.setStep(1)}}},[_c('span',{staticClass:"apicart-checkout__stepper-step-number"},[_vm._v("1")]),_c('span',{staticClass:"apicart-checkout__stepper-step-label"},[_vm._v(_vm._s(_vm.$t('checkout.steps.cartOverview')))])]),_c('hr',{class:[{'apicart-checkout__stepper-divider--active': _vm.step >= 2}, 'apicart-checkout__stepper-divider']}),_c('a',{class:[{'apicart-checkout__stepper-step--active': _vm.step >= 2}, 'apicart-checkout__stepper-step'],attrs:{"role":"button"},on:{"click":function($event){return _vm.setStep(2)}}},[_c('span',{staticClass:"apicart-checkout__stepper-step-number"},[_vm._v("2")]),_c('span',{staticClass:"apicart-checkout__stepper-step-label"},[_vm._v(_vm._s(_vm.$t('checkout.steps.paymentAndDelivery')))])]),_c('hr',{class:[{'apicart-checkout__stepper-divider--active': _vm.step >= 3}, 'apicart-checkout__stepper-divider']}),_c('a',{class:[{'apicart-checkout__stepper-step--active': _vm.step >= 3}, 'apicart-checkout__stepper-step'],attrs:{"role":"button"},on:{"click":function($event){return _vm.setStep(3)}}},[_c('span',{staticClass:"apicart-checkout__stepper-step-number"},[_vm._v("3")]),_c('span',{staticClass:"apicart-checkout__stepper-step-label"},[_vm._v(_vm._s(_vm.$t('checkout.steps.contactInformation')))])])]),_c('div',{staticClass:"apicart-checkout__step-tabs"},[_c('transition',{attrs:{"name":"apicart-checkout__step-tab"}},[_c('div',{directives:[{name:"show",rawName:"v-show",value:(_vm.step === 1),expression:"step === 1"}],staticClass:"apicart-checkout__step-tab"},[_c('apicart-cart-overview')],1)]),_