@lancom/shared 0.0.212 → 0.0.214

package/assets/js/api/admin.js

@@ -377,6 +377,21 @@ export default {
   removeWebhook(id) {
     return _delete(`admin/webhooks/${id}`);
   },
+  async fetchGrabbers(params) {
+    return sortByName(await _get('admin/grabbers', params));
+  },
+  fetchGrabberById(id) {
+    return _get(`admin/grabbers/${id}`);
+  },
+  saveGrabber(grabber) {
+    return grabber._id ? _put(`admin/grabbers/${grabber._id}`, grabber) : _post('admin/grabbers', grabber);
+  },
+  runGrabber(grabber) {
+    return _post(`admin/grabbers/${grabber._id}/run`, grabber);
+  },
+  removeGrabber(id) {
+    return _delete(`admin/grabbers/${id}`);
+  },
   async fetchCurrencies(params) {
     return sortByName(await _get('admin/currencies', params));
   },
@@ -419,6 +434,9 @@ export default {
   removeWarehouse(id) {
     return _delete(`admin/warehouse/${id}`);
   },
+  addProductToWarehouse(id, data) {
+    return _post(`admin/warehouse/${id}/product`, data);
+  },
   fetchWarehouseTaskById(id) {
     return _get(`admin/warehouse-task/${id}`);
   },
@@ -458,6 +476,12 @@ export default {
   moveToWarehouseLocations(move) {
     return _post(`admin/warehouse-locations/move/bulk`, move);
   },
+  fetchWarehouseCanonicalProductsLocations(warehouse) {
+    return _get(`admin/warehouses/${warehouse}/canonical-products-locations`);
+  },
+  removeCanonicalProductLocation(warehouse, canonicalProduct, location) {
+    return _delete(`admin/warehouses/${warehouse}/canonical-product/${canonicalProduct}/locations/${location}`);
+  },
   async fetchBanners(params) {
     return sortByName(await _get('admin/banners', params));
   },
@@ -482,6 +506,18 @@ export default {
   removeMenu(id) {
     return _delete(`admin/menus/${id}`);
   },
+  fetchPrintFactories(params) {
+    return _get('admin/print-factories', params);
+  },
+  fetchPrintFactoryById(id) {
+    return _get(`admin/print-factories/${id}`);
+  },
+  savePrintFactory(factory) {
+    return factory._id ? _put(`admin/print-factories/${factory._id}`, factory) : _post('admin/print-factories', factory);
+  },
+  removePrintFactory(id) {
+    return _delete(`admin/print-factories/${id}`);
+  },
   fetchPrintTypes(params) {
     return _get('admin/print-types', params);
   },

package/assets/js/api/index.js

@@ -93,9 +93,9 @@ const api = {
   fetchOrderByToken(token, params) {
     return _get(`order/token/${token}`, params);
   },
-  createOrderPayment(id, card, shop, invoiceId) {
-    const url = invoiceId ? `shop/${shop}/order/${id}/invoice/${invoiceId}/payment` : `shop/${shop}/order/${id}/payment`;
-    return _post(url, card);
+  createOrderPayment(id, { card, shop, country, invoice, payment }) {
+    const url = invoice ? `shop/${shop}/order/${id}/invoice/${invoice}/payment` : `shop/${shop}/order/${id}/payment`;
+    return _post(url, { card, country, payment });
   },
   addOrderTimeline(id, item) {
     return _post(`order/${id}/timeline`, item);

package/components/checkout/order/order-payment-information/order-payment-information.vue

@@ -75,7 +75,7 @@
 import { mapGetters, mapMutations, mapActions } from 'vuex';
 import { generateOrderData } from '@lancom/shared/assets/js/utils/order';
 import gtm from '@lancom/shared/assets/js/utils/gtm';
-import PaymentCart from '@lancom/shared/components/checkout/payment/payment-cart/payment-cart';
+import PaymentCart from '@lancom/shared/components/common/payment/payment_card/pinpayment/pinpayment';
 import ProgressStepsControls from '@lancom/shared/components/common/progress_steps/progress_steps_controls/progress-steps-controls';
 import { ORDER_PAYMENT_METHOD } from '@lancom/shared/assets/js/constants/order';
 import payment from '@lancom/shared/mixins/payment';

package/components/checkout/order/order-review/order-review.vue

@@ -45,8 +45,8 @@ import { groupSimpleProducts } from '@lancom/shared/assets/js/utils/cart';
 import ProgressStepsControls from '@lancom/shared/components/common/progress_steps/progress_steps_controls/progress-steps-controls';
 import { ORDER_PAYMENT_METHOD, ORDER_STEPS } from '@lancom/shared/assets/js/constants/order';
 import payment from '@lancom/shared/mixins/payment';
-import PaymentSuccess from '@lancom/shared/components/checkout/payment/payment_success/payment-success';
-import PaymentFailed from '@lancom/shared/components/checkout/payment/payment_failed/payment-failed';
+import PaymentSuccess from '@lancom/shared/components/common/payment/payment_success/payment-success';
+import PaymentFailed from '@lancom/shared/components/common/payment/payment_failed/payment-failed';
 
 export default {
   name: 'OrderReview',

package/components/common/payment/payment_card/payment-card.vue

@@ -0,0 +1,45 @@
+<template>
+  <div class="Card__wrapper">
+    <client-only>
+      <component
+        :is="cardComponent"
+        ref="card"
+        :paymentData="paymentData"
+        @inited="$emit('inited')" />
+      </client-only>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+
+export default {
+  name: 'PaymentCard',
+  components: {
+    Pinpayment: () => import('./pinpayment/pinpayment'),
+    Stripe: () => import('./stripe/stripe')
+  },
+  props: {
+    paymentData: {
+      type: Object,
+      required: true
+    }
+  },
+  computed: {
+    ...mapGetters(['payment']),
+    cardComponent() {
+      console.log('payment: ', this.payment);
+      return 'stripe';
+    }
+  },
+  methods: {
+    async tokenize() {
+      return await this.$refs.card.tokenize();
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+@import 'payment-card.scss';
+</style>

package/components/{checkout/payment/payment-cart/payment-cart.vue → common/payment/payment_card/pinpayment/pinpayment.vue}

@@ -163,6 +163,7 @@ export default {
 
       this.fields.on('ready', () => {
         this.loading = false;
+        this.$emit('inited');
       });
     },
     tokenize() {
@@ -199,5 +200,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import 'payment-cart.scss';
+@import 'pinpayment.scss';
 </style>

package/components/common/payment/payment_card/stripe/stripe.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+    <div v-if="loadedStripe">
+      <stripe-element-card
+        ref="card"
+        :pk="stripe" />
+    </div>
+  </div>
+</template>
+
+<script>
+import { StripeElementCard } from '@vue-stripe/vue-stripe';
+import { mapGetters } from 'vuex';
+
+let stripeStartLoaded = false;
+
+export default {
+  name: 'PaymentCardStripe',
+  components: {
+    StripeElementCard
+  },
+  data() {
+    return {
+      loadedStripe: false
+    }
+  },
+  computed: {
+    ...mapGetters(['payment']),
+    stripe() {
+      return this.payment.clientKey;
+    }
+  },
+  created() {
+    this.loadStripe();
+  },
+  methods: {
+    async tokenize() {
+      const data = {
+        ...this.$refs.card.element,
+      };
+      const { token, error } = await this.$refs.card.stripe.createToken(data);
+      if (error) {
+        throw new Error(error.message);
+      }
+      return token;
+    },
+    loadStripe() {
+      if (process.browser) {
+        if (!stripeStartLoaded) {
+          stripeStartLoaded = true;
+          let domElement = document.createElement('script');
+          domElement.setAttribute('src', 'https://js.stripe.com/v3/');
+          domElement.onload = () => {
+            this.loadedStripe = true;
+          };
+          domElement.onerror = () => {
+            setTimeout(() => this.loadStripe(), 1000);
+          };
+          document.body.appendChild(domElement);
+        } else {
+          let repeated = 0;
+          let timer = setInterval(() => {
+            if (typeof window.Stripe !== 'undefined' || repeated++ > 20) {
+              this.loadedStripe = true;
+              this.$emit('inited');
+              clearInterval(timer);
+            }
+          }, 500);
+        }
+      }
+    }
+  }
+};
+</script>

package/components/modals/payment_modal/payment-modal.vue

@@ -28,52 +28,14 @@
       v-show="!isVisibleChargeMessage"
       class="lc_modal__content">
       <div
-        v-if="loadingFields"
+        v-if="loadingCard"
         class="lc_modal__spinner">
         <spinner />
       </div>
-      <div class="form-row">
-        <div
-          id="name"
-          class="PaymentModal__field-container">
-        </div>
-        <div
-          id="errors_for_name"
-          class="error_message">
-        </div>
-      </div>
-      <div class="form-row">
-        <div
-          id="number"
-          class="PaymentModal__field-container">
-        </div>
-        <div
-          id="errors_for_number"
-          class="error_message">
-        </div>
-      </div>
-      <div class="form-row--cols">
-        <div class="form-col col-half">
-          <div
-            id="cvc"
-            class="PaymentModal__field-container">
-          </div>
-          <div
-            id="errors_for_cvc"
-            class="error_message">
-          </div>
-        </div>
-        <div class="form-col col-half">
-          <div
-            id="expiry"
-            class="PaymentModal__field-container">
-          </div>
-          <div
-            id="errors_for_expiry"
-            class="error_message">
-          </div>
-        </div>
-      </div>
+      <payment-card
+        ref="card"
+        :paymentData="orderData"
+        @inited="initedCard"/>
       <div class="form-row PaymentModal__terms">
         <label class="form-label PaymentModal__label-with-checkbox">
           <checkbox v-model="agreeTermsAndCondition" />
@@ -118,15 +80,17 @@ import { mapGetters, mapActions, mapMutations } from 'vuex';
 import { price } from '@lancom/shared/assets/js/utils/filters';
 import gtm from '@lancom/shared/assets/js/utils/gtm';
 import gapis from '@lancom/shared/assets/js/utils/gapis';
-import PaymentSuccess from '@lancom/shared/components/checkout/payment/payment_success/payment-success';
-import PaymentFailed from '@lancom/shared/components/checkout/payment/payment_failed/payment-failed';
+import PaymentSuccess from '@lancom/shared/components/common/payment/payment_success/payment-success';
+import PaymentFailed from '@lancom/shared/components/common/payment/payment_failed/payment-failed';
+import PaymentCard from '@lancom/shared/components/common/payment/payment_card/payment-card';
 
 export default {
   name: 'PaymentModal',
   filters: { price },
   components: {
     PaymentSuccess,
-    PaymentFailed
+    PaymentFailed,
+    PaymentCard
   },
   props: {
     switchModal: {
@@ -140,7 +104,7 @@ export default {
   data() {
     return {
       processing: false,
-      loadingFields: false,
+      loadingCard: false,
       form: {},
       fields: null,
       agreeTermsAndCondition: false,
@@ -149,7 +113,7 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(['shop']),
+    ...mapGetters(['shop', 'country', 'payment']),
     ...mapGetters('order', ['orderData']),
     isVisibleChargeMessage() {
       return this.isSuccessOrderCharge || this.isFailedOrderCharge;
@@ -163,14 +127,13 @@ export default {
       return (charge && !charge.success) || this.errorMessage;
     },
     disaledBack() {
-      return this.loadingFields || this.processing;
+      return this.loadingCard || this.processing;
     },
     disaledSubmit() {
-      return this.loadingFields || this.processing || !this.agreeTermsAndCondition || !this.confirmCopyright;
+      return this.loadingCard || this.processing || !this.agreeTermsAndCondition || !this.confirmCopyright;
     }
   },
   mounted() {
-    this.initHostedPayment();
     if (this.orderData.test) {
       this.clearCart();
       this.clearTemplate();
@@ -188,46 +151,8 @@ export default {
     ...mapActions('cart', ['clearCart']),
     ...mapMutations('product', ['clearTemplate']),
     ...mapMutations('layers', ['resetLayers']),
-    initHostedPayment() {
-      this.loadingFields = true;
-      this.fields = window.HostedFields.create({
-        sandbox: process.env.IS_PROD !== 'true',
-        styles: {
-          input: {
-            'font-size': '16px',
-            'font-family': 'helvetica, tahoma, calibri, sans-serif',
-            color: '#3a3a3a'
-          },
-          '.hosted-fields-invalid:not(:focus)': {
-            color: 'red'
-          },
-          'input::placeholder': {
-            color: '#B0B0BA'
-          }
-        },
-        fields: {
-          name: {
-            selector: '#name',
-            placeholder: 'Full Name'
-          },
-          number: {
-            selector: '#number',
-            placeholder: 'Card Number'
-          },
-          cvc: {
-            selector: '#cvc',
-            placeholder: 'CVC'
-          },
-          expiry: {
-            selector: '#expiry',
-            placeholder: 'MM/YY'
-          }
-        }
-      });
-
-      this.fields.on('ready', () => {
-        this.loadingFields = false;
-      });
+    initedCard() {
+      this.loadingCard = true;
     },
     handleErrors(err) {
       // err.messages.forEach(({ message }) => this.$toastr.e(message));
@@ -236,7 +161,7 @@ export default {
     },
     async proceedPayment(card) {
       try {
-        const data = { card, shop: this.shop._id };
+        const data = { card, shop: this.shop._id, country: this.country?._id, payment: this.payment };
         await this.submitPayment(data);
         this.clearCart();
         this.clearTemplate();
@@ -264,31 +189,16 @@ export default {
       this.deleteOrder();
       this.switchModal('showOrderModal');
     },
-    submit() {
+    async submit() {
       this.processing = true;
-      this.fields.tokenize(
-        {
-          publishable_api_key: process.env.PINPAYMENT_PUBLISHABLE_API_KEY,
-          address_line1: this.orderData.addressLine1,
-          address_line2: this.orderData.addressLine2,
-          address_city: this.orderData.city,
-          address_postcode: this.orderData.postcode,
-          address_state: this.orderData.state,
-          address_country: this.orderData.country
-        },
-        (err, response) => {
-          if (!this.processing) {
-            return;
-          }
-
-          if (err) {
-            this.handleErrors(err);
-            this.processing = false;
-          } else {
-            this.proceedPayment(response);
-          }
-        }
-      );
+      try {
+        const response = await this.$refs.card.tokenize();
+        this.proceedPayment(response);
+      } catch (e) {
+        this.handleErrors(e);
+      } finally {
+        this.processing = false;
+      }
     },
     clearFailedCharge() {
       this.errorMessage = null;

package/components/order/order_payment/order-payment.vue

@@ -51,8 +51,8 @@
 <script>
 import { mapGetters } from 'vuex';
 import api from '@lancom/shared/assets/js/api';
-import PaymentCart from '@lancom/shared/components/checkout/payment/payment-cart/payment-cart';
-import PaymentSuccess from '@lancom/shared/components/checkout/payment/payment_success/payment-success';
+import PaymentCart from '@lancom/shared/components/common/payment/payment_card/pinpayment/pinpayment';
+import PaymentSuccess from '@lancom/shared/components/common/payment/payment_success/payment-success';
 
 export default {
   name: 'OrderPayment',
@@ -77,7 +77,7 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(['shop']),
+    ...mapGetters(['shop', 'country', 'payment']),
     model() {
       return this.invoice || this.order;
     }
@@ -94,8 +94,9 @@ export default {
         this.processing = true;
         const card = await this.$refs.paymentCart.tokenize();
         if (card) {
-          const { _id: invoiceId } = this.invoice || {};
-          const { paid } = await api.createOrderPayment(this.order._id, card, this.shop._id, invoiceId);
+          const { _id: invoice } = this.invoice || {};
+          const payload = { invoice, card, shop: this.shop._id, country: this.country?._id, payment: this.payment };
+          const { paid } = await api.createOrderPayment(this.order._id, payload);
           this.model.paid = paid;
         }
       } catch (e) {

package/components/product/product.vue

@@ -48,7 +48,9 @@ import ProductFabricAndSizeInfo from './layouts/product_fabric_and_size_info/pro
 import ProductPackaging from './layouts/product_packaging/product-packaging';
 import ProductModelMeasurements from './layouts/product_model_measurements/product-model-measurements';
 import ProductSizeTable from './layouts/product_size_table/product-size-table';
-
+import RelatedProducts from '@lancom/shared/components/product/related_products/related-products';
+import Gallery from '@lancom/shared/components/product/gallery/gallery';
+    
 // import ProductLabelsCustomization from './layouts/product_labels_customization/product-labels-customization';
 
 export default {
@@ -61,8 +63,8 @@ export default {
     ProductPackaging,
     ProductModelMeasurements,
     ProductSizeTable,
-    RelatedProducts: () => import('@lancom/shared/components/product/related_products/related-products'),
-    Gallery: () => import('@lancom/shared/components/product/gallery/gallery'),
+    RelatedProducts,
+    Gallery
     // ProductLabelsCustomization
   },
   computed: {

package/mixins/payment.js

@@ -16,7 +16,7 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(['shop']),
+    ...mapGetters(['shop', 'country', 'payment']),
     ...mapGetters('order', ['orderData', 'card']),
     isVisibleChargeMessage() {
       return this.isSuccessOrderCharge || this.isFailedOrderCharge;
@@ -44,7 +44,7 @@ export default {
     async proceedPayment(card) {
       try {
         this.clearFailedCharge();
-        const data = { card, shop: this.shop._id };
+        const data = { card, shop: this.shop._id, country: this.country, payment: this.payment };
         await this.submitPayment(data);
         this.onOrderSucces();
       } catch (e) {

package/nuxt.config.js

@@ -89,6 +89,11 @@ module.exports = (config, axios, { raygunClient, publicPath } = {}) => ({
     STATIC_URL: process.env.STATIC_URL
   },
   build: {
+    splitChunks: {
+      layouts: false,
+      pages: false,
+      commons: false
+    },
     publicPath: publicPath || '/client/',
     postcss: null,
     transpile: [
@@ -152,10 +157,10 @@ module.exports = (config, axios, { raygunClient, publicPath } = {}) => ({
                     title: { _text: product.name },
                     content: { _text: review.text },
                     pros: {
-                      pro: [{ _text: review.pro }]
+                      pro: (review.pro || '').split(/\n/).map(pro => ({ _text: pro }))
                     },
                     cons: {
-                      con: [{ _text: review.cons }]
+                      con: (review.cons || '').split(/\n/).map(cons => ({ _text: cons }))
                     },
                     review_url: {
                       _attributes: {
@@ -275,11 +280,19 @@ module.exports = (config, axios, { raygunClient, publicPath } = {}) => ({
                 'g:is_bundle': { _text: product.prePrint ? 'yes' : 'no' },
                 'g:identifier_exists': sp.gtin ? 'yes' : 'no',
                 'g:product_weight': { _text: `${product.weight} kg` },
-                'g:shipping_weight': { _text: `${((product.weight || 0) + (product.weight || 0) * 0.05).toFixed(3)} kg` }
+                'g:shipping_weight': { _text: `${((product.weight || 0) + (product.weight || 0) * 0.05).toFixed(3)} kg` },
+                'g:quantity': { _text: sp.quantityStock },
+                'g:pickup_method': { _text: 'buy' },
+                'g:pickup_sla': { _text: 'next day' }
               };
+
               if (sp.gtin) {
                 info['g:gtin'] = { _text: sp.gtin || '' };
               }
+
+              if (sp.storeCode) {
+                info['g:store_code'] = { _text: sp.storeCode };
+              }
               if (product.volume) {
                 if (product.volume.length) {
                   info['g:shipping_length'] = { _text: `${product.volume.length} cm` };

package/package.json

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

package/store/index.js

@@ -6,6 +6,7 @@ const CLOSED_NOTIFICATION = 'lancom-closed-notification-1.0';
 export const state = () => ({
   country: null,
   currency: null,
+  payment: null,
   shop: {},
   menus: [],
   contacts: {},
@@ -23,6 +24,7 @@ export const getters = {
   currency: ({ currency }) => currency,
   currencies: ({ shop }) => (shop.countries || []).reduce((currencies, { country }) => [...currencies, country?.currency], []).filter(c => !!c),
   shop: ({ shop }) => shop || {},
+  payment: ({ payment }) => payment || {},
   menus: ({ menus }) => menus || [],
   topMenu: ({ menus }) => (menus || []).find(({ type }) => type === 'top'),
   footerMenus: ({ menus }) => (menus || []).filter(({ type }) => type === 'footer'),
@@ -52,6 +54,21 @@ export const actions = {
     const settings = await api.fetchClientSettings(shop._id, params);
     commit('setCountry', settings.country);
     commit('setCurrency', settings.currency);
+
+    if (process.env.PINPAYMENT_PUBLISHABLE_API_KEY) {
+      commit('setPayment', {
+        type: 'pinpayment',
+        clientKey: process.env.PINPAYMENT_PUBLISHABLE_API_KEY
+      });
+    } else {
+      const countrySettings = (shop.countries || []).find(c => c.country?._id === settings.country?._id) || { settings: [] };
+      const countrySetting = countrySettings.settings.find(s => !!s.settings.app.STRIPE_PUBLIC_KEY);
+      commit('setPayment', {
+        type: 'stripe',
+        clientKey: countrySetting.settings.app.STRIPE_PUBLIC_KEY
+      });
+    }
+
     // }
     try {
       if (req.headers.cookie) {
@@ -99,6 +116,9 @@ export const actions = {
 };
 
 export const mutations = {
+  setPayment(state, payment) {
+    state.payment = payment;
+  },
   setCountry(state, country) {
     state.country = country;
   },

package/store/order.js

@@ -19,9 +19,10 @@ export const actions = {
     const response = await api.createOrder(order, shop);
     commit('setOrderData', response);
   },
-  async submitPayment({ commit, state: { orderData } }, { card, shop }) {
+  async submitPayment({ commit, state: { orderData } }, { card, payment, country, shop }) {
     const { _id } = orderData || {};
-    const response = await api.createOrderPayment(_id, card, shop);
+    debugger;
+    const response = await api.createOrderPayment(_id, { card, shop, country, payment });
     commit('setOrderData', response);
     return {};
   },