Merge pull request #79 from ymaheshwari1/fix/router

Fixed: the routing from the query page to the route list page
hotwax · Feb 14, 2024 · 7e73f4a · 7e73f4a
2 parents 3586a4d + 0e272da
commit 7e73f4a
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 8 deletions.
diff --git a/src/views/BrokeringQuery.vue b/src/views/BrokeringQuery.vue
@@ -5,7 +5,7 @@
         <div class="menu">
           <ion-item lines="none">
             <ion-label>{{ currentRouting.routingName }}</ion-label>
-            <ion-chip slot="end" outline @click="router.push(`/tabs/brokering/${currentRouting.routingGroupId}/routes`)">
+            <ion-chip slot="end" outline @click="router.go(-1)">
               {{ getRouteIndex() }}
               <ion-icon :icon="chevronUpOutline" />
             </ion-chip>

diff --git a/src/views/BrokeringRoute.vue b/src/views/BrokeringRoute.vue
@@ -3,10 +3,7 @@
     <ion-header>
       <ion-toolbar>
         <ion-buttons slot="start">
-          <!-- Used ion-button, instead of ion-back-button as back-button navigates on the basis of history and thus stuck in the loop of navigation -->
-          <ion-button fill="clear" @click="router.push('/tabs/brokering')">
-            <ion-icon slot="icon-only" :icon="arrowBackOutline"/>
-          </ion-button>
+          <ion-back-button default-href="/tabs/brokering" />
         </ion-buttons>
         <ion-title>{{ currentRoutingGroup.groupName }}</ion-title>
       </ion-toolbar>
@@ -142,8 +139,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButtons, IonButton, IonCard, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonListHeader, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonTextarea, IonTitle, IonToolbar, alertController, modalController, onIonViewWillEnter } from "@ionic/vue";
-import { addCircleOutline, archiveOutline, arrowBackOutline, refreshOutline, reorderTwoOutline, saveOutline, timeOutline, timerOutline } from "ionicons/icons"
+import { IonBackButton, IonBadge, IonButtons, IonButton, IonCard, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonListHeader, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonTextarea, IonTitle, IonToolbar, alertController, modalController, onIonViewWillEnter } from "@ionic/vue";
+import { addCircleOutline, archiveOutline, refreshOutline, reorderTwoOutline, saveOutline, timeOutline, timerOutline } from "ionicons/icons"
 import { onBeforeRouteLeave, useRouter } from "vue-router";
 import { useStore } from "vuex";
 import { computed, defineProps, ref } from "vue";

diff --git a/src/views/Tabs.vue b/src/views/Tabs.vue
@@ -2,7 +2,7 @@
   <ion-page>
     <ion-tabs>
       <ion-router-outlet></ion-router-outlet>
-      <ion-tab-bar slot="bottom">
+      <ion-tab-bar slot="bottom" v-if="showFooter()">
         <ion-tab-button tab="brokering" href="/tabs/brokering">
           <ion-icon :icon="shuffleOutline" />
           <ion-label>{{ translate("Brokering") }}</ion-label>
@@ -21,6 +21,14 @@
 import { translate } from "@/i18n";
 import { IonIcon, IonLabel, IonPage, IonRouterOutlet, IonTabBar, IonTabButton, IonTabs } from "@ionic/vue";
 import { settingsOutline, shuffleOutline } from "ionicons/icons";
+import { useRouter } from "vue-router";
+
+const router = useRouter();
+
+function showFooter() {
+  if (['/tabs/settings', '/tabs/brokering'].includes(router.currentRoute.value.path)) return true
+  return false
+}
 </script>
 
 <style scoped>