@lancom/shared 0.0.246 → 0.0.248

package/assets/scss/ui_kit/_forms.scss

@@ -177,7 +177,7 @@ html[dir=rtl] .form-icon-left {
   height: 50px;
   border-width: 1px;
   border-style: solid;
-  border-color: #EFF1F2;
+  border-color: $grey_3;
   border-radius: 5px;
   font-style: normal;
   font-weight: normal;
@@ -424,7 +424,7 @@ html[dir=rtl] .textarea {
   }
   &__tags {
     min-height: 50px;
-    border: 1px solid #e5e5e5;
+    border: 1px solid $grey_3;
     border-radius: 8px !important;
     padding: 19px 3px 4px 20px;
   }

package/assets/scss/ui_kit/_tooltip.scss

@@ -1,3 +1,5 @@
+@import "@/assets/scss/variables";
+
 .tooltip {
   display: block !important;
   z-index: 10000;
@@ -25,7 +27,7 @@
   &.white &-inner {
     background: #FFF !important;
     color: #575872 !important;
-    border: 1px solid #EFF1F2 !important;
+    border: 1px solid $grey_3 !important;
   }
   &.white &-arrow {
     border-color: #FFF !important;

package/assets/scss/variables/_theme.scss

@@ -15,7 +15,7 @@ $white_high_emphasis: #FFFFFF;
 $white_medium_emphasis: rgba(255, 255, 255, .66);
 $gray: #575872 !default;
 $medium_gray: #B0B0BA !default;
-$light_gray: #F9F9FC !default;
+$light_gray: #F9F9FC;
 $link: #5D89A9;
 $error: #E44868;
 $secondary_900: #20303C;
@@ -52,8 +52,8 @@ $black: #343750 !default;
 $gray_main: #616277 !default;
 $grey_1: #616277 !default;
 $grey_2: #B0B0BA !default;
-$grey_3: #EFF1F2 !default;
-$grey_4: #F9F9FC !default;
+$grey_3: #EFF1F2;
+$grey_4: #F9F9FC;
 $grey_5: #9898A5 !default;
 
 $white: #fff;

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

@@ -191,6 +191,9 @@ export default {
           this.onOrderSucces();
           this.$emit('next');
         }
+      } catch (e) {
+        const { message } = (e.response && e.response.data) || e;
+        this.handleErrors({ messages: [{ message }] });
       } finally {
         this.creating = false;
       }

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

@@ -86,6 +86,8 @@
 </template>
 
 <script>
+let interval = null;
+
 export default {
   name: 'Payment',
   props: {
@@ -108,14 +110,17 @@ export default {
       fields: null
     };
   },
-  mounted() {
+  async mounted() {
     this.loading = true;
+
+    await this.preloadPinpayments();
+
     if (window.HostedFields) {
-      this.initHostedPayment();
+      await this.initHostedPayment();
     } else {
-      window.addEventListener('load', () => {
+      window.addEventListener('load', async () => {
         if (!this.fields) {
-          this.initHostedPayment();
+          await this.initHostedPayment();
         }
       });
     }
@@ -194,7 +199,31 @@ export default {
           }
         );
       });
-    }
+    },
+    async preloadPinpayments() {
+        if (!window.HostedFields) {
+          clearInterval(interval);
+          await this.loadPinpayments();
+          await new Promise((resolve, reject) => {
+            interval = setInterval(() => {
+              if (window.HostedFields) {
+                clearInterval(interval);
+                resolve()
+              }
+            }, 100);
+          });
+        }
+      },
+      loadPinpayments() {
+        return new Promise((resolve) => {
+          const script = document.createElement('script');
+          script.type = "text/javascript";
+          script.src = 'https://cdn.pinpayments.com/pin.hosted_fields.v1.js';
+          script.onload = () => resolve();
+          const body = document.getElementsByTagName('body')[0]; 
+          body.appendChild(script);
+        });
+      }
   }
 };
 </script>

package/components/editor/editor.vue

@@ -18,7 +18,9 @@
               </component>
             </template>
           </tabs>
-          <div class="Editor__footer">
+          <div
+            v-if="productAvailableInCurrentCountry"
+            class="Editor__footer">
             <btn
               btn-label="Start again"
               btn-class="white"
@@ -135,8 +137,12 @@ export default {
     ...mapGetters('layers', [
       'layerThumbnails'
     ]),
+    productAvailableInCurrentCountry() {
+      const { countries } = this.product;
+      return !(countries || []).length || countries.includes(this.country._id);
+    },
     addToCartDisabled() {
-      return !(this.template.layers.length && this.usedSimpleProducts.length);
+      return !this.usedSimpleProducts.length || (this.product.printOnly && !this.template.layers.length);
     }
   },
   watch: {

package/components/editor/editor_product_details/editor-product-details.scss

@@ -47,4 +47,10 @@
       text-align: center;
     }
   }
+  &__available-warning {
+    background-color: $error;
+    color: $white;
+    padding: 10px;
+    margin-top: 10px;
+  }
 }

package/components/editor/editor_product_details/editor-product-details.vue

@@ -61,8 +61,13 @@
         </div>
       </div>
     </div>
+    <div
+      v-if="!productAvailableInCurrentCountry"
+      class="EditorProductDetails__available-warning">
+      Product Not Available in {{ country.name }}
+    </div>
     <fragment
-      v-if="productDetailsLoaded">
+      v-if="productDetailsLoaded && productAvailableInCurrentCountry">
       <div class="EditorProductDetails__section">
         <product-colors-selector />
       </div>
@@ -112,8 +117,13 @@ export default {
       'layerThumbnails'
     ]),
     ...mapGetters([
-      'pricingSettings'
+      'pricingSettings',
+      'country'
     ]),
+    productAvailableInCurrentCountry() {
+      const { countries } = this.product;
+      return !(countries || []).length || countries.includes(this.country._id);
+    },
     productLink() {
       return generateProductLink(this.product);
     },

package/components/faq/faq.vue

@@ -111,7 +111,7 @@ export default {
 </script>
 
 <style lang="scss">
-@import "@lancom/shared/assets/scss/variables";
+@import "@/assets/scss/variables";
 $types: delivery, general, other, printing, garments;
 .FAQ {
   &__wrapper {
@@ -218,7 +218,7 @@ $types: delivery, general, other, printing, garments;
     &-body {
       padding: 6px 30px 24px 30px;
       line-height: 27px;
-      color: $gray;
+      color: $grey_1;
       overflow: hidden;
       @import "@lancom/shared/assets/scss/normalize";
     }

package/components/products/products_autocomplete/products-autocomplete.scss

@@ -10,20 +10,21 @@
     right: 0;
     top: 41px;
     padding: 10px;
-    background-color: $black;
-    color: $white;
+    background-color: white;
+    border: 1px solid $medium_gray;
+    z-index: 999;
   }
   &__result-item {
     padding-bottom: 10px;
     margin-bottom: 10px;
-    border-bottom: 1px solid $gray_main;
+    border-bottom: 1px solid $medium_gray;
     &:last-child {
       border-bottom: none;
       margin-bottom: 0px;
     }
     ::v-deep {
       a {
-        color: $white;
+        color: $gray_main;
         font-size: 13px;
         text-decoration: none;
       }
@@ -33,24 +34,22 @@
       padding: 10px;
       text-align: center;
       display: block;
-      background-color: $white;
+      background-color: $black;
+      color: $white !important;
       &:hover {
-        background-color: $black;
-        color: $white;
+        background-color: $white;
+        color: $black !important;
       }
     }
   }
   &__input {
     input {
-      background-color: #535353;
-      border: none;
+      border-color: $medium_gray;
       border-radius: 0px;
-      color: $white;
       height: 41px;
       position: relative;
       z-index: 1;
       &::placeholder {
-        font-weight: 600;
         font-size: 14px;
         color: $grey_3;
       }
@@ -61,7 +60,6 @@
       right: 10px;
       font-size: 17px;
       pointer-events: none;
-      color: $white;
       &.icon-search {
         z-index: 2;
         pointer-events: all;

package/feeds/google-shopping.js

@@ -1,3 +1,19 @@
+async function googleLocalShoppingFeed(axios, config, availableStores) {
+  const result = await googleShoppingFeed(axios, config, availableStores);
+  
+  const fields = [
+    'g:availability',
+    'g:id',
+    'g:pickup_method',
+    'g:pickup_sla',
+    'g:price',
+    'g:quantity',
+    'g:store_code'
+  ];
+  result.rss.channel.item = result.rss.channel.item
+    .map(i => fields.reduce((item, field) => ({ ...item, [field]: i[field] }), {}));
+  return result;
+}
 async function googleShoppingFeed(axios, config, availableStores) {
   const { data } = await axios.get(`${config.LOCAL_API_URL}/feed/products?host=${config.HOST_NAME}`);
   const spliceFirstImage = images => (images || []).splice(0, 1)[0];
@@ -72,6 +88,7 @@ async function googleShoppingFeed(axios, config, availableStores) {
                 }
               } else {
                 info['g:pickup_method'] = { _text: 'not_supported' };
+                info['g:excluded_destination'] = { _text: 'Local_inventory_ads' };
               }
               if (product.volume) {
                 if (product.volume.length) {
@@ -104,5 +121,6 @@ async function googleShoppingFeed(axios, config, availableStores) {
 }
 
 module.exports = {
-  googleShoppingFeed
+  googleShoppingFeed,
+  googleLocalShoppingFeed
 };

package/feeds/index.js

@@ -1,7 +1,8 @@
 const { reviewsFeed } = require('./reviews');
-const { googleShoppingFeed } = require('./google-shopping');
+const { googleShoppingFeed, googleLocalShoppingFeed } = require('./google-shopping');
 
 module.exports = {
   reviewsFeed,
-  googleShoppingFeed
+  googleShoppingFeed,
+  googleLocalShoppingFeed
 };

package/mixins/meta-info.js

@@ -34,7 +34,10 @@ const metaInfo = {
     }
   },
   head() {
-    const hasQueryParams = Object.keys(this.$route.query || {}).length > 0;
+    const hasQueryParams = Object
+      .keys(this.$route.query || {})
+      .filter(key => !['color', 'store'].includes(`${key || ''}`.toLowerCase()))
+      .length > 0;
 
     const { short_text: shortText, image, meta = {} } = this.routeInfo || {};
     const pageItemMeta = this.pageItem?.meta || {};

package/package.json

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

package/store/product.js

@@ -160,6 +160,7 @@ export const actions = {
         commit('setSelectedPrintArea', { printArea: first._id, size: first.printSize });
       }
     } catch (e) {
+      console.log(e);
       const { status, data } = e?.response || {};
       const statusCode = status || 500;
       commit('setLoadError', {