@lancom/shared 0.0.412 → 0.0.413

package/assets/js/api/admin.js

@@ -3,12 +3,6 @@ import { _get, _post, _delete, _put } from './helpers';
 import { sortSizes } from './../utils/sizes';
 import { sortByName } from './../utils/filters';
 
-const CACHE = {
-  PRINT_AREAS: 'print-areas',
-  PACKAGES: 'packages'
-};
-const promiseCache = new Map();
-
 export default {
   updateInventoryFromLink(link, warehouse) {
     const url = `admin/products/inventory/link${warehouse ? `?warehouse=${warehouse}` : ''}`;
@@ -218,13 +212,8 @@ export default {
   removeCategory(id) {
     return _delete(`admin/categories/${id}`);
   },
-  dropPackagesCache() {
-    promiseCache.delete(CACHE.PACKAGES);
-  },
   fetchPackages() {
-    const promise = promiseCache.get(CACHE.PACKAGES) || _get('admin/packages');
-    promiseCache.set(CACHE.PACKAGES, promise);
-    return promise;
+    return _get('admin/packages');
   },
   fetchPackageById(id) {
     return _get(`admin/packages/${id}`);
@@ -668,16 +657,8 @@ export default {
   removePrintType(id) {
     return _delete(`admin/print-types/${id}`);
   },
-  dropPrintAreasCache() {
-    promiseCache.delete(CACHE.PRINT_AREAS);
-  },
-  fetchPrintAreas(params) {
-    if (params) {
-      return _get('admin/print-areas', params);
-    }
-    const promise = promiseCache.get(CACHE.PRINT_AREAS) || _get('admin/print-areas');
-    promiseCache.set(CACHE.PRINT_AREAS, promise);
-    return promise;
+  fetchPrintAreas() {
+    return _get('admin/print-areas');
   },
   fetchPrintAreaById(id) {
     return _get(`admin/print-areas/${id}`);
@@ -688,8 +669,8 @@ export default {
   removePrintArea(id) {
     return _delete(`admin/print-areas/${id}`);
   },
-  fetchPrintSizes(params) {
-    return _get('admin/print-sizes', params);
+  fetchPrintSizes() {
+    return _get('admin/print-sizes');
   },
   fetchPrintSizeById(id) {
     return _get(`admin/print-sizes/${id}`);

package/assets/js/api/index.js

@@ -1,3 +1,4 @@
+
 import { _get, _post, _put, _delete, _patch } from './helpers';
 import adminApi from './admin';
 import { unminifySimpleProducts } from './utils/simple-products';
@@ -19,9 +20,6 @@ const api = {
   saveCustomer(customer, shop) {
     return customer._id ? _patch(`shop/${shop}/customer/${customer.accessToken}`, customer) : _post(`shop/${shop}/customer`, customer);
   },
-  fetchCustomer(accessToken, shop) {
-    return _get(`shop/${shop}/customer/${accessToken}`);
-  },
   authCustomer(customer, shop) {
     return _post(`shop/${shop}/customer/login`, customer);
   },

package/components/common/coupon_select/coupon-select.vue

@@ -74,7 +74,7 @@
       <div
         v-else
         class="lc_caption form-help is-danger">
-        Invalid coupon: Min Order for Coupon: {{ minOrderValue | price(currency) }}
+        Invalid coupon: Min Order for Coupon: {{ value.minOrderValue | price(currency) }}
       </div>
       <div v-if="hasQualifyingProducts" class="lc_caption mb-10">
         <div v-if="noQualifyingProductsInCart">
@@ -129,18 +129,8 @@ export default {
     hasQualifyingProductsInCart() {
       return this.sumQualifyingProductsInCart > 0;
     },
-    minOrderValue() {
-      const value = [
-        this.value,
-        ...(this.value?.values || [])
-      ]
-      .filter(v => v?.minOrderValue > 0)
-      .sort((a, b) => a.minOrderValue - b.minOrderValue)[0];
-
-      return value?.minOrderValue || 0;
-    },
     isValidPricing() {
-      return !this.minOrderValue || this.pricing.coupon;
+      return !this.value?.minOrderValue || this.pricing.coupon;
     },
     model: {
       get() {

package/components/common/phone_input/phone-input.vue

@@ -1,9 +1,9 @@
 <template>
   <div>
-    <div :class="containerClassname">
+    <div class="form-row">
       <label
         v-if="labelless"
-        :class="labelClassname"
+        class="form-label"
         @click="$refs.phone.$el.focus()">
         {{ displayLabelText }}
       </label>
@@ -31,8 +31,8 @@
               :disabled="disabled"
               :name="'phone' + uniqueKey"
               type="text"
+              class="form-field"
               :class="{
-                [inputClassname]: true,
                 'is-danger': errors.length,
                 filled: model,
                 labelless
@@ -115,18 +115,6 @@ export default {
     namePrefix: {
       type: String,
       default: ''
-    },
-    containerClassname: {
-      type: String,
-      default: 'form-row'
-    },
-    labelClassname: {
-      type: String,
-      default: 'form-label'
-    },
-    inputClassname: {
-      type: String,
-      default: 'form-field'
     }
   },
   data() {

package/components/common/postcode_select/postcode-select.vue

@@ -177,9 +177,7 @@ export default {
     if (this.suburb) {
       const option = this.createOptionFromSuburb(this.suburb);
       this.selected = option;
-      if (this.selected.value) {
-        await this.handleSearch(this.selected.value.trim());
-      }
+      await this.handleSearch(this.selected.value.trim())
     }
   },
   methods: {

package/components/customer/customer_navigation_menu/customer-navigation-menu.vue

@@ -15,12 +15,6 @@
 <script>
 export default {
   name: 'CustomerMenu',
-  props: {
-    activeMenuItem: {
-      type: String,
-      required: true
-    }
-  },
   data() {
     return {
       menuItems: [{
@@ -35,12 +29,14 @@ export default {
         label: 'Coupons',
         key: 'coupons',
         url: '/customer/coupons'
-      }, {
-        label: 'Preferences',
-        key: 'preferences',
-        url: '/customer/preferences'
       }]
     };
+  },
+  props: {
+    activeMenuItem: {
+      type: String,
+      required: true
+    }
   }
 };
 </script>
@@ -72,5 +68,5 @@ export default {
       background-color: $green;
     }
   }
-}
+} 
 </style>

package/components/product/product_banners/product-banners.scss

@@ -0,0 +1,10 @@
+@import "@/assets/scss/variables";
+
+.ProductBanners {
+  &__banner {
+    display: block;
+    img {
+      width: 100%;
+    }
+  }
+}

package/components/product/product_banners/product-banners.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="ProductBanners__wrapper">
+    <a :href="mainBanner.link" class="ProductBanners__banner">
+      <img :src="mainBanner.image.origin" :alt="mainBanner.label" />
+    </a>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+
+export default {
+  name: 'ProductBanners',
+  props: {
+    product: {
+      type: Object,
+      required: true
+    }
+  },
+  computed: {
+    ...mapGetters(['shop']),
+    ...mapGetters('product', ['banners']),
+    mainBanner() {
+      const bannersItems = this.banners.reduce((items, banner) => ([...items, ...banner.items]), []);
+      const productBanner = bannersItems.find(item => item.products?.includes(this.product._id));
+      return productBanner || bannersItems[0];
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+@import 'product-banners';
+</style>

package/components/product/product_multipacks_carousel/product-multipacks-carousel.vue

@@ -43,11 +43,6 @@ export default {
   components: {
     ProductMultipack
   },
-  data() {
-    return {
-      thumbsPage: 0
-    };
-  },
   props: {
     product: {
       type: Object,
@@ -70,8 +65,10 @@ export default {
       default: 3
     }
   },
-  created() {
-    console.log('LancomProductMultipacks...')
+  data() {
+    return {
+      thumbsPage: 0
+    };
   },
   computed: {
     ...mapGetters(['currency']),

package/components/product/product_multipacks_carousel/product_multipack/product-multipack.vue

@@ -25,7 +25,7 @@
       </div>
     </div>
     <div class="ProductMultipack__price">
-      {{ oneItemPrice | price(currency) }} each 
+      {{ oneItemPrice | price(currency) }} each
       <span>{{ totalPrice | price(currency) }}</span>
     </div>
   </div>
@@ -79,7 +79,9 @@ export default {
       return simpleProducts.find(sp => sp.size?.shortName === simpleProduct?.size?.shortName) || simpleProducts[0];
     },
     totalPrice() {
-      return this.oneItemPrice * this.multipack.qty;
+      const itemPrice = priceFromRange(this.multipack.qty, this.simpleProduct?.pricing);
+      const price = itemPrice * this.multipack.qty;
+      return this.withGst ? tax(price, this.gstTax) : price;
     },
     oneItemPrice() {
       const price = priceFromRange(this.multipack.qty, this.simpleProduct?.pricing);

package/components/product/wizard/wizard.scss

@@ -28,6 +28,9 @@
       text-decoration: underline;
     }
   }
+  &__banners {
+    margin-top: 10px;
+  }
   &__print-types {
     display: flex;
     margin: 31px 0 36px -5px;
@@ -219,4 +222,4 @@
       }
     }
   }
-}
+}

package/components/product/wizard/wizard.vue

@@ -28,6 +28,9 @@
         {{ isVisible ? 'CANCEL PRINT' : 'ADD PRINT' }}
       </div>
     </div>
+    <div class="Wizard__banners">
+      <product-banners :product="product" />
+    </div>
     <div
       v-if="isVisible"
       class="Wizard__content"
@@ -119,6 +122,7 @@ import gtm from '@lancom/shared/assets/js/utils/gtm';
 import Info from '@lancom/shared/components/common/info-popover';
 import { getPrintAreaSizes } from '@lancom/shared/assets/js/utils/prints';
 import ProgressSteps from '@lancom/shared/components/common/progress_steps/progress-steps';
+import ProductBanners from '@lancom/shared/components/product/product_banners/product-banners';
 import WizardPrintArea from './wizard_print_area/wizard-print-area';
 import WizardPrintSize from './wizard_print_size/wizard-print-size';
 import WizardPrintType from './wizard_print_type/wizard-print-type';
@@ -143,6 +147,7 @@ export default {
   name: 'Editor',
   components: {
     ProgressSteps,
+    ProductBanners,
     WizardPrintArea,
     WizardPrintSize,
     WizardPrintType,
@@ -232,7 +237,7 @@ export default {
     },
     editLayer(layer) {
       this.clearWizardData();
-      
+
       this.setEditableLayers([layer]);
       const printArea = this.productPrintAreas.find(pa => pa._id === layer.printArea);
       this.addEditablePrintArea(printArea);

package/feeds/google-shopping.js

@@ -102,6 +102,10 @@ async function googleShoppingFeed(axios, config, availableStores, country, isEdi
                 info['g:gtin'] = { _text: sp.gtin || '' };
               }
 
+              if (sp.clearancePrice > 0) {
+                info['g:sale_price'] = { _text: `${(sp.clearancePrice)} ${sp.currencyCode || 'AUD'}` };
+              }
+
               if (sp.storeCode) {
                 info['g:store_code'] = { _text: sp.storeCode };
                 info['g:link_template'] = { _text: `${link}&store={store_code}` };

package/layouts/products.vue

@@ -126,10 +126,10 @@
         return 'product';
       },
       pageItemImage() {
-        const images = this.products.reduce((images, product) => {
+        const images = this.products?.reduce((images, product) => {
           const image = getProductLargeCover(product, 'front') || getProductMediumCover(product, 'front');
           return image ? [...images, image] : images;
-        }, []);
+        }, []) || [];
         return images.slice(0, 1);
       },
       currentBrand() {

package/mixins/product-view.js

@@ -42,7 +42,7 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
         const redirectUrl = generateProductLink(product, data.defaultColor, isEditor);
         return redirect(301, redirectUrl);
       }
-      
+
       if (params.sku && params.sku !== product?.SKU?.toLowerCase()) {
         return error({ statusCode: 404, message: 'Product not found' });
       }
@@ -58,6 +58,11 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
       if (query.price) {
         store.commit('product/setPriceIncludeGST', query.price === 'IT');
       }
+      if (query.multipack) {
+        const multipackQty = +query.multipack.split('-multipack-')[1];
+        const multipack = product.multipacks?.find(m => m.qty === multipackQty);
+        store.commit('product/setMultipack', multipack);
+      }
     } catch (e) {
       console.log(e);
     }
@@ -179,7 +184,7 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
       }
     } catch (e) {
     }
-    
+
     this.fillBreadcrumbs();
     const { multipack } = this.$route.query;
     if (multipack) {
@@ -277,7 +282,7 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
         const maxPrice = this.printsPrice ? spMaxPrice + this.printsPrice : spMaxPrice;
         const availability = sp.quantityStock > 0 ? 'InStock' : 'OutOfStock';
         const name = `${this.product.name} | ${sp.size?.shortName || ''} ${sp.color?.name || ''}`;
-    
+
         const offer = {
           '@type': 'Offer',
           name,
@@ -309,7 +314,7 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
           // if (sp.quantityStock > 0) {
           // }
         }
-        
+
         offer.shippingDetails = { "@id": "#shipping_policy" };
         offer.hasMerchantReturnPolicy = { "@id": "#return_policy" };
 
@@ -422,4 +427,4 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING, isEditor = false) => ({
       this.$store.state.shop?.shippingPolicySchema
     ].filter(s => !!s);
   }
-});
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lancom/shared",
-  "version": "0.0.412",
+  "version": "0.0.413",
   "description": "lancom common scripts",
   "author": "e.tokovenko <e.tokovenko@gmail.com>",
   "repository": {

package/routes/index.js

@@ -122,11 +122,6 @@ module.exports = function(routes, resolve, config) {
     path: '/customer/coupons',
     component: resolve('@lancom/shared/pages/customer/coupons.vue'),
     chunkName: 'pages/customer/coupons'
-  }, {
-    name: 'customer-preferences',
-    path: '/customer/preferences',
-    component: resolve('@lancom/shared/pages/customer/preferences.vue'),
-    chunkName: 'pages/customer/preferences'
   }, {
     name: 'customer-recovery',
     path: '/customer/recovery',
@@ -142,11 +137,6 @@ module.exports = function(routes, resolve, config) {
     path: '/customer/password/:token',
     component: resolve('@lancom/shared/pages/customer/password/_token.vue'),
     chunkName: 'pages/customer/password/reset'
-  }, {
-    name: 'customer-preferences',
-    path: '/customer/preferences',
-    component: resolve('@lancom/shared/pages/customer/preferences.vue'),
-    chunkName: 'pages/customer/preferences'
   }, {
     name: 'checkout-cart',
     path: '/checkout/cart',

package/store/product.js

@@ -11,6 +11,7 @@ import { sortByName } from '../assets/js/utils/filters';
 
 export const state = () => ({
   multipack: null,
+  banners: [],
   calculatingPrice: false,
   loadingProductDetails: false,
   productDetailsKey: Date.now(),
@@ -64,6 +65,7 @@ export const getters = {
   editorSize: ({ editorSize }) => editorSize,
   template: ({ template }) => template,
   layers: ({ template }) => template.layers || [],
+  banners: ({ banners }) => banners || [],
   templateColors: ({ template }) => template.colors || [],
   hasLayers: ({ template }) => (template.layers || []).length > 0,
   visibleSteps: ({ template }) => template.visibleSteps,
@@ -166,6 +168,13 @@ export const actions = {
       const product = await api.fetchProduct(shop, slug, query);
       commit('setProduct', product);
 
+      const bannersParams = {
+        type: 'product view main',
+        product: product._id
+      };
+      const banners = await api.fetchBanners(shop, bannersParams) || [];
+      commit('setBanners', banners);
+
       const prints = (product.prints || []).filter(({ _id, printTemplate }) => _id === print || (!print && !!printTemplate));
       commit('setPreSetPrints', prints);
       if (prints?.length > 0) {
@@ -300,6 +309,9 @@ export const mutations = {
   setProduct(state, product) {
     state.product = product;
   },
+  setBanners(state, banners) {
+    state.banners = banners;
+  },
   setPriceIncludeGST(state, priceIncludeGST) {
     state.priceIncludeGST = priceIncludeGST;
   },

package/components/customer/customer_preferences_form/customer-preferences-form.scss

@@ -1,12 +0,0 @@
-@import "@/assets/scss/variables";
-
-.CustomerPreferencesForm {
-  &__error {
-    font-weight: bold;
-    font-size: 14px;
-    padding: 18px 10px;
-    text-align: center;
-    color: $white;
-    background: #EA3434;
-  }
-}

package/components/customer/customer_preferences_form/customer-preferences-form.vue

@@ -1,87 +0,0 @@
-<template>
-  <div class="form__wrapper CustomerFrom__wrapper">
-    <validation-observer ref="form">
-      <div class="mt-10">
-        <div
-          class="row"
-          style="margin-top: -20px">
-          <div class="col-12">
-            <div class="form-row">
-              <label class="form-label">
-                <checkbox v-model="customer.signUpForNewsletter" />
-                <span class="lc_regular12 lc__grey1">
-                  Sign up for newsletter
-                </span>
-              </label>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="form__footer mt-5">
-        <div
-          v-if="errorMessage"
-          class="CustomerForm__error">
-          {{ errorMessage }}
-        </div>
-        <div class="form-actions full">
-          <btn
-            class="btn btn-black"
-            :btn-processing="processing"
-            :btn-disabled="processing"
-            :btn-label="customer._id ? 'Save' : 'Create Account'"
-            @onclick="submit()">
-          </btn>
-        </div>
-      </div>
-    </validation-observer>
-  </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex';
-import api from '@lancom/shared/assets/js/api';
-
-export default {
-  name: 'CustomerPreferencesForm',
-  props: {
-    customer: {
-      type: Object,
-      required: true
-    }
-  },
-  data() {
-    return {
-      errorMessage: null,
-      processing: false
-    };
-  },
-  computed: {
-    ...mapGetters(['shop'])
-  },
-  methods: {
-    async submit() {
-      this.errorMessage = null;
-
-      const isValid = await this.$refs.form.validate();
-      if (!isValid) {
-        return;
-      }
-
-      try {
-        this.processing = true;
-        const result = await api.saveCustomer(this.customer, this.shop._id);
-        this.$emit('save', result);
-      } catch ({ response }) {
-        const { data } = response || {};
-        this.errorMessage = data && data.error;
-      } finally {
-        this.processing = false;
-      }
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import 'customer-preferences-form.scss';
-</style>

package/components/pages/customer/preferences/preferences.vue

@@ -1,79 +0,0 @@
-<template>
-  <div class="CustomerPreferences__wrapper">
-    <customer-preferences-form
-      v-if="customer"
-      ref="customerForm"
-      :customer="customer"
-      @save="onSave"
-      @customer-loaded="onCustomerLoaded" />
-  </div>
-</template>
-
-<script>
-import api from '@lancom/shared/assets/js/api';
-import { mapGetters, mapActions } from 'vuex';
-import CustomerPreferencesForm from '@lancom/shared/components/customer/customer_preferences_form/customer-preferences-form';
-
-export default {
-  name: 'CustomerPreferences',
-  components: {
-    CustomerPreferencesForm
-  },
-  data() {
-    return {
-      customer: null,
-      loading: false,
-      error: null
-    };
-  },
-  computed: {
-    ...mapGetters(['shop']),
-    ...mapGetters('auth', ['user'])
-  },
-  async created() {
-    await this.loadCustomerData();
-  },
-  methods: {
-    ...mapActions('auth', ['update_user']),
-    async loadCustomerData() {
-      try {
-        this.processing = true;
-        const customer = await api.fetchCustomer(this.user.accessToken, this.shop._id);
-        console.log('customer: ', customer);
-        this.customer = customer;
-      } catch (e) {
-        console.log(e);
-        const errorMessage = e?.response?.data?.error;
-        this.$toastr.e(errorMessage || 'Customer failed to load');
-      } finally {
-        this.processing = false;
-      }
-    },
-    onSave({ customer: user, token }) {
-      this.$toastr.s('Customer successfully saved');
-      this.update_user({ user, token });
-    },
-    onCustomerLoaded(customer) {
-      this.customer = customer;
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.loading-message {
-  text-align: center;
-  padding: 2rem;
-  font-size: 1.1rem;
-  color: #666;
-}
-
-.error-message {
-  text-align: center;
-  padding: 2rem;
-  color: #d32f2f;
-  background-color: #ffebee;
-  border-radius: 4px;
-  margin: 1rem 0;
-}
-</style>

package/pages/customer/preferences.vue

@@ -1,33 +0,0 @@
-<template>
-  <div
-    :data-aos="aosFadeLeft"
-    class="CustomerPreferencesPage__wrapper">
-    <customer-preferences />
-  </div>
-</template>
-
-<script>
-import metaInfo from '@lancom/shared/mixins/meta-info';
-
-export default {
-  name: 'CustomerPreferencesPage',
-  components: {
-    CustomerPreferences: () => import('@lancom/shared/components/pages/customer/preferences/preferences')
-  },
-  mixins: [metaInfo]
-};
-</script>
-
-<style lang="scss" scoped>
-  @import "@/assets/scss/variables";
-
-  .CustomerPreferencesPage {
-    &__wrapper {
-      margin: 100px auto;
-      width: 500px;
-      @media (max-width: $bp-extra-small-max) {
-        width: auto;
-      }
-    }
-  }
-</style>