@lancom/shared 0.0.319 → 0.0.321

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

@@ -67,7 +67,7 @@
           <progress-steps-controls
             class="OrderPaymentInformation__controls"
             :disabled-prev="creating"
-            :disabled-next="creating"
+            :disabled-next="loadingCard || creating || submitting"
             label-next="MAKE PAYMENT"
             @prev="$emit('prev')"
             @next="submit" />
@@ -106,6 +106,7 @@ export default {
     return {
       initing: false,
       creating: false,
+      submitting: false,
       loadingCard: true,
       isDepositPayment: this.order.paymentMethod === ORDER_PAYMENT_METHOD.DEPOSIT
     };
@@ -163,7 +164,7 @@ export default {
       }).join('</p><p>')}</p>`;
     },
     async submit() {
-      this.creating = true;
+      this.submitting = true;
       this.errorMessage = null;
 
       const orderInfo = this.orderData || generateOrderData(this.order, this.entities, this.cartPricing);
@@ -186,6 +187,7 @@ export default {
         }
       }
       this.creating = false;
+      this.submitting = false;
       // this.$emit('next');
     },
     async submitOrder() {

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

@@ -86,7 +86,8 @@
 </template>
 
 <script>
-let interval = null;
+let timer = null;
+let pinpaymentStartLoaded = false;
 
 export default {
   name: 'Payment',
@@ -113,7 +114,7 @@ export default {
   async mounted() {
     this.loading = true;
 
-    await this.preloadPinpayments();
+    await this.loadPinpayments();
 
     if (window.HostedFields) {
       await this.initHostedPayment();
@@ -125,6 +126,9 @@ export default {
       });
     }
   },
+  destroyed() {
+    clearInterval(timer);
+  },
   methods: {
     initHostedPayment() {
       this.fields = window.HostedFields.create({
@@ -201,30 +205,33 @@ 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()
+    async loadPinpayments() {
+      if (process.browser) {
+        await (new Promise((resolve, reject) => {
+          if (!pinpaymentStartLoaded) {
+            pinpaymentStartLoaded = true;
+            let domElement = document.createElement('script');
+            domElement.type = "text/javascript";
+            domElement.setAttribute('src', 'https://cdn.pinpayments.com/pin.hosted_fields.v1.js');
+            domElement.onload = () => {
+              resolve();
+            };
+            domElement.onerror = () => {
+              setTimeout(() => this.loadPinpayments(), 1000);
+            };
+            document.body.appendChild(domElement);
+          } else {
+            let repeated = 0;
+            timer = setInterval(() => {
+              if (!!window.HostedFields || repeated++ > 40) {
+                clearInterval(timer);
+                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);
-        });
+            }, 500);
+          }
+        }));
       }
+    }
   }
 };
 </script>

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

@@ -9,6 +9,7 @@ import api from '@lancom/shared/assets/js/api';
 import { mapGetters } from 'vuex';
 
 let stripeStartLoaded = false;
+let timer = null;
 
 export default {
   name: 'PaymentStripePayment',
@@ -35,9 +36,12 @@ export default {
       return this.payment.clientKey;
     }
   },
-  created() {
+  mounted() {
     this.loadStripe();
   },
+  destroyed() {
+    clearInterval(timer);
+  },
   methods: {
     async tokenize() {
       if (this.paymentIntent) {
@@ -73,9 +77,8 @@ export default {
           };
           document.body.appendChild(domElement);
         } else {
-          let repeated = 0;
-          let timer = setInterval(() => {
-            if (typeof window.Stripe !== 'undefined' || repeated++ > 20) {
+          timer = setInterval(() => {
+            if (typeof window.Stripe !== 'undefined') {
               this.onLoaded();
               clearInterval(timer);
             }

package/package.json

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