From 5a2a269f6788b57255daf8c71902d809f8dce006 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yashmaheshwari551@gmail.com>
Date: Tue, 16 Jan 2024 11:59:16 +0530
Subject: [PATCH 1/2] Implemented: support to fetch the routings for
 routingGroup(#21)

---
 src/router/index.ts                           |  5 ++--
 src/services/RoutingService.ts                |  9 ++++++
 src/store/modules/orderRouting/actions.ts     | 30 +++++++++++++++++++
 src/store/modules/orderRouting/getters.ts     |  3 ++
 src/store/modules/orderRouting/index.ts       |  2 +-
 .../modules/orderRouting/mutation-types.ts    |  2 +-
 src/store/modules/orderRouting/mutations.ts   |  2 +-
 src/views/BrokeringRoute.vue                  | 27 +++++++++++++----
 src/views/BrokeringRuns.vue                   |  7 ++++-
 9 files changed, 75 insertions(+), 12 deletions(-)

diff --git a/src/router/index.ts b/src/router/index.ts
index a24a30e..163ee06 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -38,8 +38,9 @@ const routes: Array<RouteRecordRaw> = [
         component: () => import("@/views/BrokeringRuns.vue")
       },
       {
-        path: "brokering/route",
-        component: () => import("@/views/BrokeringRoute.vue")
+        path: "brokering/:routingGroupId/routes",
+        component: () => import("@/views/BrokeringRoute.vue"),
+        props: true
       },
       {
         path: "brokering/query",
diff --git a/src/services/RoutingService.ts b/src/services/RoutingService.ts
index 1ee5ad8..f7d2acf 100644
--- a/src/services/RoutingService.ts
+++ b/src/services/RoutingService.ts
@@ -16,7 +16,16 @@ const createRoutingGroup = async (payload: any): Promise<any> => {
   })
 }
 
+const fetchOrderRoutings = async (payload: any): Promise<any> => {
+  return api({
+    url: `groups/${payload.routingGroupId}/routings`,
+    method: "GET",
+    query: payload
+  });
+}
+
 export const OrderRoutingService = {
   createRoutingGroup,
+  fetchOrderRoutings,
   fetchRoutingGroups
 }
\ No newline at end of file
diff --git a/src/store/modules/orderRouting/actions.ts b/src/store/modules/orderRouting/actions.ts
index bf65483..f21c163 100644
--- a/src/store/modules/orderRouting/actions.ts
+++ b/src/store/modules/orderRouting/actions.ts
@@ -47,6 +47,36 @@ const actions: ActionTree<OrderRoutingState, RootState> = {
       showToast("Failed to create brokering run")
       logger.error('err', err)
     }
+  },
+
+  async setCurrentRoutingGroupId({ commit }, payload) {
+    commit(types.ORDER_ROUTING_CURRENT_GROUP_UPDATED, payload)
+  },
+
+  async fetchOrderRoutings({ commit }, routingGroupId) {
+    let orderRoutings = [] as any;
+    // filter groups on the basis of productStoreId
+    const payload = {
+      routingGroupId
+    }
+
+    try {
+      const resp = await OrderRoutingService.fetchOrderRoutings(payload);
+
+      if(!hasError(resp) && resp.data.length) {
+        orderRoutings = resp.data
+      } else {
+        throw resp.data
+      }
+    } catch(err) {
+      logger.error(err);
+    }
+
+    if(orderRoutings.length) {
+      orderRoutings = sortSequence(orderRoutings)
+    }
+
+    commit(types.ORDER_ROUTINGS_UPDATED, orderRoutings)
   }
 }
 
diff --git a/src/store/modules/orderRouting/getters.ts b/src/store/modules/orderRouting/getters.ts
index d4f946d..7271f81 100644
--- a/src/store/modules/orderRouting/getters.ts
+++ b/src/store/modules/orderRouting/getters.ts
@@ -5,6 +5,9 @@ import RootState from "@/store/RootState"
 const getters: GetterTree<OrderRoutingState, RootState> = {
   getRoutingGroups(state) {
     return state.groups
+  },
+  getOrderRoutings(state) {
+    return state.routes
   }
 }
 
diff --git a/src/store/modules/orderRouting/index.ts b/src/store/modules/orderRouting/index.ts
index 09fa840..275bf06 100644
--- a/src/store/modules/orderRouting/index.ts
+++ b/src/store/modules/orderRouting/index.ts
@@ -11,7 +11,7 @@ const orderRoutingModule: Module<OrderRoutingState, RootState> = {
     groups: [],
     routes: [],
     rule: [],
-    currentGroupId: '',
+    currentGroupId: '', // choosing only to save id and not whole object, as when updating the state we don't need to care updating the state on two different places
     currentRouteId: ''
   },
   getters,
diff --git a/src/store/modules/orderRouting/mutation-types.ts b/src/store/modules/orderRouting/mutation-types.ts
index 7f9cb71..4515191 100644
--- a/src/store/modules/orderRouting/mutation-types.ts
+++ b/src/store/modules/orderRouting/mutation-types.ts
@@ -1,6 +1,6 @@
 export const SN_ORDER_ROUTING = "orderRouting"
 export const ORDER_ROUTING_GROUPS_UPDATED = SN_ORDER_ROUTING + "/GROUPS_UPDATED"
-export const ORDER_ROUTING_ROUTES_UPDATED = SN_ORDER_ROUTING + "/ROUTES_UPDATED"
+export const ORDER_ROUTINGS_UPDATED = SN_ORDER_ROUTING + "/ROUTES_UPDATED"
 export const ORDER_ROUTING_RULE_UPDATED = SN_ORDER_ROUTING + "/RULE_UPDATED"
 export const ORDER_ROUTING_CURRENT_GROUP_UPDATED = SN_ORDER_ROUTING + "/CURRENT_GROUP_UPDATED"
 export const ORDER_ROUTING_CURRENT_ROUTE_UPDATED = SN_ORDER_ROUTING + "/CURRENT_ROUTE_UPDATED"
\ No newline at end of file
diff --git a/src/store/modules/orderRouting/mutations.ts b/src/store/modules/orderRouting/mutations.ts
index 4604a31..1667a59 100644
--- a/src/store/modules/orderRouting/mutations.ts
+++ b/src/store/modules/orderRouting/mutations.ts
@@ -6,7 +6,7 @@ const mutations: MutationTree<OrderRoutingState> = {
   [types.ORDER_ROUTING_GROUPS_UPDATED](state, payload) {
     state.groups = payload
   },
-  [types.ORDER_ROUTING_ROUTES_UPDATED](state, payload) {
+  [types.ORDER_ROUTINGS_UPDATED](state, payload) {
     state.routes = payload
   },
   [types.ORDER_ROUTING_RULE_UPDATED](state, payload) {
diff --git a/src/views/BrokeringRoute.vue b/src/views/BrokeringRoute.vue
index aa16573..dab2eea 100644
--- a/src/views/BrokeringRoute.vue
+++ b/src/views/BrokeringRoute.vue
@@ -18,15 +18,15 @@
               <ion-icon :icon="addCircleOutline" />
             </ion-button>
           </ion-list-header>
-          <ion-card v-for="card in [1, 2, 3, 4]" ref="cards" :key="card" @click="router.push('query')">
+          <ion-card v-for="routing in orderRoutings" :key="routing.orderRoutingId" @click="router.push('query')">
             <ion-item lines="full">
               <ion-label>
-                <h1>{{ "Order lookup name" }}</h1>
+                <h1>{{ routing.routingName }}</h1>
               </ion-label>
-              <ion-chip>{{ `${card}/4` }}</ion-chip>
+              <ion-chip>{{ `${routing.sequenceNum}/4` }}</ion-chip>
             </ion-item>
-            <ion-item ref="item">
-              <ion-badge>{{ "BADGE" }}</ion-badge>
+            <ion-item>
+              <ion-badge>{{ routing.statusId }}</ion-badge>
               <ion-button fill="clear" color="medium" slot="end">
                 {{ "Archive" }}
               </ion-button>
@@ -79,11 +79,26 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonBadge, IonButtons, IonButton, IonCard, IonCardHeader, IonCardTitle, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonListHeader, IonPage, IonTitle, IonToolbar } from "@ionic/vue";
+import { IonBackButton, IonBadge, IonButtons, IonButton, IonCard, IonCardHeader, IonCardTitle, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonListHeader, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from "@ionic/vue";
 import { addCircleOutline, timeOutline, timerOutline } from "ionicons/icons"
 import { useRouter } from "vue-router";
+import { useStore } from "vuex";
+import { computed, defineProps } from "vue";
 
 const router = useRouter();
+const store = useStore();
+const props = defineProps({
+  routingGroupId: {
+    type: String,
+    required: true
+  }
+})
+
+const orderRoutings = computed(() => store.getters["orderRouting/getOrderRoutings"])
+
+onIonViewWillEnter(async () => {
+  await store.dispatch('orderRouting/fetchOrderRoutings', props.routingGroupId)
+})
 </script>
 
 <style scoped>
diff --git a/src/views/BrokeringRuns.vue b/src/views/BrokeringRuns.vue
index 7b7ba0c..7fb39fc 100644
--- a/src/views/BrokeringRuns.vue
+++ b/src/views/BrokeringRuns.vue
@@ -16,7 +16,7 @@
     <ion-content>
       <main v-if="groups.length">
         <section>
-          <ion-card v-for="group in groups" :key="group.routingGroupId" @click="router.push('brokering/route')">
+          <ion-card v-for="group in groups" :key="group.routingGroupId" @click="redirect(group.routingGroupId)">
             <ion-card-header>
               <ion-card-title>
                 {{ group.groupName }}
@@ -84,6 +84,11 @@ async function addNewRun() {
   return newRunAlert.present();
 }
 
+async function redirect(routingGroupId: string) {
+  await store.dispatch('orderRouting/setCurrentRoutingGroupId', routingGroupId)
+  router.push(`brokering/${routingGroupId}/routes`)
+}
+
 </script>
 
 <style scoped>

From b0ce08f5418ffe15eb8b2e51e3149d99e049e444 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yashmaheshwari551@gmail.com>
Date: Tue, 16 Jan 2024 15:32:05 +0530
Subject: [PATCH 2/2] Improved: logic to display current selected group
 information(#21)

---
 src/store/modules/orderRouting/getters.ts |  5 +++++
 src/views/BrokeringRoute.vue              | 19 +++++++++++++------
 2 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/store/modules/orderRouting/getters.ts b/src/store/modules/orderRouting/getters.ts
index 7271f81..85a27fd 100644
--- a/src/store/modules/orderRouting/getters.ts
+++ b/src/store/modules/orderRouting/getters.ts
@@ -1,6 +1,7 @@
 import { GetterTree } from "vuex"
 import OrderRoutingState from "./OrderRoutingState"
 import RootState from "@/store/RootState"
+import { Group } from "@/types"
 
 const getters: GetterTree<OrderRoutingState, RootState> = {
   getRoutingGroups(state) {
@@ -8,6 +9,10 @@ const getters: GetterTree<OrderRoutingState, RootState> = {
   },
   getOrderRoutings(state) {
     return state.routes
+  },
+  getCurrentRoutingGroup(state) {
+    const currentRoutingGroup = state.groups?.find((group: Group) => group.routingGroupId === state.currentGroupId)
+    return currentRoutingGroup ? currentRoutingGroup : {}
   }
 }
 
diff --git a/src/views/BrokeringRoute.vue b/src/views/BrokeringRoute.vue
index dab2eea..0a9aeda 100644
--- a/src/views/BrokeringRoute.vue
+++ b/src/views/BrokeringRoute.vue
@@ -43,7 +43,7 @@
             </ion-item>
             <ion-item lines="none">
               <ion-label>
-                {{ "This is what a long description of the routing rule that the user has created looks like. This also includes an edit button where the user can edit their description inline" }}
+                {{ currentRoutingGroup.description ? currentRoutingGroup.description : "No description available" }}
               </ion-label>
             </ion-item>
           </main>
@@ -57,19 +57,19 @@
               <ion-item>
                 <ion-icon slot="start" :icon="timeOutline"/>
                 <ion-label>{{ "Run time" }}</ion-label>
-                <ion-label slot="end">{{ "3:00 PM EST" }}</ion-label>
+                <!-- <ion-label slot="end">{{ currentRoutingGroup.runTime || "-" }}</ion-label> -->
               </ion-item>
               <ion-item>
                 <ion-icon slot="start" :icon="timerOutline"/>
                 <ion-label>{{ "Schedule" }}</ion-label>
-                <ion-label slot="end">{{ "Every 5 minutes" }}</ion-label>
+                <!-- <ion-label slot="end">{{ currentRoutingGroup.frequency || "-" }}</ion-label> -->
               </ion-item>
             </ion-card>
             <ion-item>
-              {{ "Created at <time>" }}
+              {{ `Created at ${currentRoutingGroup.createdDate || "-"}` }}
             </ion-item>
             <ion-item>
-              {{ "Updated at <time>" }}
+              {{ `Updated at ${currentRoutingGroup.lastUpdatedStamp || "-"}` }}
             </ion-item>
           </aside>
         </section>
@@ -84,6 +84,7 @@ import { addCircleOutline, timeOutline, timerOutline } from "ionicons/icons"
 import { useRouter } from "vue-router";
 import { useStore } from "vuex";
 import { computed, defineProps } from "vue";
+import { Group } from "@/types";
 
 const router = useRouter();
 const store = useStore();
@@ -94,10 +95,16 @@ const props = defineProps({
   }
 })
 
+const currentRoutingGroup = computed((): Group => store.getters["orderRouting/getCurrentRoutingGroup"])
 const orderRoutings = computed(() => store.getters["orderRouting/getOrderRoutings"])
 
 onIonViewWillEnter(async () => {
-  await store.dispatch('orderRouting/fetchOrderRoutings', props.routingGroupId)
+  await store.dispatch("orderRouting/fetchOrderRoutings", props.routingGroupId)
+
+  // On refresh, the groups list is removed thus resulting is not fetching the current group information
+  if(!currentRoutingGroup.value.routingGroupId) {
+    await store.dispatch("orderRouting/fetchOrderRoutingGroups")
+  }
 })
 </script>