@lancom/shared 0.0.376 → 0.0.377

package/assets/js/utils/quote.js

@@ -3,6 +3,7 @@ import { populatePrints } from './order';
 export function convertQuoteToOrder(quote, option) {
   const files = [quote.file, ...(quote.files || [])].filter(f => !!f);
   return {
+    purchaseOrderNumber: quote.purchaseOrderNumber,
     isUrgent: quote.isUrgent,
     deliveryBy: quote.deliveryBy,
     deliveryAfter: quote.deliveryAfter,

package/components/checkout/cart/cart.scss

@@ -7,6 +7,17 @@
   &__postcode-container {
     margin-top: 22px;
   }
+  &__pickup-label {
+    font-weight: 800;
+    font-size: 16px;
+    line-height: 22px;
+    text-transform: uppercase;
+    color: #303030;
+  }
+  &__pickup-errors {
+    color: $error;
+    font-size: 13px;
+  }
   // &__total-info {
   //   position: sticky;
   //   top: 130px;

package/components/checkout/cart/cart.vue

@@ -31,6 +31,25 @@
               :label-text="postcodeInfoLabel"
               @select="handleSuburbChange" />
           </div>
+          <div>
+            <div class="mt-20 mb-20">
+              <checkbox
+                v-model="wantsToPickup"
+                :disabled="hasNotValidProductsPickup"
+                :dark="true">
+                <div class="ml-10 Cart__pickup-label">Wants to pickup</div>
+              </checkbox>
+            </div>
+            <div v-if="hasNotValidProductsPickup">
+              <ul class="Cart__pickup-errors">
+                <li
+                  v-for="product in notValidProductsPickup"
+                  :key="product._id">
+                  Not Available for pickup <b>{{ product.name }}. {{ product.size ? product.size.shortName : '' }}</b> order quantity: {{ product.amount }}. Available {{ product.warehouseQuantityStock }}
+                </li>
+              </ul>
+            </div>
+          </div>
           <div class="Cart__coupon-container">
             <coupon-select
               v-model="cartCoupon"
@@ -44,7 +63,7 @@
             <btn
               :btn-disabled="isNotValidQuantity || cartPricingError || cartPricingCalculating"
               :btn-block="true"
-              to="/checkout/order"
+              :to="needToPickup ? `/checkout/order?needToPickup=true` : '/checkout/order'"
               btn-class="green"
               btn-label="PROCEED TO CHECKOUT">
               <i
@@ -71,7 +90,7 @@
 </template>
 
 <script>
-import { mapGetters } from 'vuex';
+import { mapGetters, mapMutations } from 'vuex';
 import gtm from '@lancom/shared/assets/js/utils/gtm';
 import PostcodeSelect from '@lancom/shared/components/common/postcode_select/postcode-select';
 import CouponSelect from '@lancom/shared/components/common/coupon_select/coupon-select';
@@ -80,6 +99,7 @@ import CartEntity from '@lancom/shared/components/checkout/cart/cart_entity/cart
 import { price } from '@lancom/shared/assets/js/utils/filters';
 import CartMixin from '@lancom/shared/components/checkout/cart/cart.mixin';
 import CartPriceInfo from '@lancom/shared/components/checkout/cart/cart_price_info/cart-price-info';
+
 export default {
   name: 'CheckoutCart',
   components: {
@@ -93,7 +113,18 @@ export default {
   mixins: [CartMixin],
   computed: {
     ...mapGetters(['MESSAGES', 'SETTINGS', 'currency', 'country']),
-    ...mapGetters('cart', ['isEmpty', 'cartPricingError', 'cartPricing', 'cartPricingCalculating', 'entities']),
+    ...mapGetters('cart', ['isEmpty', 'needToPickup', 'notValidProductsPickup','cartPricingError', 'cartPricing', 'cartPricingCalculating', 'entities']),
+    wantsToPickup: {
+      get() {
+        return this.needToPickup;
+      },
+      set(needToPickup) {
+        this.setNeedToPickup(needToPickup);
+      }
+    },
+    hasNotValidProductsPickup() {
+      return this.notValidProductsPickup.length > 0;
+    },
     onlyPostcode() {
       return !!this.SETTINGS.CART_ONLY_POSTCODE && this.country?.isoCode === 'UK';
     },
@@ -117,6 +148,7 @@ export default {
     }
   },
   methods: {
+    ...mapMutations('cart', ['setNeedToPickup']),
     loadedPricing() {
       gtm.viewCart(this.entities, this.cartPricing, this.currency);
     }

package/package.json

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

package/store/cart.js

@@ -4,9 +4,12 @@ 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';
+
 export const state = () => ({
   id: null,
   entities: [],
+  needToPickup: false,
   suburb: null,
   coupon: null,
   cartPricingCalculating: false,
@@ -26,12 +29,21 @@ const getProductsQuantities = entities => {
   const grouped = groupBy(entities, e => e.product._id);
   const quantities = Object.keys(grouped).map(_id => {
     const [{ prints, product: { name, minimumOrderQuantity, minimumPrintOrderQuantity } }] = grouped[_id];
-    console.log('');
-    console.log('getProductsQuantities:', prints);
-    console.log('minimumPrintOrderQuantity: ', minimumPrintOrderQuantity);
-    console.log('minimumOrderQuantity: ', minimumOrderQuantity);
     const minQty = (prints?.length > 0 ? minimumPrintOrderQuantity : minimumOrderQuantity) || minimumOrderQuantity;
-    return { _id, name, minimumOrderQuantity: minQty, quantity: getEntitiesQuantity(grouped[_id]) };
+    const simpleProducts = grouped[_id].reduce((simpleProducts, product) => {
+      product.simpleProducts?.forEach(simpleProduct => {
+        if (simpleProduct.amount > 0) {
+          let existSimpleProduct = simpleProducts.find(sp => sp.SKU === simpleProduct.SKU);
+          if (!existSimpleProduct) {
+            existSimpleProduct = { ...simpleProduct, amount: 0 };
+            simpleProducts.push(existSimpleProduct);
+          }
+          existSimpleProduct.amount += simpleProduct.amount;
+        }
+      });
+      return simpleProducts;
+    }, []);
+    return { _id, name, minimumOrderQuantity: minQty, quantity: getEntitiesQuantity(grouped[_id]), simpleProducts };
   });
   return quantities;
 };
@@ -63,6 +75,7 @@ const getPrintsQuantities = entities => {
 export const getters = {
   entities: ({ entities }) => entities,
   coupon: ({ coupon }) => coupon,
+  needToPickup: ({ needToPickup }) => needToPickup,
   cartPricingCalculating: ({ cartPricingCalculating }) => cartPricingCalculating,
   simpleProducts: ({ entities }) => entities.reduce((simpleProducts, entity) => [...simpleProducts, ...(entity.simpleProducts || [])], []),
   notEmptySimpleProducts: (state, { simpleProducts }) => simpleProducts.filter(e => e.amount > 0),
@@ -80,6 +93,23 @@ export const getters = {
   notValidProductsQuantities(state, { quantities }) {
     return (quantities?.products || []).filter(({ minimumOrderQuantity, quantity }) => quantity < minimumOrderQuantity);
   },
+  notValidProductsPickup(state, { quantities }) {
+    const simpleProducts = (quantities?.products || [])
+      .reduce((simpleProducts, product) => {
+        return [
+          ...simpleProducts,
+          ...product?.simpleProducts?.map(sp => ({
+            name: product.name,
+            ...sp
+          }))
+        ]
+      }, []);
+
+    const notValid = simpleProducts.filter(sp => sp.warehouseQuantityStock < sp.amount)
+
+    return notValid;
+    
+  },
   notValidStockQuantities(state, { quantities }) {
     return (quantities?.stock || []).filter(({ maxQuantity, quantity }) => quantity > maxQuantity);
   },
@@ -159,13 +189,17 @@ export const actions = {
     await api.saveCart(payload, shop._id);
     commit('setEntities', entities);
   },
-  async calculateCartPrice({ state: { suburb, entities, coupon, cartPricing }, commit }, { shop, country, currency }) {
-    const selectedSuppliersWithRates = cartPricing?.shipping?.suppliersWithRates;
+  async calculateCartPrice({ state: { suburb, entities, coupon, cartPricing, needToPickup }, commit }, { shop, country, currency }) {
+    let savedSuppliersWithRates = null;
+    try {
+      savedSuppliersWithRates = JSON.parse(localStorage.getItem(SUPPLIERS_WITH_RATES_KEY));
+    } catch (e) {}
+    const selectedSuppliersWithRates = cartPricing?.shipping?.suppliersWithRates || savedSuppliersWithRates;
     const payload = generateCalculatePriceData(entities, suburb, null, coupon, selectedSuppliersWithRates, country, currency);
     console.log('calculateCartPrice:payload: ', payload)
     try {
       commit('setCartPricingCalculating', true);
-      const response = await api.calculateProductPrice(payload, shop._id);
+      const response = await api.calculateProductPrice({ ...payload, needToPickup }, shop._id);
       commit('setCartPricing', response);
       commit('setCartPricingError', null);
     } catch (e) {
@@ -202,6 +236,10 @@ export const actions = {
               })
             : supplierWithRates)
       }));
+
+    try {
+      localStorage.setItem(SUPPLIERS_WITH_RATES_KEY, JSON.stringify(suppliersWithRates));
+    } catch (e) {}
     const payload = generateCalculatePriceData(entities, suburb, suppliersWithRates, coupon, null, country, currency);
     try {
       commit('setCartPricingCalculating', true);
@@ -226,6 +264,9 @@ export const mutations = {
   setId(state, id) {
     state.id = id;
   },
+  setNeedToPickup(state, needToPickup) {
+    state.needToPickup = needToPickup;
+  },
   setEntities(state, entities) {
     console.log('setEntities: ', entities);
     state.entities = entities;
@@ -255,6 +296,7 @@ export const mutations = {
     state.suburb = null;
     state.coupon = null;
     state.cartPricingError = null;
+    localStorage.removeItem(SUPPLIERS_WITH_RATES_KEY);
   }
 };
 

package/store/index.js

@@ -53,7 +53,7 @@ export const getters = {
 };
 
 export const actions = {
-  async nuxtServerInit({ commit }, { req }) {
+  async nuxtServerInit({ commit }, { req, query }) {
     const shop = await api.fetchShopByUrl(process.env.HOST_NAME);
     const menus = await api.fetchMenus(shop._id);
     commit('setMenus', menus);
@@ -98,6 +98,10 @@ export const actions = {
         }
       }
     } catch (e) {}
+
+    if (query?.needToPickup === 'true') {
+      commit('cart/setNeedToPickup', true);
+    }
   },
   async loadState({ dispatch, commit, state: { shop, currency, country, notificationBar } }, query) {
     const state = await loadState();