Merge pull request #328 from hotwax/312_order_detail_shipping_info

Implemented: Displayed payment method and status on order detail page.

src/services/OrderService.ts

@@ -425,6 +425,23 @@ const fetchOrderItemShipGroup = async (order: any): Promise<any> => {
   return shipGroup;
 }
 
+const fetchOrderPaymentPreferences = async (orderId: any): Promise<any> => {
+  const params = {
+    "entityName": "OrderPaymentPreference",
+    "inputFields": {
+      "orderId": orderId,
+    },
+    "fieldList": ["orderId", "paymentMethodTypeId", "statusId"],
+    "distinct": "Y"
+  }
+
+  return await api({
+    url: "performFind",
+    method: "get",
+    params
+  });
+}
+
 const fetchShippingAddress = async (contactMechId: string): Promise<any> => {
   let shippingAddress = {};
 
@@ -477,5 +494,6 @@ export const OrderService = {
   updateOrder,
   fetchShipmentLabelError,
   fetchOrderItemShipGroup,
-  fetchShippingAddress
+  fetchShippingAddress,
+  fetchOrderPaymentPreferences
 }

src/services/UtilService.ts

@@ -320,6 +320,22 @@ const fetchFacilityTypeInformation = async (query: any): Promise <any>  => {
   });
 }
 
+const fetchPaymentMethodTypeDesc = async (query: any): Promise <any>  => {
+  return api({
+    url: "performFind",
+    method: "get",
+    params: query
+  });
+}
+
+const fetchStatusDesc = async (query: any): Promise <any>  => {
+  return api({
+    url: "performFind",
+    method: "get",
+    params: query
+  });
+}
+
 export const UtilService = {
   createPicklist,
   fetchCarrierPartyIds,
@@ -331,6 +347,8 @@ export const UtilService = {
   fetchShipmentBoxTypeDesc,
   fetchShipmentMethods,
   fetchShipmentMethodTypeDesc,
+  fetchPaymentMethodTypeDesc,
+  fetchStatusDesc,
   fetchShipmentRouteSegmentInformation,
   findCarrierPartyIdsForShipment,
   findCarrierShipmentBoxType,

src/store/modules/order/actions.ts

@@ -475,6 +475,33 @@ const actions: ActionTree<OrderState, RootState> = {
     emitter.emit('dismissLoader');
     return resp;
   },
+  async fetchPaymentDetail({ commit, state }) {
+    try {
+      const order = JSON.parse(JSON.stringify(state.current));
+      const resp = await OrderService.fetchOrderPaymentPreferences(order.orderId);
+
+      if (!hasError(resp)) {
+        const orderPaymentPreferences = resp?.data?.docs;
+
+        if (orderPaymentPreferences.length > 0) {
+          const paymentMethodTypeIds = orderPaymentPreferences.map((orderPaymentPreference: any) => orderPaymentPreference.paymentMethodTypeId);
+          if (paymentMethodTypeIds.length > 0) {
+            this.dispatch('util/fetchPaymentMethodTypeDesc', paymentMethodTypeIds);
+          }
+
+          const statusIds = orderPaymentPreferences.map((orderPaymentPreference: any) => orderPaymentPreference.statusId);
+          if (statusIds.length > 0) {
+            this.dispatch('util/fetchStatusDesc', statusIds);
+          }
+
+          order.orderPaymentPreferences = orderPaymentPreferences;
+          commit(types.ORDER_CURRENT_UPDATED, { order });
+        }
+      }
+    } catch (err) {
+      logger.error("Error in fetching payment detail.", err);
+    }
+  },
   async fetchShippingAddress ({ commit, state }) {
     let resp;
     let order = JSON.parse(JSON.stringify(state.current))
@@ -685,6 +712,7 @@ const actions: ActionTree<OrderState, RootState> = {
     commit(types.ORDER_CURRENT_UPDATED, { order: payload })
     await dispatch('fetchShippingAddress');
     await dispatch('fetchShipGroupForOrder');
+    await dispatch('fetchPaymentDetail');
   },
 }
 

src/store/modules/util/UtilState.ts

@@ -4,4 +4,6 @@ export default interface UtilState {
   shipmentMethodTypeDesc: any;
   shipmentBoxTypeDesc: any;
   facilityTypeDesc: any;
+  paymentMethodTypeDesc: any;
+  statusDesc: any;
 }

src/store/modules/util/actions.ts

@@ -204,6 +204,88 @@ const actions: ActionTree<UtilState, RootState> = {
     } catch(err) {
       logger.error('Failed to fetch description for facility types', err)
     }
+  },
+  async fetchPaymentMethodTypeDesc({ commit, state }, paymentMethodTypeIds) {
+    let paymentMethodTypeDesc = JSON.parse(JSON.stringify(state.paymentMethodTypeDesc))
+    const cachedPaymentMethodTypeIds = Object.keys(paymentMethodTypeDesc);
+    const ids = paymentMethodTypeIds.filter((paymentMethodTypeId: string) => !cachedPaymentMethodTypeIds.includes(paymentMethodTypeId))
+
+    if(!ids.length) return paymentMethodTypeDesc;
+
+    try {
+      const payload = {
+        "inputFields": {
+          "paymentMethodTypeId": ids,
+          "paymentMethodTypeId_op": "in"
+        },
+        "fieldList": ["paymentMethodTypeId", "description"],
+        "entityName": "PaymentMethodType",
+        "viewSize": ids.length
+      }
+
+      const resp = await UtilService.fetchPaymentMethodTypeDesc(payload);
+
+      if(!hasError(resp)) {
+        const paymentMethodResp = {} as any
+        resp.data.docs.map((paymentMethodType: any) => {
+          paymentMethodResp[paymentMethodType.paymentMethodTypeId] = paymentMethodType.description
+        })
+
+        paymentMethodTypeDesc = {
+          ...paymentMethodTypeDesc,
+          ...paymentMethodResp
+        }
+
+        commit(types.UTIL_PAYMENT_METHODS_UPDATED, paymentMethodTypeDesc)
+      } else {
+        throw resp.data
+      }
+    } catch(err) {
+      logger.error('Error fetching payment method description', err)
+    }
+
+    return paymentMethodTypeDesc;
+  },
+  async fetchStatusDesc({ commit, state }, statusIds) {
+    let statusDesc = JSON.parse(JSON.stringify(state.statusDesc))
+    const cachedStatusIds = Object.keys(statusDesc);
+    const ids = statusIds.filter((statusId: string) => !cachedStatusIds.includes(statusId))
+
+    if(!ids.length) return statusDesc;
+
+    try {
+      const payload = {
+        "inputFields": {
+          "statusId": ids,
+          "statusId_op": "in"
+        },
+        "fieldList": ["statusId", "description"],
+        "entityName": "StatusItem",
+        "viewSize": ids.length
+      }
+
+      const resp = await UtilService.fetchStatusDesc(payload);
+
+      if(!hasError(resp)) {
+        const statusResp = {} as any
+        resp.data.docs.map((statusItem: any) => {
+          statusResp[statusItem.statusId] = statusItem.description
+        })
+
+        statusDesc = {
+          ...statusDesc,
+          ...statusResp
+        }
+
+        commit(types.UTIL_STATUS_UPDATED, statusDesc)
+      } else {
+        throw resp.data
+      }
+    } catch(err) {
+      logger.error('Error fetching status description', err)
+    }
+
+    return statusDesc;
   }
 }
 

src/store/modules/util/getters.ts

@@ -17,6 +17,12 @@ const getters: GetterTree <UtilState, RootState> = {
   },
   getFacilityTypeDesc: (state) => (facilityTypeId: string) => {
     return state.facilityTypeDesc[facilityTypeId] ? state.facilityTypeDesc[facilityTypeId] : ''
+  },
+  getPaymentMethodDesc: (state) => (paymentMethodTypeId: string) => {
+    return state.paymentMethodTypeDesc[paymentMethodTypeId] ? state.paymentMethodTypeDesc[paymentMethodTypeId] : paymentMethodTypeId
+  },
+  getStatusDesc: (state) => (statusId: string) => {
+    return state.statusDesc[statusId] ? state.statusDesc[statusId] : statusId
   }
 }
 export default getters;

src/store/modules/util/index.ts

@@ -12,7 +12,9 @@ const utilModule: Module<UtilState, RootState> = {
     partyNames: {},
     shipmentMethodTypeDesc: {},
     shipmentBoxTypeDesc: {},
-    facilityTypeDesc: {}
+    facilityTypeDesc: {},
+    paymentMethodTypeDesc: {},
+    statusDesc: {}
   },
   getters,
   actions,

src/store/modules/util/mutation-types.ts

@@ -4,3 +4,7 @@ export const UTIL_PARTY_NAMES_UPDATED = SN_UTIL + '/PARTY_NAMES_UPDATED'
 export const UTIL_SHIPMENT_METHODS_UPDATED = SN_UTIL + '/SHIPMENT_METHODS_UPDATED'
 export const UTIL_SHIPMENT_BOXES_UPDATED = SN_UTIL + '/SHIPMENT_BOXES_UPDATED'
 export const UTIL_FACILITY_TYPE_UPDATED = SN_UTIL + '/FACILITY_TYPE_UPDATED'
+export const UTIL_PAYMENT_METHODS_UPDATED = SN_UTIL + '/PAYMENT_METHODS_UPDATED'
+export const UTIL_STATUS_UPDATED = SN_UTIL + '/STATUS_UPDATED'
+
+

src/store/modules/util/mutations.ts

@@ -17,6 +17,12 @@ const mutations: MutationTree <UtilState> = {
   },
   [types.UTIL_FACILITY_TYPE_UPDATED] (state, payload) {
     state.facilityTypeDesc = payload
+  },
+  [types.UTIL_PAYMENT_METHODS_UPDATED] (state, payload) {
+    state.paymentMethodTypeDesc = payload
+  },
+  [types.UTIL_STATUS_UPDATED] (state, payload) {
+    state.statusDesc = payload
   }
 }
 export default mutations;

src/views/OrderDetail.vue

@@ -21,10 +21,10 @@
             <ion-icon :icon="documentTextOutline" />
             <ion-label>{{ translate('Linked picklist') }}: {{ order.picklistId }}</ion-label>
           </ion-chip>
-          <!-- <ion-chip outline> 
+          <ion-chip outline v-if="order?.orderPaymentPreferences?.length > 0"> 
             <ion-icon :icon="cashOutline" />
-            <ion-label>{{ 'Payment method: status' }}</ion-label>
-          </ion-chip> -->
+            <ion-label>{{ getPaymentMethodDesc(order?.orderPaymentPreferences[0]?.paymentMethodTypeId)}} : {{ getStatusDesc(order?.orderPaymentPreferences[0]?.statusId) }}</ion-label>
+          </ion-chip>
         </div>
         <div class="order-metadata">
           <ion-badge>{{ translate(orderCategory) }}</ion-badge>
@@ -310,7 +310,9 @@ export default defineComponent({
       rejectReasons: 'util/getRejectReasons',
       userPreference: 'user/getUserPreference',
       getPartyName: 'util/getPartyName',
-      getfacilityTypeDesc: 'util/getFacilityTypeDesc'
+      getfacilityTypeDesc: 'util/getFacilityTypeDesc',
+      getPaymentMethodDesc: 'util/getPaymentMethodDesc',
+      getStatusDesc: 'util/getStatusDesc'
     })
   },
   data() {