@lancom/shared 0.0.134 → 0.0.137

package/assets/js/api/admin.js

@@ -142,6 +142,18 @@ export default {
   removeTaskType(id) {
     return _delete(`admin/task-types/${id}`);
   },
+  fetchAccessTokens() {
+    return _get('admin/access-tokens');
+  },
+  fetchAccessTokenById(id) {
+    return _get(`admin/access-tokens/${id}`);
+  },
+  saveAccessToken(item) {
+    return item._id ? _put(`admin/access-tokens/${item._id}`, item) : _post('admin/access-tokens', item);
+  },
+  removeAccessToken(id) {
+    return _delete(`admin/access-tokens/${id}`);
+  },
   fetchFAQ() {
     return _get('admin/faq');
   },
@@ -305,6 +317,18 @@ export default {
   removeDecorator(id) {
     return _delete(`admin/decorators/${id}`);
   },
+  async fetchWebhooks(params) {
+    return sortByName(await _get('admin/webhooks', params));
+  },
+  fetchWebhookById(id) {
+    return _get(`admin/webhooks/${id}`);
+  },
+  saveWebhook(webhook) {
+    return webhook._id ? _put(`admin/webhooks/${webhook._id}`, webhook) : _post('admin/webhooks', webhook);
+  },
+  removeWebhook(id) {
+    return _delete(`admin/webhooks/${id}`);
+  },
   async fetchWarehouses(params) {
     return sortByName(await _get('admin/warehouse', params));
   },

package/components/common/breakpoint.vue

@@ -41,11 +41,11 @@ export default {
         valid = currentIndex === targetIndex;
       }
       if (valid) {
-        return this.$slots.default;
+        return this.$slots.content || this.$slots.default;
       }
       return null;
     }
-    return null;
+    return this.$slots.shadow;
   }
 };
 </script>

package/components/common/checkbox.vue

@@ -13,6 +13,7 @@
       @change="$emit('change', model)" />
     <label
       class="Checkbox__label"
+      :class="{ dark }"
       :for="id"
       @click.stop>
       <i class="icon-ok Checkbox__icon"></i>
@@ -35,6 +36,9 @@ export default {
     disabled: {
       default: false
     },
+    dark: {
+      default: false
+    },
     uncheckedValue: {
       default: false
     },
@@ -128,6 +132,12 @@ html[dir=rtl] {
         transform: translateY(-50%);
       }
 
+      &.dark {
+        &:before {
+          border: 1px solid $grey_1;
+        }
+      }
+
       &:after {
         content: '';
         position: absolute;

package/components/common/pricing_discounts_table/pricing-discounts-table.vue

@@ -16,7 +16,12 @@
           active: amount >= range.min && ((range.max && amount <= range.max) || !range.max)
         }">
         <td>{{ (range.max >= 9999 || !range.max) ? `${range.min}+` : `${range.min}-${range.max}` }}</td>
-        <td>{{ range.price | priceWithTax(pricingSettings) }}</td>
+        <td v-if="withGst">
+          {{ range.price | priceWithTax(pricingSettings) }}
+        </td>
+        <td v-else>
+          {{ range.price | price }}
+        </td>
       </tr>
     </tbody>
   </table>
@@ -24,12 +29,13 @@
 
 <script>
 import { mapGetters } from 'vuex';
-import { priceWithTax } from '@lancom/shared/assets/js/utils/filters';
+import { priceWithTax, price } from '@lancom/shared/assets/js/utils/filters';
 
 export default {
   name: 'PricingDiscountsTable',
   filters: {
-    priceWithTax
+    priceWithTax,
+    price
   },
   props: {
     prices: {
@@ -47,6 +53,10 @@ export default {
     striped: {
       type: Boolean,
       default: false
+    },
+    withGst: {
+      type: Boolean,
+      default: true
     }
   },
   computed: {

package/components/common/tabs.vue

@@ -5,7 +5,10 @@
         v-for="tab in tabs"
         :key="tab.value"
         class="tab ripple"
-        :class="{ active: currentTab === tab.value }"
+        :class="{
+          active: currentTab === tab.value,
+          shadow: btnsShadow
+        }"
         @click="select(tab)">
         <div class="lc_medium18 tab-label">
           <i
@@ -53,6 +56,10 @@ export default {
       type: Boolean,
       default: false
     },
+    btnsShadow: {
+      type: Boolean,
+      default: false
+    },
     fullWidth: {
       type: Boolean,
       default: true
@@ -132,7 +139,6 @@ export default {
   &s {
     display: flex;
     border-radius: 4px 4px 0 0;
-    overflow: hidden;
     &--secondary,
     &--primary,
     &--large {
@@ -161,12 +167,19 @@ export default {
     background-color: #FFFFFF;
     color: $grey_1;
   }
+  &:hover {
+    background-color: #FFFFFF;
+    color: $grey_1;
+  }
   &s--large &.active,
   &s--primary &.active,
   &s--secondary &.active {
     background-color: $grey_4;
     color: $black;
   }
+  &.shadow {
+    box-shadow: 1px 1px 2px rgb(214, 214, 214);
+  }
 }
 .fullWidth .tab {
   flex-grow: 1;

package/components/product/gallery/gallery.vue

@@ -171,6 +171,12 @@ export default {
       this.skipUpdateGallery = false;
     }
   },
+  mounted() {
+    const index = this.filteredImages.findIndex(i => i.color === this.editableColor?._id);
+    if (index > -1) {
+      this.goToSlide(index, true);
+    }
+  },
   methods: {
     ...mapActions('product', ['selectColor']),
     staticLink,

package/components/product/product_info_tabs/product-info-tabs.vue

@@ -3,6 +3,7 @@
     <tabs
       :tabs="tabs"
       :selected="selectedTab"
+      :btns-shadow="true"
       @select="selectedTab = $event">
       <template #default="{ currentTab }">
         <component

package/components/product/product_prints_price_info/product-prints-price-info.scss

@@ -32,6 +32,9 @@
 }
 
 .ProductPrintsPriceInfo {
+  &__wrapper {
+    position: relative;
+  }
   &__print-pricing {
     margin-top: 30px;
   }
@@ -60,4 +63,11 @@
     justify-content: flex-end;
     padding: 0 0 10px 0;
   }
+  &__content {
+    opacity: 1;
+    transition: opacity 500ms;
+    &--hidden {
+      opacity: 0;
+    }
+  }
 }

package/components/product/product_prints_price_info/product-prints-price-info.vue

@@ -1,7 +1,10 @@
 <template>
   <div class="ProductPrintsPriceInfo__wrapper">
     <div class="ProductPrintsPriceInfo__toggle-gst">
-      <checkbox v-model="inclGST">
+      <checkbox
+        v-model="inclGST"
+        :dark="true"
+        @change="onChangeInclGST">
         <div class="ml-5">Inc. GST</div>
       </checkbox>
     </div>
@@ -9,22 +12,29 @@
       v-if="avilableTabs.length > 0"
       :tabs="avilableTabs"
       :selected="selectedTab"
+      :btns-shadow="true"
       type="secondary"
       @select="selectedTab = $event">
       <template #default="{ currentTab }">
-        <product-screen-print-price-info
-          v-if="currentTab === 'screen print'"
-          :product="product"
-          :with-gst="inclGST" />
-        <product-print-price-info
-          v-else-if="currentTab"
-          :product="product"
-          :type="currentTab"
-          :with-gst="inclGST" />
         <div
-          v-if="currentPrintTypeMessage"
-          class="ProductPrintsPriceInfo__print-description"
-          v-html="currentPrintTypeMessage"></div>
+          class="ProductPrintsPriceInfo__content"
+          :class="{
+            'ProductPrintsPriceInfo__content--hidden': inclGSTSpinner
+          }">
+          <product-screen-print-price-info
+            v-if="currentTab === 'screen print'"
+            :product="product"
+            :with-gst="inclGSTFinal" />
+          <product-print-price-info
+            v-else-if="currentTab"
+            :product="product"
+            :type="currentTab"
+            :with-gst="inclGSTFinal" />
+          <div
+            v-if="currentPrintTypeMessage"
+            class="ProductPrintsPriceInfo__print-description"
+            v-html="currentPrintTypeMessage"></div>
+        </div>
       </template>
     </tabs>
     <div
@@ -59,6 +69,9 @@ export default {
   data() {
     return {
       inclGST: false,
+      inclGSTFinal: false,
+      inclGSTSpinner: false,
+      inclGSTSpinnerTimer: null,
       orderPrintTypes: PRINT_TYPES_LIST,
       tabs: [{
         label: 'Black',
@@ -107,8 +120,19 @@ export default {
       group: 'garment-print-price-details'
     });
   },
+  destroyed() {
+    clearTimeout(this.inclGSTSpinnerTimer);
+  },
   methods: {
-    ...mapActions(['loadHelpMessages'])
+    ...mapActions(['loadHelpMessages']),
+    onChangeInclGST() {
+      clearTimeout(this.inclGSTSpinnerTimer);
+      this.inclGSTSpinner = true;
+      this.inclGSTSpinnerTimer = setTimeout(() => {
+        this.inclGSTSpinner = false;
+        this.inclGSTFinal = this.inclGST;
+      }, 500);
+    }
   }
 };
 </script>

package/package.json

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

package/store/index.js

@@ -10,6 +10,7 @@ export const state = () => ({
   orderInfo: {},
   pricing: {},
   notificationBar: {},
+  discountPopup: {},
   helpMessages: {},
   depositInfo: {}
 });
@@ -22,6 +23,7 @@ export const getters = {
   helpMessages: ({ helpMessages }) => helpMessages || {},
   contacts: ({ contacts }) => contacts || {},
   notificationBar: ({ notificationBar }) => notificationBar || {},
+  discountPopup: ({ discountPopup }) => discountPopup || {},
   pricingSettings: ({ pricing }) => pricing || {},
   orderSettings: ({ orderInfo }) => orderInfo || {},
   gstTax: ({ pricing }) => pricing?.gstTax || 0,
@@ -73,11 +75,12 @@ export const actions = {
 };
 
 export const mutations = {
-  setSettings(state, { contacts, pricing, notificationBar, order, depositInfo }) {
+  setSettings(state, { contacts, pricing, notificationBar, discountPopup, order, depositInfo }) {
     state.contacts = contacts;
     state.pricing = pricing;
     state.orderInfo = order;
     state.notificationBar = notificationBar;
+    state.discountPopup = discountPopup;
     state.depositInfo = depositInfo;
   },
   setShop(state, shop) {