@lancom/shared 0.0.314 → 0.0.315

package/assets/js/models/print-area.js

@@ -13,21 +13,26 @@ const DEFAULT_PRINT_AREA = {
 
 export const PIXELS_PER_CM = 37.795275591;
 
-export const getProductPrintAreas = product => {
+export const getProductPrintAreas = (product, includeSize) => {
   if (!product) {
     return {};
   }
-  const getSizesFromAreas = (areas, map, printAreaSide) => (areas || []).reduce((list, { printSize, side, printAreaOffsets, sizes, _id }) => {
-    if (_id && printSize) {
-      list[_id] = { printSize, side: printAreaSide || side, printAreaOffsets };
-    }
 
-    if (sizes) {
-      getSizesFromAreas(sizes, list);
-    }
+  const getSizesFromAreas = (areas, map, printAreaSide, printAreaId) => {
+    return (areas || [])
+      .reduce((list, { printSize, side, printAreaOffsets, sizes, _id }) => {
+        if (_id && printSize) {
+          const key = includeSize ? `${printAreaId || _id}_${printSize?._id || printSize}` : _id;
+          list[key] = { printSize, side: printAreaSide || side, printAreaOffsets };
+        }
 
-    return list;
-  }, map || {});
+        if (sizes) {
+          getSizesFromAreas(sizes, list, printAreaSide || side, printAreaId || _id);
+        }
+
+        return list;
+      }, map || {});
+  }
 
   return getSizesFromAreas(product.printAreas);
 };
@@ -42,11 +47,12 @@ export const getProductPrintsAreasPrices = (product, printType) => {
   return areas;
 };
 
-export const getPrintAreaByName = (params, product) => {
+export const getPrintAreaByName = (params, product, includeSize) => {
   const { printArea, editorWidth, editorHeight, printSize, printAreaOffsets } = params;
-  const printAreas = getProductPrintAreas(product);
-  const pa = printAreas[printArea] || DEFAULT_PRINT_AREA;
+  const printAreas = getProductPrintAreas(product, !!includeSize);
   const printSizeId = printSize?._id || printSize;
+  const key = includeSize ? `${printArea}_${printSizeId}` : printArea;
+  const pa = printAreas[key] || DEFAULT_PRINT_AREA;
   const productPrintArea = product.printAreasOffsets?.find(p => p.printAreas?.includes(printArea) && (!p.printSize || p.printSize === printSizeId));
   const size = productPrintArea?.printAreaSize || (printSize?._id && printSize) || pa.printSize;
   const sideId = productPrintArea?.side || pa.side;

package/assets/js/utils/prints.js

@@ -39,7 +39,8 @@ export function getPrintsFromLayers(layers, product) {
   const prints = new Map();
   (layers || []).forEach(layer => {
     const { printType, printSize, printArea } = layer;
-    if (!prints.has(printArea)) {
+    const printAreaKey = `${printArea}_${printSize}`;
+    if (!prints.has(printAreaKey)) {
       const layerPrintType = product.printTypes.find(({ _id }) => _id === printType);
       const layerPrintArea = product.printAreas.find(({ _id }) => _id === printArea);
       const sizes = layerPrintArea ? getPrintAreaSizes(layerPrintArea) : [];
@@ -57,13 +58,13 @@ export function getPrintsFromLayers(layers, product) {
         printCost,
         layers: [generatePrintLayer(layer)]
       };
-      prints.set(printArea, data);
+      prints.set(printAreaKey, data);
       layer.printGuid = data.guid;
     } else {
       const print = prints.get(printArea);
       layer.printGuid = print.guid;
       print.layers.push(generatePrintLayer(layer));
-      prints.set(printArea, print);
+      prints.set(printAreaKey, print);
     }
   });
   return [...prints.values()];

package/assets/js/utils/product.js

@@ -164,6 +164,6 @@ export function getAllPrintAreas(product) {
     ?.reduce((options, pa) => [
       ...options,
       pa,
-      ...pa.sizes.map(s => ({ ...s, side: pa.side }))
+      ...pa.sizes.map(s => ({ ...s, side: pa.side, parentPrintArea: pa._id }))
     ], []) || [];
 }

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

@@ -130,11 +130,12 @@ export default {
     initedCard() {
       this.loadingCard = false;
     },
-    async initOrderData() {
+    async initOrderData(paymentStatus) {
       if (!this.orderData) {
         const recaptchaToken = await this.getRecaptcha('create_order');
         await this.createOrder({
           ...this.order,
+          paymentStatus: paymentStatus || 'abandoned',
           recaptchaToken,
           products: this.entities,
           pricing: this.cartPricing,
@@ -184,11 +185,12 @@ export default {
       try {
         this.creating = true;
         if (!this.orderData) {
-          await this.initOrderData();
+          await this.initOrderData('pending');
         } else {
           const data = {
             ...this.orderData,
             ...this.order,
+            paymentStatus: 'pending',
             charge: null
           };
           await this.saveOrder(data);

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

@@ -174,16 +174,16 @@ export default {
     tokenize() {
       this.processing = true;
       return new Promise((resolve, reject) => {
-        const { shippingAddress } = this.order;
+        const address = this.order.shippingAddress || this.order.address;
         this.fields.tokenize(
           {
             publishable_api_key: process.env.PINPAYMENT_PUBLISHABLE_API_KEY,
-            address_line1: shippingAddress.addressLine1,
-            address_line2: shippingAddress.addressLine2,
-            address_city: shippingAddress.city,
-            address_postcode: shippingAddress.postcode,
-            address_state: shippingAddress.state,
-            address_country: shippingAddress.country
+            address_line1: address.addressLine1,
+            address_line2: address.addressLine2,
+            address_city: address.city,
+            address_postcode: address.postcode,
+            address_state: address.state,
+            address_country: address.country
           },
           (err, response) => {
             if (!this.processing) {

package/components/editor/editor_layers/editor-layers.vue

@@ -129,7 +129,7 @@ export default {
       const printAreas = getAllPrintAreas(this.product);
       const groups = new Map();
       this.editableLayers.forEach(layer => {
-        const printArea = printAreas.find(pa => pa._id === layer.printArea) || { _id: null, name: 'Layers'};
+        const printArea = printAreas.find(pa => (pa.parentPrintArea || pa._id) === layer.printArea && pa.printSize._id === layer.printSize) || { _id: null, name: 'Layers'};
         if (printArea) {
           const defaultGroup = { layers: [], printArea };
           const group = groups.get(printArea._id) || defaultGroup;
@@ -171,9 +171,9 @@ export default {
         }
         this.setEditablePrintArea(printArea);
         this.setSelectedPrintArea({
-          sideId: printArea.side,
-          printArea: printArea._id,
-          size: printArea.printSize
+          sideId: printArea?.side,
+          printArea: printArea?._id,
+          size: printArea?.printSize
         });
       }
     },

package/components/editor/editor_print_area_options/editor-print-area-options.vue

@@ -47,6 +47,10 @@ export default {
     allowNoPrint: {
       type: Boolean,
       default: false
+    },
+    layers: {
+      type: Array,
+      default: () => ([])
     }
   },
   computed: {
@@ -57,10 +61,10 @@ export default {
           const mainOption = { ...groupItemToOption(printArea), sides: [printArea.side] };
           const suboptions = [
             mainOption,
-            ...(printArea.sizes || []).map(i => ({ ...groupItemToOption({ ...i, side: printArea.side }), sides: [printArea.side] }))
+            ...(printArea.sizes || []).map(i => ({ ...groupItemToOption({ ...i, side: printArea.side, parentPrintArea: printArea._id }), sides: [printArea.side] }))
           ];
           return {
-            ...(suboptions.find(s => s.printArea?._id === this.selected) || mainOption),
+            ...(suboptions.find(s => s.printArea?._id === this.selected || this.hasPrintAreaLayers(s.printArea)) || mainOption),
             suboptions
           };
         });
@@ -70,12 +74,20 @@ export default {
   },
   mounted() {
     if (!this.selected) {
-      this.select(this.options[0]);
+      const allOptions = this.options.reduce((options, option) => [...options, option, ...(option.suboptions || [])], []);
+      const option = allOptions.find(o => this.hasPrintAreaLayers(o.printArea)) || this.options[0];
+      this.select(option);
     }
   },
   methods: {
     select(option) {
       this.$emit('select', option);
+    },
+    hasPrintAreaLayers(printArea) {
+      const paId = printArea?.parentPrintArea || printArea?._id;
+      const psId = printArea?.printSize?._id;
+      const layers = this.layers.filter(l => !paId || (l.printArea === paId && l.printSize === psId));
+      return layers.length > 0;
     }
   }
 };

package/components/editor/editor_workspace/editor-workspace.vue

@@ -100,6 +100,7 @@
         :product="product"
         :selected="editablePrintArea && editablePrintArea._id"
         :side="editableSide.id"
+        :layers="editableLayers"
         @select="selectPrintArea"
         @option-mouseover="toogleBoundBox(true, $event)"
         @option-mouseleave="toogleBoundBox(false, $event)">
@@ -148,7 +149,8 @@ export default {
       'selectedPrintArea',
       'editablePrintArea',
       'editableSide',
-      'editableColor'
+      'editableColor',
+      'editableLayers'
     ]),
     isZoomIn() {
       return !!this.zoomSize;
@@ -188,9 +190,25 @@ export default {
         id: side || (this.editableSide.id === 'front' ? 'back' : 'front')
       });
     },
-    selectPrintArea({ printArea, size }) {
+    selectPrintArea(pa) {
+      const { printArea, size } = pa || {};
+      const oldPrintArea = this.editablePrintArea;
+      // console.log('');
+      // console.log('selectPrintArea: ');
+      // console.log('oldPrintArea: ', oldPrintArea);
+      // console.log('printArea: ', printArea);
+      // console.log('this.editableLayers: ', this.editableLayers);
       this.setEditablePrintArea(printArea);
-      this.setSelectedPrintArea({ sideId: this.editableSide.id, printArea: printArea._id, size });
+      const oldPaId = oldPrintArea?.parentPrintArea || oldPrintArea?._id;
+      const paId = printArea?.parentPrintArea || printArea?._id;
+      if (oldPaId && oldPaId === paId) {
+        this.editableLayers.forEach(layer => {
+          if (layer.printArea === paId) {
+            layer.printSize = printArea.printSize?._id;
+          }
+        })
+      }
+      this.setSelectedPrintArea({ sideId: this.editableSide.id, printArea: printArea?._id, parentPrintArea: printArea?.parentPrintArea, size });
     },
     toogleBoundBox(state, printAreaOption) {
       if (this.$refs.editor) {

package/components/editor/editor_workspace/editor_workspace_side/editor-workspace-side.vue

@@ -145,7 +145,9 @@ export default {
       return this.editableLayers.filter(l => l.sideId === this.side);
     },
     printAreaLayers() {
-      return this.editableLayers.filter(l => !this.printArea || l.printArea === this.printArea._id);
+      const paId = this.printArea?.parentPrintArea || this.printArea?._id;
+      const layers = this.editableLayers.filter(l => !paId || (l.printArea === paId));
+      return layers;
     },
     deleteButtonPosition() {
       return this.deleteButtonPos ? {

package/components/product/products_size_selector_color/product_size_selector_color/product-size-selector-color.vue

@@ -22,8 +22,8 @@
         <div v-if="printsPrice > 0">
           <price
             class="lc_semibold17 ProductSizeSelectorColor__price"
-            :price="printsPrice + productPrice"
-            :with-gst="withGst" />
+            :price="productPrintsPrice + productPrice"
+            :with-gst="false" />
         </div>
         <div>
           <v-popover
@@ -140,6 +140,9 @@ export default {
       const price = (pricing.find(({ min, max }) => (!min || min <= amount) && (!max || max >= amount)) || pricing[0] || {}).price || 0;
       return this.withGst ? tax(price, this.gstTax) : price;
     },
+    productPrintsPrice() {
+      return this.withGst ? tax(this.printsPrice, this.gstTax) : this.printsPrice;
+    },
     disabled() {
       return !this.product.quantityStock || !this.productPrice;
     },

package/mixins/product-view.js

@@ -129,7 +129,7 @@ export default (IS_PRODUCT_PRESET_PRINT_PRICING) => ({
                 // printAreaOffsets: printArea?.printAreaOffsets,
                 editorWidth: this.editorSize.width,
                 editorHeight: this.editorSize.height
-              }, this.product);
+              }, this.product, true);
               fitLayerToEditorSize(properties, preSetPrint.printTemplate, printArea);
               properties.sideId = printArea?.sideId;
             }

package/package.json

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

package/store/product.js

@@ -241,7 +241,7 @@ export const actions = {
       sideId: getters.editableSide?.id,
       properties: {
         ...(properties || {}),
-        printArea: editablePrintArea?._id,
+        printArea: editablePrintArea?.parentPrintArea || editablePrintArea?._id,
         printSize: editablePrintArea?.printSize?._id,
         printType: selectedPrintType?._id
       }