i18n, vue-router and vuex upgrade

1. Configuration of i18n legacy as false.
2. Translation function t is called using the useI18n.
3. Used the i18n.global.t() function from i18n instead of this.$t()
4. Event bus error that occurred during logout.
5. Implemented vue-router 4.4.0 and vuex upgrade to 4.1.0

Change-Id: I9464d82c76dcc1445ce271983ea3ab9d7b03d265
Signed-off-by: Surya Venkatesan <suryav@ami.com>
diff --git a/src/views/Overview/Overview.vue b/src/views/Overview/Overview.vue
index d999be4..2bf4205 100644
--- a/src/views/Overview/Overview.vue
+++ b/src/views/Overview/Overview.vue
@@ -37,6 +37,7 @@
 import OverviewServer from './OverviewServer';
 import PageSection from '@/components/Global/PageSection';
 import PageTitle from '@/components/Global/PageTitle';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Overview',
@@ -55,6 +56,7 @@
   mixins: [LoadingBarMixin],
   data() {
     return {
+      $t: useI18n().t,
       showDumps: process.env.VUE_APP_ENV_NAME === 'ibm',
     };
   },
diff --git a/src/views/Overview/OverviewCard.vue b/src/views/Overview/OverviewCard.vue
index aa5697d..342bf98 100644
--- a/src/views/Overview/OverviewCard.vue
+++ b/src/views/Overview/OverviewCard.vue
@@ -23,6 +23,7 @@
 </template>
 
 <script>
+import { useI18n } from 'vue-i18n';
 export default {
   name: 'OverviewCard',
   props: {
@@ -56,6 +57,11 @@
       default: '/',
     },
   },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     dataForExport() {
       return JSON.stringify(this.data);
diff --git a/src/views/Overview/OverviewDumps.vue b/src/views/Overview/OverviewDumps.vue
index 6db5d28..ba7d7e2 100644
--- a/src/views/Overview/OverviewDumps.vue
+++ b/src/views/Overview/OverviewDumps.vue
@@ -21,6 +21,7 @@
 <script>
 import OverviewCard from './OverviewCard';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Dumps',
@@ -28,6 +29,11 @@
     OverviewCard,
   },
   mixins: [DataFormatterMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     dumps() {
       return this.$store.getters['dumps/allDumps'];
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index 4d85dbd..0056af4 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -34,11 +34,17 @@
 import OverviewCard from './OverviewCard';
 import StatusIcon from '@/components/Global/StatusIcon';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Events',
   components: { OverviewCard, StatusIcon },
   mixins: [DataFormatterMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     eventLogData() {
       return this.$store.getters['eventLog/allEvents'];
diff --git a/src/views/Overview/OverviewFirmware.vue b/src/views/Overview/OverviewFirmware.vue
index c2c7f4a..0be920f 100644
--- a/src/views/Overview/OverviewFirmware.vue
+++ b/src/views/Overview/OverviewFirmware.vue
@@ -26,6 +26,7 @@
 import OverviewCard from './OverviewCard';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Firmware',
@@ -33,6 +34,11 @@
     OverviewCard,
   },
   mixins: [DataFormatterMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     ...mapState({
       server: (state) => state.system.systems[0],
diff --git a/src/views/Overview/OverviewInventory.vue b/src/views/Overview/OverviewInventory.vue
index 1da5685..4d923e1 100644
--- a/src/views/Overview/OverviewInventory.vue
+++ b/src/views/Overview/OverviewInventory.vue
@@ -30,6 +30,7 @@
 <script>
 import OverviewCard from './OverviewCard';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Inventory',
@@ -37,6 +38,11 @@
     OverviewCard,
   },
   mixins: [BVToastMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     systems() {
       let systemData = this.$store.getters['system/systems'][0];
diff --git a/src/views/Overview/OverviewNetwork.vue b/src/views/Overview/OverviewNetwork.vue
index f25c7e0..c2a7693 100644
--- a/src/views/Overview/OverviewNetwork.vue
+++ b/src/views/Overview/OverviewNetwork.vue
@@ -50,6 +50,7 @@
 <script>
 import OverviewCard from './OverviewCard';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Network',
@@ -57,6 +58,11 @@
     OverviewCard,
   },
   mixins: [DataFormatterMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     network() {
       return this.$store.getters['network/globalNetworkSettings'][0];
diff --git a/src/views/Overview/OverviewPower.vue b/src/views/Overview/OverviewPower.vue
index 0d84c76..74a737e 100644
--- a/src/views/Overview/OverviewPower.vue
+++ b/src/views/Overview/OverviewPower.vue
@@ -26,6 +26,7 @@
 import OverviewCard from './OverviewCard';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
 import { mapGetters } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Power',
@@ -33,6 +34,11 @@
     OverviewCard,
   },
   mixins: [DataFormatterMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     ...mapGetters({
       powerCapValue: 'powerControl/powerCapValue',
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index 2ab7654..ef9ab12 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -28,6 +28,7 @@
 <script>
 import ArrowRight16 from '@carbon/icons-vue/es/arrow--right/16';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'QuickLinks',
@@ -35,6 +36,11 @@
     IconArrowRight: ArrowRight16,
   },
   mixins: [BVToastMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     bmcTime() {
       return this.$store.getters['global/bmcTime'];
diff --git a/src/views/Overview/OverviewServer.vue b/src/views/Overview/OverviewServer.vue
index 8fc16d1..fe0e41d 100644
--- a/src/views/Overview/OverviewServer.vue
+++ b/src/views/Overview/OverviewServer.vue
@@ -26,6 +26,7 @@
 import OverviewCard from './OverviewCard';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Server',
@@ -33,6 +34,11 @@
     OverviewCard,
   },
   mixins: [DataFormatterMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     ...mapState({
       server: (state) => state.system.systems[0],