From e1ea1d2b7cbeecc57582c5131e037d01ece8fccf Mon Sep 17 00:00:00 2001 From: k2maan Date: Wed, 27 Sep 2023 15:29:42 +0530 Subject: [PATCH 1/9] Implemented: static UI for kit products (#268) --- src/components/RejectReasonPopover.vue | 35 ++++++ src/views/Completed.vue | 52 ++++++-- src/views/InProgress.vue | 157 +++++++++++++++++-------- src/views/OpenOrders.vue | 44 +++++-- 4 files changed, 216 insertions(+), 72 deletions(-) create mode 100644 src/components/RejectReasonPopover.vue diff --git a/src/components/RejectReasonPopover.vue b/src/components/RejectReasonPopover.vue new file mode 100644 index 00000000..9c53536a --- /dev/null +++ b/src/components/RejectReasonPopover.vue @@ -0,0 +1,35 @@ + + + \ No newline at end of file diff --git a/src/views/Completed.vue b/src/views/Completed.vue index d9f5194a..5a98ba7b 100644 --- a/src/views/Completed.vue +++ b/src/views/Completed.vue @@ -67,20 +67,44 @@ -
-
- - - - + + +
+ + + + + +

{{ item.productSku }}

+ {{ item.virtualProductName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ + +
+ + + + -

{{ item.productSku }}

- {{ item.virtualProductName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+

Primary identifier

+

Secondary identifier

 - -
-
+ + +
+ + + + + +

{{ item.productSku }}

+ {{ item.virtualProductName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ + +
+ +
@@ -145,7 +169,9 @@ import { IonInfiniteScroll, IonInfiniteScrollContent, IonItem, + IonItemDivider, IonLabel, + IonList, IonMenuButton, IonPage, IonSearchbar, @@ -192,7 +218,9 @@ export default defineComponent({ IonInfiniteScroll, IonInfiniteScrollContent, IonItem, + IonItemDivider, IonLabel, + IonList, IonMenuButton, IonPage, IonSearchbar, diff --git a/src/views/InProgress.vue b/src/views/InProgress.vue index 1f1c4215..b1e4a036 100644 --- a/src/views/InProgress.vue +++ b/src/views/InProgress.vue @@ -82,63 +82,108 @@
-
-
- - - - - -

{{ item.productSku }}

- {{ item.productName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

- - -
- -
- - - - -
- - + + +
+ + + + + +

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ -
-
-
- - - {{ $t("Ready to pack") }} - - - {{ $t("Report an issue") }} - - - -
- -
- - {{ $t("Select box") }} - - {{ shipmentPackage.packageName }} - - + +
+ + + + +
+ + + +
-
- - {{ $t("Select issue") }} - - {{ reason.description ? $t(reason.description) : reason.enumId }} - - +
+ + + {{ $t("Ready to pack") }} + + + {{ $t("Report an issue") }} + + + +
+ +
+ + {{ $t("Select box") }} + + {{ shipmentPackage.packageName }} + + +
+
+ + {{ $t("Select issue") }} + + {{ reason.description ? $t(reason.description) : reason.enumId }} + + +
+
-
+ -
+ + + + +

Primary identifier

+

Secondary identifier

+ + + {{ $t("Report an issue") }} + + + + + {{ reason.description ? $t(reason.description) : reason.enumId }} + + + + + +
+ + + + + +

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ + + +
+
+ + {{ $t("Select box") }} + + {{ shipmentPackage.packageName }} + + +
+
+
+ +
@@ -201,12 +246,16 @@ import { IonFooter, IonHeader, IonItem, + IonItemDivider, + IonItemGroup, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, + IonList, IonMenuButton, IonPage, + IonPopover, IonRow, IonRadio, IonRadioGroup, @@ -265,12 +314,16 @@ export default defineComponent({ IonFooter, IonHeader, IonItem, + IonItemDivider, + IonItemGroup, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, + IonList, IonMenuButton, IonPage, + IonPopover, IonRow, IonRadio, IonRadioGroup, diff --git a/src/views/OpenOrders.vue b/src/views/OpenOrders.vue index 38135862..bf8fdd66 100644 --- a/src/views/OpenOrders.vue +++ b/src/views/OpenOrders.vue @@ -59,10 +59,10 @@
-
-
-
- + + +
+ @@ -73,8 +73,30 @@
-
-
+ + + + + +

Primary identifier

+

Secondary identifier

+ + + +
+ + + + + +

{{ order.productSku }}

+ {{ order.virtualProductName }} +

{{ getFeature(getProduct(order.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(order.productId).featureHierarchy, '1/SIZE/')}}

+ + +
+ +
@@ -183,7 +188,6 @@ import { IonItem, IonItemDivider, IonLabel, - IonList, IonMenuButton, IonNote, IonPage, @@ -214,6 +218,7 @@ import logger from '@/logger'; import ShippingLabelErrorModal from '@/components/ShippingLabelErrorModal.vue'; import { Actions, hasPermission } from '@/authorization' import OrderActionsPopover from '@/components/OrderActionsPopover.vue' +import { getKitProducts } from '@/utils/order'; export default defineComponent({ name: 'Completed', @@ -234,7 +239,6 @@ export default defineComponent({ IonItem, IonItemDivider, IonLabel, - IonList, IonMenuButton, IonNote, IonPage, @@ -287,7 +291,17 @@ export default defineComponent({ }) }, getCompletedOrders() { - return this.completedOrders.list.slice(0, (this.completedOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any) ); + // processing kit products and normal order items + const completedOrders = JSON.parse(JSON.stringify(this.completedOrders.list)).map((order: any) => { + const items = order.items.filter((item: any) => !item.kitProduct) + const kitProducts = getKitProducts(order) + return { + ...order, + items, + kitProducts + } + }) + return completedOrders.slice(0, (this.completedOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any) ); }, async loadMoreCompletedOrders(event: any) { const completedOrdersQuery = JSON.parse(JSON.stringify(this.completedOrders.query)) diff --git a/src/views/InProgress.vue b/src/views/InProgress.vue index e992c31d..c467e8eb 100644 --- a/src/views/InProgress.vue +++ b/src/views/InProgress.vue @@ -45,7 +45,6 @@
{{ translate("Pack orders") }} -
@@ -85,118 +84,118 @@
- - -
- - - - - -

{{ item.productSku }}

- {{ item.productName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

- +
+
+ + + + + +

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ + +
+ +
+ + + + +
+ + -
- - - - -
- - - -
-
-
- - - {{ translate("Ready to pack") }} - - - {{ translate("Report an issue") }} - - - -
- -
- - {{ translate("Select box") }} - - {{ shipmentPackage.packageName }} - - -
-
- - {{ translate("Select issue") }} - - {{ reason.description ? translate(reason.description) : reason.enumId }} - - -
-
+
+
+ +
+ + + {{ translate("Ready to pack") }} + + + {{ translate("Report an issue") }} + + + +
+ +
+ + {{ translate("Select box") }} + + {{ shipmentPackage.packageName }} + +
-
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - - - +
+ + {{ translate("Select issue") }} + + {{ reason.description ? translate(reason.description) : reason.enumId }} + +
- - - - - -

Primary identifier

-

Secondary identifier

- - - {{ translate("Report an issue") }} - - - - - {{ reason.description ? translate(reason.description) : reason.enumId }} - - - - +
+
+ {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} + + + +
+
-
- - - - +
+
+ +
-

{{ item.productSku }}

- {{ item.productName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+

{{ getProduct(kitProducts[0].parentProductId).productName }}

+

{{ getProduct(kitProducts[0].parentProductId).sku }}

 - +
+ +
+ + + {{ `Box ${kitProducts[0].selectedBox}` }} + + +
+ +
+ + {{ translate('Report an issue') }} + +
+ -
-
- - {{ translate("Select box") }} - - {{ shipmentPackage.packageName }} - - -
+
+
+ + + + + +

{{ items.productSku }}

+ {{ items.productName }} +

{{ getFeature(getProduct(items.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(items.productId).featureHierarchy, '1/SIZE/')}}

+ +
+
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - + {{ getProductStock(items.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} +
- - +
+
@@ -264,16 +263,13 @@ import { IonHeader, IonItem, IonItemDivider, - IonItemGroup, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, - IonList, IonMenuButton, IonNote, IonPage, - IonPopover, IonRow, IonRadio, IonRadioGroup, @@ -298,6 +294,7 @@ import { checkmarkDoneOutline, cubeOutline, ellipsisVerticalOutline, + fileTrayOutline, pencilOutline, pricetagOutline, printOutline, @@ -322,6 +319,9 @@ import EditPickersModal from '@/components/EditPickersModal.vue'; import ShipmentBoxTypePopover from '@/components/ShipmentBoxTypePopover.vue' import OrderActionsPopover from '@/components/OrderActionsPopover.vue' import ShippingLabelErrorModal from '@/components/ShippingLabelErrorModal.vue' +import ReportIssuePopover from '@/components/ReportIssuePopover.vue' +import ShipmentBoxPopover from '@/components/ShipmentBoxPopover.vue' +import { getKitProducts } from '@/utils/order'; export default defineComponent({ name: 'InProgress', @@ -338,16 +338,13 @@ export default defineComponent({ IonHeader, IonItem, IonItemDivider, - IonItemGroup, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, - IonList, IonMenuButton, IonNote, IonPage, - IonPopover, IonRow, IonRadio, IonRadioGroup, @@ -387,11 +384,77 @@ export default defineComponent({ } }, methods: { + async openRejectReasonPopover(ev: Event, items: any, order: any) { + const reportIssuePopover = await popoverController.create({ + component: ReportIssuePopover, + event: ev, + translucent: true, + showBackdrop: false, + }); + + reportIssuePopover.present(); + + const result = await reportIssuePopover.onDidDismiss(); + + if (result.data) { + // reject kit products in bulk + const itemsToReject = items.map((item: any) => ({ ...item, rejectReason: result.data })) + this.reportIssue(order, itemsToReject) + } + }, + async openShipmentBoxPopover(ev: Event, items: any, order: any) { + const popover = await popoverController.create({ + component: ShipmentBoxPopover, + componentProps: { + shipmentPackages: order.shipmentPackages + }, + showBackdrop: false, + event: ev + }); + + popover.present(); + + const result = await popover.onDidDismiss(); + + if (result.data && items[0].selectedBox !== result.data) { + this.confirmUpdateBox(items, order, result.data) + } + }, + async confirmUpdateBox(items: any, order: any, selectedBox: string) { + const alert = await alertController.create({ + message: translate("Are you sure you want to update box selection?"), + header: translate("Update box selection?"), + buttons: [ + { + text: translate("Cancel"), + role: 'cancel' + }, + { + text: translate("Confirm"), + handler: async () => { + order.kitProducts = items.map((item: any) => ({ ...item, selectedBox })) + await this.updateOrder(order, 'box-selection') + } + } + ], + }); + return alert.present(); + }, getErrorMessage() { return this.searchedQuery === '' ? translate("doesn't have any orders in progress right now.", { facilityName: this.currentFacility.facilityName }) : translate( "No results found for . Try searching Open or Completed tab instead. If you still can't find what you're looking for, try switching stores.", { searchedQuery: this.searchedQuery, lineBreak: '
' }) }, getInProgressOrders() { - return JSON.parse(JSON.stringify(this.inProgressOrders.list)).splice(0, (this.inProgressOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any) ); + // processing kit products and normal order items + const inProgressOrders = JSON.parse(JSON.stringify(this.inProgressOrders.list)).map((order: any) => { + const items = order.items.filter((item: any) => !item.kitProduct) + const kitProducts = getKitProducts(order) + return { + ...order, + items, + kitProducts + } + }) + return inProgressOrders.splice(0, (this.inProgressOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any) ); }, isIssueSegmentSelectedForItem(item: any) { return this.itemsIssueSegmentSelected.includes(`${item.orderId}-${item.orderItemSeqId}`) @@ -656,7 +719,7 @@ export default defineComponent({ this.itemsIssueSegmentSelected = [] await this.store.dispatch('order/findInProgressOrders') }, - async updateOrder(order: any) { + async updateOrder(order: any, updateParameter?: string) { const form = new FormData() form.append('facilityId', this.currentFacility.facilityId) @@ -680,10 +743,10 @@ export default defineComponent({ const shipmentPackage = order.shipmentPackages.find((shipmentPackage: any) => shipmentPackage.packageName === item.selectedBox) let prefix = 'rtp' - if(this.isIssueSegmentSelectedForItem(item)) { + if(this.isIssueSegmentSelectedForItem(item) || updateParameter === 'report') { prefix = 'rej' form.append(`${prefix}_rejectionReason_${index}`, item.rejectReason) - } else { + } else if (!this.isIssueSegmentSelectedForItem(item) || updateParameter === 'box-selection') { form.append(`${prefix}_newShipmentId_${index}`, shipmentPackage.shipmentId) } @@ -1100,6 +1163,7 @@ export default defineComponent({ printOutline, pencilOutline, ellipsisVerticalOutline, + fileTrayOutline, optionsOutline, formatUtcDate, getFeature, diff --git a/src/views/OpenOrders.vue b/src/views/OpenOrders.vue index b5e00d0a..1eb67475 100644 --- a/src/views/OpenOrders.vue +++ b/src/views/OpenOrders.vue @@ -60,56 +60,61 @@
- - -
- - - - - -

{{ item.productSku }}

- {{ item.virtualProductName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

- - -
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - - - -
-
- - - - +
+
+ + + + -

Primary identifier

-

Secondary identifier

+

{{ item.productSku }}

+ {{ item.virtualProductName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

 - + +
+
+ {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} + + + +
+
-
- - - - +
+
+ +
-

{{ item.productSku }}

- {{ item.virtualProductName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+

{{ getProduct(kitProducts[0].parentProductId).productName }}

+

{{ getProduct(kitProducts[0].parentProductId).sku }}

 - +
+ + +
+
+ + + + + +

{{ items.productSku }}

+ {{ items.productName }} +

{{ getFeature(getProduct(items.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(items.productId).featureHierarchy, '1/SIZE/')}}

+ + +
+
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - + {{ getProductStock(items.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} +
- - +
+
+
+ {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} + + {{ translate('Check stock') }} + + + + + {{ translate('Report an issue') }} + + +
+
+ + + + +
+ +

Primary identifier

+

Secondary identifier

+ +
+ +
+ + + {{ `Box` }} + + +
+ +
+ + {{ translate('Report an issue') }} + +
+ + +
+ + + + + +

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ + + +
+ {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} + + + +
+
+ + - -
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - - {{ translate('Check stock') }} - - - - - {{ translate('Report an issue') }} - - -
-
{{ translate("Pack using default packaging") }} @@ -229,7 +279,10 @@ import { IonHeader, IonIcon, IonItem, + IonItemDivider, + IonItemGroup, IonLabel, + IonList, IonNote, IonPage, IonRow, @@ -295,7 +348,10 @@ export default defineComponent({ IonHeader, IonIcon, IonItem, + IonItemDivider, + IonItemGroup, IonLabel, + IonList, IonNote, IonPage, IonRow, From 2093612948529084dfc3b2129b24c08d617f6511 Mon Sep 17 00:00:00 2001 From: k2maan Date: Fri, 17 Nov 2023 15:09:18 +0530 Subject: [PATCH 4/9] Reverted: code for testing in actions (#268) --- src/store/modules/order/actions.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/store/modules/order/actions.ts b/src/store/modules/order/actions.ts index 74d348d7..9e522f3e 100644 --- a/src/store/modules/order/actions.ts +++ b/src/store/modules/order/actions.ts @@ -303,7 +303,6 @@ const actions: ActionTree = { inProgressQuery.viewSize = orders.length commit(types.ORDER_INPROGRESS_QUERY_UPDATED, { ...inProgressQuery }) - orders[0].items = [...orders[0].items, ...orders[0].items.map((item: any) => ({ ...item, toOrderItemAssocs: ["KIT_COMPONENT/00101/11470"] }))] commit(types.ORDER_INPROGRESS_UPDATED, {orders, total}) // fetching the additional information like shipmentRoute, carrierParty information @@ -398,7 +397,6 @@ const actions: ActionTree = { openOrderQuery.viewSize = orders.length commit(types.ORDER_OPEN_QUERY_UPDATED, { ...openOrderQuery }) - orders[0].items = [...orders[0].items, ...orders[0].items.map((item: any) => ({ ...item, toOrderItemAssocs: ["KIT_COMPONENT/00101/11470"] }))] commit(types.ORDER_OPEN_UPDATED, {list: orders, total}) emitter.emit('dismissLoader'); @@ -480,7 +478,6 @@ const actions: ActionTree = { }) commit(types.ORDER_COMPLETED_QUERY_UPDATED, { ...completedOrderQuery }) - orders[0].items = [...orders[0].items, ...orders[0].items.map((item: any) => ({ ...item, toOrderItemAssocs: ["KIT_COMPONENT/00101/11470"] }))] commit(types.ORDER_COMPLETED_UPDATED, {list: orders, total}) // fetching the additional information like shipmentRoute, carrierParty information From bd7dd5c45eb075f728fa805139f931981a75fd50 Mon Sep 17 00:00:00 2001 From: k2maan Date: Fri, 17 Nov 2023 15:27:47 +0530 Subject: [PATCH 5/9] Improved: condition check for checking kit component (#268) --- src/utils/order.ts | 10 +++++++--- src/views/Completed.vue | 4 ++-- src/views/InProgress.vue | 4 ++-- src/views/OpenOrders.vue | 4 ++-- 4 files changed, 13 insertions(+), 9 deletions(-) diff --git a/src/utils/order.ts b/src/utils/order.ts index bc4f9285..94705586 100644 --- a/src/utils/order.ts +++ b/src/utils/order.ts @@ -79,10 +79,13 @@ const getOrderCategory = (order: any) => { return result; } +const isKitComponent = (item: any) => { + return item.toOrderItemAssocs?.some((assoc: any) => assoc.split("/")[0] === 'KIT_COMPONENT') +} + const getKitProducts = (order: any) => { - // TODO make it generic to search kit association when multiple associations are there return order.items.reduce((kitProducts: any, item: any) => { - if (item.toOrderItemAssocs && item.toOrderItemAssocs[0].split("/")[0] === 'KIT_COMPONENT') { + if (item.toOrderItemAssocs && isKitComponent(item)) { // getting second and third values i.e kit product's orderItemSeqId and parentProductId const [, orderItemSeqId, parentProductId] = item.toOrderItemAssocs[0].split('/') if (!kitProducts[orderItemSeqId]) { @@ -101,5 +104,6 @@ const getKitProducts = (order: any) => { export { getKitProducts, - getOrderCategory + getOrderCategory, + isKitComponent } \ No newline at end of file diff --git a/src/views/Completed.vue b/src/views/Completed.vue index b007d5aa..3860b838 100644 --- a/src/views/Completed.vue +++ b/src/views/Completed.vue @@ -218,7 +218,7 @@ import logger from '@/logger'; import ShippingLabelErrorModal from '@/components/ShippingLabelErrorModal.vue'; import { Actions, hasPermission } from '@/authorization' import OrderActionsPopover from '@/components/OrderActionsPopover.vue' -import { getKitProducts } from '@/utils/order'; +import { getKitProducts, isKitComponent } from '@/utils/order'; export default defineComponent({ name: 'Completed', @@ -293,7 +293,7 @@ export default defineComponent({ getCompletedOrders() { // processing kit products and normal order items const completedOrders = JSON.parse(JSON.stringify(this.completedOrders.list)).map((order: any) => { - const items = order.items.filter((item: any) => !item.kitProduct) + const items = order.items.filter((item: any) => !isKitComponent(item)) const kitProducts = getKitProducts(order) return { ...order, diff --git a/src/views/InProgress.vue b/src/views/InProgress.vue index 3ccca316..a02210a7 100644 --- a/src/views/InProgress.vue +++ b/src/views/InProgress.vue @@ -328,7 +328,7 @@ import OrderActionsPopover from '@/components/OrderActionsPopover.vue' import ShippingLabelErrorModal from '@/components/ShippingLabelErrorModal.vue' import ReportIssuePopover from '@/components/ReportIssuePopover.vue' import ShipmentBoxPopover from '@/components/ShipmentBoxPopover.vue' -import { getKitProducts } from '@/utils/order'; +import { getKitProducts, isKitComponent } from '@/utils/order'; import QRCodeModal from '@/components/QRCodeModal.vue' import { useAuthStore } from '@hotwax/dxp-components' @@ -455,7 +455,7 @@ export default defineComponent({ getInProgressOrders() { // processing kit products and normal order items const inProgressOrders = JSON.parse(JSON.stringify(this.inProgressOrders.list)).map((order: any) => { - const items = order.items.filter((item: any) => !item.kitProduct) + const items = order.items.filter((item: any) => !isKitComponent(item)) const kitProducts = getKitProducts(order) return { ...order, diff --git a/src/views/OpenOrders.vue b/src/views/OpenOrders.vue index 1eb67475..bdecaf28 100644 --- a/src/views/OpenOrders.vue +++ b/src/views/OpenOrders.vue @@ -185,7 +185,7 @@ import { translate } from '@hotwax/dxp-components'; import { UserService } from '@/services/UserService'; import { Actions, hasPermission } from '@/authorization' import OrderActionsPopover from '@/components/OrderActionsPopover.vue' -import { getKitProducts } from '@/utils/order'; +import { getKitProducts, isKitComponent } from '@/utils/order'; export default defineComponent({ name: 'OpenOrders', @@ -238,7 +238,7 @@ export default defineComponent({ getOpenOrders() { // processing kit products and normal order items const openOrders = JSON.parse(JSON.stringify(this.openOrders.list)).map((order: any) => { - const items = order.items.filter((item: any) => !item.kitProduct) + const items = order.items.filter((item: any) => !isKitComponent(item)) const kitProducts = getKitProducts(order) return { ...order, From 235766e790e5d7f1d09818c8ac8896b887559295 Mon Sep 17 00:00:00 2001 From: k2maan Date: Mon, 20 Nov 2023 12:21:24 +0530 Subject: [PATCH 6/9] Improved: flow for processing kit products by moving the logic to actions (#268) --- src/store/modules/order/actions.ts | 271 ++++++++++++++++------------- src/utils/order.ts | 4 +- src/views/Completed.vue | 13 +- src/views/InProgress.vue | 29 +-- src/views/OpenOrders.vue | 13 +- src/views/OrderDetail.vue | 118 ++++++------- 6 files changed, 218 insertions(+), 230 deletions(-) diff --git a/src/store/modules/order/actions.ts b/src/store/modules/order/actions.ts index 9e522f3e..a3800ae8 100644 --- a/src/store/modules/order/actions.ts +++ b/src/store/modules/order/actions.ts @@ -8,7 +8,7 @@ import * as types from './mutation-types' import { prepareOrderQuery } from '@/utils/solrHelper' import { UtilService } from '@/services/UtilService' import logger from '@/logger' -import { getOrderCategory } from '@/utils/order' +import { prepareKitProducts, getOrderCategory, isKitComponent } from '@/utils/order' const actions: ActionTree = { async fetchInProgressOrdersAdditionalInformation({ commit, state }, payload = { viewIndex: 0 }) { @@ -29,46 +29,46 @@ const actions: ActionTree = { try { // maintaining an object containing information of shipmentIds for each order - const shipmentIdsForOrderAndPicklistBin = await UtilService.findShipmentIdsForOrders(picklistBinIds, orderIds); + const shipmentIdsForOrderAndPicklistBin = await UtilService.findShipmentIdsForOrders(picklistBinIds, orderIds); - let shipmentPackagesByOrderAndPicklistBin = {} as any, itemInformationByOrder = {} as any, carrierPartyIdsByShipment = {} as any, carrierShipmentBoxType = {} as any + let shipmentPackagesByOrderAndPicklistBin = {} as any, itemInformationByOrder = {} as any, carrierPartyIdsByShipment = {} as any, carrierShipmentBoxType = {} as any - // storing all the shipmentIds for all the orders in an array to use furthur - const orderShipmentIds = [...(new Set(Object.values(shipmentIdsForOrderAndPicklistBin).flat()))] as Array + // storing all the shipmentIds for all the orders in an array to use furthur + const orderShipmentIds = [...(new Set(Object.values(shipmentIdsForOrderAndPicklistBin).flat()))] as Array - // TODO: handle case when shipmentIds is empty - // https://stackoverflow.com/questions/28066429/promise-all-order-of-resolved-values - const [shipmentPackagesByOrderInformationAndPicklistBin, itemInformationByOrderInformation, carrierPartyIdsByShipmentInformation] = await Promise.all([UtilService.findShipmentPackages(orderShipmentIds), UtilService.findShipmentItemInformation(orderShipmentIds), UtilService.findCarrierPartyIdsForShipment(orderShipmentIds)]) + // TODO: handle case when shipmentIds is empty + // https://stackoverflow.com/questions/28066429/promise-all-order-of-resolved-values + const [shipmentPackagesByOrderInformationAndPicklistBin, itemInformationByOrderInformation, carrierPartyIdsByShipmentInformation] = await Promise.all([UtilService.findShipmentPackages(orderShipmentIds), UtilService.findShipmentItemInformation(orderShipmentIds), UtilService.findCarrierPartyIdsForShipment(orderShipmentIds)]) - // TODO: try fetching the carrierPartyIds when fetching packages information, as ShipmentPackageRouteSegDetail entity contain carrierPartyIds as well - const carrierPartyIds = [...new Set(Object.values(carrierPartyIdsByShipmentInformation).map((carrierPartyIds: any) => carrierPartyIds.map((carrier: any) => carrier.carrierPartyId)).flat())] + // TODO: try fetching the carrierPartyIds when fetching packages information, as ShipmentPackageRouteSegDetail entity contain carrierPartyIds as well + const carrierPartyIds = [...new Set(Object.values(carrierPartyIdsByShipmentInformation).map((carrierPartyIds: any) => carrierPartyIds.map((carrier: any) => carrier.carrierPartyId)).flat())] - shipmentPackagesByOrderAndPicklistBin = { - ...shipmentPackagesByOrderAndPicklistBin, - ...shipmentPackagesByOrderInformationAndPicklistBin - } + shipmentPackagesByOrderAndPicklistBin = { + ...shipmentPackagesByOrderAndPicklistBin, + ...shipmentPackagesByOrderInformationAndPicklistBin + } - itemInformationByOrder = { - ...itemInformationByOrder, - ...itemInformationByOrderInformation - } + itemInformationByOrder = { + ...itemInformationByOrder, + ...itemInformationByOrderInformation + } - carrierPartyIdsByShipment = { - ...carrierPartyIdsByShipment, - ...carrierPartyIdsByShipmentInformation - } + carrierPartyIdsByShipment = { + ...carrierPartyIdsByShipment, + ...carrierPartyIdsByShipmentInformation + } - carrierShipmentBoxType = { - ...carrierShipmentBoxType, - ...await UtilService.findCarrierShipmentBoxType(carrierPartyIds) - } + carrierShipmentBoxType = { + ...carrierShipmentBoxType, + ...await UtilService.findCarrierShipmentBoxType(carrierPartyIds) + } - const orderShipmentPackages = this.state.util.productStoreShipmentMethCount > 0 ? await OrderService.fetchShipmentPackages(orderShipmentIds) : []; + const orderShipmentPackages = this.state.util.productStoreShipmentMethCount > 0 ? await OrderService.fetchShipmentPackages(orderShipmentIds) : []; - inProgressOrders = inProgressOrders.map((order: any) => { + inProgressOrders = inProgressOrders.map((order: any) => { - // if for an order shipment information is not available then returning the same order information again - if(!shipmentIdsForOrderAndPicklistBin[`${order.orderId}_${order.picklistBinId}`]) { + // if for an order shipment information is not available then returning the same order information again + if (!shipmentIdsForOrderAndPicklistBin[`${order.orderId}_${order.picklistBinId}`]) { // if there are no shipment for the order, there is some issue with the order if (picklistBinIds.includes(order.picklistBinId) && orderIds.includes(order.orderId)) { return { @@ -77,60 +77,63 @@ const actions: ActionTree = { } } return order - } + } - order.items.map((item: any) => { - // fetching shipmentItemInformation for the current order item and then assigning the shipmentItemSeqId to item - const shipment = itemInformationByOrder[item.orderId]?.find((shipmentItem: any) => shipmentItem.orderItemSeqId === item.orderItemSeqId) + order.items.map((item: any) => { + // fetching shipmentItemInformation for the current order item and then assigning the shipmentItemSeqId to item + const shipment = itemInformationByOrder[item.orderId]?.find((shipmentItem: any) => shipmentItem.orderItemSeqId === item.orderItemSeqId) - if(shipment) { - item.shipmentId = shipment.shipmentId - item.shipmentItemSeqId = shipment.shipmentItemSeqId - } + if (shipment) { + item.shipmentId = shipment.shipmentId + item.shipmentItemSeqId = shipment.shipmentItemSeqId + } - item.selectedBox = shipmentPackagesByOrderAndPicklistBin[`${item.orderId}_${item.picklistBinId}`]?.find((shipmentPackage: any) => shipmentPackage.shipmentId === item.shipmentId)?.packageName - }) + item.selectedBox = shipmentPackagesByOrderAndPicklistBin[`${item.orderId}_${item.picklistBinId}`]?.find((shipmentPackage: any) => shipmentPackage.shipmentId === item.shipmentId)?.packageName + }) - const orderItem = order.items[0]; - const carrierPartyIds = [...new Set(orderShipmentIds.map((id: any) => carrierPartyIdsByShipment[id]?.map((carrierParty: any) => carrierParty.carrierPartyId)).flat())]; + const orderItem = order.items[0]; + const carrierPartyIds = [...new Set(orderShipmentIds.map((id: any) => carrierPartyIdsByShipment[id]?.map((carrierParty: any) => carrierParty.carrierPartyId)).flat())]; - const shipmentBoxTypeByCarrierParty = carrierPartyIds.reduce((shipmentBoxType: any, carrierPartyId: any) => { - if(shipmentBoxType[carrierPartyId]) { - shipmentBoxType[carrierPartyId].push(carrierShipmentBoxType[carrierPartyId]) - } else { - shipmentBoxType[carrierPartyId] = carrierShipmentBoxType[carrierPartyId] - } + const shipmentBoxTypeByCarrierParty = carrierPartyIds.reduce((shipmentBoxType: any, carrierPartyId: any) => { + if (shipmentBoxType[carrierPartyId]) { + shipmentBoxType[carrierPartyId].push(carrierShipmentBoxType[carrierPartyId]) + } else { + shipmentBoxType[carrierPartyId] = carrierShipmentBoxType[carrierPartyId] + } - return shipmentBoxType - }, {}); + return shipmentBoxType + }, {}); - const shipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].map((shipmentPackage: any) => { - return { - ...shipmentPackage, - shipmentBoxTypes: shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] ? shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] : [] - } - }); + const shipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].map((shipmentPackage: any) => { + return { + ...shipmentPackage, + shipmentBoxTypes: shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] ? shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] : [] + } + }); - const currentShipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].reduce((currentShipmentPackages: any, shipment: any) => { - currentShipmentPackages.push(...orderShipmentPackages.filter((shipmentPackage: any) => shipmentPackage.shipmentId === shipment.shipmentId )); - return currentShipmentPackages; - }, []); + const currentShipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].reduce((currentShipmentPackages: any, shipment: any) => { + currentShipmentPackages.push(...orderShipmentPackages.filter((shipmentPackage: any) => shipmentPackage.shipmentId === shipment.shipmentId)); + return currentShipmentPackages; + }, []); - // When the shipment method for product store is configured then only check for shipmentPackages otherwise we won't show missing label error button - const missingLabelImage = this.state.util.productStoreShipmentMethCount > 0 ? currentShipmentPackages.length > 0 : false; + // When the shipment method for product store is configured then only check for shipmentPackages otherwise we won't show missing label error button + const missingLabelImage = this.state.util.productStoreShipmentMethCount > 0 ? currentShipmentPackages.length > 0 : false; + const kitProducts = prepareKitProducts(order) - return { - ...order, - shipmentIds: shipmentIdsForOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`], - shipmentPackages: shipmentPackages, - carrierPartyIds, - shipmentBoxTypeByCarrierParty: shipmentBoxTypeByCarrierParty, - missingLabelImage - } - }) + return { + ...order, + items: order.items.filter((item: any) => !isKitComponent(item)), + ...(!!(Object.keys(kitProducts)).length && { kitProducts }), + shipmentIds: shipmentIdsForOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`], + shipmentPackages: shipmentPackages, + carrierPartyIds, + shipmentBoxTypeByCarrierParty: shipmentBoxTypeByCarrierParty, + missingLabelImage + } + }) - this.dispatch('util/fetchShipmentBoxTypeDesc', [...new Set(Object.values(carrierShipmentBoxType).flat())]) - } catch(err) { + this.dispatch('util/fetchShipmentBoxTypeDesc', [...new Set(Object.values(carrierShipmentBoxType).flat())]) + } catch (err) { inProgressOrders = inProgressOrders.map((order: any) => { orderIds.includes(order.orderId) && (order.hasMissingInfo = true); return order; @@ -139,7 +142,7 @@ const actions: ActionTree = { } // updating the state with the updated orders information - commit(types.ORDER_INPROGRESS_UPDATED, {orders: inProgressOrders, total: state.inProgress.total}) + commit(types.ORDER_INPROGRESS_UPDATED, { orders: inProgressOrders, total: state.inProgress.total }) }, async fetchCompletedOrdersAdditionalInformation({ commit, state }) { @@ -212,9 +215,12 @@ const actions: ActionTree = { // If there is any shipment package with missing tracking code, retry shipping label const missingLabelImage = this.state.util.productStoreShipmentMethCount > 0 ? currentShipmentPackages.length > 0 : false; + const kitProducts = prepareKitProducts(order) return { ...order, + items: order.items.filter((item: any) => !isKitComponent(item)), + ...(!!(Object.keys(kitProducts)).length && { kitProducts }), shipments: orderShipments, missingLabelImage, trackingCode, @@ -371,6 +377,8 @@ const actions: ActionTree = { orders = orders.map((order: any) => { const orderItem = order.doclist.docs[0]; + const kitProducts = prepareKitProducts({ items: order.doclist.docs }) + return { category: 'open', customerId: orderItem.customerId, @@ -379,7 +387,8 @@ const actions: ActionTree = { orderDate: orderItem.orderDate, orderName: orderItem.orderName, groupValue: order.groupValue, - items: order.doclist.docs, + items: order.doclist.docs.filter((item: any) => !isKitComponent(item)), + ...(!!(Object.keys(kitProducts)).length && { kitProducts }), shipGroupSeqId: orderItem.shipGroupSeqId, shipmentMethodTypeId: orderItem.shipmentMethodTypeId, shipmentMethodTypeDesc: orderItem.shipmentMethodTypeDesc, @@ -643,6 +652,9 @@ const actions: ActionTree = { resp = await OrderService.findOpenOrders(orderQueryPayload); if (!hasError(resp) && resp.data.grouped?.orderId.matches > 0) { const orderItem = resp.data.grouped.orderId.groups[0].doclist.docs[0]; + // getting product IDs beforehand as items and kit products will be processed later + const productIds = resp.data.grouped.orderId.groups[0].doclist.docs.map((item: any) => item.productId) + const kitProducts = prepareKitProducts({ items: resp.data.grouped.orderId.groups[0].doclist.docs}) order = { category: 'open', customerId: orderItem.customerId, @@ -651,13 +663,15 @@ const actions: ActionTree = { orderDate: orderItem.orderDate, orderName: orderItem.orderName, groupValue: resp.data.grouped.orderId.groups[0].groupValue, - items: resp.data.grouped.orderId.groups[0].doclist.docs, + ...(!!(Object.keys(kitProducts)).length && { kitProducts }), + items: resp.data.grouped.orderId.groups[0].doclist.docs.filter((item: any) => !isKitComponent(item)), shipGroupSeqId: orderItem.shipGroupSeqId, shipmentMethodTypeId: orderItem.shipmentMethodTypeId, shipmentMethodTypeDesc: orderItem.shipmentMethodTypeDesc, reservedDatetime: orderItem.reservedDatetime } - await this.dispatch('product/fetchProducts', { productIds: order.items.map((item: any) => item.productId) }) + + await this.dispatch('product/fetchProducts', { productIds }) } else { throw resp.data } @@ -907,8 +921,12 @@ const actions: ActionTree = { // If there is any shipment package with missing tracking code, retry shipping label const missingLabelImage = this.state.util.productStoreShipmentMethCount > 0 ? currentShipmentPackages.length > 0 : false; + const kitProducts = prepareKitProducts(current) + current = { ...current, + items: current.items.filter((item: any) => !isKitComponent(item)), + ...(!!(Object.keys(kitProducts)).length && { kitProducts }), shipments: orderShipments, missingLabelImage, shipmentPackages: currentShipmentPackages // ShipmentPackages information is required when performing retryShippingLabel action @@ -965,68 +983,71 @@ const actions: ActionTree = { const orderShipmentPackages = this.state.util.productStoreShipmentMethCount > 0 ? await OrderService.fetchShipmentPackages(orderShipmentIds) : []; - // if for an order shipment information is not available then returning the same order information again - if (!shipmentIdsForOrderAndPicklistBin[`${current.orderId}_${current.picklistBinId}`]) { - // if there are no shipment for the order, there is some issue with the order - if (picklistBinIds.includes(current.picklistBinId) && orderIds.includes(current.orderId)) { - current = { - ...current, - hasMissingInfo: true, - } - return + // if for an order shipment information is not available then returning the same order information again + if (!shipmentIdsForOrderAndPicklistBin[`${current.orderId}_${current.picklistBinId}`]) { + // if there are no shipment for the order, there is some issue with the order + if (picklistBinIds.includes(current.picklistBinId) && orderIds.includes(current.orderId)) { + current = { + ...current, + hasMissingInfo: true, } return } + return + } - current.items.map((item: any) => { - // fetching shipmentItemInformation for the current order item and then assigning the shipmentItemSeqId to item - const shipment = itemInformationByOrder[item.orderId]?.find((shipmentItem: any) => shipmentItem.orderItemSeqId === item.orderItemSeqId) + current.items.map((item: any) => { + // fetching shipmentItemInformation for the current order item and then assigning the shipmentItemSeqId to item + const shipment = itemInformationByOrder[item.orderId]?.find((shipmentItem: any) => shipmentItem.orderItemSeqId === item.orderItemSeqId) - if (shipment) { - item.shipmentId = shipment.shipmentId - item.shipmentItemSeqId = shipment.shipmentItemSeqId - } + if (shipment) { + item.shipmentId = shipment.shipmentId + item.shipmentItemSeqId = shipment.shipmentItemSeqId + } - item.selectedBox = shipmentPackagesByOrderAndPicklistBin[`${item.orderId}_${item.picklistBinId}`]?.find((shipmentPackage: any) => shipmentPackage.shipmentId === item.shipmentId)?.packageName - }) + item.selectedBox = shipmentPackagesByOrderAndPicklistBin[`${item.orderId}_${item.picklistBinId}`]?.find((shipmentPackage: any) => shipmentPackage.shipmentId === item.shipmentId)?.packageName + }) - const orderItem = current.items[0]; - const carrierPartyIdsOnOrderShipment = [...new Set(orderShipmentIds.map((id: any) => carrierPartyIdsByShipment[id]?.map((carrierParty: any) => carrierParty.carrierPartyId)).flat())]; + const orderItem = current.items[0]; + const carrierPartyIdsOnOrderShipment = [...new Set(orderShipmentIds.map((id: any) => carrierPartyIdsByShipment[id]?.map((carrierParty: any) => carrierParty.carrierPartyId)).flat())]; - const shipmentBoxTypeByCarrierParty = carrierPartyIdsOnOrderShipment.reduce((shipmentBoxType: any, carrierPartyId: any) => { - if (shipmentBoxType[carrierPartyId]) { - shipmentBoxType[carrierPartyId].push(carrierShipmentBoxType[carrierPartyId]) - } else { - shipmentBoxType[carrierPartyId] = carrierShipmentBoxType[carrierPartyId] - } + const shipmentBoxTypeByCarrierParty = carrierPartyIdsOnOrderShipment.reduce((shipmentBoxType: any, carrierPartyId: any) => { + if (shipmentBoxType[carrierPartyId]) { + shipmentBoxType[carrierPartyId].push(carrierShipmentBoxType[carrierPartyId]) + } else { + shipmentBoxType[carrierPartyId] = carrierShipmentBoxType[carrierPartyId] + } - return shipmentBoxType - }, {}); + return shipmentBoxType + }, {}); - const shipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].map((shipmentPackage: any) => { - return { - ...shipmentPackage, - shipmentBoxTypes: shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] ? shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] : [] - } - }); + const shipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].map((shipmentPackage: any) => { + return { + ...shipmentPackage, + shipmentBoxTypes: shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] ? shipmentBoxTypeByCarrierParty[shipmentPackage.carrierPartyId] : [] + } + }); - const currentShipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].reduce((currentShipmentPackages: any, shipment: any) => { - currentShipmentPackages.push(...orderShipmentPackages.filter((shipmentPackage: any) => shipmentPackage.shipmentId === shipment.shipmentId )); - return currentShipmentPackages; - }, []); + const currentShipmentPackages = shipmentPackagesByOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`].reduce((currentShipmentPackages: any, shipment: any) => { + currentShipmentPackages.push(...orderShipmentPackages.filter((shipmentPackage: any) => shipmentPackage.shipmentId === shipment.shipmentId)); + return currentShipmentPackages; + }, []); - // When the shipment method for product store is configured then only check for shipmentPackages otherwise we won't show missing label error button - const missingLabelImage = this.state.util.productStoreShipmentMethCount > 0 ? currentShipmentPackages.length > 0 : false; + // When the shipment method for product store is configured then only check for shipmentPackages otherwise we won't show missing label error button + const missingLabelImage = this.state.util.productStoreShipmentMethCount > 0 ? currentShipmentPackages.length > 0 : false; + const kitProducts = prepareKitProducts(current) - current = { - ...current, - shipmentIds: shipmentIdsForOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`], - shipmentPackages: shipmentPackages, - carrierPartyIdsOnOrderShipment, - shipmentBoxTypeByCarrierParty: shipmentBoxTypeByCarrierParty, - missingLabelImage - } + current = { + ...current, + items: current.items.filter((item: any) => !isKitComponent(item)), + ...(!!(Object.keys(kitProducts)).length && { kitProducts }), + shipmentIds: shipmentIdsForOrderAndPicklistBin[`${orderItem.orderId}_${orderItem.picklistBinId}`], + shipmentPackages: shipmentPackages, + carrierPartyIdsOnOrderShipment, + shipmentBoxTypeByCarrierParty: shipmentBoxTypeByCarrierParty, + missingLabelImage + } this.dispatch('util/fetchShipmentBoxTypeDesc', [...new Set(Object.values(carrierShipmentBoxType).flat())]) } catch (err) { diff --git a/src/utils/order.ts b/src/utils/order.ts index 94705586..8dd6c25f 100644 --- a/src/utils/order.ts +++ b/src/utils/order.ts @@ -83,7 +83,7 @@ const isKitComponent = (item: any) => { return item.toOrderItemAssocs?.some((assoc: any) => assoc.split("/")[0] === 'KIT_COMPONENT') } -const getKitProducts = (order: any) => { +const prepareKitProducts = (order: any) => { return order.items.reduce((kitProducts: any, item: any) => { if (item.toOrderItemAssocs && isKitComponent(item)) { // getting second and third values i.e kit product's orderItemSeqId and parentProductId @@ -103,7 +103,7 @@ const getKitProducts = (order: any) => { } export { - getKitProducts, + prepareKitProducts, getOrderCategory, isKitComponent } \ No newline at end of file diff --git a/src/views/Completed.vue b/src/views/Completed.vue index 3860b838..118bb896 100644 --- a/src/views/Completed.vue +++ b/src/views/Completed.vue @@ -218,7 +218,6 @@ import logger from '@/logger'; import ShippingLabelErrorModal from '@/components/ShippingLabelErrorModal.vue'; import { Actions, hasPermission } from '@/authorization' import OrderActionsPopover from '@/components/OrderActionsPopover.vue' -import { getKitProducts, isKitComponent } from '@/utils/order'; export default defineComponent({ name: 'Completed', @@ -291,17 +290,7 @@ export default defineComponent({ }) }, getCompletedOrders() { - // processing kit products and normal order items - const completedOrders = JSON.parse(JSON.stringify(this.completedOrders.list)).map((order: any) => { - const items = order.items.filter((item: any) => !isKitComponent(item)) - const kitProducts = getKitProducts(order) - return { - ...order, - items, - kitProducts - } - }) - return completedOrders.slice(0, (this.completedOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any) ); + return JSON.parse(JSON.stringify(this.completedOrders.list)).slice(0, (this.completedOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any)); }, async loadMoreCompletedOrders(event: any) { const completedOrdersQuery = JSON.parse(JSON.stringify(this.completedOrders.query)) diff --git a/src/views/InProgress.vue b/src/views/InProgress.vue index a02210a7..7bbd7734 100644 --- a/src/views/InProgress.vue +++ b/src/views/InProgress.vue @@ -159,7 +159,7 @@
- + {{ `Box ${kitProducts[0].selectedBox}` }} @@ -328,7 +328,6 @@ import OrderActionsPopover from '@/components/OrderActionsPopover.vue' import ShippingLabelErrorModal from '@/components/ShippingLabelErrorModal.vue' import ReportIssuePopover from '@/components/ReportIssuePopover.vue' import ShipmentBoxPopover from '@/components/ShipmentBoxPopover.vue' -import { getKitProducts, isKitComponent } from '@/utils/order'; import QRCodeModal from '@/components/QRCodeModal.vue' import { useAuthStore } from '@hotwax/dxp-components' @@ -393,7 +392,7 @@ export default defineComponent({ } }, methods: { - async openRejectReasonPopover(ev: Event, items: any, order: any) { + async openRejectReasonPopover(ev: Event, kitProducts: any, order: any) { const reportIssuePopover = await popoverController.create({ component: ReportIssuePopover, event: ev, @@ -407,11 +406,11 @@ export default defineComponent({ if (result.data) { // reject kit products in bulk - const itemsToReject = items.map((item: any) => ({ ...item, rejectReason: result.data })) + const itemsToReject = kitProducts.map((item: any) => ({ ...item, rejectReason: result.data })) this.reportIssue(order, itemsToReject) } }, - async openShipmentBoxPopover(ev: Event, items: any, order: any) { + async openShipmentBoxPopover(ev: Event, kitProducts: any, orderItemSeqId: number, order: any) { const popover = await popoverController.create({ component: ShipmentBoxPopover, componentProps: { @@ -425,11 +424,11 @@ export default defineComponent({ const result = await popover.onDidDismiss(); - if (result.data && items[0].selectedBox !== result.data) { - this.confirmUpdateBox(items, order, result.data) + if (result.data && kitProducts[0].selectedBox !== result.data) { + this.confirmUpdateBox(kitProducts, orderItemSeqId, order, result.data) } }, - async confirmUpdateBox(items: any, order: any, selectedBox: string) { + async confirmUpdateBox(kitProducts: any, orderItemSeqId: number, order: any, selectedBox: string) { const alert = await alertController.create({ message: translate("Are you sure you want to update box selection?"), header: translate("Update box selection?"), @@ -441,7 +440,7 @@ export default defineComponent({ { text: translate("Confirm"), handler: async () => { - order.kitProducts = items.map((item: any) => ({ ...item, selectedBox })) + order.kitProducts[orderItemSeqId] = kitProducts.map((item: any) => ({ ...item, selectedBox })) await this.updateOrder(order, 'box-selection') } } @@ -453,17 +452,7 @@ export default defineComponent({ return this.searchedQuery === '' ? translate("doesn't have any orders in progress right now.", { facilityName: this.currentFacility.facilityName }) : translate( "No results found for . Try searching Open or Completed tab instead. If you still can't find what you're looking for, try switching stores.", { searchedQuery: this.searchedQuery, lineBreak: '
' }) }, getInProgressOrders() { - // processing kit products and normal order items - const inProgressOrders = JSON.parse(JSON.stringify(this.inProgressOrders.list)).map((order: any) => { - const items = order.items.filter((item: any) => !isKitComponent(item)) - const kitProducts = getKitProducts(order) - return { - ...order, - items, - kitProducts - } - }) - return inProgressOrders.splice(0, (this.inProgressOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any) ); + return JSON.parse(JSON.stringify(this.inProgressOrders.list)).splice(0, (this.inProgressOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any)); }, isIssueSegmentSelectedForItem(item: any) { return this.itemsIssueSegmentSelected.includes(`${item.orderId}-${item.orderItemSeqId}`) diff --git a/src/views/OpenOrders.vue b/src/views/OpenOrders.vue index bdecaf28..414ab88e 100644 --- a/src/views/OpenOrders.vue +++ b/src/views/OpenOrders.vue @@ -185,7 +185,6 @@ import { translate } from '@hotwax/dxp-components'; import { UserService } from '@/services/UserService'; import { Actions, hasPermission } from '@/authorization' import OrderActionsPopover from '@/components/OrderActionsPopover.vue' -import { getKitProducts, isKitComponent } from '@/utils/order'; export default defineComponent({ name: 'OpenOrders', @@ -236,17 +235,7 @@ export default defineComponent({ return this.searchedQuery === '' ? translate("doesn't have any outstanding orders right now.", { facilityName: this.currentFacility.facilityName }) : translate( "No results found for . Try searching In Progress or Completed tab instead. If you still can't find what you're looking for, try switching stores.", { searchedQuery: this.searchedQuery, lineBreak: '
' }) }, getOpenOrders() { - // processing kit products and normal order items - const openOrders = JSON.parse(JSON.stringify(this.openOrders.list)).map((order: any) => { - const items = order.items.filter((item: any) => !isKitComponent(item)) - const kitProducts = getKitProducts(order) - return { - ...order, - items, - kitProducts - } - }) - return openOrders.slice(0, (this.openOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any)); + return JSON.parse(JSON.stringify(this.openOrders.list)).slice(0, (this.openOrders.query.viewIndex + 1) * (process.env.VUE_APP_VIEW_SIZE as any)); }, async loadMoreOpenOrders(event: any) { const openOrdersQuery = JSON.parse(JSON.stringify(this.openOrders.query)) diff --git a/src/views/OrderDetail.vue b/src/views/OrderDetail.vue index d17eee40..f27080cd 100644 --- a/src/views/OrderDetail.vue +++ b/src/views/OrderDetail.vue @@ -72,65 +72,63 @@
- - -
-
- - - - - -

{{ item.productSku }}

- {{ item.virtualProductName }} -

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

- - -
+
+
+ + + + + +

{{ item.productSku }}

+ {{ item.virtualProductName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}

+ + +
-
- - - {{ `Box ${item.selectedBox}` }} - - -
+
+ + + {{ `Box ${item.selectedBox}` }} + + +
- -
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - - {{ translate('Check stock') }} - - - - - {{ translate('Report an issue') }} - - -
-
- + +
+ {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} + + {{ translate('Check stock') }} + + + + + {{ translate('Report an issue') }} + + +
+
- +
+
-

Primary identifier

-

Secondary identifier

+

{{ getProduct(kitProducts[0]?.parentProductId).productName }}

+

{{ getProduct(kitProducts[0]?.parentProductId).sku }}
-
- +
+ - {{ `Box` }} + {{ `Box ${kitProducts[0]?.selectedBox}` }}
-
- +
+ {{ translate('Report an issue') }}
@@ -155,8 +153,8 @@
- - +
+
@@ -280,9 +278,7 @@ import { IonIcon, IonItem, IonItemDivider, - IonItemGroup, IonLabel, - IonList, IonNote, IonPage, IonRow, @@ -331,6 +327,7 @@ import ShipmentBoxTypePopover from '@/components/ShipmentBoxTypePopover.vue' import ShipmentBoxPopover from '@/components/ShipmentBoxPopover.vue' import ReportIssuePopover from '@/components/ReportIssuePopover.vue' import ShippingDetails from '@/views/ShippingDetails.vue'; +import { prepareKitProducts, isKitComponent } from "@/utils/order"; export default defineComponent({ name: "OrderDetail", @@ -349,9 +346,7 @@ export default defineComponent({ IonIcon, IonItem, IonItemDivider, - IonItemGroup, IonLabel, - IonList, IonNote, IonPage, IonRow, @@ -412,7 +407,7 @@ export default defineComponent({ async printPicklist (order: any) { await OrderService.printPicklist(order.picklistId) }, - async openShipmentBoxPopover(ev: Event, item: any, order: any) { + async openShipmentBoxPopover(ev: Event, item: any, order: any, kitProducts?: any, orderItemSeqId?: number) { const popover = await popoverController.create({ component: ShipmentBoxPopover, componentProps: { @@ -426,11 +421,11 @@ export default defineComponent({ const result = await popover.onDidDismiss(); - if (result.data && item.selectedBox !== result.data) { - this.confirmUpdateBox(item, order, result.data) + if (result.data && (kitProducts ? kitProducts[0].selectedBox !== result.data : item.selectedBox !== result.data)) { + this.confirmUpdateBox(item, order, result.data, kitProducts, orderItemSeqId) } }, - async confirmUpdateBox(item: any, order: any, selectedBox: string) { + async confirmUpdateBox(item: any, order: any, selectedBox: string, kitProducts?: any, orderItemSeqId?: number) { const alert = await alertController.create({ message: translate("Are you sure you want to update box selection?"), header: translate("Update box selection?"), @@ -442,7 +437,7 @@ export default defineComponent({ { text: translate("Confirm"), handler: async () => { - item.selectedBox = selectedBox; + kitProducts ? order.kitProducts[orderItemSeqId as number] = kitProducts.map((item: any) => ({ ...item, selectedBox })) : item.selectedBox = selectedBox; await this.updateOrder(order, 'box-selection').then(async () => { await this.store.dispatch('order/getInProgressOrder', { orderId: this.orderId, shipGroupSeqId: this.shipGroupSeqId, isModified: true }) }).catch(err => err); @@ -640,7 +635,7 @@ export default defineComponent({ }); return popover.present(); }, - async openRejectReasonPopover(ev: Event, item: any, order: any) { + async openRejectReasonPopover(ev: Event, item: any, order: any, kitProducts?: any) { const reportIssuePopover = await popoverController.create({ component: ReportIssuePopover, event: ev, @@ -653,8 +648,13 @@ export default defineComponent({ const result = await reportIssuePopover.onDidDismiss(); if (result.data) { - item.rejectReason = result.data; - const itemsToReject = order.items.filter((item: any) => item.rejectReason) + let itemsToReject + if (kitProducts) { + itemsToReject = kitProducts.map((item: any) => ({ ...item, rejectReason: result.data })) + } else { + item.rejectReason = result.data + itemsToReject = order.items.filter((item: any) => item.rejectReason) + } this.reportIssue(order, itemsToReject) } }, From fa05dd401eb067974ac371e119ffafbee2b87b1e Mon Sep 17 00:00:00 2001 From: k2maan Date: Mon, 20 Nov 2023 14:36:29 +0530 Subject: [PATCH 7/9] Implemented: logic to fetch parent kit products (#268) --- src/store/modules/order/actions.ts | 17 ++++++++++++++--- src/store/modules/product/actions.ts | 6 +++++- src/views/OrderDetail.vue | 9 ++++++--- 3 files changed, 25 insertions(+), 7 deletions(-) diff --git a/src/store/modules/order/actions.ts b/src/store/modules/order/actions.ts index a3800ae8..32459c9d 100644 --- a/src/store/modules/order/actions.ts +++ b/src/store/modules/order/actions.ts @@ -652,9 +652,11 @@ const actions: ActionTree = { resp = await OrderService.findOpenOrders(orderQueryPayload); if (!hasError(resp) && resp.data.grouped?.orderId.matches > 0) { const orderItem = resp.data.grouped.orderId.groups[0].doclist.docs[0]; - // getting product IDs beforehand as items and kit products will be processed later - const productIds = resp.data.grouped.orderId.groups[0].doclist.docs.map((item: any) => item.productId) - const kitProducts = prepareKitProducts({ items: resp.data.grouped.orderId.groups[0].doclist.docs}) + const kitProducts = prepareKitProducts({ items: resp.data.grouped.orderId.groups[0].doclist.docs }) + let productIds = resp.data.grouped.orderId.groups[0].doclist.docs.map((item: any) => item.productId) + if (Object.keys(kitProducts).length) { + productIds = [...productIds, ...Object.values(kitProducts).map((item: any) => item.parentProductId)] + } order = { category: 'open', customerId: orderItem.customerId, @@ -931,6 +933,11 @@ const actions: ActionTree = { missingLabelImage, shipmentPackages: currentShipmentPackages // ShipmentPackages information is required when performing retryShippingLabel action } + + if (Object.keys(kitProducts).length) { + const productIds = [...Object.values(kitProducts).map((item: any) => item.parentProductId)] + await this.dispatch('product/fetchProducts', { productIds }) + } } catch(err) { current.hasMissingPackageInfo = true; logger.error('Something went wrong', err) @@ -1049,6 +1056,10 @@ const actions: ActionTree = { missingLabelImage } + if (Object.keys(kitProducts).length) { + const productIds = [...Object.values(kitProducts).map((item: any) => item.parentProductId)] + await this.dispatch('product/fetchProducts', { productIds }) + } this.dispatch('util/fetchShipmentBoxTypeDesc', [...new Set(Object.values(carrierShipmentBoxType).flat())]) } catch (err) { current.hasMissingPackageInfo = true; diff --git a/src/store/modules/product/actions.ts b/src/store/modules/product/actions.ts index 7382c692..54254dbc 100644 --- a/src/store/modules/product/actions.ts +++ b/src/store/modules/product/actions.ts @@ -5,6 +5,7 @@ import ProductState from './ProductState' import * as types from './mutation-types' import { hasError } from '@/adapter' import logger from "@/logger"; +import { isKitComponent } from "@/utils/order"; const actions: ActionTree = { @@ -48,7 +49,10 @@ const actions: ActionTree = { let productIds: any = new Set(); orders.forEach((list: any) => { list.doclist.docs.forEach((order: any) => { - if (order.productId) productIds.add(order.productId) + if (order.productId) { + productIds.add(order.productId) + !isKitComponent(order) && productIds.add(order.parentProductId) + } }) }) diff --git a/src/views/OrderDetail.vue b/src/views/OrderDetail.vue index f27080cd..525045f8 100644 --- a/src/views/OrderDetail.vue +++ b/src/views/OrderDetail.vue @@ -147,9 +147,12 @@
- {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - - + + {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} + + + {{ translate('Check stock') }} +
From b05eac45d1be89681ba2dfb0ea9b328a43963eff Mon Sep 17 00:00:00 2001 From: k2maan Date: Mon, 20 Nov 2023 14:51:32 +0530 Subject: [PATCH 8/9] Improved: imports ordering and removed unwanted changes (#268) --- src/store/modules/order/actions.ts | 2 +- src/views/InProgress.vue | 3 ++- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/store/modules/order/actions.ts b/src/store/modules/order/actions.ts index 32459c9d..a198787f 100644 --- a/src/store/modules/order/actions.ts +++ b/src/store/modules/order/actions.ts @@ -8,7 +8,7 @@ import * as types from './mutation-types' import { prepareOrderQuery } from '@/utils/solrHelper' import { UtilService } from '@/services/UtilService' import logger from '@/logger' -import { prepareKitProducts, getOrderCategory, isKitComponent } from '@/utils/order' +import { getOrderCategory, isKitComponent, prepareKitProducts } from '@/utils/order' const actions: ActionTree = { async fetchInProgressOrdersAdditionalInformation({ commit, state }, payload = { viewIndex: 0 }) { diff --git a/src/views/InProgress.vue b/src/views/InProgress.vue index 7bbd7734..c9dfe74d 100644 --- a/src/views/InProgress.vue +++ b/src/views/InProgress.vue @@ -111,7 +111,7 @@
- + {{ translate("Ready to pack") }} @@ -140,6 +140,7 @@
+
{{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} From a788186274f4f702af2c47ccd1dc4e3751f36ec5 Mon Sep 17 00:00:00 2001 From: k2maan Date: Fri, 24 Nov 2023 16:54:05 +0530 Subject: [PATCH 9/9] Improved: variable naming in template for rendering kit products (#268) --- src/views/Completed.vue | 20 ++++++++++---------- src/views/InProgress.vue | 26 +++++++++++++------------- src/views/OpenOrders.vue | 20 ++++++++++---------- 3 files changed, 33 insertions(+), 33 deletions(-) diff --git a/src/views/Completed.vue b/src/views/Completed.vue index 118bb896..6a48850d 100644 --- a/src/views/Completed.vue +++ b/src/views/Completed.vue @@ -90,33 +90,33 @@
-
+
-

{{ getProduct(kitProducts[0].parentProductId).productName }}

-

{{ getProduct(kitProducts[0].parentProductId).sku }}

+

{{ getProduct(kitProduct[0].parentProductId).productName }}

+

{{ getProduct(kitProduct[0].parentProductId).sku }}
-
+
- + -

{{ items.productSku }}

- {{ items.productName }} -

{{ getFeature(getProduct(items.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(items.productId).featureHierarchy, '1/SIZE/')}}

+

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}
- {{ getProductStock(items.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - + {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} +
diff --git a/src/views/InProgress.vue b/src/views/InProgress.vue index c9dfe74d..287f2b06 100644 --- a/src/views/InProgress.vue +++ b/src/views/InProgress.vue @@ -150,47 +150,47 @@
-
+
-

{{ getProduct(kitProducts[0].parentProductId).productName }}

-

{{ getProduct(kitProducts[0].parentProductId).sku }}

+

{{ getProduct(kitProduct[0].parentProductId).productName }}

+

{{ getProduct(kitProduct[0].parentProductId).sku }}
- + - {{ `Box ${kitProducts[0].selectedBox}` }} + {{ `Box ${kitProduct[0].selectedBox}` }}
- + {{ translate('Report an issue') }}
-
+
- + -

{{ items.productSku }}

- {{ items.productName }} -

{{ getFeature(getProduct(items.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(items.productId).featureHierarchy, '1/SIZE/')}}

+

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}
- {{ getProductStock(items.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - + {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} +
diff --git a/src/views/OpenOrders.vue b/src/views/OpenOrders.vue index 414ab88e..d6474b12 100644 --- a/src/views/OpenOrders.vue +++ b/src/views/OpenOrders.vue @@ -82,33 +82,33 @@
-
+
-

{{ getProduct(kitProducts[0].parentProductId).productName }}

-

{{ getProduct(kitProducts[0].parentProductId).sku }}

+

{{ getProduct(kitProduct[0].parentProductId).productName }}

+

{{ getProduct(kitProduct[0].parentProductId).sku }}
-
+
- + -

{{ items.productSku }}

- {{ items.productName }} -

{{ getFeature(getProduct(items.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(items.productId).featureHierarchy, '1/SIZE/')}}

+

{{ item.productSku }}

+ {{ item.productName }} +

{{ getFeature(getProduct(item.productId).featureHierarchy, '1/COLOR/')}} {{ getFeature(getProduct(item.productId).featureHierarchy, '1/SIZE/')}}
- {{ getProductStock(items.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} - + {{ getProductStock(item.productId).quantityOnHandTotal }} {{ translate('pieces in stock') }} +