Implemented: support to display the run history for the current run(#64)

src/locales/en.json

@@ -51,6 +51,7 @@
   "greater": "greater",
   "greater than or equal to": "greater than or equal to",
   "High": "High",
+  "History": "History",
   "Inventory Filters": "Inventory Filters",
   "Inventory rule created successfully": "Inventory rule created successfully",
   "Inventory Sort": "Inventory Sort",

src/services/RoutingService.ts

@@ -22,6 +22,13 @@ const fetchRoutingScheduleInformation = async (routingGroupId: string): Promise<
   });
 }
 
+const fetchRoutingHistory = async (routingGroupId: string): Promise<any> => {
+  return api({
+    url: `groups/${routingGroupId}/routingRuns`,
+    method: "GET"
+  });
+}
+
 const createRoutingGroup = async (payload: any): Promise<any> => {
   return api({
     url: "groups",
@@ -133,6 +140,7 @@ export const OrderRoutingService = {
   fetchOrderRouting,
   fetchRoutingGroupInformation,
   fetchRoutingGroups,
+  fetchRoutingHistory,
   fetchRoutingScheduleInformation,
   fetchRule,
   runNow,

src/utils/index.ts

@@ -26,11 +26,19 @@ const sortSequence = (sequence: Array<Group | Route | Rule>) => {
 }
 
 const getTime = (time: any) => {
-  return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "-";
+  return time ? DateTime.fromMillis(time).toLocaleString(DateTime.TIME_24_WITH_SECONDS) : "-";
 }
 
 const getTimeFromSeconds = (time: any) => {
   return time ? DateTime.fromSeconds(time).toLocaleString(DateTime.DATETIME_MED) : "-";
 }
 
-export { getTime, getTimeFromSeconds, showToast, hasError, sortSequence }
+function getDate(runTime: any) {
+  return DateTime.fromMillis(runTime).toLocaleString(DateTime.DATE_MED);
+}
+
+function getDateAndTime(time: any) {
+  return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "-";
+}
+
+export { getDate, getDateAndTime, getTime, getTimeFromSeconds, showToast, hasError, sortSequence }

src/views/BrokeringRoute.vue

@@ -57,7 +57,7 @@
         <section class="ion-padding">
           <main>
             <ion-item lines="none">
-              {{ translate("Description") }}
+              <h2>{{ translate("Description") }}</h2>
               <ion-button fill="clear" slot="end" @click="isDescUpdating ? updateGroupDescription() : (isDescUpdating = !isDescUpdating)">
                 {{ translate(isDescUpdating ? "Save" : "Edit") }}
               </ion-button>
@@ -66,6 +66,16 @@
               <ion-textarea v-if="isDescUpdating" aria-label="description" v-model="description"></ion-textarea>
               <ion-label v-else>{{ description }}</ion-label>
             </ion-item>
+            <ion-item lines="none">
+              <h2>{{ translate("History") }}</h2>
+            </ion-item>
+            <ion-item v-for="routing in routingHistory" :key="routing.routingGroupId">
+              <ion-label>
+                <h3>{{ getTime(routing.startDate) }}</h3>
+                <p>{{ getDate(routing.startDate) }}</p>
+              </ion-label>
+              <ion-badge color="dark">{{ getTime(routing.endDate - routing.startDate) }}</ion-badge>
+            </ion-item>
           </main>
           <aside>
             <ion-card>
@@ -104,10 +114,10 @@
               </div>
             </div>
             <ion-item>
-              {{ `Created at ${getTime(currentRoutingGroup.createdDate)}` }}
+              {{ `Created at ${getDateAndTime(currentRoutingGroup.createdDate)}` }}
             </ion-item>
             <ion-item>
-              {{ `Updated at ${getTime(currentRoutingGroup.lastUpdatedStamp)}` }}
+              {{ `Updated at ${getDateAndTime(currentRoutingGroup.lastUpdatedStamp)}` }}
             </ion-item>
           </aside>
         </section>
@@ -132,7 +142,7 @@ import ArchivedRoutingModal from "@/components/ArchivedRoutingModal.vue"
 import { OrderRoutingService } from "@/services/RoutingService";
 import logger from "@/logger";
 import { DateTime } from "luxon";
-import { hasError, getTime, getTimeFromSeconds, showToast, sortSequence } from "@/utils";
+import { hasError, getDate, getDateAndTime, getTime, getTimeFromSeconds, showToast, sortSequence } from "@/utils";
 import emitter from "@/event-bus";
 import { translate } from "@/i18n";
 
@@ -153,14 +163,15 @@ let hasUnsavedChanges = ref(false)
 
 let job = ref({}) as any
 let orderRoutings = 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))
 
 onIonViewWillEnter(async () => {
-  await store.dispatch("orderRouting/fetchCurrentRoutingGroup", props.routingGroupId)
+  await Promise.all([store.dispatch("orderRouting/fetchCurrentRoutingGroup", props.routingGroupId), fetchRoutingHistory()])
   store.dispatch("util/fetchStatusInformation")
 
   job.value = currentRoutingGroup.value["schedule"] ? JSON.parse(JSON.stringify(currentRoutingGroup.value))["schedule"] : {}
@@ -232,6 +243,21 @@ async function saveChanges() {
   return alert.present();
 }
 
+async function fetchRoutingHistory() {
+  routingHistory.value = []
+  try {
+    const resp = await OrderRoutingService.fetchRoutingHistory(props.routingGroupId)
+
+    if(!hasError(resp)) {
+      routingHistory.value = resp.data
+    } 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") {

src/views/BrokeringRuns.vue

@@ -36,10 +36,10 @@
               <ion-label slot="end">{{ group.runTime ? group.runTime : "-" }}</ion-label>
             </ion-item>
             <ion-item>
-              {{ getTime(group.createdDate) }}
+              {{ getDateAndTime(group.createdDate) }}
             </ion-item>
             <ion-item lines="none">
-              {{ getTime(group.lastUpdatedStamp) }}
+              {{ getDateAndTime(group.lastUpdatedStamp) }}
             </ion-item>
           </ion-card>
         </section>
@@ -54,7 +54,7 @@
 <script setup lang="ts">
 import { translate } from "@/i18n";
 import { Group } from "@/types";
-import { getTime, showToast } from "@/utils";
+import { getDateAndTime, showToast } from "@/utils";
 import { IonButton, IonButtons, IonCard, IonCardHeader, IonCardTitle, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonPage, IonSpinner, IonTitle, IonToolbar, alertController, onIonViewWillEnter } from "@ionic/vue";
 import { addOutline } from "ionicons/icons"
 import { computed, ref } from "vue";