Merge pull request #94 from ymaheshwari1/#92

Implemented: support to change the routing status from the details page, display the history for the current routing and archive a routing(#92)

src/store/modules/orderRouting/OrderRoutingState.ts

@@ -3,4 +3,5 @@ export default interface OrderRoutingState {
   rules: any;
   currentGroup: any;
   currentRoute: any;
+  routingHistory: any;
 }

src/store/modules/orderRouting/actions.ts

@@ -162,6 +162,44 @@ const actions: ActionTree<OrderRoutingState, RootState> = {
     commit(types.ORDER_ROUTING_CURRENT_ROUTE_UPDATED, payload)
   },
 
+  async fetchRoutingHistory({ commit, state }, routingGroupId) {
+    const history = Object.values(state.routingHistory)[0] as any
+
+    // If the routing history for the current group is already available then don't fetch the history again
+    if(history?.length && history[0].routingGroupId === routingGroupId) {
+      return;
+    }
+
+    let routingHistory = {}
+
+    try {
+      const resp = await OrderRoutingService.fetchRoutingHistory(routingGroupId)
+
+      if(!hasError(resp)) {
+        // Sorting the history based on startTime, as we does not get the records in sorted order from api
+        const sortedRoutingHistory = resp.data.sort((a: any, b: any) => b.startDate - a.startDate)
+
+        routingHistory = sortedRoutingHistory.reduce((routings: any, routing: any) => {
+          if(routings[routing.orderRoutingId]) {
+            routings[routing.orderRoutingId].push(routing)
+          } else {
+            routings = {
+              ...routings,
+              [routing.orderRoutingId]: [routing]
+            }
+          }
+          return routings
+        }, {})
+      } else {
+        throw resp.data;
+      }
+    } catch(err) {
+      logger.error(err)
+    }
+
+    commit(types.ORDER_ROUTING_HISTORY_UPDATED, routingHistory)
+  },
+
   async deleteRoutingFilters({ dispatch }, payload) {
     let hasAllFiltersDeletedSuccessfully = true;
     try {

src/store/modules/orderRouting/getters.ts

@@ -14,6 +14,9 @@ const getters: GetterTree<OrderRoutingState, RootState> = {
   },
   getCurrentOrderRouting(state) {
     return JSON.parse(JSON.stringify(state.currentRoute))
+  },
+  getRoutingHistory(state) {
+    return JSON.parse(JSON.stringify(state.routingHistory))
   }
 }
 

src/store/modules/orderRouting/index.ts

@@ -11,7 +11,8 @@ const orderRoutingModule: Module<OrderRoutingState, RootState> = {
     groups: [],
     rules: {},
     currentGroup: {},
-    currentRoute: {}
+    currentRoute: {},
+    routingHistory: {}
   },
   getters,
   actions,

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

@@ -3,4 +3,5 @@ export const ORDER_ROUTING_GROUPS_UPDATED = SN_ORDER_ROUTING + "/GROUPS_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"
+export const ORDER_ROUTING_HISTORY_UPDATED = SN_ORDER_ROUTING + "/ROUTING_HISTORY_UPDATED"
 export const ORDER_ROUTING_CLEARED = SN_ORDER_ROUTING + "/CLEARED"

src/store/modules/orderRouting/mutations.ts

@@ -15,11 +15,15 @@ const mutations: MutationTree<OrderRoutingState> = {
   [types.ORDER_ROUTING_CURRENT_ROUTE_UPDATED](state, payload) {
     state.currentRoute = payload
   },
+  [types.ORDER_ROUTING_HISTORY_UPDATED](state, payload) {
+    state.routingHistory = payload
+  },
   [types.ORDER_ROUTING_CLEARED](state) {
     state.groups = []
     state.rules = {}
     state.currentGroup = {}
     state.currentRoute = {}
+    state.routingHistory = {}
   },
 }
 export default mutations;

src/utils/index.ts

@@ -41,4 +41,9 @@ function getDateAndTime(time: any) {
   return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "-";
 }
 
-export { getDate, getDateAndTime, getTime, getTimeFromSeconds, showToast, hasError, sortSequence }
+function getDateAndTimeShort(time: any) {
+  // format: hh:mm(localized 24-hour time) date/month
+  return time ? DateTime.fromMillis(time).toFormat("T dd/LL") : "-";
+}
+
+export { getDate, getDateAndTime, getDateAndTimeShort, getTime, getTimeFromSeconds, showToast, hasError, sortSequence }

src/views/BrokeringQuery.vue

@@ -11,6 +11,26 @@
             </ion-chip>
           </ion-item>
           <ion-button class="ion-margin" expand="block" :disabled="!hasUnsavedChanges" @click="saveChanges">{{ translate("Save changes") }}</ion-button>
+          <ion-item>
+            <ion-icon slot="start" :icon="pulseOutline" />
+            <ion-select :label="translate('Status')" interface="popover" :value="routingStatus" @ionChange="updateOrderRouting($event.detail.value)">
+              <ion-select-option value="ROUTING_DRAFT">{{ translate("Draft") }}</ion-select-option>
+              <ion-select-option value="ROUTING_ACTIVE">{{ translate("Active") }}</ion-select-option>
+            </ion-select>
+          </ion-item>
+          <ion-item lines="full">
+            <ion-icon :icon="timeOutline" slot="start" />
+            <ion-label>{{ translate("Last run") }}</ion-label>
+            <ion-chip outline @click.stop="openRoutingHistoryModal()">
+              <ion-label>{{ routingHistory[currentRouting.orderRoutingId] ? getDateAndTimeShort(routingHistory[currentRouting.orderRoutingId][0].startDate) : "-" }}</ion-label>
+            </ion-chip>
+          </ion-item>
+          <ion-item lines="full">
+            <ion-icon :icon="archiveOutline" slot="start" />
+            <ion-toggle color="danger" :checked="currentRouting.statusId === 'ROUTING_ARCHIVED'" @ionChange="toggleRoutingStatus($event)">
+              {{ translate("Archive") }}
+            </ion-toggle>
+          </ion-item>
           <ion-item-group>
             <ion-item-divider color="light">
               <ion-label>{{ translate("Filters") }}</ion-label>
@@ -225,19 +245,20 @@
 
 <script setup lang="ts">
 import { IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonIcon, IonInput, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonToggle, alertController, modalController, onIonViewWillEnter, popoverController } from "@ionic/vue";
-import { addCircleOutline, bookmarkOutline, chevronUpOutline, filterOutline, golfOutline, optionsOutline, playForwardOutline, swapVerticalOutline } from "ionicons/icons"
+import { addCircleOutline, archiveOutline, bookmarkOutline, chevronUpOutline, filterOutline, golfOutline, optionsOutline, playForwardOutline, pulseOutline, swapVerticalOutline, timeOutline } from "ionicons/icons"
 import { onBeforeRouteLeave, useRouter } from "vue-router";
 import { computed, defineProps, ref } from "vue";
 import store from "@/store";
 import AddInventoryFilterOptionsModal from "@/components/AddInventoryFilterOptionsModal.vue";
-import { sortSequence } from "@/utils";
+import { getDateAndTimeShort, sortSequence } from "@/utils";
 import { Rule } from "@/types";
 import AddOrderRouteFilterOptions from "@/components/AddOrderRouteFilterOptions.vue"
 import PromiseFilterPopover from "@/components/PromiseFilterPopover.vue"
 import logger from "@/logger";
 import { DateTime } from "luxon";
 import emitter from "@/event-bus";
 import { translate } from "@/i18n";
+import RoutingHistoryModal from "@/components/RoutingHistoryModal.vue"
 
 const router = useRouter();
 const props = defineProps({
@@ -258,6 +279,7 @@ const facilities = computed(() => store.getters["util/getFacilities"])
 const enums = computed(() => store.getters["util/getEnums"])
 const shippingMethods = computed(() => store.getters["util/getShippingMethods"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
+const routingHistory = computed(() => store.getters["orderRouting/getRoutingHistory"])
 
 let ruleActionType = ref("")
 let selectedRoutingRule = ref({}) as any
@@ -270,10 +292,12 @@ let inventoryRuleActions = ref({}) as any
 let rulesInformation = ref({}) as any
 let hasUnsavedChanges = ref(false)
 let isRuleNameUpdating = ref(false)
+let routingStatus = ref("")
 
 onIonViewWillEnter(async () => {
   emitter.emit("presentLoader", { message: "Fetching filters and inventory rules", backdropDismiss: false })
   await Promise.all([store.dispatch("orderRouting/fetchCurrentOrderRouting", props.orderRoutingId), store.dispatch("util/fetchFacilities"), store.dispatch("util/fetchEnums", { enumTypeId: "ORDER_SALES_CHANNEL" }), store.dispatch("util/fetchShippingMethods"), store.dispatch("util/fetchFacilityGroups")])
+  store.dispatch("orderRouting/fetchRoutingHistory", router.currentRoute.value.params.routingGroupId)
 
   // Fetching the group information again if the group stored in the state and the groupId in the route params are not same. This case occurs when we are on the route details page of a group and then directly hit the route details for a different group.
   if(currentRoutingGroup.value.routingGroupId !== router.currentRoute.value.params.routingGroupId) {
@@ -289,6 +313,8 @@ onIonViewWillEnter(async () => {
     inventoryRules.value = sortSequence(JSON.parse(JSON.stringify(currentRouting.value["rules"])))
     await fetchRuleInformation(inventoryRules.value[0].routingRuleId);
   }
+
+  routingStatus.value = currentRouting.value.statusId
   emitter.emit("dismissLoader")
 })
 
@@ -437,6 +463,15 @@ async function addOrderRouteFilterOptions(parentEnumId: string, conditionTypeEnu
   await orderRouteFilterOptions.present();
 }
 
+async function openRoutingHistoryModal() {
+  const routingHistoryModal = await modalController.create({
+    component: RoutingHistoryModal,
+    componentProps: { routingHistory: routingHistory.value[currentRouting.value.orderRoutingId], routingName: currentRouting.value.routingName, groupName: currentRoutingGroup.value.groupName }
+  })
+
+  routingHistoryModal.present();
+}
+
 async function addInventoryRule() {
   const newRuleAlert = await alertController.create({
     header: translate("New Inventory Rule"),
@@ -486,6 +521,21 @@ function updateRule() {
   hasUnsavedChanges.value = true
 }
 
+function updateOrderRouting(value: string) {
+  routingStatus.value = value
+  hasUnsavedChanges.value = true
+}
+
+function toggleRoutingStatus(event: CustomEvent) {
+  if(event.detail.checked) {
+    routingStatus.value = "ROUTING_ARCHIVED"
+  } else {
+    routingStatus.value = "ROUTING_DRAFT"
+  }
+
+  hasUnsavedChanges.value = true
+}
+
 function updateUnfillableActionType(value: string) {
   const actionType = ruleActionType.value
   ruleActionType.value = value
@@ -735,7 +785,7 @@ function doConditionSortReorder(event: CustomEvent) {
   updateRule()
 }
 
-function findRoutingsDiff(previousSeq: any, updatedSeq: any) {
+function findRulesDiff(previousSeq: any, updatedSeq: any) {
   const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
     if (updatedSeq[key].routingRuleId === previousSeq[key].routingRuleId && updatedSeq[key].statusId === previousSeq[key].statusId && updatedSeq[key].assignmentEnumId === previousSeq[key].assignmentEnumId && updatedSeq[key].ruleName === previousSeq[key].ruleName) return diff
     return {
@@ -848,7 +898,7 @@ function doReorder(event: CustomEvent) {
   // returns the updated sequence after reordering
   const updatedSeq = event.detail.complete(JSON.parse(JSON.stringify(inventoryRules.value)));
 
-  let diffSeq = findRoutingsDiff(previousSeq, updatedSeq)
+  let diffSeq = findRulesDiff(previousSeq, updatedSeq)
 
   const updatedSeqenceNum = previousSeq.map((rule: Rule) => rule.sequenceNum)
   Object.keys(diffSeq).map((key: any) => {
@@ -890,9 +940,14 @@ async function save() {
     routingGroupId: currentRouting.value.routingGroupId
   } as any
 
+  // Check if the status of currentRouting is changed, if yes then update the status for routing
+  if(currentRouting.value.statusId !== routingStatus.value) {
+    orderRouting["statusId"] = routingStatus.value
+  }
+
   // Find diff for inventory rules
   if(currentRouting.value["rules"]) {
-    let diffSeq = findRoutingsDiff(currentRouting.value["rules"], inventoryRules.value)
+    let diffSeq = findRulesDiff(currentRouting.value["rules"], inventoryRules.value)
   
     const updatedSeqenceNum = currentRouting.value["rules"].map((rule: Rule) => rule.sequenceNum)
     Object.keys(diffSeq).map((key: any) => {
@@ -935,7 +990,7 @@ async function save() {
     // }
   }
 
-  if(filtersToUpdate?.length || orderRouting["rules"]?.length) {
+  if(filtersToUpdate?.length || orderRouting["rules"]?.length || orderRouting.statusId) {
     orderRouting["orderFilters"] = filtersToUpdate
     const orderRoutingId = await store.dispatch("orderRouting/updateRouting", orderRouting)
 

src/views/BrokeringRoute.vue

@@ -37,7 +37,7 @@
                 </ion-item>
                 <ion-item lines="full">
                   <ion-icon :icon="timeOutline" slot="start" />
-                  <ion-label>{{ "Last run" }}</ion-label>
+                  <ion-label>{{ translate("Last run") }}</ion-label>
                   <ion-chip outline @click.stop="openRoutingHistoryModal(routing.orderRoutingId, routing.routingName)">
                     <ion-label>{{ routingHistory[routing.orderRoutingId] ? getDateAndTimeShort(routingHistory[routing.orderRoutingId][0].startDate) : "-" }}</ion-label>
                   </ion-chip>
@@ -152,7 +152,7 @@ import ArchivedRoutingModal from "@/components/ArchivedRoutingModal.vue"
 import { OrderRoutingService } from "@/services/RoutingService";
 import logger from "@/logger";
 import { DateTime } from "luxon";
-import { hasError, getDate, getDateAndTime, getTime, getTimeFromSeconds, showToast, sortSequence } from "@/utils";
+import { hasError, getDate, getDateAndTime, getDateAndTimeShort, getTime, getTimeFromSeconds, showToast, sortSequence } from "@/utils";
 import emitter from "@/event-bus";
 import { translate } from "@/i18n";
 import GroupHistoryModal from "@/components/GroupHistoryModal.vue"
@@ -176,17 +176,17 @@ let hasUnsavedChanges = ref(false)
 let job = ref({}) as any
 let orderRoutings = ref([]) as any
 let groupHistory = ref([]) as any
-let routingHistory = ref({}) as any
 
 const currentRoutingGroup: any = computed((): Group => store.getters["orderRouting/getCurrentRoutingGroup"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 const isOmsConnectionExist = computed(() => store.getters["util/isOmsConnectionExist"])
 const getStatusDesc = computed(() => (id: string) => store.getters["util/getStatusDesc"](id))
+const routingHistory = computed(() => store.getters["orderRouting/getRoutingHistory"])
 
 onIonViewWillEnter(async () => {
   await store.dispatch("orderRouting/fetchCurrentRoutingGroup", props.routingGroupId)
   await fetchGroupHistory()
-  fetchRoutingHistory()
+  store.dispatch("orderRouting/fetchRoutingHistory", props.routingGroupId)
   store.dispatch("util/fetchStatusInformation")
 
   job.value = currentRoutingGroup.value["schedule"] ? JSON.parse(JSON.stringify(currentRoutingGroup.value))["schedule"] : {}
@@ -279,39 +279,6 @@ async function fetchGroupHistory() {
   }
 }
 
-async function fetchRoutingHistory() {
-  routingHistory.value = {}
-
-  if(!currentRoutingGroup.value?.jobName) {
-    return;
-  }
-
-  try {
-    const resp = await OrderRoutingService.fetchRoutingHistory(props.routingGroupId)
-
-    if(!hasError(resp)) {
-      // Sorting the history based on startTime, as we does not get the records in sorted order from api
-      const sortedRoutingHistory = resp.data.sort((a: any, b: any) => b.startDate - a.startDate)
-
-      routingHistory.value = sortedRoutingHistory.reduce((routings: any, routing: any) => {
-        if(routings[routing.orderRoutingId]) {
-          routings[routing.orderRoutingId].push(routing)
-        } else {
-          routings = {
-            ...routings,
-            [routing.orderRoutingId]: [routing]
-          }
-        }
-        return routings
-      }, {})
-    } else {
-      throw resp.data;
-    }
-  } catch(err) {
-    logger.error(err)
-  }
-}
-
 async function saveSchedule() {
   // If this is the first time then we are fetching the omsConnection status, as if the value of isOmsConnectionExist value is a boolean it means we have previously fetched the connection status
   if(typeof isOmsConnectionExist.value !== "boolean") {
@@ -652,11 +619,6 @@ async function showGroupHistory() {
 
   groupHistoryModal.present();
 }
-
-function getDateAndTimeShort(time: any) {
-  // format: hh:mm(localized 24-hour time) date/month
-  return time ? DateTime.fromMillis(time).toFormat("T dd/LL") : "-";
-}
 </script>
 
 <style scoped>