Added shop selector to menu footer (#2a7ymj3)

src/components/Menu.vue

@@ -31,11 +31,19 @@
         <ion-item lines="none">
           <ion-label class="ion-text-wrap">
             <p class="overline">{{ instanceUrl }}</p>
-            {{ eComStore.storeName }}
-            <p>{{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}</p>
           </ion-label>
           <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
         </ion-item>
+        <ion-item lines="none">
+          <ion-select interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
+            <ion-select-option v-for="store in (userProfile?.stores ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
+          </ion-select>
+        </ion-item>
+        <ion-item lines="none">
+          <ion-label class="ion-text-wrap">
+            <p>{{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}</p>
+          </ion-label>
+        </ion-item>
       </ion-toolbar>
     </ion-footer>
   </ion-menu>
@@ -54,13 +62,16 @@ import {
   IonMenu,
   IonMenuToggle,
   IonNote,
+  IonSelect,
+  IonSelectOption,
   IonTitle,
   IonToolbar
 } from "@ionic/vue";
 import { defineComponent, ref } from "vue";
 import { mapGetters } from "vuex";
 import { pulseOutline, calendarNumberOutline, terminalOutline, ticketOutline, albumsOutline, shirtOutline, settings, iceCreamOutline, libraryOutline } from "ionicons/icons";
 import { useStore } from "@/store";
+import emitter from "@/event-bus"
 export default defineComponent({
   name: "Menu",
   components: {
@@ -75,6 +86,8 @@ export default defineComponent({
     IonMenu,
     IonMenuToggle,
     IonNote,
+    IonSelect,
+    IonSelectOption,
     IonTitle,
     IonToolbar
   },
@@ -94,6 +107,14 @@ export default defineComponent({
       currentShopifyConfig: 'user/getCurrentShopifyConfig'
     })
   },
+  methods: {
+    async setEComStore(event: CustomEvent) {
+      if(this.userProfile) {
+        await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
+        emitter.emit("productStoreChanged")
+      }
+    },
+  },
   watch:{
     $route (to) {
       // When logout and login it should point to Oth index

src/store/modules/user/actions.ts

@@ -136,7 +136,6 @@ const actions: ActionTree<UserState, RootState> = {
     if(!productStore) {
       productStore = this.state.user.current.stores.find((store: any) => store.productStoreId === payload.productStoreId);
     }
-
     commit(types.USER_CURRENT_ECOM_STORE_UPDATED, productStore);
     dispatch('getShopifyConfig',  productStore.productStoreId);
     await UserService.setUserPreference({

src/views/InitialLoad.vue

@@ -115,14 +115,12 @@ export default defineComponent({
       isDesktop: isPlatform('desktop')
     }
   },
-  mounted () {
-    this.store.dispatch("job/fetchJobs", {
-      "inputFields":{
-        "systemJobEnumId": Object.values(this.jobEnums),
-        "systemJobEnumId_op": "in"
-      }
-    })
-    this.store.dispatch('webhook/fetchWebhooks')
+  mounted() {
+    this.fetchJobs();
+    emitter.on("productStoreChanged", this.fetchJobs);
+  },
+  unmounted() {
+    emitter.off("productStoreChanged", this.fetchJobs);
   },
   computed: {
     ...mapGetters({
@@ -195,6 +193,15 @@ export default defineComponent({
         this.isJobDetailAnimationCompleted = true;
       }
     },
+    fetchJobs(){
+      this.store.dispatch("job/fetchJobs", {
+        "inputFields":{
+          "systemJobEnumId": Object.values(this.jobEnums),
+          "systemJobEnumId_op": "in"
+        }
+      })
+      this.store.dispatch('webhook/fetchWebhooks')
+    },
     async updateWebhook(checked: boolean, enumId: string) {
       const webhook = this.getCachedWebhook[this.webhookEnums[enumId]]
 

src/views/Inventory.vue

@@ -171,17 +171,22 @@ export default defineComponent({
       return this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description ?
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         this.$t('Disabled')
+    },
+    fetchJobs(){
+      this.store.dispatch("job/fetchJobs", {
+        "inputFields":{
+          "enumTypeId": "INVENTORY_SYS_JOB"
+        }
+      });
     }
   },
   mounted () {
-    this.store.dispatch("job/fetchJobs", {
-      "inputFields":{
-        "enumTypeId": "INVENTORY_SYS_JOB"
-      }
-    });
+    this.fetchJobs();
+    emitter.on("productStoreChanged", this.fetchJobs);
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
+    emitter.off("productStoreChanged", this.fetchJobs);
     emitter.off('viewJobConfiguration', this.viewJobConfiguration)
   },
   setup() {

src/views/Orders.vue

@@ -455,6 +455,23 @@ export default defineComponent({
         });
       return jobAlert.present();
     },
+    fetchJobs(){
+      this.store.dispatch("job/fetchJobs", {
+        "inputFields": {
+          "enumTypeId": "ORDER_SYS_JOB"
+        }
+      });
+      this.store.dispatch("job/fetchJobs", {
+        "inputFields": {
+          "systemJobEnumId": Object.values(this.batchJobEnums).map((jobEnum: any) => jobEnum.id),
+          "systemJobEnumId_op": "in"
+        }
+      });
+      this.store.dispatch('webhook/fetchWebhooks')
+      if (this.currentEComStore.productStoreId) {
+        this.getAutoCancelDays();
+      }
+    },
     async getAutoCancelDays(){
       const payload = {
         "inputFields": {
@@ -479,24 +496,12 @@ export default defineComponent({
     }
   },
   mounted () {
-    this.store.dispatch("job/fetchJobs", {
-      "inputFields":{
-        "enumTypeId": "ORDER_SYS_JOB"
-      }
-    });
-    this.store.dispatch("job/fetchJobs", {
-      "inputFields":{
-        "systemJobEnumId": Object.values(this.batchJobEnums).map((jobEnum: any) => jobEnum.id),
-        "systemJobEnumId_op": "in"
-      }
-    });
-    this.store.dispatch('webhook/fetchWebhooks')
-    if (this.currentEComStore.productStoreId) {
-      this.getAutoCancelDays();
-    }
+    this.fetchJobs();
+    emitter.on("productStoreChanged", this.fetchJobs);
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
+    emitter.off("productStoreChanged", this.fetchJobs);
     emitter.off('viewJobConfiguration', this.viewJobConfiguration)
   },
   setup() {

src/views/Pipeline.vue

@@ -37,7 +37,7 @@
           <div v-if="pendingJobs?.length === 0">
             <p class="ion-text-center">{{ $t("There are no jobs pending right now")}}</p>
             <div class="ion-text-center">
-              <ion-button fill="outline" @click="refreshJobs()">
+              <ion-button fill="outline" @click="refreshJobs(undefined, true)">
                 {{ $t('retry') }}
                 <ion-spinner v-if="isRetrying" name="crescent" />
               </ion-button>
@@ -97,7 +97,7 @@
           <div v-if="runningJobs?.length === 0">
             <p class="ion-text-center">{{ $t("There are no jobs running right now")}}</p>
             <div class="ion-text-center">
-              <ion-button fill="outline" @click="refreshJobs()">
+              <ion-button fill="outline" @click="refreshJobs(undefined, true)">
                 {{ $t('retry') }}
                 <ion-spinner slot="end" v-if="isRetrying" name="crescent" />
               </ion-button>
@@ -167,7 +167,7 @@
           <div v-if="jobHistory?.length === 0">
             <p class="ion-text-center">{{ $t("No jobs have run yet")}}</p>
             <div class="ion-text-center">
-              <ion-button fill="outline" @click="refreshJobs()">
+              <ion-button fill="outline" @click="refreshJobs(undefined, true)">
                 {{ $t('retry') }}
                 <ion-spinner v-if="isRetrying" name="crescent" />
               </ion-button>
@@ -457,8 +457,8 @@ export default defineComponent({
         event.target.complete();
       })
     },
-    async refreshJobs(event: any) {
-      this.isRetrying = true;
+    async refreshJobs(event: any, isRetrying = false ) {
+      this.isRetrying = isRetrying;
       if(this.segmentSelected === 'pending') {
         this.getPendingJobs().then(() => {
           if(event) event.target.complete();
@@ -589,9 +589,11 @@ export default defineComponent({
     await this.store.dispatch('job/updateCurrentJob', { job: {} });
   },
   mounted(){
+    emitter.on("productStoreChanged", this.refreshJobs);
     emitter.on("pinnedJobsUpdated", (this as any).updateSelectedPinnedJob);
   },
   unmounted(){
+    emitter.off("productStoreChanged", this.refreshJobs);
     emitter.off('jobUpdated', this.updateJobs);
     emitter.off("pinnedJobsUpdated", (this as any).updateSelectedPinnedJob);
   },

src/views/PreOrder.vue

@@ -311,18 +311,23 @@ export default defineComponent({
       return this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description ?
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         this.$t('Disabled')
+    },
+    fetchJobs(){
+      this.store.dispatch("job/fetchJobs", {
+        "inputFields":{
+          "enumTypeId": "PRE_ORD_SYS_JOB"
+        }
+      });
     }
   },
   mounted () {
-    this.store.dispatch("job/fetchJobs", {
-      "inputFields":{
-        "enumTypeId": "PRE_ORD_SYS_JOB"
-      }
-    });
+    this.fetchJobs();
+    emitter.on("productStoreChanged", this.fetchJobs);
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
+    emitter.off("productStoreChanged", this.fetchJobs);
   },
   setup() {
     const store = useStore();

src/views/Product.vue

@@ -127,15 +127,13 @@ export default defineComponent({
     }
   },
   mounted () {
-    this.store.dispatch("job/fetchJobs", {
-      "inputFields":{
-        "enumTypeId": "PRODUCT_SYS_JOB"
-      }
-    });
+    this.fetchJobs();
+    emitter.on("productStoreChanged", this.fetchJobs);
     this.store.dispatch('webhook/fetchWebhooks')
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
+    emitter.off("productStoreChanged", this.fetchJobs);
     emitter.off('viewJobConfiguration', this.viewJobConfiguration)
   },
   methods: {
@@ -179,6 +177,14 @@ export default defineComponent({
       return this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description ?
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         this.$t('Disabled')
+    },
+    fetchJobs(){
+      this.store.dispatch("job/fetchJobs", {
+        "inputFields":{
+          "enumTypeId": "PRODUCT_SYS_JOB"
+        }
+      });
+      this.store.dispatch('webhook/fetchWebhooks')
     }
   },
   setup() {