Improved: inventory detail page to disply items count. (#256)

hotwax · Jan 11, 2024 · b188d14 · b188d14
1 parent ca1b4e0
commit b188d14
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/src/locales/en.json b/src/locales/en.json
@@ -91,6 +91,7 @@
   "No new file upload. Please try again": "No new file upload. Please try again",
   "No results found": "No results found",
   "No time zone found": "No time zone found",
+  "of": "of",
   "OMS": "OMS",
   "OMS instance": "OMS instance",
   "Only select": "Only select",
@@ -115,6 +116,7 @@
   "Review": "Review",
   "Review PO details": "Review PO details",
   "Review purchase order": "Review purchase order",
+  "Reviewing uploaded file": "Reviewing uploaded file",
   "Reset": "Reset",
   "Reset inventory": "Reset inventory",
   "Reset password": "Reset password",

diff --git a/src/views/InventoryReview.vue b/src/views/InventoryReview.vue
@@ -3,6 +3,9 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/inventory" />
+        <ion-title v-if="!stockItems.initial || stockItems.initial.length === 0">{{stockItems.parsed.length}} {{ $t('items') }}</ion-title>
+        <ion-title v-else>{{ stockItems.initial.length }} {{ $t('of') }} {{ stockItems.parsed.length }} {{ $t('items') }}</ion-title>
+
         <ion-buttons slot="end">
           <ion-button @click="revertAll">
             <ion-icon slot="icon-only" :icon="arrowUndoOutline" />
@@ -102,7 +105,7 @@ import { useRouter } from 'vue-router';
 import { showToast } from '@/utils';
 import { translate } from "@/i18n";
 import emitter from "@/event-bus";
-import { IonCard, IonCardContent, IonPage, IonHeader, IonToolbar, IonBackButton, IonContent, IonItem, IonThumbnail, IonLabel, IonChip, IonIcon, IonButton, IonButtons, popoverController, IonFab, IonFabButton, modalController, alertController, IonNote } from '@ionic/vue'
+import { IonCard, IonCardContent, IonPage, IonHeader, IonToolbar, IonBackButton, IonContent, IonItem, IonThumbnail, IonLabel, IonChip, IonIcon, IonButton, IonButtons, popoverController, IonFab, IonFabButton, modalController, alertController, IonNote, IonSpinner, IonTitle } from '@ionic/vue'
 import { businessOutline, calculatorOutline, chevronForwardOutline, ellipsisVerticalOutline, locationOutline, shirtOutline, checkboxOutline, cloudUploadOutline, arrowUndoOutline, warningOutline } from 'ionicons/icons'
 
 export default defineComponent({
@@ -125,7 +128,9 @@ export default defineComponent({
     IonButtons,
     IonFab,
     IonFabButton,
-    IonNote
+    IonNote,
+    IonSpinner,
+    IonTitle
   },
   computed: {
     ...mapGetters({
@@ -150,11 +155,11 @@ export default defineComponent({
   ionViewDidEnter(){
     this.store.dispatch('util/fetchFacilities');
   },
-  async mounted() {
+  ionViewWillEnter() {
     emitter.on('fileProcessing', this.fileProcessing);
     emitter.on('fileProcessed', this.fileProcessed);
   },
-  unmounted() {
+  ionViewWillLeave() {
     emitter.off('fileProcessing', this.fileProcessing);
     emitter.off('fileProcessed', this.fileProcessed);
   },
@@ -188,10 +193,10 @@ export default defineComponent({
   },
   
   methods: {
-    async fileProcessing() {
+    fileProcessing() {
       this.isProcessingFile = true;
     },
-    async fileProcessed() {
+    fileProcessed() {
       this.isProcessingFile = false;
     },
     getFacilityName(facilityId: any, externalFacilityId: any) {