Merge pull request #211 from ymaheshwari1/#124

Improved: UI for back feature from the query page(#124)
hotwax · May 10, 2024 · 98220c9 · 98220c9
2 parents 47c620b + 1023d63
commit 98220c9
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/src/locales/en.json b/src/locales/en.json
@@ -48,7 +48,7 @@
   "Failed to create brokering run": "Failed to create brokering run",
   "Failed to create inventory rule": "Failed to create inventory rule",
   "Failed to create order routing": "Failed to create order routing",
-  "Failed to fetch filter options": "Failed to fetch filter options",
+  "Failed to fetch filters options": "Failed to fetch filters options",
   "Failed to fetch sort options": "Failed to fetch sort options",
   "Failed to update group information": "Failed to update group information",
   "Failed to update group status": "Failed to update group status",
@@ -98,6 +98,7 @@
   "Order priority": "Order priority",
   "Order Rule Filters": "Order Rule Filters",
   "Order Rule Sort": "Order Rule Sort",
+  "Order routing information updated": "Order routing information updated",
   "Orders will be brokered based on order date if no sorting is specified.": "Orders will be brokered based on order date if no sorting is specified.",
   "operator": "operator",
   "Partial allocation cannot be disabled. Orders are filtered by item when filtering by promise date.": "Partial allocation cannot be disabled. Orders are filtered by item when filtering by promise date.",

diff --git a/src/views/BrokeringQuery.vue b/src/views/BrokeringQuery.vue
@@ -1,5 +1,13 @@
 <template>
   <ion-page>
+    <ion-header>
+      <ion-toolbar>
+        <ion-buttons slot="start">
+          <ion-back-button :default-href="`/tabs/brokering/${currentRoutingGroup.routingGroupId}/routes`" />
+        </ion-buttons>
+        <ion-title>{{ currentRouting.routingName }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
     <ion-content>
       <main>
         <section id="order-filters" class="menu">
@@ -9,9 +17,8 @@
               <!-- Added class as we can't change the background of ion-input with css property, and we need to change the background to show the user that now this value is editable -->
               <ion-input ref="routeNameRef" :class="isRouteNameUpdating ? 'name' : ''" v-show="isRouteNameUpdating" aria-label="route name" v-model="routeName"></ion-input>
             </ion-label>
-            <ion-chip slot="end" outline @click="router.go(-1)">
+            <ion-chip slot="end" outline>
               {{ getRouteIndex() }}
-              <ion-icon :icon="chevronUpOutline" />
             </ion-chip>
           </ion-item>
           <ion-button class="ion-margin-start" color="medium" fill="outline" size="small" @click="isRouteNameUpdating ? updateRouteName() : editRouteName()">
@@ -114,7 +121,7 @@
             </ion-list>
             <ion-button fill="outline" @click="addInventoryRule">
               {{ translate("Add inventory rule") }}
-              <ion-icon :icon="addCircleOutline"/>
+              <ion-icon :icon="addCircleOutline" slot="end"/>
             </ion-button>
           </section>
           <div v-if="selectedRoutingRule?.routingRuleId">
@@ -294,8 +301,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonIcon, IonInput, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonNote, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonToggle, alertController, modalController, onIonViewWillEnter, popoverController } from "@ionic/vue";
-import { addCircleOutline, bookmarkOutline, chevronUpOutline, closeCircleOutline, copyOutline, filterOutline, golfOutline, optionsOutline, pencilOutline, playForwardOutline, pulseOutline, saveOutline, swapVerticalOutline, timeOutline } from "ionicons/icons"
+import { IonBackButton, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonNote, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonTitle, IonToggle, IonToolbar, alertController, modalController, onIonViewWillEnter, popoverController } from "@ionic/vue";
+import { addCircleOutline, bookmarkOutline, closeCircleOutline, copyOutline, filterOutline, golfOutline, optionsOutline, pencilOutline, playForwardOutline, pulseOutline, saveOutline, swapVerticalOutline, timeOutline } from "ionicons/icons"
 import { onBeforeRouteLeave, useRouter } from "vue-router";
 import { computed, defineProps, nextTick, ref } from "vue";
 import store from "@/store";