@lancom/shared 0.0.424 → 0.0.427

package/store/index.js

@@ -4,13 +4,9 @@ import { getAuthToken } from '@lancom/shared/assets/js/utils/auth';
 import { getShopCountrySettings } from '@lancom/shared/assets/js/utils/shop';
 import { MESSAGES, COUNTRIES_MESSAGES } from '@/messages';
 import { SETTINGS, COUNTRIES_SETTINGS } from '@/settings';
-import { getSharePromise, clearAllSharePromises } from '@lancom/shared/assets/js/utils/share-promises';
-
 const cookieparser = process.server ? require('cookieparser') : undefined;
 const CLOSED_NOTIFICATION = 'lancom-closed-notification-1.0';
 
-const shareShopInfo = getSharePromise(60 * 1000);
-
 export const state = () => ({
   googleClickId: null,
   stockCountry: null,
@@ -73,14 +69,9 @@ export const actions = {
       await commit('setShop', shop);
     }
   },
-  async nuxtServerInit({ commit }, { req, query }) {
-    if (query?.cache === 'false') {
-      clearAllSharePromises();
-      await api.clearAllSharePromises();
-    }
-
-    const shop = await shareShopInfo.share(process.env.HOST_NAME, () => api.fetchShopByUrl(process.env.HOST_NAME));
-    const menus = await shareShopInfo.share(`menus_${shop._id}`, () => api.fetchMenus(shop._id));
+  async nuxtServerInit({ commit }, { req }) {
+    const shop = await api.fetchShopByUrl(process.env.HOST_NAME);
+    const menus = await api.fetchMenus(shop._id);
     commit('setMenus', menus);
     commit('setShop', shop);
     // if (req.headers.cookie) {

package/store/product.js

@@ -45,6 +45,7 @@ export const state = () => ({
   selectedPrintUnderbases: {},
   selectedPrintUnderbase: false,
   editModeSelectedLayer: false,
+  offsetWarningVisible: false,
   selectedPrintAreas: {},
   productPricing: null,
   selectedTab: null,
@@ -77,7 +78,7 @@ export const getters = {
   usedBigSizeSimpleProductsQuantity: (state, { usedSimpleProducts }) => filterBigSize(usedSimpleProducts).reduce((sum, { amount }) => sum + amount, 0),
   defaultSimpleProduct: ({ productDetails, editableColor }) => {
     return editableColor && (
-      productDetails.simpleProducts.find(({ color, size }) => color._id === editableColor._id && size?.alias === 'small')
+      productDetails.simpleProducts.find(({ color, size }) => color._id === editableColor._id && size.alias === 'small')
       || productDetails.simpleProducts.find(({ color }) => color._id === editableColor._id)
     );
   },
@@ -162,6 +163,22 @@ export const getters = {
     const price = pricing?.prints?.prints?.reduce((sum , print) => sum + (+print.priceWithoutTax || 0), 0) || maxPrintsPrice;
     return price;
   },
+  offsetWarningVisible: ({ offsetWarningVisible }) => offsetWarningVisible,
+  showRecommendationToUseLargerImage: ({ selectedLayer }) => {
+    return (
+      selectedLayer &&
+      selectedLayer.type === 'art' &&
+      selectedLayer.dpi >= 75 &&
+      selectedLayer.dpi <= 100
+    );
+  },
+  showErrorAboutSmallImage: ({ selectedLayer }) => {
+    return (
+      selectedLayer &&
+      selectedLayer.type === 'art' &&
+      selectedLayer.dpi < 75
+    );
+  }
 };
 
 export const actions = {
@@ -319,6 +336,9 @@ export const mutations = {
   setPriceIncludeGST(state, priceIncludeGST) {
     state.priceIncludeGST = priceIncludeGST;
   },
+  setOffsetWarningVisible(state, offsetWarningVisible) {
+    state.offsetWarningVisible = offsetWarningVisible;
+  },
   setLoadError(state, error) {
     state.loadError = error;
   },
@@ -439,6 +459,22 @@ export const mutations = {
       state.isPrintPricing = false;
     }
   },
+  moveUpTemplateLayer(state, layer) {
+    const index = state.template.layers.findIndex(({ createdAt }) => createdAt === layer.createdAt);
+    if (index > 0) {
+      const layers = state.template.layers;
+      const [layerToMove] = layers.splice(index, 1);
+      layers.splice(index - 1, 0, layerToMove);
+    }
+  },
+  moveDownTemplateLayer(state, layer) {
+    const index = state.template.layers.findIndex(({ createdAt }) => createdAt === layer.createdAt);
+    if (index < state.template.layers.length - 1) {
+      const layers = state.template.layers;
+      const [layerToMove] = layers.splice(index, 1);
+      layers.splice(index + 1, 0, layerToMove);
+    }
+  },
   updateTemplateLayer(state, layer) {
     const index = state.template.layers.findIndex(({ createdAt, _id }) => createdAt === layer.createdAt || (_id && _id === layer._id));
     Vue.set(state.template.layers, index, layer);

package/assets/js/utils/share-promises/index.js

@@ -1,76 +0,0 @@
-const MAX_PROMISES_COUNT = 1000;
-const DEFAULT_SHARE_LIFETIME = 10 * 1000;
-
-export class SharePromises {
-  constructor(clearSharesTimeoutDelay) {
-    this.promises = new Map();
-    this.clearSharesTimeout = null;
-    this.clearSharesTimeoutDelay = clearSharesTimeoutDelay || DEFAULT_SHARE_LIFETIME;
-  }
-
-  startClearTimeout(key) {
-    const promise = this.promises.get(key);
-    if (promise) {
-      clearTimeout(promise.timeout);
-      promise.timeout = setTimeout(() => {
-        this.promises.delete(key);
-      }, this.clearSharesTimeoutDelay);
-    }
-  }
-
-  share(keyObj, promiseFactory) {
-    const key = `${keyObj}`;
-    let promise = this.promises.get(key);
-    if (!promise) {
-      this.checkMaxPromisesCount();
-
-      promise = {
-        promise: promiseFactory(),
-        timeout: null
-      };
-
-      this.promises.set(key, promise);
-
-      this.startClearTimeout(key);
-    }
-
-    promise.promise = promise.promise.then((result) => result);
-
-    return promise.promise;
-  }
-
-  checkMaxPromisesCount() {
-    if (this.promises.size >= MAX_PROMISES_COUNT) {
-      this.clear();
-    }
-  }
-
-  clear() {
-    this.promises.forEach(promise => {
-      clearTimeout(promise.timeout);
-    });
-    this.promises.clear();
-  }
-
-  clearPromise(keyObj) {
-    const key = `${keyObj}`;
-    let promise = this.promises.get(key);
-    if (promise) {
-      clearTimeout(promise.timeout);
-      this.promises.delete(key);
-    }
-  }
-}
-
-const allSharePromises = [];
-export function getSharePromise(timeout) {
-  const sharePromise = new SharePromises(timeout);
-  allSharePromises.push(sharePromise);
-  return sharePromise;
-}
-
-export function clearAllSharePromises() {
-  for (const sharePromise of allSharePromises) {
-    sharePromise.clear();
-  }
-}

package/components/customer/customer_preferences_form/customer-preferences-form.scss

@@ -1,12 +0,0 @@
-@import "@/assets/scss/variables";
-
-.CustomerPreferencesForm {
-  &__error {
-    font-weight: bold;
-    font-size: 14px;
-    padding: 18px 10px;
-    text-align: center;
-    color: $white;
-    background: #EA3434;
-  }
-}

package/components/customer/customer_preferences_form/customer-preferences-form.vue

@@ -1,87 +0,0 @@
-<template>
-  <div class="form__wrapper CustomerFrom__wrapper">
-    <validation-observer ref="form">
-      <div class="mt-10">
-        <div
-          class="row"
-          style="margin-top: -20px">
-          <div class="col-12">
-            <div class="form-row">
-              <label class="form-label">
-                <checkbox v-model="customer.signUpForNewsletter" />
-                <span class="lc_regular12 lc__grey1">
-                  Sign up for newsletter
-                </span>
-              </label>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="form__footer mt-5">
-        <div
-          v-if="errorMessage"
-          class="CustomerForm__error">
-          {{ errorMessage }}
-        </div>
-        <div class="form-actions full">
-          <btn
-            class="btn btn-black"
-            :btn-processing="processing"
-            :btn-disabled="processing"
-            :btn-label="customer._id ? 'Save' : 'Create Account'"
-            @onclick="submit()">
-          </btn>
-        </div>
-      </div>
-    </validation-observer>
-  </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex';
-import api from '@lancom/shared/assets/js/api';
-
-export default {
-  name: 'CustomerPreferencesForm',
-  props: {
-    customer: {
-      type: Object,
-      required: true
-    }
-  },
-  data() {
-    return {
-      errorMessage: null,
-      processing: false
-    };
-  },
-  computed: {
-    ...mapGetters(['shop'])
-  },
-  methods: {
-    async submit() {
-      this.errorMessage = null;
-
-      const isValid = await this.$refs.form.validate();
-      if (!isValid) {
-        return;
-      }
-
-      try {
-        this.processing = true;
-        const result = await api.saveCustomer(this.customer, this.shop._id);
-        this.$emit('save', result);
-      } catch ({ response }) {
-        const { data } = response || {};
-        this.errorMessage = data && data.error;
-      } finally {
-        this.processing = false;
-      }
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import 'customer-preferences-form.scss';
-</style>

package/components/pages/customer/preferences/preferences.vue

@@ -1,79 +0,0 @@
-<template>
-  <div class="CustomerPreferences__wrapper">
-    <customer-preferences-form
-      v-if="customer"
-      ref="customerForm"
-      :customer="customer"
-      @save="onSave"
-      @customer-loaded="onCustomerLoaded" />
-  </div>
-</template>
-
-<script>
-import api from '@lancom/shared/assets/js/api';
-import { mapGetters, mapActions } from 'vuex';
-import CustomerPreferencesForm from '@lancom/shared/components/customer/customer_preferences_form/customer-preferences-form';
-
-export default {
-  name: 'CustomerPreferences',
-  components: {
-    CustomerPreferencesForm
-  },
-  data() {
-    return {
-      customer: null,
-      loading: false,
-      error: null
-    };
-  },
-  computed: {
-    ...mapGetters(['shop']),
-    ...mapGetters('auth', ['user'])
-  },
-  async created() {
-    await this.loadCustomerData();
-  },
-  methods: {
-    ...mapActions('auth', ['update_user']),
-    async loadCustomerData() {
-      try {
-        this.processing = true;
-        const customer = await api.fetchCustomer(this.user.accessToken, this.shop._id);
-        console.log('customer: ', customer);
-        this.customer = customer;
-      } catch (e) {
-        console.log(e);
-        const errorMessage = e?.response?.data?.error;
-        this.$toastr.e(errorMessage || 'Customer failed to load');
-      } finally {
-        this.processing = false;
-      }
-    },
-    onSave({ customer: user, token }) {
-      this.$toastr.s('Customer successfully saved');
-      this.update_user({ user, token });
-    },
-    onCustomerLoaded(customer) {
-      this.customer = customer;
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.loading-message {
-  text-align: center;
-  padding: 2rem;
-  font-size: 1.1rem;
-  color: #666;
-}
-
-.error-message {
-  text-align: center;
-  padding: 2rem;
-  color: #d32f2f;
-  background-color: #ffebee;
-  border-radius: 4px;
-  margin: 1rem 0;
-}
-</style>

package/components/resource/resource_view/resource-view.mixin.js

@@ -1,74 +0,0 @@
-import api from '@lancom/shared/assets/js/api';
-
-const ORDER_RESOURCE_STATUS = {
-  PENDING_APPROVAL: 'pending approval',
-  APPROVED: 'approved',
-  NOT_APPROVED: 'not approved'
-};
-
-export default {
-  props: {
-    order: {
-      type: Object,
-      required: true
-    },
-    resource: {
-      type: Object,
-      required: true
-    }
-  },
-  data() {
-    return {
-      processing: false
-    };
-  },
-  computed: {
-    file() {
-      return this.resource.file;
-    },
-    isNotApproved() {
-      return this.resource.status === ORDER_RESOURCE_STATUS.NOT_APPROVED;
-    },
-    isApproved() {
-      return this.resource.status === ORDER_RESOURCE_STATUS.APPROVED;
-    },
-    isAvailableForApprove() {
-      const statuses = [
-        ORDER_RESOURCE_STATUS.APPROVED,
-        ORDER_RESOURCE_STATUS.NOT_APPROVED,
-        ORDER_RESOURCE_STATUS.PENDING_APPROVAL
-      ];
-      return statuses.includes(this.resource.status);
-    },
-    isValidStatus() {
-      const statuses = [
-        ORDER_RESOURCE_STATUS.APPROVED,
-        ORDER_RESOURCE_STATUS.NOT_APPROVED
-      ];
-      return statuses.includes(this.resource.status);
-    }
-  },
-  mounted() {
-    console.log('this.resource: ', this.resource);
-    console.log('this.order: ', this.order);
-  },
-  methods: {
-    approveMockup() {
-      this.resource.status = 'approved';
-    },
-    notApproveMockup() {
-      this.resource.status = 'not approved';
-    },
-    async submitApproval() {
-      this.processing = true;
-      try {
-        await api.approveOrderMockup(this.order, this.resource);
-        this.processing = false;
-        this.$toastr.s('Approval submitted successfully.');
-      } catch (error) {
-        this.processing = false;
-        this.$toastr.e('Failed to submit approval.');
-      }
-    }
-  }
-};

package/components/resource/resource_view/resource-view.scss

@@ -1,13 +0,0 @@
-.ResourceView {
-  &__wrapper {
-    margin-top: 50px;
-  }
-  &__approve-btn {
-    height: 42px;
-  }
-  &__approve {
-    margin-top: 30px;
-    border: 1px solid #f1f1f1;
-    padding: 10px;
-  }
-}

package/components/resource/resource_view/resource-view.vue

@@ -1,97 +0,0 @@
-<template>
-  <div class="ResourceView__wrapper">
-    <div class="row">
-      <div class="col-6">
-        <div class="ResourceView__code lc_h3">
-          {{ order.code }}
-        </div>
-        <div>
-          <div>
-            <div class="ResourceView__code lc_h5">
-              Approve Mockup
-            </div>
-            <div
-              v-if="file"
-              class="lc_regular16">
-              <span>
-                Mockup:
-              </span>
-              <a
-                :href="file.origin"
-                target="_blank"
-                class="lc_black">
-                {{ file.fileName }}
-              </a>
-            </div>
-          </div>
-          <div class="ResourceView__approve">
-            <div>
-              <btn
-                :btn-class="isApproved ? 'purple' : 'white'"
-                :btn-disabled="!isAvailableForApprove || processing"
-                :btn-processing="processing"
-                btn-label="Approved"
-                class="ResourceView__approve-btn"
-                @onclick="approveMockup()">
-              </btn>
-              <btn
-                :btn-class="isNotApproved ? 'purple' : 'white'"
-                :btn-disabled="!isAvailableForApprove"
-                :btn-processing="processing"
-                btn-label="Not Approved"
-                class="ResourceView__approve-btn"
-                @onclick="notApproveMockup()">
-              </btn>
-            </div>
-            <div class="mt-10">
-              <validation-provider
-                tag="div"
-                name="Comment"
-                class="mb-5 mt-5">
-                <textarea
-                  id="timeline_message"
-                  v-model="resource.comment"
-                  name="comment"
-                  style="height: 140px"
-                  placeholder="Comment"
-                  class="form-field no-label"></textarea>
-              </validation-provider>
-            </div>
-            <div class="mt-10">
-              <btn
-                btn-class="green"
-                :btn-disabled="!isValidStatus || processing"
-                :btn-processing="processing"
-                btn-label="Save"
-                class="ResourceView__approve-btn"
-                @onclick="submitApproval()">
-              </btn>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-6">
-        <resource-view-prints
-          :order="order"
-          :resource="resource" />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import ResourceViewMixin from './resource-view.mixin';
-import ResourceViewPrints from './resource_view_prints/resource-view-prints';
-
-export default {
-  name: 'LancomResourceView',
-  components: {
-    ResourceViewPrints
-  },
-  mixins: [ResourceViewMixin]
-};
-</script>
-
-<style lang="scss" scoped>
-@import 'resource-view.scss';
-</style>

package/components/resource/resource_view/resource_view_prints/resource-view-prints.scss

@@ -1,7 +0,0 @@
-.ResourceViewPrints {
-  &__print {
-    margin-bottom: 10px;
-    padding-left: 10px;
-    border-left: 4px solid #d8d8d8;
-  }
-}

package/components/resource/resource_view/resource_view_prints/resource-view-prints.vue

@@ -1,42 +0,0 @@
-<template>
-  <div class="ResourceViewPrints__wrapper">
-    <resource-view-print
-      v-for="print in prints"
-      :key="print._id"
-      :order="order"
-      :resource="resource"
-      :print="print"
-      class="ResourceViewPrints__print" />
-  </div>
-</template>
-
-<script>
-import ResourceViewPrint from './resource_view_print/resource-view-print';
-
-export default {
-  name: 'LancomResourceViewPrints',
-  components: {
-    ResourceViewPrint
-  },
-  props: {
-    order: {
-      type: Object,
-      required: true
-    },
-    resource: {
-      type: Object,
-      required: true
-    }
-  },
-  computed: {
-    prints() {
-      const productsPrints = this.order.products.reduce((prints, product) => [...prints, ...product.prints], []);
-      return [...this.order.prints, ...productsPrints];
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import 'resource-view-prints.scss';
-</style>

package/components/resource/resource_view/resource_view_prints/resource_view_print/resource-view-print.scss

@@ -1,5 +0,0 @@
-.ResourceViewPrint {
-  &__products {
-    margin-top: 5px;
-  }
-}

package/components/resource/resource_view/resource_view_prints/resource_view_print/resource-view-print.vue

@@ -1,54 +0,0 @@
-<template>
-  <div class="ResourceViewPrint__wrapper">
-    <div class="lc_regular12">
-      <div v-if="print.printType">
-        <b class="lc_bold">Print Type:</b> {{ print.printType.name }}
-      </div>
-      <div v-if="print.printArea">
-        <b class="lc_bold">Print Area:</b> {{ print.printArea.name }}
-      </div>
-      <div v-if="print.printSize">
-        <b class="lc_bold">Print Size:</b> {{ print.printSize.name }}
-      </div>
-    </div>
-    <div class="ResourceViewPrint__products">
-      <resource-view-print-products
-        :order="order"
-        :resource="resource"
-        :print="print" />
-    </div>
-  </div>
-</template>
-
-<script>
-import ResourceViewPrintProducts from './resource_view_print_products/resource-view-print-products';
-
-export default {
-  name: 'LancomResourceViewPrint',
-  components: {
-    ResourceViewPrintProducts
-  },
-  props: {
-    order: {
-      type: Object,
-      required: true
-    },
-    resource: {
-      type: Object,
-      required: true
-    },
-    print: {
-      type: Object,
-      required: true
-    }
-  },
-  mounted() {
-    console.log('');
-    console.log('this.print: ', this.print);
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import 'resource-view-print.scss';
-</style>