Implemented: support for fetching the rules for orderRouting(#24)

src/router/index.ts

@@ -43,8 +43,9 @@ const routes: Array<RouteRecordRaw> = [
         props: true
       },
       {
-        path: "brokering/query",
-        component: () => import("@/views/BrokeringQuery.vue")
+        path: "brokering/:routingGroupId/:orderRoutingId/rules",
+        component: () => import("@/views/BrokeringQuery.vue"),
+        props: true
       },
       {
         path: "settings",

src/services/RoutingService.ts

@@ -24,8 +24,17 @@ const fetchOrderRoutings = async (payload: any): Promise<any> => {
   });
 }
 
+const fetchRoutingRules = async (payload: any): Promise<any> => {
+  return api({
+    url: `routings/${payload.orderRoutingId}/rules`,
+    method: "GET",
+    query: payload
+  });
+}
+
 export const OrderRoutingService = {
   createRoutingGroup,
   fetchOrderRoutings,
-  fetchRoutingGroups
+  fetchRoutingGroups,
+  fetchRoutingRules
 }

src/store/modules/orderRouting/OrderRoutingState.ts

@@ -1,7 +1,7 @@
 export default interface OrderRoutingState {
   groups: Array<any>; // runs
   routes: Array<any>;
-  rule: Array<any>;
+  rules: Array<any>;
   currentGroupId: string;
   currentRouteId: string;
 }

src/store/modules/orderRouting/actions.ts

@@ -77,7 +77,37 @@ const actions: ActionTree<OrderRoutingState, RootState> = {
     }
 
     commit(types.ORDER_ROUTINGS_UPDATED, orderRoutings)
-  }
+  },
+
+  async fetchRoutingRules({ commit }, orderRoutingId) {
+    let routingRules = [] as any;
+    // filter groups on the basis of productStoreId
+    const payload = {
+      orderRoutingId
+    }
+
+    try {
+      const resp = await OrderRoutingService.fetchRoutingRules(payload);
+
+      if(!hasError(resp) && resp.data.length) {
+        routingRules = resp.data
+      } else {
+        throw resp.data
+      }
+    } catch(err) {
+      logger.error(err);
+    }
+
+    if(routingRules.length) {
+      routingRules = sortSequence(routingRules)
+    }
+
+    commit(types.ORDER_ROUTING_RULES_UPDATED, routingRules)
+  },
+
+  async setCurrentOrderRoutingId({ commit }, payload) {
+    commit(types.ORDER_ROUTING_CURRENT_ROUTE_UPDATED, payload)
+  },
 }
 
 export default actions;

src/store/modules/orderRouting/getters.ts

@@ -1,7 +1,7 @@
 import { GetterTree } from "vuex"
 import OrderRoutingState from "./OrderRoutingState"
 import RootState from "@/store/RootState"
-import { Group } from "@/types"
+import { Group, Route } from "@/types"
 
 const getters: GetterTree<OrderRoutingState, RootState> = {
   getRoutingGroups(state) {
@@ -10,9 +10,16 @@ const getters: GetterTree<OrderRoutingState, RootState> = {
   getOrderRoutings(state) {
     return state.routes
   },
+  getRoutingRules(state) {
+    return state.rules
+  },
   getCurrentRoutingGroup(state) {
     const currentRoutingGroup = state.groups?.find((group: Group) => group.routingGroupId === state.currentGroupId)
     return currentRoutingGroup ? currentRoutingGroup : {}
+  },
+  getCurrentOrderRouting(state) {
+    const orderRouting = state.routes?.find((route: Route) => route.orderRoutingId === state.currentRouteId)
+    return orderRouting ? orderRouting : {}
   }
 }
 

src/store/modules/orderRouting/index.ts

@@ -10,7 +10,7 @@ const orderRoutingModule: Module<OrderRoutingState, RootState> = {
   state: {
     groups: [],
     routes: [],
-    rule: [],
+    rules: [],
     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: ''
   },

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_ROUTINGS_UPDATED = SN_ORDER_ROUTING + "/ROUTES_UPDATED"
-export const ORDER_ROUTING_RULE_UPDATED = SN_ORDER_ROUTING + "/RULE_UPDATED"
+export const ORDER_ROUTING_RULES_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"

src/store/modules/orderRouting/mutations.ts

@@ -9,8 +9,8 @@ const mutations: MutationTree<OrderRoutingState> = {
   [types.ORDER_ROUTINGS_UPDATED](state, payload) {
     state.routes = payload
   },
-  [types.ORDER_ROUTING_RULE_UPDATED](state, payload) {
-    state.rule = payload
+  [types.ORDER_ROUTING_RULES_UPDATED](state, payload) {
+    state.rules = payload
   },
   [types.ORDER_ROUTING_CURRENT_GROUP_UPDATED](state, groupId) {
     state.currentGroupId = groupId

src/views/BrokeringQuery.vue

@@ -4,7 +4,7 @@
       <div>
         <div class="menu">
           <ion-item lines="none">
-            <ion-label>{{ "<order lookup name>" }}</ion-label>
+            <ion-label>{{ currentRouting.routeName }}</ion-label>
             <ion-chip slot="end" outline @click="router.push('route')">
               {{ "2/4" }}
               <ion-icon :icon="chevronUpOutline" />
@@ -67,16 +67,8 @@
         <div class="menu">
           <ion-list>
             <ion-reorder-group :disabled="false">
-              <ion-item>
-                <ion-label>{{ "Warehouse only" }}</ion-label>
-                <ion-reorder />
-              </ion-item>
-              <ion-item>
-                <ion-label>{{ "Warehouse and stores" }}</ion-label>
-                <ion-reorder />
-              </ion-item>
-              <ion-item>
-                <ion-label>{{ "Any Location" }}</ion-label>
+              <ion-item v-for="rule in routingRules" :key="rule.routingRuleId">
+                <ion-label>{{ rule.ruleName }}</ion-label>
                 <ion-reorder />
               </ion-item>
             </ion-reorder-group>
@@ -186,11 +178,31 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonChip, IonContent, IonIcon, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption } from "@ionic/vue";
+import { IonButton, IonCard, IonChip, IonContent, IonIcon, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, onIonViewWillEnter } from "@ionic/vue";
 import { checkmarkOutline, chevronUpOutline, filterOutline, optionsOutline, swapVerticalOutline } from "ionicons/icons"
 import { useRouter } from "vue-router";
+import { computed, defineProps } from "vue";
+import store from "@/store";
 
 const router = useRouter();
+const props = defineProps({
+  orderRoutingId: {
+    type: String,
+    required: true
+  },
+  routingGroupId: {
+    type: String,
+    requied: true
+  }
+})
+
+const currentRouting = computed(() => store.getters["orderRouting/getCurrentOrderRouting"])
+const routingRules = computed(() => store.getters["orderRouting/getRoutingRules"])
+
+onIonViewWillEnter(async () => {
+  await store.dispatch("orderRouting/fetchRoutingRules", props.orderRoutingId)
+})
+
 </script>
 
 <style scoped>

src/views/BrokeringRoute.vue

@@ -18,7 +18,7 @@
               <ion-icon :icon="addCircleOutline" />
             </ion-button>
           </ion-list-header>
-          <ion-card v-for="routing in orderRoutings" :key="routing.orderRoutingId" @click="router.push('query')">
+          <ion-card v-for="routing in orderRoutings" :key="routing.orderRoutingId" @click="redirect(routing.orderRoutingId)">
             <ion-item lines="full">
               <ion-label>
                 <h1>{{ routing.routingName }}</h1>
@@ -106,6 +106,11 @@ onIonViewWillEnter(async () => {
     await store.dispatch("orderRouting/fetchOrderRoutingGroups")
   }
 })
+
+async function redirect(orderRoutingId: string) {
+  await store.dispatch('orderRouting/setCurrentOrderRoutingId', orderRoutingId)
+  router.push(`${orderRoutingId}/rules`)
+}
 </script>
 
 <style scoped>