From 4df3d0c59acc8afc918a88454e6de0679ccde142 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Tue, 1 Nov 2022 15:28:31 +0530
Subject: [PATCH 01/24] Implemented logic for storing and applying multiple
 field mappings(#2hran7u)

---
 src/components/Menu.vue                  |  2 +-
 src/locales/en.json                      |  3 +
 src/store/modules/user/UserState.ts      |  1 +
 src/store/modules/user/actions.ts        |  4 ++
 src/store/modules/user/getters.ts        |  3 +
 src/store/modules/user/index.ts          |  1 +
 src/store/modules/user/mutation-types.ts |  3 +-
 src/store/modules/user/mutations.ts      |  8 +++
 src/views/PurchaseOrder.vue              | 88 ++++++++++++++++--------
 9 files changed, 84 insertions(+), 29 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 44032890..bc44efb5 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -30,7 +30,7 @@
               <ion-label class="ion-text-wrap">
                 <p class="overline">{{ instanceUrl }}</p>
               </ion-label>
-              <ion-note slot="end">{{ userProfile.userTimeZone }}</ion-note>
+              <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
             </ion-item>
           </ion-toolbar>
         </ion-footer>
diff --git a/src/locales/en.json b/src/locales/en.json
index 2dc73919..b9162acf 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -23,6 +23,7 @@
   "Leave page": "Leave page",
   "Login": "Login",
   "Logout": "Logout",
+  "Mapping name": "Mapping name",
   "Missing SKUs": "Missing SKUs",
   "No time zone found": "No time zone found",
   "OMS": "OMS",
@@ -40,9 +41,11 @@
   "Review": "Review",
   "Reset": "Reset",
   "Safety stock": "Safety stock",
+  "Save mapping": "Save mapping",
   "Search products": "Search products",
   "Search time zones": "Search time zones",
   "Select": "Select",
+  "Select mapping": "Select mapping",
   "Select time zone": "Select time zone",
   "Select the column index for the following information in the uploaded CSV.": "Select the column index for the following information in the uploaded CSV.",
   "Something went wrong": "Something went wrong",
diff --git a/src/store/modules/user/UserState.ts b/src/store/modules/user/UserState.ts
index df4c21e2..d802583c 100644
--- a/src/store/modules/user/UserState.ts
+++ b/src/store/modules/user/UserState.ts
@@ -3,4 +3,5 @@ export default interface UserState {
     current: object | null;
     currentFacility: object;
     instanceUrl: string;
+    fieldMappings: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 3cd1a7ff..9e926a13 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -112,6 +112,10 @@ const actions: ActionTree<UserState, RootState> = {
    */
   setUserInstanceUrl ({ state, commit }, payload){
     commit(types.USER_INSTANCE_URL_UPDATED, payload)
+  },
+
+  updateFieldMappings({ commit }, payload){
+    commit(types.USER_FIELD_MAPPINGS_UPDATED, payload);
   }
 }
 
diff --git a/src/store/modules/user/getters.ts b/src/store/modules/user/getters.ts
index e0fc2496..c943e755 100644
--- a/src/store/modules/user/getters.ts
+++ b/src/store/modules/user/getters.ts
@@ -21,6 +21,9 @@ const getters: GetterTree <UserState, RootState> = {
     getInstanceUrl (state) {
         const baseUrl = process.env.VUE_APP_BASE_URL;
         return baseUrl ? baseUrl : state.instanceUrl;
+    },
+    getFieldMappings(state) {
+        return state.fieldMappings;
     }
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index 6c3ee09d..bf548d20 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -12,6 +12,7 @@ const userModule: Module<UserState, RootState> = {
       current: null,
       currentFacility: {},
       instanceUrl: '',
+      fieldMappings: []
     },
     getters,
     actions,
diff --git a/src/store/modules/user/mutation-types.ts b/src/store/modules/user/mutation-types.ts
index 9d9067dc..3b791dc7 100644
--- a/src/store/modules/user/mutation-types.ts
+++ b/src/store/modules/user/mutation-types.ts
@@ -3,4 +3,5 @@ export const USER_TOKEN_CHANGED = SN_USER + '/TOKEN_CHANGED'
 export const USER_END_SESSION = SN_USER + '/END_SESSION'
 export const USER_INFO_UPDATED = SN_USER + '/INFO_UPDATED'
 export const USER_CURRENT_FACILITY_UPDATED = SN_USER + '/CURRENT_FACILITY_UPDATED'
-export const USER_INSTANCE_URL_UPDATED = SN_USER + '/INSTANCE_URL_UPDATED'
\ No newline at end of file
+export const USER_INSTANCE_URL_UPDATED = SN_USER + '/INSTANCE_URL_UPDATED'
+export const USER_FIELD_MAPPINGS_UPDATED = SN_USER + '/FIELD_MAPPINGS_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index bd3239cc..d2ae04ef 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -19,6 +19,14 @@ const mutations: MutationTree <UserState> = {
     },
     [types.USER_INSTANCE_URL_UPDATED] (state, payload) {
         state.instanceUrl = payload;
+    },
+    [types.USER_FIELD_MAPPINGS_UPDATED] (state, payload) {
+        const mapping = state.fieldMappings.find((mapping: any) => mapping.name === payload.name );
+        if (mapping) {
+            mapping.fieldMapping = payload.fieldMapping;
+        } else {
+            state.fieldMappings.push(payload);
+        }
     }
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 40d0d97b..cae458e2 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -17,55 +17,70 @@
 
         <ion-list>
           <ion-list-header>{{ $t("Select the column index for the following information in the uploaded CSV.") }}</ion-list-header>
+
+          <ion-item lines="none">
+            <ion-label>{{ $t("Select mapping") }}</ion-label>
+            <ion-select interface="popover" @ionChange="mapFields">
+              <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping">{{ mapping.name }}</ion-select-option>
+            </ion-select>
+          </ion-item>
+
           <ion-item>
             <ion-label>{{ $t("Order ID") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="orderIdField">
-                <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.orderId">
+              <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Shopify product SKU") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="productSkuField">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.productSku">
               <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Arrival date") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="dateField">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.date">
               <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Ordered quantity") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="quantityField">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.quantity">
               <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Facility ID") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="facilityField">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.facility">
               <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
-        </ion-list>
+        </ion-list>  
 
-        <ion-button color="medium" @click="mapFields" expand="block">
+        <ion-button color="medium" @click="review" expand="block">
           {{ $t("Review") }}
           <ion-icon slot="end" :icon="arrowForwardOutline" />
         </ion-button>
+
+        <ion-item>
+          <ion-label>{{ $t("Mapping name") }}</ion-label>
+          <ion-input v-model="mappingName" />
+        </ion-item>
+        <ion-button @click="savaMapping">{{ $t("Save mapping") }}</ion-button>
+
       </main>
     </ion-content>
   </ion-page>
 </template>
 <script>
-import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonItem, IonLabel, IonList, IonListHeader, IonNote, IonMenuButton, IonButton, IonSelect, IonSelectOption, IonIcon } from "@ionic/vue";
+import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonItem, IonInput, IonLabel, IonList, IonListHeader, IonNote, IonMenuButton, IonButton, IonSelect, IonSelectOption, IonIcon } from "@ionic/vue";
 import { defineComponent } from "vue";
 import { useRouter } from 'vue-router';
-import { useStore } from "vuex";
+import { useStore, mapGetters } from "vuex";
 import { showToast, parseCsv } from '@/utils';
 import { translate } from "@/i18n";
 import { arrowForwardOutline } from 'ionicons/icons';
@@ -79,6 +94,7 @@ export default defineComponent({
       IonTitle,
       IonContent,
       IonItem,
+      IonInput,
       IonLabel,
       IonButton,
       IonMenuButton,
@@ -92,15 +108,26 @@ export default defineComponent({
       return {
         file: "",
         content: [],
-        orderIdField: "",
-        productSkuField: "",
-        dateField: "",
-        quantityField: "",
-        facilityField: "",
+        fields: {
+          orderId: "",
+          productSku: "",
+          date: "",
+          quantity: "",
+          facility: "",
+        },
+        mappingName: "",
         orderItemsList: [],
       }
     },
+    computed: {
+      ...mapGetters({
+        fieldMappings: 'user/getFieldMappings'
+      })
+    },
     methods: {
+      savaMapping() {
+        this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: this.fields })
+      },
       getFile(event) {
         this.file = event.target.files[0];
         if(this.file){
@@ -112,28 +139,35 @@ export default defineComponent({
           showToast(translate("Something went wrong, Please try again"));
         }
       },
-
       async parseFile(){
         await parseCsv(this.file).then(res => {
           this.content = res;
         })
       },
-      mapFields() {
+      review() {
+        if(!this.orderItemsList.length) this.mapFields();
+        this.store.dispatch('order/updatedOrderList', this.orderItemsList);
+        this.router.push({
+          name:'PurchaseOrderDetail'
+        })
+      },
+      mapFields(event) {
+        if(event.detail.value){
+          const mapping = JSON.parse(JSON.stringify(event.detail.value));
+          this.fields = mapping.fieldMapping;
+          this.mappingName = mapping.name;
+        }
         this.orderItemsList = this.content.map(item => {
           return {
-            orderId: item[this.orderIdField],
-            shopifyProductSKU: item[this.productSkuField],
-            shopifyProductUPC: item[this.productUpcField],
-            arrivalDate: item[this.dateField],
-            quantityOrdered: item[this.quantityField],
+            orderId: item[this.fields.orderId],
+            shopifyProductSKU: item[this.fields.productSku],
+            shopifyProductUPC: item[this.fields.productUpc],
+            arrivalDate: item[this.fields.date],
+            quantityOrdered: item[this.fields.quantity],
             facilityId: '',
-            externalFacilityId: item[this.facilityField]
+            externalFacilityId: item[this.fields.facility]
           }
         })
-        this.store.dispatch('order/updatedOrderList', this.orderItemsList);
-        this.router.push({
-          name:'PurchaseOrderDetail'
-        })
       },
     },
     setup() {

From ae4e4cb0e29224ad39e66a64c7c535face4f243e Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Tue, 1 Nov 2022 15:32:41 +0530
Subject: [PATCH 02/24] Improved code(#2hran7u)

---
 src/views/PurchaseOrder.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index cae458e2..11e92dc1 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -152,7 +152,7 @@ export default defineComponent({
         })
       },
       mapFields(event) {
-        if(event.detail.value){
+        if(event && event.detail.value){
           const mapping = JSON.parse(JSON.stringify(event.detail.value));
           this.fields = mapping.fieldMapping;
           this.mappingName = mapping.name;

From 42b86999b43a013935edde965af313017e0ec1e7 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Tue, 1 Nov 2022 15:41:18 +0530
Subject: [PATCH 03/24] Updated markup(#2hran7u)

---
 src/views/PurchaseOrder.vue | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 11e92dc1..1515b8fe 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -13,18 +13,18 @@
           <ion-label>{{ file.name ? $t("Purchase order ") +  file.name : $t('Purchase order') }}</ion-label>
           <input @change="getFile" ref="file" class="ion-hide" type="file" id="inputFile"/>
           <label for="inputFile">{{ $t("Upload") }}</label>
-        </ion-item>      
+        </ion-item> 
+
+        <ion-item lines="none">
+          <ion-label>{{ $t("Select mapping") }}</ion-label>
+          <ion-select interface="popover" @ionChange="mapFields">
+            <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping">{{ mapping.name }}</ion-select-option>
+          </ion-select>
+        </ion-item>     
 
         <ion-list>
           <ion-list-header>{{ $t("Select the column index for the following information in the uploaded CSV.") }}</ion-list-header>
 
-          <ion-item lines="none">
-            <ion-label>{{ $t("Select mapping") }}</ion-label>
-            <ion-select interface="popover" @ionChange="mapFields">
-              <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping">{{ mapping.name }}</ion-select-option>
-            </ion-select>
-          </ion-item>
-
           <ion-item>
             <ion-label>{{ $t("Order ID") }}</ion-label>
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.orderId">

From 94e490ca3fb9def83ddd7d515a6ee8041ae4c6bb Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Tue, 1 Nov 2022 17:04:15 +0530
Subject: [PATCH 04/24] Improved code(#2hran7u)

---
 src/locales/en.json         |  1 +
 src/views/PurchaseOrder.vue | 12 ++++++++----
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index b9162acf..b7b2ff46 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -13,6 +13,7 @@
   "Click the backdrop to dismiss.": "Click the backdrop to dismiss.",
   "Confirm": "Confirm",
   "Dismiss": "Dismiss",
+  "Enter mapping name": "Enter mapping name",
   "Facility": "Facility",
   "Facility ID": "Facility ID",
   "File uploaded successfully": "File uploaded successfully",
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 1515b8fe..b1e48bb9 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -17,8 +17,8 @@
 
         <ion-item lines="none">
           <ion-label>{{ $t("Select mapping") }}</ion-label>
-          <ion-select interface="popover" @ionChange="mapFields">
-            <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping">{{ mapping.name }}</ion-select-option>
+          <ion-select :disabled="!fieldMappings.length" interface="popover" @ionChange="mapFields">
+            <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping.name">{{ mapping.name }}</ion-select-option>
           </ion-select>
         </ion-item>     
 
@@ -59,7 +59,7 @@
               <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
-        </ion-list>  
+        </ion-list>
 
         <ion-button color="medium" @click="review" expand="block">
           {{ $t("Review") }}
@@ -126,7 +126,11 @@ export default defineComponent({
     },
     methods: {
       savaMapping() {
-        this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: this.fields })
+        if (this.mappingName) {
+          this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: this.fields })
+        } else {
+          showToast(translate("Enter mapping name"));
+        }
       },
       getFile(event) {
         this.file = event.target.files[0];

From 6cdc753e23d0a36b0f81ba224e851b5bc6633f4b Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Tue, 1 Nov 2022 18:00:37 +0530
Subject: [PATCH 05/24] Fixed: typo and unwanted mutation of mappings(#2hran7u)

---
 src/views/PurchaseOrder.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index b1e48bb9..c05bce57 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -70,7 +70,7 @@
           <ion-label>{{ $t("Mapping name") }}</ion-label>
           <ion-input v-model="mappingName" />
         </ion-item>
-        <ion-button @click="savaMapping">{{ $t("Save mapping") }}</ion-button>
+        <ion-button @click="saveMapping">{{ $t("Save mapping") }}</ion-button>
 
       </main>
     </ion-content>
@@ -125,9 +125,9 @@ export default defineComponent({
       })
     },
     methods: {
-      savaMapping() {
+      saveMapping() {
         if (this.mappingName) {
-          this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: this.fields })
+          this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: JSON.parse(JSON.stringify(this.fields)) })
         } else {
           showToast(translate("Enter mapping name"));
         }

From 39a275d38dbec612f0d7126a9fe4e446d5b7dc7d Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Tue, 1 Nov 2022 18:58:35 +0530
Subject: [PATCH 06/24] Reverted unwanted changes(#2hran7u)

---
 src/views/PurchaseOrder.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index c05bce57..7608056d 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -28,35 +28,35 @@
           <ion-item>
             <ion-label>{{ $t("Order ID") }}</ion-label>
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.orderId">
-              <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
+              <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Shopify product SKU") }}</ion-label>
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.productSku">
-              <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
+              <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Arrival date") }}</ion-label>
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.date">
-              <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
+              <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Ordered quantity") }}</ion-label>
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.quantity">
-              <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
+              <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Facility ID") }}</ion-label>
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.facility">
-              <ion-select-option v-bind:key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
+              <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
         </ion-list>

From c6ce6d2178603f24476e891b65a710eccf471c04 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Fri, 4 Nov 2022 12:59:39 +0530
Subject: [PATCH 07/24] Improved code and variable name(#2hran7u)

---
 src/store/modules/user/actions.ts   |  2 +-
 src/store/modules/user/index.ts     |  2 +-
 src/store/modules/user/mutations.ts |  7 +----
 src/views/PurchaseOrder.vue         | 47 ++++++++++++++---------------
 4 files changed, 26 insertions(+), 32 deletions(-)

diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 9e926a13..28f3cc8f 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -114,7 +114,7 @@ const actions: ActionTree<UserState, RootState> = {
     commit(types.USER_INSTANCE_URL_UPDATED, payload)
   },
 
-  updateFieldMappings({ commit }, payload){
+  updateFieldMappings({ state, commit }, payload){
     commit(types.USER_FIELD_MAPPINGS_UPDATED, payload);
   }
 }
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index bf548d20..7bf69938 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -12,7 +12,7 @@ const userModule: Module<UserState, RootState> = {
       current: null,
       currentFacility: {},
       instanceUrl: '',
-      fieldMappings: []
+      fieldMappings: {}
     },
     getters,
     actions,
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index d2ae04ef..6fdc7e01 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -21,12 +21,7 @@ const mutations: MutationTree <UserState> = {
         state.instanceUrl = payload;
     },
     [types.USER_FIELD_MAPPINGS_UPDATED] (state, payload) {
-        const mapping = state.fieldMappings.find((mapping: any) => mapping.name === payload.name );
-        if (mapping) {
-            mapping.fieldMapping = payload.fieldMapping;
-        } else {
-            state.fieldMappings.push(payload);
-        }
+        state.fieldMappings[payload.name] = payload.fieldMapping;
     }
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 7608056d..ca0632da 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -17,8 +17,8 @@
 
         <ion-item lines="none">
           <ion-label>{{ $t("Select mapping") }}</ion-label>
-          <ion-select :disabled="!fieldMappings.length" interface="popover" @ionChange="mapFields">
-            <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping.name">{{ mapping.name }}</ion-select-option>
+          <ion-select :disabled="!Object.keys(fieldMappings).length" interface="popover" @ionChange="mapFields">
+            <ion-select-option v-for="(mapping, name) in fieldMappings" :value="{ mapping, name }" :key="name">{{ name }}</ion-select-option>
           </ion-select>
         </ion-item>     
 
@@ -27,35 +27,35 @@
 
           <ion-item>
             <ion-label>{{ $t("Order ID") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.orderId">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.orderId">
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Shopify product SKU") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.productSku">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.productSku">
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Arrival date") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.date">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.orderDate">
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Ordered quantity") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.quantity">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.quantity">
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Facility ID") }}</ion-label>
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.facility">
+            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.facility">
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
@@ -108,10 +108,10 @@ export default defineComponent({
       return {
         file: "",
         content: [],
-        fields: {
+        fieldMapping: {
           orderId: "",
           productSku: "",
-          date: "",
+          orderDate: "",
           quantity: "",
           facility: "",
         },
@@ -127,7 +127,7 @@ export default defineComponent({
     methods: {
       saveMapping() {
         if (this.mappingName) {
-          this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: JSON.parse(JSON.stringify(this.fields)) })
+          this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: JSON.parse(JSON.stringify(this.fieldMapping)) })
         } else {
           showToast(translate("Enter mapping name"));
         }
@@ -150,6 +150,16 @@ export default defineComponent({
       },
       review() {
         if(!this.orderItemsList.length) this.mapFields();
+        this.orderItemsList = this.content.map(item => {
+          return {
+            orderId: item[this.fieldMapping.orderId],
+            shopifyProductSKU: item[this.fieldMapping.productSku],
+            arrivalDate: item[this.fieldMapping.orderDate],
+            quantityOrdered: item[this.fieldMapping.quantity],
+            facilityId: '',
+            externalFacilityId: item[this.fieldMapping.facility]
+          }
+        })
         this.store.dispatch('order/updatedOrderList', this.orderItemsList);
         this.router.push({
           name:'PurchaseOrderDetail'
@@ -157,21 +167,10 @@ export default defineComponent({
       },
       mapFields(event) {
         if(event && event.detail.value){
-          const mapping = JSON.parse(JSON.stringify(event.detail.value));
-          this.fields = mapping.fieldMapping;
-          this.mappingName = mapping.name;
+          const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
+          this.fieldMapping = fieldMapping.mapping;
+          this.mappingName = fieldMapping.name;
         }
-        this.orderItemsList = this.content.map(item => {
-          return {
-            orderId: item[this.fields.orderId],
-            shopifyProductSKU: item[this.fields.productSku],
-            shopifyProductUPC: item[this.fields.productUpc],
-            arrivalDate: item[this.fields.date],
-            quantityOrdered: item[this.fields.quantity],
-            facilityId: '',
-            externalFacilityId: item[this.fields.facility]
-          }
-        })
       },
     },
     setup() {

From 8e3c6bba742a12d3b589e09b04241d0518d68baa Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Fri, 4 Nov 2022 14:37:49 +0530
Subject: [PATCH 08/24] Updated code to display toast if mapped fields are not
 found in the csv(#2hran7u-updated)

---
 src/locales/en.json         | 1 +
 src/views/PurchaseOrder.vue | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/src/locales/en.json b/src/locales/en.json
index b7b2ff46..45a0c39e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -49,6 +49,7 @@
   "Select mapping": "Select mapping",
   "Select time zone": "Select time zone",
   "Select the column index for the following information in the uploaded CSV.": "Select the column index for the following information in the uploaded CSV.",
+  "Some of the fields are missing in the CSV": "Some of the fields are missing in the CSV",
   "Something went wrong": "Something went wrong",
   "Something went wrong, Please try again": "Something went wrong, Please try again",
   "Sorry, your username or password is incorrect. Please try again.": "Sorry, your username or password is incorrect. Please try again.",
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index ca0632da..f1ec79b5 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -170,6 +170,8 @@ export default defineComponent({
           const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
           this.fieldMapping = fieldMapping.mapping;
           this.mappingName = fieldMapping.name;
+          const missingFields = Object.values(this.fieldMapping).filter(field => !Object.keys(this.content[0]).indexOf(field) >= 0);
+          if(missingFields.length) showToast(translate("Some of the fields are missing in the CSV"))
         }
       },
     },

From 5a2f32ce34b5d98cca0d1b9d5950964d057cbd57 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Fri, 4 Nov 2022 15:21:48 +0530
Subject: [PATCH 09/24] Improved logic to verify whether all the mapped fields
 are present in csv(#2hran7u)

---
 src/views/PurchaseOrder.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index f1ec79b5..d61e53c4 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -170,7 +170,7 @@ export default defineComponent({
           const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
           this.fieldMapping = fieldMapping.mapping;
           this.mappingName = fieldMapping.name;
-          const missingFields = Object.values(this.fieldMapping).filter(field => !Object.keys(this.content[0]).indexOf(field) >= 0);
+          const missingFields = Object.values(this.fieldMapping).filter(field => !Object.keys(this.content[0]).includes(field));
           if(missingFields.length) showToast(translate("Some of the fields are missing in the CSV"))
         }
       },

From 630e83b54a1b101dd01083ecfa9fe45519fcadd5 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Fri, 18 Nov 2022 11:18:01 +0530
Subject: [PATCH 10/24] Removed unwanted code(#2hran7u)

---
 src/views/PurchaseOrder.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 00cbd74e..10754bd1 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -151,7 +151,6 @@ export default defineComponent({
         })
       },
       review() {
-        if(!this.orderItemsList.length) this.mapFields();
         this.orderItemsList = this.content.map(item => {
           return {
             orderId: item[this.fieldMapping.orderId],

From 6ceb077d52677dcea197c8a426ccc6b7d1b47ef3 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Fri, 18 Nov 2022 18:57:16 +0530
Subject: [PATCH 11/24] Implemented logic to store mappings corresponding to a
 unique mappingPrefId(#2hran7u)

---
 src/store/modules/user/actions.ts   |  2 +-
 src/store/modules/user/mutations.ts |  2 +-
 src/views/PurchaseOrder.vue         | 10 +++++-----
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 2cac31e6..a6786b73 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -118,7 +118,7 @@ const actions: ActionTree<UserState, RootState> = {
     commit(types.USER_INSTANCE_URL_UPDATED, payload)
   },
 
-  updateFieldMappings({ state, commit }, payload){
+  updateFieldMappings({ commit }, payload){
     commit(types.USER_FIELD_MAPPINGS_UPDATED, payload);
   }
 }
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index 3b36d7d3..d621498e 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -21,7 +21,7 @@ const mutations: MutationTree <UserState> = {
         state.instanceUrl = payload;
     },
     [types.USER_FIELD_MAPPINGS_UPDATED] (state, payload) {
-        state.fieldMappings[payload.name] = payload.fieldMapping;
+        state.fieldMappings[payload.mappingPrefId] = payload;
     },    
     [types.USER_DATETIME_FORMAT_UPDATED] (state, payload) {
         state.preferredDateTimeFormat = payload;
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 10754bd1..bd704a40 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -14,11 +14,10 @@
           <input @change="getFile" ref="file" class="ion-hide" type="file" id="inputFile"/>
           <label for="inputFile">{{ $t("Upload") }}</label>
         </ion-item> 
-
         <ion-item lines="none">
           <ion-label>{{ $t("Select mapping") }}</ion-label>
           <ion-select :disabled="!Object.keys(fieldMappings).length" interface="popover" @ionChange="mapFields">
-            <ion-select-option v-for="(mapping, name) in fieldMappings" :value="{ mapping, name }" :key="name">{{ name }}</ion-select-option>
+            <ion-select-option v-for="mapping in fieldMappings" :value="mapping" :key="mapping?.mappingPrefId">{{ mapping?.mappingPrefName }}</ion-select-option>
           </ion-select>
         </ion-item>     
 
@@ -129,7 +128,8 @@ export default defineComponent({
     methods: {
       saveMapping() {
         if (this.mappingName) {
-          this.store.dispatch('user/updateFieldMappings', { name: this.mappingName, fieldMapping: JSON.parse(JSON.stringify(this.fieldMapping)) })
+          const mappingPrefId = Math.floor(Math.random() * 1000);
+          this.store.dispatch('user/updateFieldMappings', { mappingPrefId, mappingPrefName: this.mappingName, mappingPrefValue: JSON.parse(JSON.stringify(this.fieldMapping)) })
         } else {
           showToast(translate("Enter mapping name"));
         }
@@ -169,8 +169,8 @@ export default defineComponent({
       mapFields(event) {
         if(event && event.detail.value){
           const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
-          this.fieldMapping = fieldMapping.mapping;
-          this.mappingName = fieldMapping.name;
+          this.fieldMapping = fieldMapping.mappingPrefValue;
+          this.mappingName = fieldMapping.mappingPrefName;
           const missingFields = Object.values(this.fieldMapping).filter(field => !Object.keys(this.content[0]).includes(field));
           if(missingFields.length) showToast(translate("Some of the fields are missing in the CSV"))
         }

From 42171a2cec5c7c21b9e02a8d0bd6a65038b7bb59 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 15:50:31 +0530
Subject: [PATCH 12/24] Removed unwanted code and implemented logic to generate
 unique mappingPrefids(#2hran7u)

---
 src/locales/en.json         |  1 -
 src/views/PurchaseOrder.vue | 15 +++++++++++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index c4c36ba3..e316a41d 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -60,7 +60,6 @@
   "Select mapping": "Select mapping",
   "Select time zone": "Select time zone",
   "Select the column index for the following information in the uploaded CSV.": "Select the column index for the following information in the uploaded CSV.",
-  "Some of the fields are missing in the CSV": "Some of the fields are missing in the CSV",
   "Something went wrong": "Something went wrong",
   "Something went wrong, Please try again": "Something went wrong, Please try again",
   "Sorry, your username or password is incorrect. Please try again.": "Sorry, your username or password is incorrect. Please try again.",
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index bd704a40..1429573f 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -110,6 +110,9 @@ export default defineComponent({
         fieldMappings: 'user/getFieldMappings'
       })
     },
+    mounted(){
+      console.log(this.fieldMappings, "abc");
+    },
     data() {
       return {
         file: "",
@@ -126,9 +129,15 @@ export default defineComponent({
       }
     },
     methods: {
+      generateUniqueId(id) {
+        if (!this.fieldMappings[id]) {
+          return id;
+        }
+        this.generateUniqueId(Math.floor(Math.random() * 1000));
+      },
       saveMapping() {
         if (this.mappingName) {
-          const mappingPrefId = Math.floor(Math.random() * 1000);
+          const mappingPrefId = this.generateUniqueId(Math.floor(Math.random() * 1000));
           this.store.dispatch('user/updateFieldMappings', { mappingPrefId, mappingPrefName: this.mappingName, mappingPrefValue: JSON.parse(JSON.stringify(this.fieldMapping)) })
         } else {
           showToast(translate("Enter mapping name"));
@@ -167,12 +176,10 @@ export default defineComponent({
         })
       },
       mapFields(event) {
-        if(event && event.detail.value){
+        if(event && event.detail.value) {
           const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
           this.fieldMapping = fieldMapping.mappingPrefValue;
           this.mappingName = fieldMapping.mappingPrefName;
-          const missingFields = Object.values(this.fieldMapping).filter(field => !Object.keys(this.content[0]).includes(field));
-          if(missingFields.length) showToast(translate("Some of the fields are missing in the CSV"))
         }
       },
     },

From 59c1734d6fb91cac6e0f272bb2f1cdff247abc11 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 16:12:11 +0530
Subject: [PATCH 13/24] Fixed: code to generate unique mappingPrefId(#2hran7u)

---
 src/views/PurchaseOrder.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 1429573f..c552f31a 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -133,7 +133,7 @@ export default defineComponent({
         if (!this.fieldMappings[id]) {
           return id;
         }
-        this.generateUniqueId(Math.floor(Math.random() * 1000));
+        return this.generateUniqueId(Math.floor(Math.random() * 1000));
       },
       saveMapping() {
         if (this.mappingName) {

From 3efaddd0edcf98127e1350b4c156cf08debe4419 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 16:30:14 +0530
Subject: [PATCH 14/24] Removed unwanted code (#2hran7u)

---
 src/views/PurchaseOrder.vue | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index c552f31a..5f695ebf 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -110,9 +110,6 @@ export default defineComponent({
         fieldMappings: 'user/getFieldMappings'
       })
     },
-    mounted(){
-      console.log(this.fieldMappings, "abc");
-    },
     data() {
       return {
         file: "",

From fe856925dae119f21a38e5d9e4f4b6649b688d83 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 16:35:32 +0530
Subject: [PATCH 15/24] Updated method name(#2hran7u)

---
 src/views/PurchaseOrder.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 5f695ebf..de1c16ba 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -126,7 +126,7 @@ export default defineComponent({
       }
     },
     methods: {
-      generateUniqueId(id) {
+      generateUniqueMappingPrefId(id) {
         if (!this.fieldMappings[id]) {
           return id;
         }

From 25679b6f902c8160de15076bc62c9e2fe773eb47 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 17:01:00 +0530
Subject: [PATCH 16/24] Resolved merge conflicts(#2hran7u)

---
 src/views/PurchaseOrder.vue | 21 ---------------------
 1 file changed, 21 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 20913bfe..831e166f 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -26,56 +26,35 @@
 
           <ion-item>
             <ion-label>{{ $t("Order ID") }}</ion-label>
-<<<<<<< HEAD
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.orderId">
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
-=======
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.orderId">
-                <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
->>>>>>> edac349650757a3d685f74480e549aefe33f38ee
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Shopify product SKU") }}</ion-label>
-<<<<<<< HEAD
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.productSku">
-=======
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.productSku">
->>>>>>> edac349650757a3d685f74480e549aefe33f38ee
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Arrival date") }}</ion-label>
-<<<<<<< HEAD
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.orderDate">
-=======
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.date">
->>>>>>> edac349650757a3d685f74480e549aefe33f38ee
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Ordered quantity") }}</ion-label>
-<<<<<<< HEAD
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.quantity">
-=======
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.quantity">
->>>>>>> edac349650757a3d685f74480e549aefe33f38ee
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>
 
           <ion-item>
             <ion-label>{{ $t("Facility ID") }}</ion-label>
-<<<<<<< HEAD
             <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fieldMapping.facility">
-=======
-            <ion-select interface="popover" v-if="content.length" :placeholder = "$t('Select')" v-model="fields.facility">
->>>>>>> edac349650757a3d685f74480e549aefe33f38ee
               <ion-select-option :key="index" v-for="(prop, index) in Object.keys(content[0])">{{ prop }}</ion-select-option>
             </ion-select>
           </ion-item>

From 28720147b704304902a0b272fd0c471f1178cf16 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 17:08:19 +0530
Subject: [PATCH 17/24] Fixed: wrong variable name(#2hran7u)

---
 src/views/PurchaseOrder.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 831e166f..0c2ac973 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -157,7 +157,7 @@ export default defineComponent({
         })
       },
       review() {
-        const areAllFieldsSelected = Object.values(this.fields).every(field => field !== "");
+        const areAllFieldsSelected = Object.values(this.fieldMapping).every(field => field !== "");
         if (this.content.length <= 0) {
           showToast(translate("Please upload a valid purchase order csv to continue"));
         } else if (areAllFieldsSelected) {

From 360a5c0e13cd85c8408aab0d34cf6888258a76e0 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 17:49:43 +0530
Subject: [PATCH 18/24] Updated code to block user navigation if the csv does
 not contain the field mapping applied(#2hran7u)

---
 src/views/PurchaseOrder.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 0c2ac973..8ea2f4dc 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -130,11 +130,11 @@ export default defineComponent({
         if (!this.fieldMappings[id]) {
           return id;
         }
-        return this.generateUniqueId(Math.floor(Math.random() * 1000));
+        return this.generateUniqueMappingPrefId(Math.floor(Math.random() * 1000));
       },
       saveMapping() {
         if (this.mappingName) {
-          const mappingPrefId = this.generateUniqueId(Math.floor(Math.random() * 1000));
+          const mappingPrefId = this.generateUniqueMappingPrefId(Math.floor(Math.random() * 1000));
           this.store.dispatch('user/updateFieldMappings', { mappingPrefId, mappingPrefName: this.mappingName, mappingPrefValue: JSON.parse(JSON.stringify(this.fieldMapping)) })
         } else {
           showToast(translate("Enter mapping name"));
@@ -182,6 +182,9 @@ export default defineComponent({
       mapFields(event) {
         if(event && event.detail.value) {
           const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
+          for(const field in fieldMapping.mappingPrefValue){
+            if(!Object.keys(this.content[0]).includes(fieldMapping.mappingPrefValue[field])) fieldMapping.mappingPrefValue[field] = "";
+          }
           this.fieldMapping = fieldMapping.mappingPrefValue;
           this.mappingName = fieldMapping.mappingPrefName;
         }

From 13c0adc188de150e330fcb4a57d7a6dbee04ade1 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 18:05:56 +0530
Subject: [PATCH 19/24] Improved code and added comments(#2hran7u)

---
 src/views/PurchaseOrder.vue | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 8ea2f4dc..7bdae451 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -126,15 +126,14 @@ export default defineComponent({
       }
     },
     methods: {
-      generateUniqueMappingPrefId(id) {
-        if (!this.fieldMappings[id]) {
-          return id;
-        }
-        return this.generateUniqueMappingPrefId(Math.floor(Math.random() * 1000));
+      //Todo: Generating unique identifiers as we are currently storing in local storage. Need to remove it as we will be storing data on server.
+      generateUniqueMappingPrefId() {
+        const id = Math.floor(Math.random() * 1000);
+        return !this.fieldMappings[id] ? id : this.generateUniqueMappingPrefId();
       },
       saveMapping() {
         if (this.mappingName) {
-          const mappingPrefId = this.generateUniqueMappingPrefId(Math.floor(Math.random() * 1000));
+          const mappingPrefId = this.generateUniqueMappingPrefId();
           this.store.dispatch('user/updateFieldMappings', { mappingPrefId, mappingPrefName: this.mappingName, mappingPrefValue: JSON.parse(JSON.stringify(this.fieldMapping)) })
         } else {
           showToast(translate("Enter mapping name"));

From e364e3c1c7985254a2235c8121ca1c965cd5c2d2 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 20:11:14 +0530
Subject: [PATCH 20/24] Updated toast message(#2hran7u)

---
 src/locales/en.json         |  1 +
 src/theme/variables.css     |  4 ++++
 src/views/PurchaseOrder.vue | 17 +++++++++++++----
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index e0213d51..7ea483a0 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -62,6 +62,7 @@
   "Select all the fields to continue": "Select all the fields to continue",
   "Select time zone": "Select time zone",
   "Select the column index for the following information in the uploaded CSV.": "Select the column index for the following information in the uploaded CSV.",
+  "Some of the mapping fields are missing in the CSV: ": "Some of the mapping fields are missing in the CSV: ",
   "Something went wrong": "Something went wrong",
   "Something went wrong, Please try again": "Something went wrong, Please try again",
   "Sorry, your username or password is incorrect. Please try again.": "Sorry, your username or password is incorrect. Please try again.",
diff --git a/src/theme/variables.css b/src/theme/variables.css
index c9177b47..33318e7d 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -286,6 +286,10 @@ body {
   justify-self: start
 }
 
+.toast-message {
+  --white-space: pre-wrap !important;
+}
+
 @media (min-width: 700px) {
   .list-item {
     --col-calc: var(--columns-tablet);
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 7bdae451..0979968b 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -181,11 +181,20 @@ export default defineComponent({
       mapFields(event) {
         if(event && event.detail.value) {
           const fieldMapping = JSON.parse(JSON.stringify(event.detail.value));
-          for(const field in fieldMapping.mappingPrefValue){
-            if(!Object.keys(this.content[0]).includes(fieldMapping.mappingPrefValue[field])) fieldMapping.mappingPrefValue[field] = "";
-          }
+          const CsvFields = Object.keys(this.content[0]);
+
+          const missingFields = Object.values(fieldMapping.mappingPrefValue).filter(field => {
+            if(!Object.keys(this.content[0]).includes(field)) return field;
+          });
+          if(missingFields.length) showToast(translate(`Some of the mapping fields are missing in the CSV: \n ${ missingFields.join(", ") }`))
+
+          Object.keys(fieldMapping.mappingPrefValue).map((field) => {
+            if(!CsvFields.includes(fieldMapping.mappingPrefValue[field])){
+              fieldMapping.mappingPrefValue[field] = "";
+            }
+          })
           this.fieldMapping = fieldMapping.mappingPrefValue;
-          this.mappingName = fieldMapping.mappingPrefName;
+          this.mappingName = fieldMapping.mappingPrefName; 
         }
       },
     },

From 71c23cd60ff546962797dc030a3d20ff2dabb3b1 Mon Sep 17 00:00:00 2001
From: Disha Talreja <dishatalreja1202@gmail.com>
Date: Mon, 21 Nov 2022 20:13:09 +0530
Subject: [PATCH 21/24] Added missing import(#2hran7u)

---
 src/views/PurchaseOrder.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 4a442a6b..c175234e 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -83,6 +83,7 @@ import { useStore, mapGetters } from "vuex";
 import { showToast, parseCsv } from '@/utils';
 import { translate } from "@/i18n";
 import { arrowForwardOutline } from 'ionicons/icons';
+import { DateTime } from 'luxon';
 
 export default defineComponent({
     name: "purchase orders",

From 8acbb634701456f4447fc439a5b13bb72e2ee35b Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Tue, 22 Nov 2022 12:15:17 +0530
Subject: [PATCH 22/24] Fixed internationalisation for the missing feilds toast
 (#2hran7u-updated)

---
 src/locales/en.json         | 2 +-
 src/views/PurchaseOrder.vue | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 7ea483a0..f20ff79e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -62,7 +62,7 @@
   "Select all the fields to continue": "Select all the fields to continue",
   "Select time zone": "Select time zone",
   "Select the column index for the following information in the uploaded CSV.": "Select the column index for the following information in the uploaded CSV.",
-  "Some of the mapping fields are missing in the CSV: ": "Some of the mapping fields are missing in the CSV: ",
+  "Some of the mapping fields are missing in the CSV: ": "Some of the mapping fields are missing in the CSV: {missingFields}",
   "Something went wrong": "Something went wrong",
   "Something went wrong, Please try again": "Something went wrong, Please try again",
   "Sorry, your username or password is incorrect. Please try again.": "Sorry, your username or password is incorrect. Please try again.",
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index c175234e..8a896661 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -10,7 +10,7 @@
     <ion-content>
       <main>
         <ion-item>
-          <ion-label>{{ file.name ? $t("Purchase order ") +  file.name : $t('Purchase order') }}</ion-label>
+          <ion-label>{{ file.name ? $t("Purchase order") +  file.name : $t('Purchase order') }}</ion-label>
           <input @change="getFile" ref="file" class="ion-hide" type="file" id="inputFile"/>
           <label for="inputFile">{{ $t("Upload") }}</label>
         </ion-item> 
@@ -186,7 +186,7 @@ export default defineComponent({
           const missingFields = Object.values(fieldMapping.mappingPrefValue).filter(field => {
             if(!Object.keys(this.content[0]).includes(field)) return field;
           });
-          if(missingFields.length) showToast(translate(`Some of the mapping fields are missing in the CSV: \n ${ missingFields.join(", ") }`))
+          if(missingFields.length) showToast(this.$t("Some of the mapping fields are missing in the CSV: ", { missingFields: missingFields.join(", ") }))
 
           Object.keys(fieldMapping.mappingPrefValue).map((field) => {
             if(!CsvFields.includes(fieldMapping.mappingPrefValue[field])){

From f82c2e68a1203f8a6e03bca98134812657aab852 Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Tue, 22 Nov 2022 12:25:21 +0530
Subject: [PATCH 23/24] Refactored translate function to accept value params
 (#2hran7u-updated)

---
 src/i18n.ts                 | 4 ++--
 src/views/PurchaseOrder.vue | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/i18n.ts b/src/i18n.ts
index 39d62622..ed01dcae 100644
--- a/src/i18n.ts
+++ b/src/i18n.ts
@@ -27,11 +27,11 @@ const i18n = createI18n({
 
 // TODO Check if this is needed in updated versions
 // Currently this method is added to be used in ts files
-const translate = (key: string) => {
+const translate = (key: string, named?: Record<string, unknown>) => {
   if (!key) {
     return '';
   }
-  return i18n.global.t(key);
+  return named ? i18n.global.t(key, named) : i18n.global.t(key);
 };
 
 export { i18n as default, translate }
\ No newline at end of file
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 8a896661..b60789a0 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -186,7 +186,7 @@ export default defineComponent({
           const missingFields = Object.values(fieldMapping.mappingPrefValue).filter(field => {
             if(!Object.keys(this.content[0]).includes(field)) return field;
           });
-          if(missingFields.length) showToast(this.$t("Some of the mapping fields are missing in the CSV: ", { missingFields: missingFields.join(", ") }))
+          if(missingFields.length) showToast(translate("Some of the mapping fields are missing in the CSV: ", { missingFields: missingFields.join(", ") }))
 
           Object.keys(fieldMapping.mappingPrefValue).map((field) => {
             if(!CsvFields.includes(fieldMapping.mappingPrefValue[field])){

From 78b678cab9c6bb1bbfa9d1713a96e9e037dcb892 Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Tue, 22 Nov 2022 12:25:21 +0530
Subject: [PATCH 24/24] Refactored translate function to accept value params
 (#2hran7u)

---
 src/i18n.ts                 | 4 ++--
 src/views/PurchaseOrder.vue | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/i18n.ts b/src/i18n.ts
index 39d62622..ed01dcae 100644
--- a/src/i18n.ts
+++ b/src/i18n.ts
@@ -27,11 +27,11 @@ const i18n = createI18n({
 
 // TODO Check if this is needed in updated versions
 // Currently this method is added to be used in ts files
-const translate = (key: string) => {
+const translate = (key: string, named?: Record<string, unknown>) => {
   if (!key) {
     return '';
   }
-  return i18n.global.t(key);
+  return named ? i18n.global.t(key, named) : i18n.global.t(key);
 };
 
 export { i18n as default, translate }
\ No newline at end of file
diff --git a/src/views/PurchaseOrder.vue b/src/views/PurchaseOrder.vue
index 8a896661..b60789a0 100644
--- a/src/views/PurchaseOrder.vue
+++ b/src/views/PurchaseOrder.vue
@@ -186,7 +186,7 @@ export default defineComponent({
           const missingFields = Object.values(fieldMapping.mappingPrefValue).filter(field => {
             if(!Object.keys(this.content[0]).includes(field)) return field;
           });
-          if(missingFields.length) showToast(this.$t("Some of the mapping fields are missing in the CSV: ", { missingFields: missingFields.join(", ") }))
+          if(missingFields.length) showToast(translate("Some of the mapping fields are missing in the CSV: ", { missingFields: missingFields.join(", ") }))
 
           Object.keys(fieldMapping.mappingPrefValue).map((field) => {
             if(!CsvFields.includes(fieldMapping.mappingPrefValue[field])){