From cd3f2273d71aa292b819f4474eeb86f82cb37283 Mon Sep 17 00:00:00 2001 From: Yash Maheshwari Date: Mon, 10 Jun 2024 18:41:50 +0530 Subject: [PATCH 1/3] Improved: the api endpoints for performing operations on order(#73) --- src/i18n/locales/en.json | 3 +++ src/services/OrderService.ts | 19 +++++++++++-------- src/views/Order.vue | 21 +++++++++++++++------ 3 files changed, 29 insertions(+), 14 deletions(-) diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 6471767c..d9ff8860 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -1,9 +1,11 @@ { + "Add address": "Add address", "Are you sure you want to save the changes?": "Are you sure you want to save the changes?", "Are you sure you want to cancel the order items?": "Are you sure you want to cancel the order items?", "Cancel": "Cancel", "Cancel items": "Cancel items", "Change Store": "Change Store", + "Changes saved": "Changes saved", "City": "City", "Confirm": "Confirm", "Click the backdrop to dismiss.": "Click the backdrop to dismiss.", @@ -15,6 +17,7 @@ "Fetching order details.": "Fetching order details.", "Fetching stores.": "Fetching stores.", "First name": "First name", + "Failed to cancel the order": "Failed to cancel the order", "Failed to update the pickup store": "Failed to update the pickup store", "Failed to update the shipping addess": "Failed to update the shipping addess", "Last name": "Last name", diff --git a/src/services/OrderService.ts b/src/services/OrderService.ts index bbcd3f0d..2970886d 100644 --- a/src/services/OrderService.ts +++ b/src/services/OrderService.ts @@ -1,31 +1,34 @@ import { api } from '@/adapter'; -const getOrder = async (): Promise => { +const getOrder = async (token: string): Promise => { return api({ - url: "orders", - method: "get", + url: "getRerouteOrder", + method: "POST", + data: { + token + } }); } const updateShippingAddress = async (payload: any): Promise => { return api({ - url: "service/updateShippingInformationOfShipGroup", + url: "updateShippingAddressRerouteOrder", method: "post", - data: payload, + data: payload }); } const updatePickupFacility = async (payload: any): Promise => { return api({ - url: "service/updateOrderItemShipGroup", + url: "updatePickupFacility", method: "post", - data: payload, + data: payload }); } const cancelOrderItem = async (payload: any): Promise => { return api({ - url: 'cancelOrderItem', + url: "cancelRerouteOrderItem", method: "post", data: payload }); diff --git a/src/views/Order.vue b/src/views/Order.vue index bcbd4fb0..3e73f301 100644 --- a/src/views/Order.vue +++ b/src/views/Order.vue @@ -148,7 +148,8 @@ export default defineComponent({ name: 'Shipping', value: 'STANDARD' } - ] + ], + token: "" } }, computed: { @@ -162,6 +163,7 @@ export default defineComponent({ // invalid request return; } + this.token = this.$route.query.token as any initialise({ token: this.$route.query.token, instanceUrl: `${this.$route.query.oms}/api/`, @@ -194,10 +196,14 @@ export default defineComponent({ await this.presentLoader() let resp; let order + if(!this.token) { + return; + } + try { - resp = await OrderService.getOrder(); - if (!hasError(resp)) { - order = resp.data; + resp = await OrderService.getOrder(this.token); + if (!hasError(resp) && resp.data.order) { + order = resp.data.order; const productIds: any = new Set(); order.shipGroup = order.shipGroup.filter((group: any) => { if(group.facilityId === '_NA_') { @@ -260,7 +266,8 @@ export default defineComponent({ "city": shipGroup.updatedAddress.city, "stateProvinceGeoId": shipGroup.updatedAddress.stateProvinceGeoId, "postalCode": shipGroup.updatedAddress.postalCode, - "countryGeoId": shipGroup.updatedAddress.countryGeoId + "countryGeoId": shipGroup.updatedAddress.countryGeoId, + "token": this.token } as any if (shipGroup.selectedShipmentMethodTypeId === shipGroup.shipmentMethodTypeId) { @@ -294,6 +301,7 @@ export default defineComponent({ "shipmentMethod": "STOREPICKUP@_NA_@CARRIER", // TODO Check why CARRIER is needed "contactMechPurposeTypeId": "SHIPPING_LOCATION", "facilityId": shipGroup.selectedFacility.facilityId, + "token": this.token } try { @@ -386,7 +394,8 @@ export default defineComponent({ const payload = { "orderId": this.order.id, "shipGroupSeqId": shipGroup.shipGroupSeqId, - "itemReasonMap": itemReasonMap + "itemReasonMap": itemReasonMap, + "token": this.token } as any try { From bf433cb074da808828f77bb6801dcfd65f0e9a49 Mon Sep 17 00:00:00 2001 From: Yash Maheshwari Date: Tue, 18 Jun 2024 12:14:21 +0530 Subject: [PATCH 2/3] Improved: endpoints for the services and handled the changes as required(#73) Updated endpoints to use reroute specific endpoints Removed passing token in the headers as we are passing token in the params Displayed stateCode in the store pickup modal and country on the shipping info card Updated routes to handle the token as prop in the route, previously we use to get the same as params --- src/router/index.ts | 11 +++++++---- src/services/OrderService.ts | 15 ++++++++------- src/services/UtilityService.ts | 2 +- src/store/modules/user/actions.ts | 6 ++++-- src/views/AddressModal.vue | 3 ++- src/views/Order.vue | 23 +++++++++++++---------- src/views/PickupLocationModal.vue | 2 +- 7 files changed, 36 insertions(+), 26 deletions(-) diff --git a/src/router/index.ts b/src/router/index.ts index e6b3c540..749b4ca5 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -4,13 +4,16 @@ import Order from "@/views/Order.vue" const routes: Array = [ { - path: '/', - redirect: "/order", + path: "/order/:token", + name: "Order", + component: Order, + props: true }, { - path: "/order", + path: '/:token', // Added this route as when using redirect we can't define props as true and thus the redirect fails name: "Order", - component: Order + component: Order, + props: true } ] diff --git a/src/services/OrderService.ts b/src/services/OrderService.ts index 2970886d..5a34501d 100644 --- a/src/services/OrderService.ts +++ b/src/services/OrderService.ts @@ -1,18 +1,19 @@ import { api } from '@/adapter'; +import store from '@/store'; -const getOrder = async (token: string): Promise => { +const getOrder = async (payload: any): Promise => { + let baseURL = store.getters['user/getInstanceUrl']; + baseURL = baseURL && baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/api/`; return api({ url: "getRerouteOrder", - method: "POST", - data: { - token - } + method: "post", + data: payload }); } const updateShippingAddress = async (payload: any): Promise => { return api({ - url: "updateShippingAddressRerouteOrder", + url: "updateShippingAddressOfRerouteOrder", method: "post", data: payload }); @@ -36,7 +37,7 @@ const cancelOrderItem = async (payload: any): Promise => { const getProductStoreSetting = async (payload: any): Promise => { return api({ - url: 'getProductStoreSetting', + url: "getProductStoreSettingForRerouteOrder", method: "post", data: payload }); diff --git a/src/services/UtilityService.ts b/src/services/UtilityService.ts index 930cf3b9..30dc14f5 100644 --- a/src/services/UtilityService.ts +++ b/src/services/UtilityService.ts @@ -2,7 +2,7 @@ import { api } from '@/adapter'; const getAssociatedStates = async (payload: any): Promise => { return api({ - url: "getStates", + url: "getStatesForRerouteOrder", method: "post", data: payload, }); diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts index 0c59850c..3021eb86 100644 --- a/src/store/modules/user/actions.ts +++ b/src/store/modules/user/actions.ts @@ -114,14 +114,16 @@ const actions: ActionTree = { updateInstanceUrl(payload) }, - async getConfiguration({ commit }, productStoreId) { + async getConfiguration({ commit }, { productStoreId, token }) { try { const resp = await OrderService.getProductStoreSetting({ + token, inputFields: { productStoreId, "settingTypeEnumId": ["CUST_DLVRMTHD_UPDATE", "CUST_DLVRADR_UPDATE", "CUST_PCKUP_UPDATE", "CUST_ALLOW_CNCL", "RF_SHIPPING_METHOD"], "settingTypeEnumId_op": "in" - } + }, + viewSize: 100 }) if (!hasError(resp)) { const permissions = resp.data.docs.filter((permission: any) => permission.settingValue == 'true').map((permission: any) => permission.settingTypeEnumId) diff --git a/src/views/AddressModal.vue b/src/views/AddressModal.vue index 5c4ed8e9..15386b9d 100644 --- a/src/views/AddressModal.vue +++ b/src/views/AddressModal.vue @@ -93,7 +93,7 @@ export default defineComponent({ states: [] as any }; }, - props: ["shipGroup"], + props: ["shipGroup", "token"], async mounted() { await this.getAssociatedStates() if (this.shipGroup.shipmentMethodTypeId != 'STOREPICKUP') this.prepareAddress(); @@ -126,6 +126,7 @@ export default defineComponent({ async getAssociatedStates() { try { const payload = { + "token": this.token, "countryGeoId": this.shipGroup.shipTo.postalAddress.countryGeoId, "viewSize": process.env.VUE_APP_VIEW_SIZE } diff --git a/src/views/Order.vue b/src/views/Order.vue index 3e73f301..1440c0ac 100644 --- a/src/views/Order.vue +++ b/src/views/Order.vue @@ -45,7 +45,7 @@ {{ shipGroup.selectedFacility.facilityName }} {{ shipGroup.selectedFacility.address1 }} - {{ shipGroup.selectedFacility.city }} {{ shipGroup.selectedFacility.stateCode }} {{ shipGroup.selectedFacility.postalCode }} + {{ shipGroup.selectedFacility.city }} {{ shipGroup.selectedFacility.stateCode }} {{ shipGroup.shipTo.postalAddress.country }} {{ shipGroup.selectedFacility.postalCode }} {{ $t("Change Store")}} @@ -148,8 +148,7 @@ export default defineComponent({ name: 'Shipping', value: 'STANDARD' } - ], - token: "" + ] } }, computed: { @@ -157,15 +156,15 @@ export default defineComponent({ deliveryMethod: 'user/getDeliveryMethod', }) }, + props: ["token"], async mounted() { if (Object.keys(this.$route.query).length > 0) { - if(!this.$route.query.oms || !this.$route.query.token) { + if(!this.$route.query.oms || !this.token) { // invalid request return; } - this.token = this.$route.query.token as any initialise({ - token: this.$route.query.token, + token: "", // Not passing token, as in this app we don't want to send the token in the Authorizartion header and instead the token will be passed in the params/body instanceUrl: `${this.$route.query.oms}/api/`, cacheMaxAge: this.maxAge, events: { @@ -174,6 +173,7 @@ export default defineComponent({ } } }) + this.store.dispatch("user/setUserInstanceUrl", `${this.$route.query.oms}/api/`) await this.getOrder(); } }, @@ -201,9 +201,11 @@ export default defineComponent({ } try { - resp = await OrderService.getOrder(this.token); - if (!hasError(resp) && resp.data.order) { - order = resp.data.order; + resp = await OrderService.getOrder({ + token: this.token + }); + if (!hasError(resp) && resp.data.id) { + order = resp.data; const productIds: any = new Set(); order.shipGroup = order.shipGroup.filter((group: any) => { if(group.facilityId === '_NA_') { @@ -217,7 +219,7 @@ export default defineComponent({ } }) if (productIds.length) await this.fetchProducts([...productIds]) - await this.store.dispatch("user/getConfiguration", order.productStoreId); + await this.store.dispatch("user/getConfiguration", { productStoreId: order.productStoreId, token: this.token}); this.order = order; if (productIds.size) await this.fetchProducts([...productIds]) } @@ -335,6 +337,7 @@ export default defineComponent({ backdropDismiss: false, componentProps: { shipGroup, + token: this.token } }) modal.onDidDismiss().then((result) => { diff --git a/src/views/PickupLocationModal.vue b/src/views/PickupLocationModal.vue index 8bcb84fb..e103804d 100644 --- a/src/views/PickupLocationModal.vue +++ b/src/views/PickupLocationModal.vue @@ -18,7 +18,7 @@ {{ shipGroup.shipTo.postalAddress.toName }} {{ shipGroup.shipTo.postalAddress.address1 }} - {{ shipGroup.shipTo.postalAddress.city }} {{ shipGroup.shipTo.postalAddress.country }} {{ shipGroup.shipTo.postalAddress.postalCode }} + {{ shipGroup.shipTo.postalAddress.city }} {{ shipGroup.shipTo.postalAddress.stateCode }} {{ shipGroup.shipTo.postalAddress.country }} {{ shipGroup.shipTo.postalAddress.postalCode }} From 6b62bbb56c45e37a5be654880ed8fd95097d7272 Mon Sep 17 00:00:00 2001 From: Yash Maheshwari Date: Tue, 18 Jun 2024 18:24:54 +0530 Subject: [PATCH 3/3] Improved: address modal to have a loader before populating data and added a null check on geoCode(#73) --- src/i18n/locales/en.json | 1 + src/views/AddressModal.vue | 25 ++++++++++++++++++++++--- 2 files changed, 23 insertions(+), 3 deletions(-) diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index d9ff8860..b8c851cd 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -20,6 +20,7 @@ "Failed to cancel the order": "Failed to cancel the order", "Failed to update the pickup store": "Failed to update the pickup store", "Failed to update the shipping addess": "Failed to update the shipping addess", + "Fetching address": "Fetching address", "Last name": "Last name", "Login": "Login", "Logout": "Logout", diff --git a/src/views/AddressModal.vue b/src/views/AddressModal.vue index 15386b9d..2b574bcf 100644 --- a/src/views/AddressModal.vue +++ b/src/views/AddressModal.vue @@ -52,7 +52,8 @@ import { IonSelectOption, IonTitle, IonToolbar, - modalController + modalController, + loadingController } from '@ionic/vue'; import { defineComponent } from 'vue'; import { closeOutline } from 'ionicons/icons'; @@ -90,13 +91,16 @@ export default defineComponent({ countryGeoId: "" } as any, contactMechId: '', - states: [] as any + states: [] as any, + loader: null as any }; }, props: ["shipGroup", "token"], async mounted() { + this.presentLoader() await this.getAssociatedStates() if (this.shipGroup.shipmentMethodTypeId != 'STOREPICKUP') this.prepareAddress(); + this.dismissLoader() }, methods: { async updateAddress() { @@ -106,7 +110,9 @@ export default defineComponent({ }) if (hasEmptyValues) return showToast(translate("Please fill all the fields")) const state = this.states.find((state: any) => state.geoId === this.address.stateProvinceGeoId); - this.address.stateCode = state.geoCode; + // In some cases, we get a stateProvinceGeoId that does not exist in data, thus state is not displayed on the UI but originally the field has information thus toast of empty field is not displayed + // thus added a check that if the geoCode is not found in the states fetched from the server, do not stop the address update process and pass the same state that was previously in the address. + this.address.stateCode = state?.geoCode || this.address.stateProvinceGeoId; this.close(this.address); }, prepareAddress() { @@ -143,6 +149,19 @@ export default defineComponent({ close(address?: any) { modalController.dismiss({ dismissed: true }, address); }, + async presentLoader() { + this.loader = await loadingController + .create({ + message: this.$t("Fetching address") + }); + await this.loader.present(); + }, + dismissLoader() { + if (this.loader) { + this.loader.dismiss(); + this.loader = null; + } + }, }, setup() { const router = useRouter();