Merge pull request #143 from ymaheshwari1/#136

Implemented: support to display oms details on settings page(#136)

src/locales/en.json

@@ -48,6 +48,7 @@
   "facility group": "facility group",
   "Group": "Group",
   "Group history": "Group history",
+  "Go to OMS": "Go to OMS",
   "greater": "greater",
   "greater than or equal to": "greater than or equal to",
   "High": "High",
@@ -81,6 +82,7 @@
   "No runs scheduled": "No runs scheduled",
   "No time zone found": "No time zone found",
   "OMS": "OMS",
+  "OMS instance": "OMS instance",
   "Order batches": "Order batches",
   "Order priority": "Order priority",
   "Order Rule Filters": "Order Rule Filters",
@@ -137,6 +139,7 @@
   "selected": "selected",
   "shipping method": "shipping method",
   "The timezone you select is used to ensure automations you schedule are always accurate to the time you select.": "The timezone you select is used to ensure automations you schedule are always accurate to the time you select.",
+  "This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.": "This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.",
   "Timezone": "Timezone",
   "Time zone updated successfully": "Time zone updated successfully",
   "Unarchive": "Unarchive",

src/views/Settings.vue

@@ -31,6 +31,23 @@
         <h1>{{ translate("OMS") }}</h1>
       </div>
       <section>
+        <ion-card>
+          <ion-card-header>
+            <ion-card-subtitle>
+              {{ $t('OMS instance') }}
+            </ion-card-subtitle>
+            <ion-card-title>
+              {{ oms }}
+            </ion-card-title>
+          </ion-card-header>
+          <ion-card-content>
+            {{ $t('This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.') }}
+          </ion-card-content>
+          <ion-button @click="goToOms()" fill="clear">
+            {{ $t('Go to OMS') }}
+            <ion-icon slot="end" :icon="openOutline" />
+          </ion-button>
+        </ion-card>
         <ion-card>
           <ion-card-header>
             <ion-card-subtitle>
@@ -79,14 +96,15 @@
 </template>
 
 <script setup lang="ts">
-import { IonAvatar, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonHeader, IonItem, IonLabel, IonMenuButton, IonPage, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonAvatar, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonMenuButton, IonPage, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { computed, onMounted, ref } from "vue";
 import { useStore } from "vuex";
 import { useRouter } from "vue-router";
 import TimeZoneModal from "@/components/TimezoneModal.vue";
 import Image from "@/components/Image.vue"
 import { DateTime } from "luxon";
 import { translate } from "@/i18n"
+import { openOutline } from "ionicons/icons"
 
 const store = useStore()
 const router = useRouter()
@@ -95,6 +113,8 @@ const appInfo = (process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_A
 
 const userProfile = computed(() => store.getters["user/getUserProfile"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const token = computed(() => store.getters["user/getUserToken"])
+const oms = computed(() => store.getters["user/getInstanceUrl"])
 
 onMounted(() => {
   appVersion.value = appInfo.branch ? (appInfo.branch + "-" + appInfo.revision) : appInfo.tag;
@@ -124,6 +144,12 @@ function logout() {
 function getDateTime(time: any) {
   return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "";
 }
+
+function goToOms() {
+  const link = (oms.value.startsWith('http') ? oms.value.replace(/\/api\/?|\/$/, "") : `https://${oms.value}.hotwax.io`) + `/qapps?token=${token.value}`
+
+  window.open(link, '_blank', 'noopener, noreferrer')
+}
 </script>
 
 <style scoped>