Merge branch 'main' of https://github.com/hotwax/bopis into bopis/#284

src/locales/en.json

@@ -62,6 +62,7 @@
   "Mismatch": "Mismatch",
   "More": "More",
   "New notification received.": "New notification received.",
+  "No items found": "No items found",
   "No inventory details found": "No inventory details found",
   "Not in stock": "Not in stock",
   "Not in Stock": "Not in Stock",

src/locales/es.json

@@ -61,6 +61,7 @@
   "Mismatch": "Desajuste",
   "More": "Más",
   "New notification received.": "New notification received.",
+  "No items found": "No items found",
   "No inventory details found": "No se encontraron detalles de inventario",
   "Not in stock": "No disponible en el inventario",
   "No products found": "No se encontraron productos",

src/locales/ja.json

@@ -61,6 +61,7 @@
   "Mismatch": "不一致",
   "More": "More",
   "New notification received.": "New notification received.",
+  "No items found": "No items found",
   "No inventory details found": "在庫の詳細が見つかりません",
   "Not in Stock": "在庫切れ",
   "No products found": "商品が見つかりません",

src/services/OrderService.ts

@@ -171,7 +171,16 @@ const getOrderItemRejectionHistory = async (payload: any): Promise<any> => {
   })
 }
 
+const fetchOrderPaymentPreferences = async (params: any): Promise<any> => {
+  return await api({
+    url: "performFind",
+    method: "get",
+    params
+  });
+}
+
 export const OrderService = {
+  fetchOrderPaymentPreferences,
   getOpenOrders,
   getOrderDetails,
   getCompletedOrders,

src/services/UtilService.ts

@@ -9,6 +9,24 @@ const fetchRejectReasons = 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 = {
-  fetchRejectReasons
+  fetchPaymentMethodTypeDesc,
+  fetchRejectReasons,
+  fetchStatusDesc
 }

src/store/modules/order/actions.ts

@@ -110,7 +110,7 @@ const actions: ActionTree<OrderState , RootState> ={
         return order.orderId === payload.orderId;
       })
       if(order) {
-        dispatch('updateCurrent', { order })
+        await dispatch('updateCurrent', { order })
         return order;
       }
     }
@@ -189,7 +189,7 @@ const actions: ActionTree<OrderState , RootState> ={
       console.error(err)
     }
 
-    dispatch('updateCurrent', { order: currentOrder })
+    await dispatch('updateCurrent', { order: currentOrder })
   },
 
   updateCurrent ({ commit }, payload) {
@@ -471,7 +471,7 @@ const actions: ActionTree<OrderState , RootState> ={
           })
         }
         // Added ready to handover because we need to show the user that the order has moved to the packed tab (ready to handover)
-        dispatch('updateCurrent', { order : { ...payload.order, readyToHandover: true } })
+        await dispatch('updateCurrent', { order : { ...payload.order, readyToHandover: true } })
 
         showToast(translate("Order packed and ready for delivery"))
       } else {
@@ -827,6 +827,52 @@ const actions: ActionTree<OrderState , RootState> ={
     commit(types.ORDER_OPEN_UPDATED, {orders: {} , total: 0})
     commit(types.ORDER_PACKED_UPDATED, {orders: {} , total: 0})
     commit(types.ORDER_COMPLETED_UPDATED, {orders: {} , total: 0})
+    commit(types.ORDER_CURRENT_UPDATED, { order: {} });
+  },
+
+  async fetchPaymentDetail({ commit, state }) {
+    const order = JSON.parse(JSON.stringify(state.current));
+
+    // if order already contains payment status don't fetch the information again
+    if(order.paymentStatus) {
+      return;
+    }
+
+    try {
+      const params = {
+        "entityName": "OrderPaymentPreference",
+        "inputFields": {
+          "orderId": order.orderId,
+        },
+        "fieldList": ["orderId", "paymentMethodTypeId", "statusId"],
+        "distinct": "Y"
+      }
+
+      const resp = await OrderService.fetchOrderPaymentPreferences(params);
+
+      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 });
+        }
+      } else {
+        throw resp.data
+      }
+    } catch (err) {
+      console.error("Error in fetching payment detail.", err);
+    }
   }
 }
 

src/store/modules/user/actions.ts

@@ -149,6 +149,7 @@ const actions: ActionTree<UserState, RootState> = {
     dispatch('clearNotificationState')
     dispatch('clearPartialOrderRejectionConfig');
     this.dispatch('util/updateRejectReasons', [])
+    this.dispatch('order/clearOrders')
     commit(types.USER_END_SESSION)
     resetPermissions();
     resetConfig();

src/store/modules/util/UtilState.ts

@@ -1,3 +1,5 @@
 export default interface UtilState {
   rejectReasons: [];
+  paymentMethodTypeDesc: any;
+  statusDesc: any;
 }

src/store/modules/util/actions.ts

@@ -36,6 +36,90 @@ const actions: ActionTree<UtilState, RootState> = {
 
   async updateRejectReasons({ commit }, payload) {
     commit(types.UTIL_REJECT_REASONS_UPDATED, payload)
+  },
+
+  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) {
+      console.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) {
+      console.error('Error fetching status description', err)
+    }
+
+    return statusDesc;
   }
 }
 

src/store/modules/util/getters.ts

@@ -5,6 +5,12 @@ import RootState from '@/store/RootState'
 const getters: GetterTree <UtilState, RootState> = {
   getRejectReasons(state) {
     return state.rejectReasons ? state.rejectReasons : []
+  },
+  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

@@ -8,7 +8,9 @@ import UtilState from './UtilState'
 const utilModule: Module<UtilState, RootState> = {
   namespaced: true,
   state: {
-    rejectReasons: []
+    rejectReasons: [],
+    paymentMethodTypeDesc: {},
+    statusDesc: {}
   },
   getters,
   actions,

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

@@ -1,2 +1,4 @@
 export const SN_UTIL = 'util'
-export const UTIL_REJECT_REASONS_UPDATED = SN_UTIL + '/REJECT_REASONS_UPDATED'
+export const UTIL_REJECT_REASONS_UPDATED = SN_UTIL + '/REJECT_REASONS_UPDATED'
+export const UTIL_STATUS_UPDATED = SN_UTIL + '/STATUS_UPDATED'
+export const UTIL_PAYMENT_METHODS_UPDATED = SN_UTIL + '/PAYMENT_METHODS_UPDATED'

src/store/modules/util/mutations.ts

@@ -5,6 +5,12 @@ import * as types from './mutation-types'
 const mutations: MutationTree <UtilState> = {
   [types.UTIL_REJECT_REASONS_UPDATED] (state, payload) {
     state.rejectReasons = payload
+  },
+  [types.UTIL_STATUS_UPDATED] (state, payload) {
+    state.statusDesc = payload
+  },
+  [types.UTIL_PAYMENT_METHODS_UPDATED] (state, payload) {
+    state.paymentMethodTypeDesc = payload
   }
 }
 export default mutations;

src/views/OrderDetail.vue

@@ -5,7 +5,7 @@
         <ion-back-button default-href="/" slot="start" />
         <ion-title>{{ translate("Order details") }}</ion-title>
         <ion-buttons slot="end">
-          <ion-button :disabled="!order?.orderId || order?.rejected" @click="openOrderItemRejHistoryModal()">
+          <ion-button :disabled="!order?.orderId" @click="openOrderItemRejHistoryModal()">
             <ion-icon slot="icon-only" :icon="timeOutline" />
           </ion-button>
           <ion-button v-if="orderType === 'open'" class="ion-hide-md-up" :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order?.readyToHandover || order?.rejected" @click="rejectOrder()">
@@ -30,11 +30,19 @@
             <ion-icon :icon="checkmarkCircleOutline" color="success" slot="start" />
             <ion-label class="ion-text-wrap">{{ order.handovered ? translate("Order is successfully handed over to customer.") : translate("Order is successfully shipped.") }}</ion-label>
           </ion-item>
+          <ion-item lines="none">
+            <ion-label class="ion-text-wrap">
+              <h2>{{ order?.orderName ? order?.orderName : order?.orderId }}</h2>
+            </ion-label>
+            <ion-chip outline v-if="order?.orderPaymentPreferences" slot="end">
+              <ion-icon :icon="cashOutline"/>
+              <ion-label>{{ getPaymentMethodDesc(order?.orderPaymentPreferences[0]?.paymentMethodTypeId)}} : {{ getStatusDesc(order?.orderPaymentPreferences[0]?.statusId) }}</ion-label>
+            </ion-chip>
+          </ion-item>
           <ion-list>
             <ion-item lines="none">
               <ion-label class="ion-text-wrap">
                 <h2>{{ order?.customer?.name }}</h2>
-                <p>{{ order?.orderName ? order?.orderName : order?.orderId }}</p>
               </ion-label>
               <ion-badge v-if="order?.placedDate" slot="end">{{ timeFromNow(order.placedDate) }}</ion-badge>
             </ion-item>
@@ -81,11 +89,12 @@
             <ProductListItem :item="item" />
             <!-- Checking for true as a string as the settingValue contains a string and not boolean-->
             <div v-if="partialOrderRejectionConfig?.settingValue == 'true' && orderType === 'open'" class="border-top">
-              <ion-button fill="clear" @click="openReportAnIssueModal(item)">
+              <ion-button :disabled="order?.readyToHandover || order?.rejected" fill="clear" @click="openReportAnIssueModal(item)">
                 {{ translate("Report an issue") }}
               </ion-button>
             </div>
           </ion-card>
+          <p v-if="!order.part?.items?.length" class="empty-state">{{ translate('No items found') }}</p>
         </section>
       </main>
 
@@ -111,6 +120,7 @@ import {
   IonButton,
   IonButtons,
   IonCard,
+  IonChip,
   IonContent,
   IonHeader,
   IonIcon,
@@ -128,6 +138,7 @@ import { defineComponent } from "vue";
 import { mapGetters, useStore } from "vuex";
 import {
   accessibilityOutline,
+  cashOutline,
   copyOutline,
   closeCircleOutline,
   checkmarkCircleOutline,
@@ -160,6 +171,7 @@ export default defineComponent({
     IonButton,
     IonButtons,
     IonCard,
+    IonChip,
     IonContent,
     IonHeader,
     IonIcon,
@@ -184,7 +196,9 @@ export default defineComponent({
       order: "order/getCurrent",
       currentFacility: 'user/getCurrentFacility',
       configurePicker: "user/configurePicker",
-      partialOrderRejectionConfig: 'user/getPartialOrderRejectionConfig'
+      partialOrderRejectionConfig: 'user/getPartialOrderRejectionConfig',
+      getPaymentMethodDesc: 'util/getPaymentMethodDesc',
+      getStatusDesc: 'util/getStatusDesc'
     })
   },
   methods: {
@@ -223,6 +237,7 @@ export default defineComponent({
         orderPartSeqId
       }
       await this.store.dispatch("order/getOrderDetail", { payload, orderType })
+      await this.store.dispatch("order/fetchPaymentDetail")
     },
     async rejectOrder() {
       const rejectOrderModal = await modalController.create({
@@ -324,6 +339,7 @@ export default defineComponent({
       accessibilityOutline,
       bagHandleOutline,
       bagRemoveOutline,
+      cashOutline,
       copyOutline,
       copyToClipboard,
       closeCircleOutline,