@lancom/shared 0.0.383 → 0.0.385

package/components/quotes/quote_view/quote_view_product/quote-view-product.scss

@@ -8,6 +8,13 @@
       margin-right: 26px;
     }
   }
+  &__qty-warning {
+    font-size: 12px;
+    color: rgb(194, 7, 7);
+    b {
+      font-weight: bold;
+    }
+  }
   &__features {
     margin-top: 4px;
     padding-bottom: 4px;

package/components/quotes/quote_view/quote_view_product/quote-view-product.vue

@@ -63,7 +63,13 @@
           :entity="product"
           :group="group"
           :default-preview="groupedProducts.size === 1"
+          @change="onChangeColorSimpleProduct()"
           class="QuoteViewProduct__item" />
+        <div
+          v-if="!isValidTotalQty"
+          class="QuoteViewProduct__qty-warning">
+          Total Qty Should Be: <b>{{ product.totalAmount }}</b>
+        </div>
       </div>
       <div
         v-if="hasPrints"
@@ -103,12 +109,18 @@ export default {
       type: Object,
       required: true
     },
+    pricing: {
+      type: Object
+    },
     withDivider: {
       type: Boolean,
       default: true
     }
   },
   computed: {
+    isValidTotalQty() {
+      return this.product.totalAmount > 0 && this.product.totalAmount === this.amount;
+    },
     productLink() {
       return this.product.product ? generateProductLink(this.product.product) : null;
     },
@@ -128,17 +140,27 @@ export default {
       return [...groupSimpleProducts(this.product, !this.product.isCustom, true)].filter(([, g]) => g.amount > 0);
     },
     totalPrice() {
-      const printsTotal = (this.product.prints || []).reduce((total, print) => {
-        const isMultiplePrint = (print.products || []).length > 0;
-        const printProducts = print.products || [];
-        const isMultiplePrintMainProduct = printProducts.indexOf(this.product.guid) === 0 || printProducts.indexOf(this.product._id) === 0;
-        const isFreeSetup = print.freeSetupOver >= 0 && this.amount > print.freeSetupOver;
-        const printCost = print.costType === 'setup only' ? 0 : print.printCost;
-        const setupCost = (isMultiplePrint && !isMultiplePrintMainProduct) ? 0 : (print.costType === 'item cost only' || isFreeSetup) ? 0 : print.setupCost;
-        return total + this.amount * printCost + setupCost;
-      }, 0);
-      const productsTotal = this.simpleProducts.reduce((total, { amount = 0, productCost = 0 }) => total + amount * productCost, 0);
-      return this.amount > 0 ? (printsTotal + productsTotal) : 0;
+      if (this.pricing) {
+        return this.pricing?.products[this.product._id]?.totalPriceWithoutTax;
+      } else {
+        const printsTotal = (this.product.prints || []).reduce((total, print) => {
+          const isMultiplePrint = (print.products || []).length > 0;
+          const printProducts = print.products || [];
+          const isMultiplePrintMainProduct = printProducts.indexOf(this.product.guid) === 0 || printProducts.indexOf(this.product._id) === 0;
+          const isFreeSetup = print.freeSetupOver >= 0 && this.amount > print.freeSetupOver;
+          const printCost = print.costType === 'setup only' ? 0 : print.printCost;
+          const setupCost = (isMultiplePrint && !isMultiplePrintMainProduct) ? 0 : (print.costType === 'item cost only' || isFreeSetup) ? 0 : print.setupCost;
+          return total + this.amount * printCost + setupCost;
+        }, 0);
+        const productsTotal = this.simpleProducts.reduce((total, { amount = 0, productCost = 0 }) => total + amount * productCost, 0);
+        return this.amount > 0 ? (printsTotal + productsTotal) : 0;
+      }
+    }
+  },
+  methods: {
+    onChangeColorSimpleProduct() {
+      console.log('onChangeColorSimpleProduct2:change...');
+      this.$emit('change');
     }
   }
 };

package/feeds/google-shopping.js

@@ -1,5 +1,5 @@
 async function googleLocalShoppingFeed(axios, config, availableStores, country) {
-  const result = await googleShoppingFeed(axios, config, availableStores, country);
+  const result = await googleShoppingFeed(axios, config, availableStores, country, false, { allowSameDayDelivery: true });
   
   const fields = [
     'g:availability',
@@ -8,10 +8,11 @@ async function googleLocalShoppingFeed(axios, config, availableStores, country)
     'g:pickup_sla',
     'g:price',
     'g:quantity',
-    'g:store_code'
+    'g:store_code',
+    'g:local_shipping_label'
   ];
   result.rss.channel.item = result.rss.channel.item
-    .map(i => fields.reduce((item, field) => ({ ...item, [field]: i[field] }), {}));
+    .map(i => fields.reduce((item, field) => i[field] ? ({ ...item, [field]: i[field] }) : item, {}));
   return result;
 }
 
@@ -19,7 +20,8 @@ const COUNTRIES_SIZE_SYSTEMS = {
   GB: 'UK'
 };
 
-async function googleShoppingFeed(axios, config, availableStores, country, isEditor) {
+async function googleShoppingFeed(axios, config, availableStores, country, isEditor, params) {
+  const { allowSameDayDelivery } = params || {};
   const { data } = await axios.get(`${config.LOCAL_API_URL}/feed/products?host=${config.HOST_NAME}&country=${country || ''}`);
   const spliceFirstImage = images => (images || []).splice(0, 1)[0];
   const getImages = images => (images || []).length > 0 ? images : null;
@@ -127,6 +129,10 @@ async function googleShoppingFeed(axios, config, availableStores, country, isEdi
                 info['g:shipping_label'] = product.country;
               }
 
+              if (allowSameDayDelivery && product.sameDayDelivery) {
+                info['g:local_shipping_label'] = { _text: 'sameday' };
+              }
+
               const productHighlight = `${product.feedProductHighlight || ''}`
                 .trim()
                 .split(/\n+/g)

package/mixins/product-preview.js

@@ -105,6 +105,12 @@ const productPreview = {
         this.loadHolder.canLoadColorImages = true;
       }, 3000);
     }
+  },
+  methods: {
+    updateCurrentColor(color) {
+      this.currentColor = color;
+      this.$emit('color', color);
+    }
   }
 };
 

package/package.json

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

package/pages/checkout/order.vue

@@ -3,10 +3,19 @@
     :data-aos="aosFadeRight"
     class="CheckoutOrderPage__wrapper">
     <order>
-      <cart-price-info
-        slot="after-steps"
-        class="CheckoutOrderPage__pricing"
-        @loaded="loadedPricing($event)" />
+      <template #after-steps>
+        <div class="CheckoutOrderPage__pricing">
+          <btn
+            btn-class="black"
+            btn-label="EDIT CART"
+            :btn-block="true"
+            to="/checkout/cart" />
+          <cart-price-info
+            class="mt-10"
+            :disabled-rates="true"
+            @loaded="loadedPricing($event)" />
+        </div>
+      </template>
     </order>
   </div>
 </template>

package/pages/contact.vue

@@ -0,0 +1,54 @@
+<template>
+  <div class="ContactPage__wrapper">
+    <div class="content-inner">
+      <breadcrumbs :items="breadcrumbs" />
+      <div class="row">
+        <div class="col-sm-5 col-12">
+          <contact-us />
+        </div>
+        <div class="col-sm-7 col-12">
+          <iframe
+            v-if="contacts.googleMapIframeSrc"
+            :src="contacts.googleMapIframeSrc"
+            width="100%"
+            height="100%"
+            style="border:0;"
+            loading="lazy">
+          </iframe>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import metaInfo from '@lancom/shared/mixins/meta-info';
+
+export default {
+  name: 'ContactPage',
+  components: {
+    Breadcrumbs: () => import('@lancom/shared/components/common/breadcrumbs/breadcrumbs'),
+    ContactUs: () => import('@lancom/shared/components/asides/contact_us/contact-us')
+  },
+  mixins: [metaInfo],
+  data() {
+    return {
+      breadcrumbs: [{
+        text: 'Contact'
+      }]
+    };
+  },
+  computed: {
+    ...mapGetters(['contacts'])
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.ContactPage{
+  &__wrapper {
+    padding: 30px 0;
+  }
+}
+</style>

package/pages/customer/coupons.vue

@@ -0,0 +1,39 @@
+<template>
+  <div
+    :data-aos="aosFadeRight"
+    class="CustomerCouponsPage__wrapper">
+    <customer-menu active-menu-item="coupons" />
+    <customer-coupons :customer="user" />
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import metaInfo from '@lancom/shared/mixins/meta-info';
+
+export default {
+  name: 'CustomerCouponsPage',
+  components: {
+    CustomerCoupons: () => import('@lancom/shared/components/customer/customer_coupons/customer-coupons'),
+    CustomerMenu: () => import('@lancom/shared/components/customer/customer_navigation_menu/customer-navigation-menu')
+  },
+  mixins: [metaInfo],
+  computed: {
+    ...mapGetters('auth', ['user'])
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+  @import "@/assets/scss/variables";
+
+  .CustomerCouponsPage {
+    &__wrapper {
+      margin: 50px auto;
+      width: 1100px;
+      @media (max-width: $bp-extra-small-max) {
+        width: auto;
+      }
+    }
+  }
+</style>

package/pages/customer/orders.vue

@@ -0,0 +1,39 @@
+<template>
+  <div
+    :data-aos="aosFadeRight"
+    class="CustomerOrdersPage__wrapper">
+    <customer-navigation-menu active-menu-item="orders" />
+    <customer-orders :customer="user" />
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import metaInfo from '@lancom/shared/mixins/meta-info';
+
+export default {
+  name: 'CustomerOrdersPage',
+  components: {
+    CustomerOrders: () => import('@lancom/shared/components/customer/customer_orders/customer-orders'),
+    CustomerNavigationMenu: () => import('@lancom/shared/components/customer/customer_navigation_menu/customer-navigation-menu')
+  },
+  mixins: [metaInfo],
+  computed: {
+    ...mapGetters('auth', ['user'])
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+  @import "@/assets/scss/variables";
+
+  .CustomerOrdersPage {
+    &__wrapper {
+      margin: 50px auto;
+      width: 1100px;
+      @media (max-width: $bp-extra-small-max) {
+        width: auto;
+      }
+    }
+  }
+</style>

package/pages/customer/settings.vue

@@ -2,6 +2,7 @@
   <div
     :data-aos="aosFadeRight"
     class="CustomerSettingsPage__wrapper">
+    <customer-navigation-menu active-menu-item="settings" />
     <customer-settings />
   </div>
 </template>
@@ -12,6 +13,7 @@ import metaInfo from '@lancom/shared/mixins/meta-info';
 export default {
   name: 'CustomerCreatePage',
   components: {
+    CustomerNavigationMenu: () => import('@lancom/shared/components/customer/customer_navigation_menu/customer-navigation-menu'),
     CustomerSettings: () => import('@lancom/shared/components/pages/customer/settings/settings')
   },
   mixins: [metaInfo]
@@ -23,8 +25,8 @@ export default {
 
   .CustomerSettingsPage {
     &__wrapper {
-      margin: 100px auto;
-      width: 500px;
+      margin: 50px auto;
+      width: 1100px;
       @media (max-width: $bp-extra-small-max) {
         width: auto;
       }

package/pages/products-kit/_alias.vue

@@ -0,0 +1,103 @@
+<template>
+  <div class="ProductsKitPage__wrapper">
+    <breadcrumbs :items="breadcrumbs" />
+    <transition name="from-right-to-left" appear>
+      <products-kit :products-kit="productsKit" />
+    </transition>
+    <transition
+      v-if="hasProductsKitsList"
+      name="from-left-to-right"
+      appear>
+      <div class="content-inner">
+        <h2 class="lc_h2 lc_black ProductsKitPage__list-title">
+          You might also like
+        </h2>
+        <products-kits-list
+          class="ProductsKitPage__list"
+          :productsKits="productsKitsList" />
+      </div>
+    </transition>
+  </div>
+</template>
+<script>
+import metaInfo from '@lancom/shared/mixins/meta-info';
+
+export default {
+  name: 'ProductsKitPage',
+  components: {
+    Breadcrumbs: () => import('@lancom/shared/components/common/breadcrumbs/breadcrumbs'),
+    ProductsKit: () => import('@lancom/shared/components/products_kit/products_kit/products-kit'),
+    ProductsKitsList: () => import('@lancom/shared/components/products_kit/products_kits_list/products-kits-list')
+  },
+  mixins: [metaInfo],
+  async asyncData({ params, store, error, redirect }) {
+    console.log('asyncData: ', 1);
+    try {
+      const { shop, country, currency } = store.getters;
+      const data = {
+        shop: shop._id,
+        alias: params.alias,
+        country: country?._id,
+        currency: currency?._id
+      };
+      await store.dispatch('productsKit/fetchProductsKit', data);
+    } catch (e) {
+      console.log(e);
+    }
+    const productsKit = store.getters['productsKit/productsKit'];
+    const loadError = store.getters['productsKit/loadError'];
+
+    // console.log('loadError: ', loadError);
+    if (loadError?.redirectLink) {
+      return redirect(301, loadError?.redirectLink);
+    } else if (loadError) {
+      error(loadError);
+    }
+    return {
+      productsKit
+    };
+  },
+  data() {
+    return {
+      productsKit: null,
+      productsKits: []
+    };
+  },
+  computed: {
+    hasProductsKitsList() {
+      return this.productsKitsList.length > 0;
+    },
+    productsKitsList() {
+      return this.productsKits.filter(i => i.alias !== this.productsKit.alias).slice(0, 3);
+    },
+    breadcrumbs() {
+      const item = this.productsKit ? { text: this.productsKit.name } : null;
+      return [{
+        to: '/products-kits',
+        text: 'Products Kits'
+      }, item].filter(i => !!i);
+    },
+    pageItemType() {
+      return 'products-kits';
+    }
+  },
+  getRoute() {
+    return '/shop/:shop/products-kits/:alias';
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.ProductsKitPage{
+  &__wrapper {
+    margin-top: 30px;
+  }
+  &__list-title {
+    margin-top: 20px;
+    text-align: center;
+  }
+  &__list {
+    padding: 20px 0;
+  }
+}
+</style>

package/pages/products-kit/index.vue

@@ -0,0 +1,59 @@
+<template>
+  <div class="ProductsKitsPage__wrapper view-transition">
+    <div class="content-inner">
+      <breadcrumbs :items="breadcrumbs" />
+      <products-kits-list
+        class="ProductsKitsPage__list"
+        :products-kits="productsKits"
+        :count="count"
+        :page="page"
+        :per-page="perPage" />
+    </div>
+  </div>
+</template>
+
+<script>
+import metaInfo from '@lancom/shared/mixins/meta-info';
+import api from '@lancom/shared/assets/js/api';
+
+const KITS_PER_PAGE = 18;
+
+export default {
+  name: 'ProductPage',
+  components: {
+    Breadcrumbs: () => import('@lancom/shared/components/common/breadcrumbs/breadcrumbs'),
+    ProductsKitsList: () => import('@lancom/shared/components/products_kit/products_kits_list/products-kits-list')
+  },
+  mixins: [metaInfo],
+  async asyncData({ store, params, query }) {
+    const { _id } = store.getters.shop;
+    const kitsQuery = { ...params, ...query, limit: KITS_PER_PAGE };
+    const { productsKits, count, page, perPage } = await api.fetchProductsKits(_id, kitsQuery);
+    return { productsKits, count, page, perPage };
+  },
+  data() {
+    return {
+      productsKits: [],
+      count: null,
+      page: null,
+      perPage: null,
+      breadcrumbs: [{
+        text: 'Products Kits'
+      }]
+    };
+  },
+  computed: {
+    pageItemType() {
+      return 'products-kits';
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.ProductsKitsPage {
+  &__wrapper {
+    padding: 30px 0;
+  }
+}
+</style>

package/routes/index.js

@@ -112,8 +112,13 @@ module.exports = function(routes, resolve) {
   }, {
     name: 'customer-orders',
     path: '/customer/orders',
-    component: resolve('@lancom/shared/pages/customer/orders/index.vue'),
+    component: resolve('@lancom/shared/pages/customer/orders.vue'),
     chunkName: 'pages/customer/orders'
+  }, {
+    name: 'customer-coupons',
+    path: '/customer/coupons',
+    component: resolve('@lancom/shared/pages/customer/coupons.vue'),
+    chunkName: 'pages/customer/coupons'
   }, {
     name: 'customer-recovery',
     path: '/customer/recovery',
@@ -164,5 +169,20 @@ module.exports = function(routes, resolve) {
     path: '/news/tag/:tag',
     component: resolve('@lancom/shared/pages/news/tag/_tag.vue'),
     chunkName: 'pages/news/tag'
+  }, {
+    name: 'products-kits',
+    path: '/products-kits',
+    component: resolve('@lancom/shared/pages/products-kit/index.vue'),
+    chunkName: 'pages/products-kits'
+  }, {
+    name: 'products-kit-view',
+    path: '/products-kit/:alias',
+    component: resolve('@lancom/shared/pages/products-kit/_alias.vue'),
+    chunkName: 'pages/products-kit/products-kit-view'
+  }, {
+    name: 'contact',
+    path: '/contact',
+    component: resolve('@lancom/shared/pages/contact.vue'),
+    chunkName: 'pages/contact'
   }];
 }

package/store/cart.js

@@ -4,7 +4,7 @@ import gtm from '@lancom/shared/assets/js/utils/gtm';
 import { getPrintTypeSizePricing } from '@lancom/shared/assets/js/utils/prints';
 import { filterBigSize } from '@lancom/shared/assets/js/utils/product';
 
-const SUPPLIERS_WITH_RATES_KEY = 'suppliers-with-wates';
+const SUPPLIERS_WITH_RATES_KEY = 'suppliers-with-rates';
 
 export const state = () => ({
   id: null,
@@ -134,7 +134,7 @@ export const actions = {
     const cartEntities = state.id ? (await api.fetchCartById(shop._id, state.id, params)).entities : state.entities;
     entities = entities.map(e => {
       const entitiy = cartEntities.find(e2 => isSamePrints(e, e2) && e2?.product?._id === e?.product?._id);
-      if (entitiy) {
+      if (!e.productsKit && entitiy) {
         e.simpleProducts.forEach(sp => {
           const simpleProduct = entitiy.simpleProducts.find(sp2 => sp2.SKU === sp.SKU);
           if (!simpleProduct) {