// import * as Sentry from "@sentry/browser"; // import { Integrations } from "@sentry/tracing"; // // Sentry.init({ // // dsn: "https://8269dd83371d4eaeb7815ff3f9d42983@logs.storeino.com/19", // // integrations: [new Integrations.BrowserTracing()], // // // Set tracesSampleRate to 1.0 to capture 100% // // // of transactions for performance monitoring. // // // We recommend adjusting this value in production // // tracesSampleRate: 1.0, // // }); // import _ from 'lodash' var vm = new StoreinoApp({ el: "#app_expresscheckout", data() { return { config: __DATA__, tools: { getPixel : (order) => { let pixel = { content_ids: order.details.map(d=>d.product._id), contents: order.details.map(d=>{ return { name: d.product.name.replace('&','and'), id: d.product._id, price: d.product.price.salePrice, quantity: d.quantity } }), total: order.total, fbParams:{} }; if (order.shipping.address && order.shipping.address.firstname) pixel.fbParams['user_firstname'] = order.shipping.address.firstname; if (order.shipping.address && order.shipping.address.lastname) pixel.fbParams['user_lastname'] = order.shipping.address.lastname; if (order.shipping.address && order.shipping.address.country && order.shipping.address.country.code) pixel.fbParams['user_country'] = order.shipping.address.country.code.toLowerCase(); if (order.shipping.address && order.shipping.address.phone) pixel.fbParams['user_phone'] = order.shipping.address.phone; if (order.customer.email) pixel.fbParams['user_email'] = order.customer.email; pixel = JSON.stringify(pixel); pixel = encodeURI(pixel); return pixel; }, validateEmail : (email) => { // is valid email if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email)) return true return false }, validatePhone : (phone, min=6, max=14)=> { // Get digits if(!phone) return true; phone = phone.replace(/[^0-9\u0660-\u0669+]/g, ''); // is valid phone if (phone.length < parseInt(min) || phone.length > parseInt(max)){ return true } return false } }, showCaptcha: false, products: [], store: { state: { cart: [], language: { code: 'EN', name: 'English' }, currency: { code: 'USD', symbol: '$' }, }, }, sending: false, displayMap:false, loading:{ zones: true, cart: true, zoneTimes: 0 }, settings: null, errors: {}, show:{ products: false, coupon: false, }, localization:{ position: {}, zoom: 12, center: [51.505, -0.09], url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", attribution: '© OpenStreetMap contributors', markerPos: [51.505, -0.09], }, locals: { create_account: false, ship_to_different_address: false, shippers: [], shipper: null, methods: [], method: null, subtotal: 0, shipping: 0, discount: { type: 'percentage', value: 0, price: 0 }, total: 0 }, items: [], preferredCountries: [], infoContry:{}, singular: { countries: 'country', provinces: 'province', cities: 'city' }, shipLocations: { countries: [], provinces: [], cities: [] }, locations: { countries: [], provinces: [], cities: [] }, customer: { firstname: '', lastname: '', fullname: '', password: '', email: '', phone: '', token: undefined, ipAddress: undefined, address:{ address1: '', address2: '', country:null, province:null, city:{ name:'', _id:undefined } } }, order:{ customer:{ firstname: '', lastname: '', fullname: '', email: '' }, shipping:{ zone:null, shipper:null, price:0, address: { firstname: '', lastname: '', fullname: '', address1: '', address2: '', phone: '', country:null, province:null, city:{ name:'', _id:undefined } } }, discount: null, details: [], customerNote: '', method: null }, details:null, pickedColle:'', fromInitCart:false, isAffiliate:false, relatedProductds:[], collectionsRelated:[], selectedProduct:[], isOpen:false, isPaypalToCheckoutActive: false, thanksPath: "#", ctk:null, activeCountry: { code: "ma" }, open: false, manualTrigger: false, selectedIndex: null, typeToFindInput: "", typeToFindTimer: null } }, watch:{ "store.state.cart":{ handler:function(){ this.calculate("fronWatch"); }, deep:true }, 'localization.position': { deep: true, async handler(value) { this.localization.position = value this.localization.markerPos = [value.lat,value.lng]; this.$emit("input", value ); } }, // defaultCountry(newVal) { // const defaultCountry = this.findCountry(newVal); // this.choose(defaultCountry); // }, "locals":{ handler:function(){ this.calculate("fromLocal"); }, deep:true }, "order":{ handler:function(){ this.abandonmentCart(); }, deep:true }, "customer":{ handler:function(){ this.abandonmentCart(); }, deep:true }, "customer.address":{ handler:function(val){ this.abandonmentCart(); if(!this.locals.ship_to_different_address){ this.shipLocations = JSON.parse(JSON.stringify(this.locations)); this.order.shipping.address.country = val.country; this.order.shipping.address.province = val.province; this.order.shipping.address.city = val.city; } }, deep:true }, "order.shipping.address.country":{ handler:function(val){ if(this.loading.zoneTimes > 3) {this.getZones(); if (!this.settings.checkout_required_fields.typing_city_manually) { this.order.shipping.address.city = null this.customer.address.city = null } this.order.shipping.address.province = null this.customer.address.province = null } }, deep:true }, "order.shipping.address.province":{ handler:function(val){ if(this.loading.zoneTimes > 3){ this.getZones(); if (!this.settings.checkout_required_fields.typing_city_manually) { this.order.shipping.address.city = null this.customer.address.city = null } } }, deep:true }, "order.shipping.address.city":{ handler:function(val){ if(this.loading.zoneTimes > 3 || this.settings.checkout_required_fields.typing_city_manually) this.getZones(); }, deep:true }, "locals.ship_to_different_address"(val){ if(!val){ this.shipLocations = JSON.parse(JSON.stringify(this.locations)); this.order.shipping.address.country = this.customer.address.country; this.order.shipping.address.province = this.customer.address.province; this.order.shipping.address.city = this.customer.address.city; } } }, // computed: { // filteredCountries() { // // List countries after filtered // if (this.onlyCountries.length) { // return this.getCountries(this.onlyCountries); // } // return preferredCountries; // }, // // sortedCountries() { // // // Sort the list countries: from preferred countries to all countries // // const preferredCountries = this.getCountries( // // this.preferredCountries // // ).map(country => ({ ...country, preferred: true })); // // return [...preferredCountries, ...this.filteredCountries]; // // } // }, async mounted(){ if (!window.products) window.products = [] this.products = window.products window.removeEventListener('CURRENT_PRODUCT', this.currentProduct, true); this.settings = await this.getSettings(); this.store.state.currency = this.settings.store_currencies.find(currency => currency.default) || this.store.state.currency; this.store.state.currency = window.$nuxt.$store.state.currency this.normalizeSettings(); if(!this.settings.checkout_headlines.buy_now_color) this.$set(this.settings.checkout_headlines,'buy_now_color', "#40c11f"); if(!this.settings.checkout_headlines.text_color) this.$set(this.settings.checkout_headlines,'text_color', "#444444"); if(!this.settings.checkout_headlines.price_color) this.$set(this.settings.checkout_headlines,'price_color', "#ff3344"); if(!this.settings.checkout_headlines.bg_color) this.$set(this.settings.checkout_headlines,'bg_color', "#ffffff"); if(!this.settings.checkout_headlines.bg_color) this.$set(this.settings.checkout_headlines,'bg_color', "#eeeeee"); if (!this.settings.checkout_required_fields.typing_city_manually) { this.order.shipping.address.city = null this.customer.address.city = null } // 1 await this.getMethods(); await this.getLocations('world', undefined); this.getCountriesInfo() if(this.settings.checkout_required_fields.show_ship_to_different_address){ this.shipLocations = JSON.parse(JSON.stringify(this.locations)); } this.checkMethods() // this.initializeCountry(); // this.$emit("onSelect", this.activeCountry); // window.removeEventListener('CURRENT_PRODUCT', this.currentProduct, true); // if(window.getEventListeners(window).CURRENT_PRODUCT && window.getEventListeners(window).CURRENT_PRODUCT.length < 1) { // } window.addEventListener("CURRENT_PRODUCT", this.currentProduct, true); window.dispatchEvent(new CustomEvent("APP_LOADER")); if(this.settings.checkout_required_fields.show_captcha){ this.loadScript('https://www.google.com/recaptcha/api.js', 'recaptcha'); } if(this.settings.checkout_required_fields.auto_coupon && this.settings.checkout_headlines.auto_code_coupon){ this.show.coupon = true; this.locals.discount.code = this.settings.checkout_headlines.auto_code_coupon this.applyCoupon() } // if(this.settings.checkout_required_fields.show_localisation){ // this.loadScript('https://unpkg.com/leaflet/dist/leaflet.js', 'leaflet'); // this.loadScript('https://unpkg.com/vue2-leaflet', 'vue2-leaflet'); // this.loadStyle('https://unpkg.com/leaflet/dist/leaflet.css','leafletcss'); // } }, filters:{ method(value, lang){ const translates = { AR: { Hyperpay:'Hyperpay', CashOnDelivery: 'الدفع عند الاستلام', PayPal: 'الدفع عبر بايبال', Stripe: 'الدفع ببطاقة الائتمان',"Paypal-Credit-Card": 'الدفع ببطاقة الائتمان','cmi': 'الدفع ببطاقة الائتمان مغربية',paytech: 'Paytech' }, EN: { Hyperpay:'Hyperpay', CashOnDelivery: 'Cash on delivery', PayPal: 'PayPal', Stripe: 'Credit Card',"Paypal-Credit-Card": 'Credit Card',cmi: 'Credit Card Moroccan',paytech: 'Paytech' }, FR: { Hyperpay:'Hyperpay', CashOnDelivery: 'Paiement à la livraison', PayPal: 'PayPal', Stripe: 'Carte bancaire',"Paypal-Credit-Card": 'Carte bancaire',cmi: 'Carte bancaire Marocain',paytech: 'Paytech' }, } return translates[lang][value]; } }, methods: { loadScript(url, id){ return new Promise(function(resolve, reject) { const exists = document.getElementById(id); if(!exists){ const script = document.createElement('script'); script.src = url; script.async = true; script.defer = true; script.id = id; document.body.appendChild(script); script.onload = () => { resolve(); } }else resolve(); }); }, tickLocal(position){ this.localization.position = {lat: position.coords.latitude,lng : position.coords.longitude} this.localization.markerPos = [ position.coords.latitude,position.coords.longitude] }, openMap(){ window.navigator.geolocation.getCurrentPosition(this.tickLocal); this.displayMap = true; }, onMapClick(value) { this.localization.position = value.latlng; this.localization.markerPos = [value.latlng.lat,value.latlng.lng]; }, updateMarker(e) { this.localization.markerPos = [e.target._latlng.lat,e.target._latlng.lng]; this.localization.position = e.target._latlng; }, sortedObject(unordered) { return Object.keys(unordered).sort().reduce( (obj, key) => { obj[key] = unordered[key]; return obj; }, {}); }, async currentProduct(e){ const productId = document.querySelector('[itemprop="productID"]')? document.querySelector('[itemprop="productID"]').content : null; if(productId && productId != e.detail.product_id) return; if( JSON.stringify(this.sortedObject(this.details ? this.details : '{}')) === JSON.stringify(this.sortedObject(e.detail )))return; this.details = e.detail; const cartItem = { _id: e.detail.product_id, quantity: e.detail.product_quantity || 1 }; if(e.detail.product_variant) cartItem.variant = { _id: e.detail.product_variant }; this.store.state.currency = this.settings.store_currencies.find(currency => currency.code == e.detail.product_currency) || this.store.state.currency; this.locals.subtotal = e.detail.product_price.salePrice * e.detail.product_quantity; // if(e.detail.) this.isAffiliate = true; console.log("e.detail",e.detail); this.store.state.cart = []; await this.initCart([cartItem]); this.calculate("fromCurrentP"); }, checkMethods(){ if(this.settings.checkout_defaults.active_payment_time){ const hours = new Date().getHours(); const Minute = new Date().getMinutes(); const date = `${String(hours).length === 1 ? '0'+hours : hours}:${String(Minute).length === 1 ? '0'+Minute : Minute}` const check_methods = this.locals.methods.filter(meth => this.settings.checkout_defaults.active_payment_time[meth.name].is_active); const methods = this.locals.methods.filter(meth => !this.settings.checkout_defaults.active_payment_time[meth.name].is_active); if(check_methods.length > 0){ for (const method of check_methods) { if(this.settings.checkout_defaults.active_payment_time[method.name].start >= date || this.settings.checkout_defaults.active_payment_time[method.name].end <= date){ methods.push(method) } } this.locals.methods = methods if(this.locals.methods.length > 0){ this.locals.method = this.locals.methods[0]; } } } }, async getSettings(){ if(window.$nuxt && window.$nuxt.$store && window.$nuxt.$store.state.settings){ if(window.$nuxt.$store.state.IP) this.customer.ipAddress = window.$nuxt.$store.state.IP; return (({ checkout_defaults, store_currencies, checkout_error_messages, checkout_headlines, checkout_labels, checkout_placeholders, checkout_required_fields, checkout_steps }) => ({ checkout_defaults, store_currencies, checkout_error_messages, checkout_headlines, checkout_labels, checkout_placeholders, checkout_required_fields, checkout_steps }))($nuxt.$store.state.settings); } const response = await StoreinoApp.$store.search("settings", { "key-in": ["checkout_defaults", "store_currencies", "checkout_error_messages", "checkout_headlines", "checkout_labels", "checkout_placeholders", "checkout_required_fields", "checkout_steps"], }); const settings = {}; for(result of response.results){ settings[result.key] = result.value; }; return (({ checkout_defaults, store_currencies, checkout_error_messages, checkout_headlines, checkout_labels, checkout_placeholders, checkout_required_fields, checkout_steps }) => ({ checkout_defaults, store_currencies, checkout_error_messages, checkout_headlines, checkout_labels, checkout_placeholders, checkout_required_fields, checkout_steps }))(settings); }, cancelText(){ let txt = "Cancel"; switch (this.store.state.language.code) { case "AR": txt = "إلغاء" break; case "EN": txt = "Cancel" break; case "FR": txt = "Annuler" break; } return txt; }, async initPaypal(order,paypalOrder,clientId,thanksPath,customerToken = ''){ this.isPaypalToCheckoutActive = false; try { let linkPaypal = `https://www.paypal.com/sdk/js?client-id=${clientId}&components=buttons,funding-eligibility`; await this.loadScript(linkPaypal,'paypalToCheckout'); } catch (error) { console.error("failed to load the PayPal JS SDK script", error); } if (paypal) { try { const vm = this; paypal.getFundingSources().forEach(function(fundingSource) { let button = paypal.Buttons({ style: { height: 55, }, fundingSource: fundingSource, createOrder(data, actions) { return actions.order.create(paypalOrder); }, onCancel: function (data) { // location.href = thanksPath; vm.isPaypalToCheckoutActive = false; }, onApprove(data, actions){ try { return actions.order.capture().then(function(details) { StoreinoApp.$store.customUpdate('orders',{ orderId: order.orderId },{ payment: { isPaid: true, method: 'PAYPAL CHECKOUT' } },{ 'x-auth-token': customerToken }); location.href = thanksPath; }); } catch (err) { console.log({err}); } } }); if (button.isEligible() && fundingSource != "paypal") { button.render('#paypal_credit_cart'); vm.isPaypalToCheckoutActive = true; } }); } catch (error) { console.error("failed to render the PayPal Buttons", error); vm.isPaypalToCheckoutActive = false; } } }, async next(){ if(this.sending) return; this.errors = {}; this.sending = true; if(this.showCaptcha){ const token = await grecaptcha.getResponse(); if(token){ this.customer.token = token; this.showCaptcha = false; }else{ return this.showCaptcha = true; } } if( this.settings.checkout_defaults.is_min_cost && typeof this.settings.checkout_defaults.min_cost === 'object' && this.settings.checkout_defaults.min_cost[this.store.state.currency.code] && this.locals.subtotal < this.settings.checkout_defaults.min_cost[this.store.state.currency.code].value ) { this.errors.min_cost = true; this.sending = false; return; } if(this.settings.checkout_required_fields.show_fullname) this.fillName(this.customer); try{ // cData => customer data const cData = JSON.parse(JSON.stringify(this.customer)); if(this.locals.create_account) cData.isRegistred = true; cData.address.firstname = this.customer.firstname; cData.address.lastname = this.customer.lastname; // const dialCode = this.infoContry ? this.infoContry :'' if(this.customer.phone) cData.address.phone = this.customer.phone; delete cData.fullname; const action = this.order.customer._id ? 'update' : 'create'; const query = this.order.customer._id ? { _id: this.order.customer._id } : { }; const sourceCS = localStorage.getItem('CSource'); cData.source = sourceCS ? sourceCS : '' if(this.settings.checkout_required_fields.show_localisation && Object.keys(this.localization.position).length > 0) cData.address.location = this.localization.position let valid = this.isValid('customer', cData); if(!valid){ this.sending = false; return; } this.normalize(cData); // cResponse => customer response const cResponse = await StoreinoApp.$store[action]('customers', query, cData); if(action == 'create'){ this.order.customer = cResponse.customer; this.ctk = cResponse.tokenCustomer; document.cookie = `CUSTOMER=${cResponse.tokenCustomer}; path=/`; try { let fbparams = {}; // if (this.dataCustomer.Customer.firstname) fbparams['user_firstname'] = this.dataCustomer.Customer.firstname; // if (this.dataCustomer.Customer.lastname) fbparams['user_lastname'] = this.dataCustomer.Customer.lastname; // if (this.dataCustomer.Customer.phone) fbparams['user_phone'] = this.dataCustomer.Customer.phone; // if (this.dataCustomer.Customer.email) fbparams['user_email'] = this.dataCustomer.Customer.email; _fbpx('CompleteRegistration',{ content_name: document.title, status: true, value: this.locals.subtotal, currency: this.store.state.currency, },fbparams); } catch (error) {} }else{ this.order.customer = cResponse; } // oData => order data const oData = JSON.parse(JSON.stringify(this.order)); if(this.locals.method){ oData.method = { _id: this.locals.method._id, name: this.locals.method.name }; } if(this.locals.shipper && this.locals.shipper._id){ oData.shipping.zone = this.locals.shipper.zone; oData.shipping.shipper = { _id: this.locals.shipper._id, name: this.locals.shipper.name }; } if(this.locals.discount && this.locals.discount._id) oData.discount = { _id: this.locals.discount._id, code: this.locals.discount.code }; if(!this.locals.ship_to_different_address){ oData.shipping.address = cData.address; } if(this.settings.checkout_required_fields.show_fullname) this.fillName(oData.shipping.address); oData.shipping.address.fullname = undefined; // Fill details oData.details = []; for (const item of this.store.state.cart) { const detail = { product: { _id: item._id }, quantity: item.quantity }; if(item.variant && item.variant._id) detail.product.variant = { _id: item.variant._id }; if(item.upsell && item.upsell._id) detail.upsell = { _id: item.upsell._id }; oData.details.push(detail); } valid = this.isValid('order', oData); if(!valid){ this.sending = false; return; } this.normalize(oData); // oResponse => order response const oResponse = await StoreinoApp.$store.create('orders',{ cur:this.store.state.currency.code, lang:this.store.state.language.code },oData); const order = oResponse.result; document.cookie = `ORDER_ID=${order.orderId}; path=/`; document.cookie = `ORDER_STATE=${JSON.stringify(order)}; path=/`; window.dispatchEvent(new CustomEvent('ORDER_PLACED', { detail: { _id: order._id } })); let pixel = this.tools.getPixel(order); let thanksPath = `${location.origin}/checkout/thanks/?method=${order.method.name}&code=${order.orderId}&pixel=${pixel}`; let codeSnap = location.href.split("&").filter(e => e.includes('ScCid'))[0] if(codeSnap) { thanksPath += `&${codeSnap}` } this.thanksPath = thanksPath; if(oResponse.paymentResponse.approveLink){ if (order.method.name != 'Hyperpay') location.href = oResponse.paymentResponse.approveLink; else location.href = `${oResponse.paymentResponse.approveLink}&redirect=${thanksPath}`; return; } if (oResponse.paymentResponse.clientId && oResponse.paymentResponse.paypalOrder) { this.initPaypal(oResponse.result,oResponse.paymentResponse.paypalOrder,oResponse.paymentResponse.clientId,thanksPath,this.ctk); this.sending = false; return; } location.href = thanksPath; return; }catch(err){ console.log({err}); this.sending = false; if(e.response && e.response.data == 'solve_captcha'){ this.showCaptcha = true; return; } const error = e.response ? JSON.stringify(e.response.data) : e.message; let key1 = null; for (const key in this.settings.checkout_error_messages) { if(error.indexOf(key) > -1){ key1 = key; this.errors[key] = true; } } if(key1) alert(this.settings.checkout_error_messages[key1]); else alert(e.response); return; } }, async getCountriesInfo(){ if(window.$nuxt && window.$nuxt.$store && window.$nuxt.$store.state.settings){ if( this.settings.checkout_required_fields.autoDetectCountry && window.$nuxt.$store.state.IP ){ const baseUrl = window.$nuxt.$store.state.settings.store.subdomain.includes('.world') ? 'https://api-stores.storeino.world' : 'https://api-stores.storeino.com' const data4 = await window.$nuxt.$store.$http.get(`${baseUrl}/api/countries/search`, { params:{only: ['name','dialCode','code'], limit: 1000 }}); this.preferredCountries = data4.status === 200 ? data4.data.results : []; const contryByIp = await window.$nuxt.$store.$http.get(`https://api-views.storeino.com/api/geoLite/get?ip=${window.$nuxt.$store.state.IP}`); let selected = this.preferredCountries.filter(ct => ct.code.toLowerCase() === contryByIp.data.geoplugin_countryCode.toLowerCase()) this.customer.address.country = selected[0] await this.getLocations("country", selected[0]._id); } // this.$store.state.form.user.country = this.$store.state.countries.find(country => country.code == this.$store.state.form.user.country.code); // this.$store.state.form.user.phone.code = this.$store.state.form.user.country.dialCode; } }, async applyCoupon(){ if(!this.locals.discount.code) return; try{ const response = await StoreinoApp.$store.get('discounts', { code: this.locals.discount.code }); if(response.target === 'SELECTED' && response.products.length > 0 ){ if(typeof response.products[0] === 'string' && !response.products.includes(this.details.product_id)){ return this.$set(this.errors,'coupon', true); } if(typeof response.products[0] === 'object'){ let prod = response.products.filter(prod => prod._id === this.details.product_id) if (prod.length === 0) { return this.$set(this.errors,'coupon', true); }else if(prod[0].by_quantity && prod[0].quantity >= this.items[0].quantity.value ){ return; } } } this.locals.discount._id = response._id; this.locals.discount.type = response.type; this.locals.discount.value = response.value; this.calculate("fromCoupon"); }catch(err){ console.log({err}); this.$set(this.errors,'coupon', true); } }, async getMethods(){ try { const { results } = await StoreinoApp.$store.search('methods',{}); this.locals.methods = results; if(this.locals.methods.length > 0){ this.locals.method = this.locals.methods[0]; } } catch (err) { console.log({err}); } }, async getLocations(type, parentId, isShipping=false) { this.loading.zoneTimes++; this.loading.zones = true; if(type == 'city'){ if(this.loading.zoneTimes > 3 || this.settings.checkout_required_fields.typing_city_manually){ this.getZones(); } return; } const object = isShipping ? this.order.shipping : this.customer; const base = isShipping ? 'shipLocations' : 'locations'; const params = { [type]: parentId }; if( type == 'province' && !object.address.country) return; if (type == "province") params.country = object.address.country._id; try { const { results } = await StoreinoApp.$store.search('locations', params); if (type == "country") { this[base].provinces = results; this[base].cities = []; if(this.settings.checkout_defaults.isCustomize_zone && this.settings.checkout_defaults.customize_zone && this.settings.checkout_defaults.customize_zone.provinces){ if(this.settings.checkout_defaults.customize_zone.provinces.length > 0){ this[base].provinces = results.filter(province => this.settings.checkout_defaults.customize_zone.provinces.includes(province._id)) if (this[base].provinces.length < 1) { this[base].provinces = results } } } if(this.settings.checkout_defaults.province && !this[base].provinces.find(e=>e._id === this.settings.checkout_defaults.province._id)){ this.settings.checkout_defaults.province = {_id: '5feb408a2ef4130539efb9e0', name: 'DISABLED'}; } if(this.settings.checkout_defaults.has_province && this.settings.checkout_defaults.province){ object.address.province = this.settings.checkout_defaults.province; await this.getLocations("province", this.settings.checkout_defaults.province._id, isShipping); }else if(this[base].provinces.length > 0){ // object.address.province = this[base].provinces[0]; await this.getLocations("province", this[base].provinces[0]._id, isShipping); } } else if (type == "province") { this[base].cities = results; if(this.settings.checkout_defaults.isCustomize_zone && this.settings.checkout_defaults.customize_zone && this.settings.checkout_defaults.customize_zone.cities){ if(this.settings.checkout_defaults.customize_zone.cities.length > 0){ this[base].cities = results.filter(city => this.settings.checkout_defaults.customize_zone.cities.includes(city._id)) if (this[base].cities.length < 1) { this[base].cities = results } } } if(this.settings.checkout_defaults.city && !this[base].cities.find(e=>e._id === this.settings.checkout_defaults.city._id)){ this.settings.checkout_defaults.city = {_id: '5feb408a2ef4130539efb9e0', name: 'DISABLED'}; } if(this.settings.checkout_defaults.has_city && this.settings.checkout_defaults.city){ object.address.city = this.settings.checkout_defaults.city; }else if(this[base].cities.length > 0 && !this.settings.checkout_required_fields.typing_city_manually){ // object.address.city = this[base].cities[0]; } }else { this[base].countries = results; this[base].provinces = []; this[base].cities = []; console.log(this.settings.checkout_defaults.isCustomize_zone && this.settings.checkout_defaults.customize_zone && this.settings.checkout_defaults.customize_zone.countries); if(this.settings.checkout_defaults.isCustomize_zone && this.settings.checkout_defaults.customize_zone && this.settings.checkout_defaults.customize_zone.countries){ if(this.settings.checkout_defaults.customize_zone.countries.length > 0){ this[base].countries = results.filter(country => this.settings.checkout_defaults.customize_zone.countries.includes(country._id)) console.log("countries=====>2",this[base].countries.filter(country => this.settings.checkout_defaults.customize_zone.countries.includes(country._id))) console.log("countries=====>",this[base].countries) } } if(this.settings.checkout_defaults.has_country && this.settings.checkout_defaults.country){ object.address.country = this.settings.checkout_defaults.country; await this.getLocations("country", this.settings.checkout_defaults.country._id, isShipping); }else if(this[base].countries.length > 0){ // object.address.country = this[base].countries[0]; // await this.getLocations("country", object.address.country._id, isShipping); } } } catch (err) { console.log({err}); } }, async getZones(){ this.loading.zones = true; this.errors.shipping = false; clearTimeout(window.zoneTimeout); window.zoneTimeout = setTimeout(async ()=>{ this.getZonesDebounced(); }, 1000); }, async getZonesDebounced(){ this.locals.shippers = []; try { const { results } = await StoreinoApp.$store.search('zones',{ country: this.order.shipping.address.country && this.order.shipping.address.country._id, province: this.order.shipping.address.province && this.order.shipping.address.province._id, city: this.order.shipping.address.city && this.order.shipping.address.city._id }); const zones = results; for (const zone of zones) { for (const shipper of zone.shippers) { const index = this.locals.shippers.findIndex(e=>e._id === shipper._id); if(index > -1){ if(this.locals.shippers[index].price > shipper.price){ this.locals.shippers[index].price = shipper.price; this.locals.shippers[index].zone = { _id: zone._id, name: zone.name }; } }else{ shipper.zone = {_id: zone._id, name: zone.name}; this.locals.shippers.push(shipper); } } } if(this.locals.shippers.length > 0 && !this.locals.shipper){ this.locals.shipper = this.locals.shippers[0]; }else if(this.locals.shippers.length > 0 && this.locals.shippers.find(e=>e._id === this.locals.shipper._id)){ this.locals.shipper = this.locals.shippers.find(e=>e._id === this.locals.shipper._id); }else if(this.locals.shippers.length > 0){ this.locals.shipper = this.locals.shippers[0]; } this.calculate("fromZone"); } catch (err) { console.log({err}); } if(this.locals.shippers.length == 0){ this.locals.shipper = null; this.locals.zone = null; } this.loading.zones = false; }, selectd(product){ let index = this.selectedProduct.findIndex(p => p._id === product._id) if (index > -1) return; this.selectedProduct.push(product) let cartItem = {}; this.store.state.cart.push({ "_id": product._id, "quantity": product.quantity.default, "price": product.price.salePrice, "parents": [] }) console.log('cart__1',this.store.state.cart); cartItem._id = product._id; cartItem.slug = product.slug; cartItem.name = product.name; cartItem.price = product.price.salePrice; cartItem.quantity = {...product.quantity,value:product.quantity.default} cartItem.quantity.value = product.quantity.default; cartItem.image = product.images.length > 0 ? product.images[0].src : ''; if(product.variant && product.variant._id){ cartItem.variant = product.variants.find(variant => variant._id === product.variant._id); cartItem.price = cartItem.variant.price.salePrice; if(cartItem.variant.quantity.pack && cartItem.variant.quantity.pack > 0){ cartItem.quantity.value = cartItem.variant.quantity.pack; } } if(product.upsell){ cartItem.upsell = product.upsell; const discount = cartItem.upsell.type == 'percentage' ? cartItem.price * (cartItem.upsell.value / 100) : cartItem.upsell.value cartItem.originalPrice = cartItem.price; cartItem.price = cartItem.price - discount; } cartItem.total = cartItem.price * cartItem.quantity.value; this.items.push(cartItem) console.log('items___&',this.items); this.isOpen = !this.isOpen }, onRemove(itemId){ this.selectedProduct = this.selectedProduct.filter(p => p._id !== itemId) this.store.state.cart = this.store.state.cart.filter(p => p._id !== itemId) this.items = this.items.filter(p => p._id !== itemId) }, async pickCollectionReq(arrColl){ const productsResult = await StoreinoApp.$store.search('products', { "collections.slug-in[]": arrColl, "status":"PUBLISH", "outStock.disabled":true, limit:10 }, true ); this.relatedProductds = productsResult.results }, pickCollection(arrColl){ this.pickedColle = arrColl this.pickCollectionReq(this.pickedColle) }, async initCart(cart){ this.collectionsRelated = []; this.store.state.cart = []; this.store.state.cart = cart; // this.items = []; const ids = cart.map(e => e._id); this.loading.cart = true; if(ids.length > 0){ try{ const item = cart[0] || {}; let product = window.products.find(p => p._id === item._id); if (!product) { const response = await StoreinoApp.$store.search('products',{ '_id': ids[0], status:'all' }); this.products = response.results; let windowProduct = [...window.products, ...this.products] window.products = Array.from(new Set(windowProduct.map(JSON.stringify))).map(JSON.parse) // window.products = [...window.products, ...this.products] } product = window.products.find(p => p._id === item._id); if (this.settings.checkout_required_fields.show_related_upsell) { if (product && product.collections.length != 0) { product.collections.forEach(col => { this.collectionsRelated.push(col.slug); }); this.pickCollectionReq( this.collectionsRelated) } } const cartItem = {}; cartItem._id = product._id; cartItem.slug = product.slug; cartItem.name = product.name; cartItem.price = product.price.salePrice; cartItem.quantity = product.quantity; cartItem.quantity.value = item.quantity || 1; cartItem.image = product.images.length > 0 ? product.images[0].src : ''; if(item.variant && item.variant._id){ cartItem.variant = product.variants.find(variant => variant._id === item.variant._id); cartItem.price = cartItem.variant.price.salePrice; if(cartItem.variant.quantity.pack && cartItem.variant.quantity.pack > 0){ cartItem.quantity.value = cartItem.variant.quantity.pack; } } if(item.upsell){ cartItem.upsell = item.upsell; const discount = cartItem.upsell.type == 'percentage' ? cartItem.price * (cartItem.upsell.value / 100) : cartItem.upsell.value cartItem.originalPrice = cartItem.price; cartItem.price = cartItem.price - discount; } cartItem.total = cartItem.price * cartItem.quantity.value; this.items = [cartItem]; if(this.settings.checkout_required_fields.auto_coupon_by_quantity && this.settings.checkout_headlines.auto_code_coupon){ this.locals.discount.code = this.settings.checkout_headlines.auto_code_coupon const response = await StoreinoApp.$store.get('discounts', { code: this.locals.discount.code }); if(typeof response.products[0] === 'object' && response.target === 'SELECTED'){ let prod = response.products.filter(prod => prod._id === this.items[0]._id) if(prod.length > 0 && prod[0].by_quantity && prod[0].quantity <= cartItem.quantity.value ){ this.locals.discount._id = response._id; this.locals.discount.type = response.type; this.locals.discount.value = response.value; }else if (prod.length > 0 && !prod[0].by_quantity ) { this.locals.discount._id = response._id; this.locals.discount.type = response.type; this.locals.discount.value = response.value; }else{ this.locals.discount._id = ""; this.locals.discount.type = ""; this.locals.discount.value = 0; this.locals.discount.price = 0 } } } this.calculate("fromInitCart"); }catch(err){ console.log('error check',err); console.log({err}); } } this.loading.cart = false; }, async calculate(from){ if (from === 'fromInitCart') { this.fromInitCart = true; } let shipping = 0; const subTotal = this.items.reduce((total, item) => total + (item.price * item.quantity.value), 0); this.locals.subtotal = subTotal if(this.settings.checkout_defaults.has_shipping){ if(typeof this.settings.checkout_defaults.shipping === 'object'){ if (this.settings.checkout_defaults.shipping[this.store.state.currency.code]) { shipping = Number(this.settings.checkout_defaults.shipping[this.store.state.currency.code].value); } else { shipping = 0; } }else{ shipping = Number(this.settings.checkout_defaults.shipping); } this.locals.shipper = null; }else shipping = 0; if(this.locals.shipper) shipping = this.locals.shipper.price; if(this.settings.checkout_defaults.has_min_price_freeshipping && this.locals.subtotal > this.settings.checkout_defaults.min_price_freeshipping){ shipping = 0; } if(this.locals.discount.value != 0){ if(this.locals.discount.type == 'percentage'){ this.locals.discount.price = this.locals.subtotal * (this.locals.discount.value / 100); }else{ this.locals.discount.price = this.locals.discount.value; } } if(this.locals.discount.type == 'free_shipping'){ shipping = 0; } this.locals.shipping = shipping; this.locals.total = this.locals.subtotal + this.locals.shipping - this.locals.discount.price; if(this.items.length === 0 && subTotal === 0 && this.fromInitCart){ location.reload(); } }, fillName(obj=this.customer){ if(obj.fullname){ const names = obj.fullname.trim().split(' '); switch (names.length) { case 1 : obj.firstname = names[0]; obj.lastname = names[0] ; break; case 2 : obj.firstname = names[0]; obj.lastname = names[1] ; break; case 3 : obj.firstname = names[0]; obj.lastname = names[1] + ' ' + names[2] ; break; default : obj.firstname = names[0] + ' ' + names[1]; obj.lastname = names[2] + ' ' + names[3] ; break; } } }, isValid(type, data){ this.errors = {}; if(type == 'customer'){ // "firstname":"Invalid first name", if(data.firstname.length < 2){ this.errors.firstname = true; this.errors.fullname = true; } // "lastname":"Invalid last name", if(data.lastname.length < 2){ this.errors.lastname = true; this.errors.fullname = true; } // "email":"Invalid email", if((this.settings.checkout_required_fields.show_email && data.email) || this.settings.checkout_required_fields.email){ if(!this.tools.validateEmail(data.email)) this.errors.email = true; } // "phone":"Invalid phone", if((this.settings.checkout_required_fields.show_phone && data.phone) || this.settings.checkout_required_fields.phone){ if(this.tools.validatePhone(data.phone, this.settings.checkout_defaults.phone_min, this.settings.checkout_defaults.phone_max)){ this.errors.phone = true; }} // "password":"Invalid password", if((this.settings.checkout_required_fields.show_password && this.locals.create_account) || this.settings.checkout_required_fields.password){ if(data.password.length < 4) this.errors.password = true; } // "address1":"Invalid address1", if((this.settings.checkout_required_fields.show_address1 && data.address.address1) || this.settings.checkout_required_fields.address1){ if(data.address.address1.length < 4) this.errors.address1 = true; } // "address2":"Invalid address2", if((this.settings.checkout_required_fields.show_address2 && data.address.address2) || this.settings.checkout_required_fields.address2){ if(data.address.address2.length < 4) this.errors.address2 = true; } // "countries":"Invalid country", if(this.settings.checkout_required_fields.show_countries && this.settings.checkout_required_fields.countries){ if(!(data.address.country && data.address.country._id)) this.errors.countries = true; } // "provinces":"Invalid province", if(this.settings.checkout_required_fields.show_provinces && this.settings.checkout_required_fields.provinces){ if(!(data.address.province && data.address.province._id)) this.errors.provinces = true; } // "cities":"Invalid city", if(this.settings.checkout_required_fields.show_cities && this.settings.checkout_required_fields.cities && !this.settings.checkout_required_fields.typing_city_manually){ if(!(data.address.city && data.address.city._id)) this.errors.cities = true; } if(this.settings.checkout_required_fields.show_cities && this.settings.checkout_required_fields.typing_city_manually){ if(this.settings.checkout_required_fields.cities && !data.address.city) this.errors.cities = true; else if(data.address.city.name.length < 2) this.errors.cities = true; } }else{ // "address_firstname":"Invalid first name", if(data.shipping.address.firstname.length < 2){ this.errors.address_firstname = true; this.errors.address_fullname = true; } // "address_lastname":"Invalid last name", if(data.shipping.address.lastname.length < 2){ this.errors.address_lastname = true; this.errors.address_fullname = true; } // "address_phone":"Invalid phone", if((this.settings.checkout_required_fields.show_phone && data.shipping.address.phone) || this.settings.checkout_required_fields.phone){ if(this.tools.validatePhone(data.shipping.address.phone, this.settings.checkout_defaults.phone_min, this.settings.checkout_defaults.phone_max)){ this.errors.address_phone = true;} } // "address_address1":"Invalid address1", if((this.settings.checkout_required_fields.show_address1 && data.shipping.address.address1) || this.settings.checkout_required_fields.address1){ if(data.shipping.address.address1.length < 4) this.errors.address_address1 = true; } // "address_address2":"Invalid address2", if((this.settings.checkout_required_fields.show_address2 && data.shipping.address.address2) || this.settings.checkout_required_fields.address2){ if(data.shipping.address.address2.length < 4) this.errors.address_address2 = true; } } if(Object.keys(this.errors).length > 0){ this.$nextTick(()=>{ const view = document.querySelector('.ck-error'); if(view){ view.parentNode.scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'nearest' }); }else window.scrollTo(0,0); }) return false; } return true; }, normalize(data){ for (const key in data) { if(typeof data[key] === 'object') { if(data[key]===null){ data[key] = undefined; continue; } for (const key2 in data[key]) { if(data[key][key2]===null){ data[key][key2] = undefined; continue; } if(typeof data[key][key2] === 'string') { if(key2 == 'phone') data[key][key2] = data[key][key2].replace(/[^0-9\u0660-\u0669+]/g, ''); data[key][key2] = data[key][key2].trim(); if(data[key][key2] == '') data[key][key2] = undefined; } } }else if(typeof data[key] === 'string'){ if(key == 'phone') data[key] = data[key].replace(/[^0-9\u0660-\u0669+]/g, ''); data[key] = data[key].trim(); if(!data[key]) data[key] = undefined; } } return data; }, normalizeSettings(){ for (const key in this.settings.checkout_required_fields) { if (!Object.hasOwnProperty.call(this.settings.checkout_required_fields, `show_${key}`) && this.settings.checkout_required_fields[key]) this.settings.checkout_required_fields[`show_${key}`] = this.settings.checkout_required_fields[key]; if(!this.settings.checkout_required_fields[`show_${key}`] && this.settings.checkout_required_fields[key]) this.settings.checkout_required_fields[key] = false; } if(this.settings.checkout_required_fields.show_password && !this.settings.checkout_required_fields.email){ this.settings.checkout_required_fields.show_password = false; this.settings.checkout_required_fields.password = false; } }, abandonmentCart(){ const order = JSON.parse(JSON.stringify(this.order)); order.details = this.store.state.cart.map(item=>{ return { product: {_id: item._id}, quantity: item.quantity || 1 } }); order.customer = JSON.parse(JSON.stringify(this.customer)); order.shipping.address = JSON.parse(JSON.stringify(this.customer.address)); this.fillName(order.customer); window.dispatchEvent(new CustomEvent('ORDER_UPDATED', { detail: order })) }, initializeCountry() { /** * 1. Use default country if passed from parent */ // if (this.defaultCountry) { // const defaultCountry = this.findCountry(this.defaultCountry); // if (defaultCountry) { // this.activeCountry = defaultCountry; // return; // } // } /** * 2. Use the first country from preferred list (if available) or all countries list */ this.activeCountry.code = this.findCountry(this.preferredCountries[0].code.toLowerCase()) || this.preferredCountries[0].code.toLowerCase(); /** * 3. Check if fetching country based on user's IP is allowed, set it as the default country */ // if (!this.disabledFetchingCountry) { // getCountry().then(res => { // this.choose(this.findCountry(res) || this.activeCountry); // }); // } }, /** * Get the list of countries from the list of code code */ getCountries(list = []) { return list .map(countryCode => this.findCountry(countryCode.code)) .filter(Boolean); }, findCountry(iso = "") { return this.preferredCountries.find(country => country.code === iso.toUpperCase()); }, getItemClass(index, code) { const highlighted = this.selectedIndex === index; const lastPreferred = index === this.preferredCountries.length - 1; const preferred = !!~this.preferredCountries .map(c => c.code.toUpperCase()) .indexOf(code); return { highlighted, "last-preferred": lastPreferred, preferred }; }, choose(country) { this.activeCountry = { code:country.code.toLowerCase(), dialCode:country.dialCode, name:country.name, }; this.$emit("onSelect", this.activeCountry); }, toggleDropdown() { if (this.disabled) { return; } this.open = !this.open; }, // Method to enable programmatic trigger of the dropdown by an element in the DOM manualDropdown() { if (this.disabled) { return; } this.manualTrigger = true; this.open = true; }, clickedOutside() { // If this was caused by a programmatic trigger, allow it, then reset the manualTrigger if (this.manualTrigger) { this.manualTrigger = false; return; } this.open = false; }, keyboardNav(e) { if (e.keyCode === 40) { // down arrow this.open = true; if (this.selectedIndex === null) { this.selectedIndex = 0; } else { this.selectedIndex = Math.min( this.preferredCountries.length - 1, this.selectedIndex + 1 ); } let selEle = this.$refs.list.children[this.selectedIndex]; if ( selEle.offsetTop + selEle.clientHeight > this.$refs.list.scrollTop + this.$refs.list.clientHeight ) this.$refs.list.scrollTop = selEle.offsetTop - this.$refs.list.clientHeight + selEle.clientHeight; } else if (e.keyCode === 38) { // up arrow this.open = true; if (this.selectedIndex === null) { this.selectedIndex = this.preferredCountries.length - 1; } else { this.selectedIndex = Math.max(0, this.selectedIndex - 1); } let selEle = this.$refs.list.children[this.selectedIndex]; if (selEle.offsetTop < this.$refs.list.scrollTop) this.$refs.list.scrollTop = selEle.offsetTop; } else if (e.keyCode === 13) { // enter key if (this.selectedIndex !== null) { this.choose(this.preferredCountries[this.selectedIndex]); } this.open = !this.open; } else { // typing a country's name this.typeToFindInput += e.key; clearTimeout(this.typeToFindTimer); this.typeToFindTimer = setTimeout(() => { this.typeToFindInput = ""; }, 700); // don't include preferred countries so we jump to the right place in the alphabet let typedCountryI = this.preferredCountries .slice(this.preferredCountries.length) .findIndex(c => c.name.toLowerCase().startsWith(this.typeToFindInput) ); if (~typedCountryI) { this.selectedIndex = this.preferredCountries.length + typedCountryI; let selEle = this.$refs.list.children[this.selectedIndex]; if ( selEle.offsetTop < this.$refs.list.scrollTop || selEle.offsetTop + selEle.clientHeight > this.$refs.list.scrollTop + this.$refs.list.clientHeight ) { this.$refs.list.scrollTop = selEle.offsetTop - this.$refs.list.clientHeight / 2; } } } }, reset() { this.selectedIndex = this.preferredCountries .map(c => c.code) .indexOf(this.activeCountry.code.toUpperCase()); this.open = false; } }, });

Tente Traverse x4 Ref 68003

ِQuantité

Partagez ce produit

Pas de description pour le moment

Produits relatifs

خيمة أوتوماتيكية 200*200*130 سم

PACK TRIO DE CAMPING !

Triangle de sécurité

Torche UV

Torche matraque

Tente triptreck X4 - 68013

Tente sierra ridge air x4 ref 68077

Tente sierra ridge air pro x6 ref 68079

Tente sierra ridge air pro x4 ref 68078

Tente Ocaso x3 ref 68011

Tasse inox 09cm

Table valise avec 4 chaises

Pompe électrique bestway ref 62139

Pompe à air intex 38cm ref 68614

خيمة أوتوماتيكية 200200130 سم