diff --git a/src/views/ChangePassword/ChangePassword.vue b/src/views/ChangePassword/ChangePassword.vue
index 002362a..2680cc3 100644
--- a/src/views/ChangePassword/ChangePassword.vue
+++ b/src/views/ChangePassword/ChangePassword.vue
@@ -22,13 +22,13 @@
               v-model="form.password"
               autofocus="autofocus"
               type="password"
-              :state="getValidationState($v.form.password)"
+              :state="getValidationState(v$.form.password)"
               class="form-control-with-button"
-              @change="$v.form.password.$touch()"
+              @change="v$.form.password.$touch()"
             >
             </b-form-input>
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.password.required">
+              <template v-if="!v$.form.password.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
             </b-form-invalid-feedback>
@@ -43,16 +43,16 @@
               id="password-confirm"
               v-model="form.passwordConfirm"
               type="password"
-              :state="getValidationState($v.form.passwordConfirm)"
+              :state="getValidationState(v$.form.passwordConfirm)"
               class="form-control-with-button"
-              @change="$v.form.passwordConfirm.$touch()"
+              @change="v$.form.passwordConfirm.$touch()"
             >
             </b-form-input>
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.passwordConfirm.required">
+              <template v-if="!v$.form.passwordConfirm.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
-              <template v-else-if="!$v.form.passwordConfirm.sameAsPassword">
+              <template v-else-if="!v$.form.passwordConfirm.sameAsPassword">
                 {{ $t('global.form.passwordsDoNotMatch') }}
               </template>
             </b-form-invalid-feedback>
@@ -78,6 +78,7 @@
 import InputPasswordToggle from '@/components/Global/InputPasswordToggle';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'ChangePassword',
@@ -90,6 +91,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         password: null,
         passwordConfirm: null,
@@ -115,8 +117,8 @@
       this.$store.dispatch('authentication/logout');
     },
     changePassword() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       let data = {
         originalUsername: this.username,
         password: this.form.password,
diff --git a/src/views/HardwareStatus/Inventory/Inventory.vue b/src/views/HardwareStatus/Inventory/Inventory.vue
index d05e32e..a3f4d23 100644
--- a/src/views/HardwareStatus/Inventory/Inventory.vue
+++ b/src/views/HardwareStatus/Inventory/Inventory.vue
@@ -64,6 +64,8 @@
 import JumpLink16 from '@carbon/icons-vue/es/jump-link/16';
 import JumpLinkMixin from '@/components/Mixins/JumpLinkMixin';
 import { chunk } from 'lodash';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: {
@@ -89,54 +91,55 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       links: [
         {
           id: 'system',
           dataRef: 'system',
           href: '#system',
-          linkText: this.$t('pageInventory.system'),
+          linkText: i18n.global.t('pageInventory.system'),
         },
         {
           id: 'bmc',
           dataRef: 'bmc',
           href: '#bmc',
-          linkText: this.$t('pageInventory.bmcManager'),
+          linkText: i18n.global.t('pageInventory.bmcManager'),
         },
         {
           id: 'chassis',
           dataRef: 'chassis',
           href: '#chassis',
-          linkText: this.$t('pageInventory.chassis'),
+          linkText: i18n.global.t('pageInventory.chassis'),
         },
         {
           id: 'dimms',
           dataRef: 'dimms',
           href: '#dimms',
-          linkText: this.$t('pageInventory.dimmSlot'),
+          linkText: i18n.global.t('pageInventory.dimmSlot'),
         },
         {
           id: 'fans',
           dataRef: 'fans',
           href: '#fans',
-          linkText: this.$t('pageInventory.fans'),
+          linkText: i18n.global.t('pageInventory.fans'),
         },
         {
           id: 'powerSupply',
           dataRef: 'powerSupply',
           href: '#powerSupply',
-          linkText: this.$t('pageInventory.powerSupplies'),
+          linkText: i18n.global.t('pageInventory.powerSupplies'),
         },
         {
           id: 'processors',
           dataRef: 'processors',
           href: '#processors',
-          linkText: this.$t('pageInventory.processors'),
+          linkText: i18n.global.t('pageInventory.processors'),
         },
         {
           id: 'assembly',
           dataRef: 'assembly',
           href: '#assembly',
-          linkText: this.$t('pageInventory.assemblies'),
+          linkText: i18n.global.t('pageInventory.assemblies'),
         },
       ],
     };
diff --git a/src/views/HardwareStatus/Inventory/InventoryServiceIndicator.vue b/src/views/HardwareStatus/Inventory/InventoryServiceIndicator.vue
index 0825ad7..5b19b42 100644
--- a/src/views/HardwareStatus/Inventory/InventoryServiceIndicator.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryServiceIndicator.vue
@@ -40,10 +40,16 @@
 <script>
 import PageSection from '@/components/Global/PageSection';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   components: { PageSection },
   mixins: [BVToastMixin],
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     systems() {
       let systemData = this.$store.getters['system/systems'][0];
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue b/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue
index b9f59cc..68bee05 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue
@@ -76,12 +76,15 @@
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection },
   mixins: [BVToastMixin, TableRowExpandMixin, DataFormatterMixin],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -91,25 +94,25 @@
         },
         {
           key: 'name',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'partNumber',
-          label: this.$t('pageInventory.table.partNumber'),
+          label: i18n.global.t('pageInventory.table.partNumber'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'identifyLed',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue b/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue
index 8c1e50d..848322c 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue
@@ -88,14 +88,14 @@
                 <!-- BMC date and time -->
                 <dt>{{ $t('pageInventory.table.bmcDateTime') }}:</dt>
                 <dd>
-                  {{ item.dateTime }}
-                  {{ item.dateTime }}
+                  {{ $filters.formatDate(item.dateTime) }}
+                  {{ $filters.formatTime(item.dateTime) }}
                 </dd>
                 <!-- Reset date and time -->
                 <dt>{{ $t('pageInventory.table.lastResetTime') }}:</dt>
                 <dd>
-                  {{ item.lastResetTime }}
-                  {{ item.lastResetTime }}
+                  {{ $filters.formatDate(item.lastResetTime) }}
+                  {{ $filters.formatTime(item.lastResetTime) }}
                 </dd>
               </dl>
             </b-col>
@@ -170,12 +170,15 @@
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon },
   mixins: [BVToastMixin, TableRowExpandMixin, DataFormatterMixin],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -185,22 +188,22 @@
         },
         {
           key: 'id',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
         },
         {
           key: 'identifyLed',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue b/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue
index 18ddfba..4458e33 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue
@@ -129,12 +129,15 @@
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon },
   mixins: [BVToastMixin, TableRowExpandMixin, DataFormatterMixin],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -144,23 +147,23 @@
         },
         {
           key: 'id',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
           tdClass: 'text-nowrap',
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
         },
         {
           key: 'identifyLed',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue b/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue
index f3db133..f4a850b 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue
@@ -203,6 +203,8 @@
 import TableRowExpandMixin, {
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount },
@@ -215,6 +217,7 @@
   ],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -224,29 +227,29 @@
         },
         {
           key: 'id',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
           tdClass: 'text-nowrap',
         },
         {
           key: 'statusState',
-          label: this.$t('pageInventory.table.state'),
+          label: i18n.global.t('pageInventory.table.state'),
           formatter: this.dataFormatter,
           tdClass: 'text-nowrap',
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
         },
         {
           key: 'identifyLed',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
index 62f0b76..f8db745 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
@@ -113,6 +113,8 @@
 import TableRowExpandMixin, {
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount },
@@ -124,6 +126,7 @@
   ],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -134,26 +137,26 @@
         },
         {
           key: 'name',
-          label: this.$t('pageInventory.table.name'),
+          label: i18n.global.t('pageInventory.table.name'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
           sortable: true,
           tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
-          label: this.$t('pageInventory.table.partNumber'),
+          label: i18n.global.t('pageInventory.table.partNumber'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'serialNumber',
-          label: this.$t('pageInventory.table.serialNumber'),
+          label: i18n.global.t('pageInventory.table.serialNumber'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
index df03fdf..ac64673 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
@@ -134,6 +134,8 @@
 import TableRowExpandMixin, {
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount },
@@ -145,6 +147,7 @@
   ],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -155,26 +158,26 @@
         },
         {
           key: 'id',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
           sortable: true,
           tdClass: 'text-nowrap',
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'identifyLed',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue b/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue
index 2887fc4..4bdff54 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue
@@ -172,6 +172,8 @@
 import TableRowExpandMixin, {
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount },
@@ -184,6 +186,7 @@
   ],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -194,33 +197,33 @@
         },
         {
           key: 'id',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
           sortable: true,
           tdClass: 'text-nowrap',
         },
         {
           key: 'statusState',
-          label: this.$t('pageInventory.table.state'),
+          label: i18n.global.t('pageInventory.table.state'),
           formatter: this.dataFormatter,
           sortable: true,
           tdClass: 'text-nowrap',
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
           sortable: true,
         },
         {
           key: 'identifyLed',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
           sortable: false,
         },
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue b/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue
index 8ac1a25..2839c78 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue
@@ -142,12 +142,15 @@
   expandRowLabel,
 } from '@/components/Mixins/TableRowExpandMixin';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconChevron, PageSection, StatusIcon },
   mixins: [BVToastMixin, TableRowExpandMixin, DataFormatterMixin],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -157,29 +160,29 @@
         },
         {
           key: 'id',
-          label: this.$t('pageInventory.table.id'),
+          label: i18n.global.t('pageInventory.table.id'),
           formatter: this.dataFormatter,
         },
         {
           key: 'hardwareType',
-          label: this.$t('pageInventory.table.hardwareType'),
+          label: i18n.global.t('pageInventory.table.hardwareType'),
           formatter: this.dataFormatter,
           tdClass: 'text-nowrap',
         },
         {
           key: 'health',
-          label: this.$t('pageInventory.table.health'),
+          label: i18n.global.t('pageInventory.table.health'),
           formatter: this.dataFormatter,
           tdClass: 'text-nowrap',
         },
         {
           key: 'locationNumber',
-          label: this.$t('pageInventory.table.locationNumber'),
+          label: i18n.global.t('pageInventory.table.locationNumber'),
           formatter: this.dataFormatter,
         },
         {
           key: 'locationIndicatorActive',
-          label: this.$t('pageInventory.table.identifyLed'),
+          label: i18n.global.t('pageInventory.table.identifyLed'),
           formatter: this.dataFormatter,
         },
       ],
diff --git a/src/views/HardwareStatus/Sensors/Sensors.vue b/src/views/HardwareStatus/Sensors/Sensors.vue
index c4663a9..ac70e40 100644
--- a/src/views/HardwareStatus/Sensors/Sensors.vue
+++ b/src/views/HardwareStatus/Sensors/Sensors.vue
@@ -121,6 +121,8 @@
 import SearchFilterMixin, {
   searchFilter,
 } from '@/components/Mixins/SearchFilterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'Sensors',
@@ -147,6 +149,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -157,49 +160,49 @@
         {
           key: 'name',
           sortable: true,
-          label: this.$t('pageSensors.table.name'),
+          label: i18n.global.t('pageSensors.table.name'),
         },
         {
           key: 'status',
           sortable: true,
-          label: this.$t('pageSensors.table.status'),
+          label: i18n.global.t('pageSensors.table.status'),
           tdClass: 'text-nowrap',
         },
         {
           key: 'lowerCritical',
           formatter: this.dataFormatter,
-          label: this.$t('pageSensors.table.lowerCritical'),
+          label: i18n.global.t('pageSensors.table.lowerCritical'),
         },
         {
           key: 'lowerCaution',
           formatter: this.dataFormatter,
-          label: this.$t('pageSensors.table.lowerWarning'),
+          label: i18n.global.t('pageSensors.table.lowerWarning'),
         },
 
         {
           key: 'currentValue',
           formatter: this.dataFormatter,
-          label: this.$t('pageSensors.table.currentValue'),
+          label: i18n.global.t('pageSensors.table.currentValue'),
         },
         {
           key: 'upperCaution',
           formatter: this.dataFormatter,
-          label: this.$t('pageSensors.table.upperWarning'),
+          label: i18n.global.t('pageSensors.table.upperWarning'),
         },
         {
           key: 'upperCritical',
           formatter: this.dataFormatter,
-          label: this.$t('pageSensors.table.upperCritical'),
+          label: i18n.global.t('pageSensors.table.upperCritical'),
         },
       ],
       tableFilters: [
         {
           key: 'status',
-          label: this.$t('pageSensors.table.status'),
+          label: i18n.global.t('pageSensors.table.status'),
           values: [
-            this.$t('global.action.ok'),
-            this.$t('global.action.warning'),
-            this.$t('global.action.critical'),
+            i18n.global.t('global.action.ok'),
+            i18n.global.t('global.action.warning'),
+            i18n.global.t('global.action.critical'),
           ],
         },
       ],
@@ -253,7 +256,7 @@
         date.toISOString().slice(0, 10) +
         '_' +
         date.toString().split(':').join('-').split(' ')[4];
-      return this.$t('pageSensors.exportFilePrefix') + date;
+      return i18n.global.t('pageSensors.exportFilePrefix') + date;
     },
   },
 };
diff --git a/src/views/Logs/Dumps/Dumps.vue b/src/views/Logs/Dumps/Dumps.vue
index 5a9869a..0446911 100644
--- a/src/views/Logs/Dumps/Dumps.vue
+++ b/src/views/Logs/Dumps/Dumps.vue
@@ -84,8 +84,8 @@
 
             <!-- Date and Time column -->
             <template #cell(dateTime)="{ value }">
-              <p class="mb-0">{{ value }}</p>
-              <p class="mb-0">{{ value }}</p>
+              <p class="mb-0">{{ $filters.formatDate(value) }}</p>
+              <p class="mb-0">{{ $filters.formatTime(value) }}</p>
             </template>
 
             <!-- Size column -->
@@ -171,6 +171,7 @@
 } from '@/components/Mixins/SearchFilterMixin';
 import TableFilter from '@/components/Global/TableFilter';
 import TableFilterMixin from '@/components/Mixins/TableFilterMixin';
+import i18n from '@/i18n';
 
 export default {
   components: {
@@ -210,22 +211,22 @@
         },
         {
           key: 'dateTime',
-          label: this.$t('pageDumps.table.dateAndTime'),
+          label: i18n.global.t('pageDumps.table.dateAndTime'),
           sortable: true,
         },
         {
           key: 'dumpType',
-          label: this.$t('pageDumps.table.dumpType'),
+          label: i18n.global.t('pageDumps.table.dumpType'),
           sortable: true,
         },
         {
           key: 'id',
-          label: this.$t('pageDumps.table.id'),
+          label: i18n.global.t('pageDumps.table.id'),
           sortable: true,
         },
         {
           key: 'size',
-          label: this.$t('pageDumps.table.size'),
+          label: i18n.global.t('pageDumps.table.size'),
           sortable: true,
         },
         {
@@ -238,13 +239,13 @@
       batchActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete'),
+          label: i18n.global.t('global.action.delete'),
         },
       ],
       tableFilters: [
         {
           key: 'dumpType',
-          label: this.$t('pageDumps.table.dumpType'),
+          label: i18n.global.t('pageDumps.table.dumpType'),
           values: [
             'BMC Dump Entry',
             'Hostboot Dump Entry',
@@ -279,11 +280,11 @@
           actions: [
             {
               value: 'download',
-              title: this.$t('global.action.download'),
+              title: i18n.global.t('global.action.download'),
             },
             {
               value: 'delete',
-              title: this.$t('global.action.delete'),
+              title: i18n.global.t('global.action.delete'),
             },
           ],
         };
@@ -328,12 +329,15 @@
     onTableRowAction(action, dump) {
       if (action === 'delete') {
         this.$bvModal
-          .msgBoxConfirm(this.$tc('pageDumps.modal.deleteDumpConfirmation'), {
-            title: this.$tc('pageDumps.modal.deleteDump'),
-            okTitle: this.$tc('pageDumps.modal.deleteDump'),
-            cancelTitle: this.$t('global.action.cancel'),
-            autoFocusButton: 'ok',
-          })
+          .msgBoxConfirm(
+            i18n.global.t('pageDumps.modal.deleteDumpConfirmation'),
+            {
+              title: i18n.global.t('pageDumps.modal.deleteDump'),
+              okTitle: i18n.global.t('pageDumps.modal.deleteDump'),
+              cancelTitle: i18n.global.t('global.action.cancel'),
+              autoFocusButton: 'ok',
+            },
+          )
           .then((deleteConfrimed) => {
             if (deleteConfrimed) {
               this.$store
@@ -355,20 +359,20 @@
       if (action === 'delete') {
         this.$bvModal
           .msgBoxConfirm(
-            this.$tc(
+            i18n.global.t(
               'pageDumps.modal.deleteDumpConfirmation',
               this.selectedRows.length,
             ),
             {
-              title: this.$tc(
+              title: i18n.global.t(
                 'pageDumps.modal.deleteDump',
                 this.selectedRows.length,
               ),
-              okTitle: this.$tc(
+              okTitle: i18n.global.t(
                 'pageDumps.modal.deleteDump',
                 this.selectedRows.length,
               ),
-              cancelTitle: this.$t('global.action.cancel'),
+              cancelTitle: i18n.global.t('global.action.cancel'),
               autoFocusButton: 'ok',
             },
           )
diff --git a/src/views/Logs/Dumps/DumpsForm.vue b/src/views/Logs/Dumps/DumpsForm.vue
index 40cea7e..7da3084 100644
--- a/src/views/Logs/Dumps/DumpsForm.vue
+++ b/src/views/Logs/Dumps/DumpsForm.vue
@@ -9,7 +9,7 @@
           id="selectDumpType"
           v-model="selectedDumpType"
           :options="dumpTypeOptions"
-          :state="getValidationState($v.selectedDumpType)"
+          :state="getValidationState(v$.selectedDumpType)"
         >
           <template #first>
             <b-form-select-option :value="null" disabled>
@@ -39,6 +39,7 @@
 import Alert from '@/components/Global/Alert';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
+import i18n from '@/i18n';
 
 export default {
   components: { Alert, ModalConfirmation },
@@ -52,8 +53,8 @@
     return {
       selectedDumpType: null,
       dumpTypeOptions: [
-        { value: 'bmc', text: this.$t('pageDumps.form.bmcDump') },
-        { value: 'system', text: this.$t('pageDumps.form.systemDump') },
+        { value: 'bmc', text: i18n.global.t('pageDumps.form.bmcDump') },
+        { value: 'system', text: i18n.global.t('pageDumps.form.systemDump') },
       ],
     };
   },
@@ -64,8 +65,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
 
       // System dump initiation
       if (this.selectedDumpType === 'system') {
@@ -76,10 +77,15 @@
         this.$store
           .dispatch('dumps/createBmcDump')
           .then(() =>
-            this.infoToast(this.$t('pageDumps.toast.successStartBmcDump'), {
-              title: this.$t('pageDumps.toast.successStartBmcDumpTitle'),
-              timestamp: true,
-            }),
+            this.infoToast(
+              i18n.global.t('pageDumps.toast.successStartBmcDump'),
+              {
+                title: i18n.global.t(
+                  'pageDumps.toast.successStartBmcDumpTitle',
+                ),
+                timestamp: true,
+              },
+            ),
           )
           .catch(({ message }) => this.errorToast(message));
       }
@@ -91,10 +97,15 @@
       this.$store
         .dispatch('dumps/createSystemDump')
         .then(() =>
-          this.infoToast(this.$t('pageDumps.toast.successStartSystemDump'), {
-            title: this.$t('pageDumps.toast.successStartSystemDumpTitle'),
-            timestamp: true,
-          }),
+          this.infoToast(
+            i18n.global.t('pageDumps.toast.successStartSystemDump'),
+            {
+              title: i18n.global.t(
+                'pageDumps.toast.successStartSystemDumpTitle',
+              ),
+              timestamp: true,
+            },
+          ),
         )
         .catch(({ message }) => this.errorToast(message));
     },
diff --git a/src/views/Logs/Dumps/DumpsModalConfirmation.vue b/src/views/Logs/Dumps/DumpsModalConfirmation.vue
index 2a1e552..4b68681 100644
--- a/src/views/Logs/Dumps/DumpsModalConfirmation.vue
+++ b/src/views/Logs/Dumps/DumpsModalConfirmation.vue
@@ -17,11 +17,11 @@
       <status-icon status="danger" />
       {{ $t('pageDumps.modal.initiateSystemDumpMessage3') }}
     </p>
-    <b-form-checkbox v-model="confirmed" @input="$v.confirmed.$touch()">
+    <b-form-checkbox v-model="confirmed" @input="v$.confirmed.$touch()">
       {{ $t('pageDumps.modal.initiateSystemDumpMessage4') }}
     </b-form-checkbox>
     <b-form-invalid-feedback
-      :state="getValidationState($v.confirmed)"
+      :state="getValidationState(v$.confirmed)"
       role="alert"
     >
       {{ $t('global.form.required') }}
@@ -67,14 +67,14 @@
       });
     },
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok');
       this.closeModal();
     },
     resetForm() {
       this.confirmed = false;
-      this.$v.$reset();
+      this.v$.$reset();
     },
   },
 };
diff --git a/src/views/Logs/EventLogs/EventLogs.vue b/src/views/Logs/EventLogs/EventLogs.vue
index c906fc6..e50be81 100644
--- a/src/views/Logs/EventLogs/EventLogs.vue
+++ b/src/views/Logs/EventLogs/EventLogs.vue
@@ -144,8 +144,8 @@
                     <!-- Modified date -->
                     <dt>{{ $t('pageEventLogs.table.modifiedDate') }}:</dt>
                     <dd v-if="item.modifiedDate">
-                      {{ item.modifiedDate }}
-                      {{ item.modifiedDate }}
+                      {{ $filters.formatDate(item.modifiedDate) }}
+                      {{ $filters.formatTime(item.modifiedDate) }}
                     </dd>
                     <dd v-else>--</dd>
                   </dl>
@@ -170,8 +170,8 @@
           </template>
           <!-- Date column -->
           <template #cell(date)="{ value }">
-            <p class="mb-0">{{ value }}</p>
-            <p class="mb-0">{{ value }}</p>
+            <p class="mb-0">{{ $filters.formatDate(value) }}</p>
+            <p class="mb-0">{{ $filters.formatTime(value) }}</p>
           </template>
 
           <!-- Status column -->
@@ -535,8 +535,8 @@
     onTableRowAction(action, { uri }) {
       if (action === 'delete') {
         this.$bvModal
-          .msgBoxConfirm(this.$tc('pageEventLogs.modal.deleteMessage'), {
-            title: this.$tc('pageEventLogs.modal.deleteTitle'),
+          .msgBoxConfirm(i18n.global.t('pageEventLogs.modal.deleteMessage'), {
+            title: i18n.global.t('pageEventLogs.modal.deleteTitle'),
             okTitle: i18n.global.t('global.action.delete'),
             cancelTitle: i18n.global.t('global.action.cancel'),
             autoFocusButton: 'ok',
@@ -551,12 +551,12 @@
         const uris = this.selectedRows.map((row) => row.uri);
         this.$bvModal
           .msgBoxConfirm(
-            this.$tc(
+            i18n.global.t(
               'pageEventLogs.modal.deleteMessage',
               this.selectedRows.length,
             ),
             {
-              title: this.$tc(
+              title: i18n.global.t(
                 'pageEventLogs.modal.deleteTitle',
                 this.selectedRows.length,
               ),
@@ -575,7 +575,7 @@
                   )
                   .then(() => {
                     this.successToast(
-                      this.$tc(
+                      i18n.global.t(
                         'pageEventLogs.toast.successDelete',
                         uris.length,
                       ),
diff --git a/src/views/Logs/PostCodeLogs/PostCodeLogs.vue b/src/views/Logs/PostCodeLogs/PostCodeLogs.vue
index ad62afc..6d8ff90 100644
--- a/src/views/Logs/PostCodeLogs/PostCodeLogs.vue
+++ b/src/views/Logs/PostCodeLogs/PostCodeLogs.vue
@@ -97,8 +97,8 @@
           </template>
           <!-- Date column -->
           <template #cell(date)="{ value }">
-            <p class="mb-0">{{ value }}</p>
-            <p class="mb-0">{{ value }}</p>
+            <p class="mb-0">{{ $filters.formatDate(value) }}</p>
+            <p class="mb-0">{{ $filters.formatTime(value) }}</p>
           </template>
 
           <!-- Actions column -->
@@ -186,6 +186,8 @@
 import SearchFilterMixin, {
   searchFilter,
 } from '@/components/Mixins/SearchFilterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: {
@@ -218,6 +220,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -226,20 +229,20 @@
         },
         {
           key: 'date',
-          label: this.$t('pagePostCodeLogs.table.created'),
+          label: i18n.global.t('pagePostCodeLogs.table.created'),
           sortable: true,
         },
         {
           key: 'timeStampOffset',
-          label: this.$t('pagePostCodeLogs.table.timeStampOffset'),
+          label: i18n.global.t('pagePostCodeLogs.table.timeStampOffset'),
         },
         {
           key: 'bootCount',
-          label: this.$t('pagePostCodeLogs.table.bootCount'),
+          label: i18n.global.t('pagePostCodeLogs.table.bootCount'),
         },
         {
           key: 'postCode',
-          label: this.$t('pagePostCodeLogs.table.postCode'),
+          label: i18n.global.t('pagePostCodeLogs.table.postCode'),
         },
         {
           key: 'actions',
@@ -278,11 +281,11 @@
             actions: [
               {
                 value: 'export',
-                title: this.$t('pagePostCodeLogs.action.exportLogs'),
+                title: i18n.global.t('pagePostCodeLogs.action.exportLogs'),
               },
               {
                 value: 'download',
-                title: this.$t('pagePostCodeLogs.action.downloadDetails'),
+                title: i18n.global.t('pagePostCodeLogs.action.downloadDetails'),
               },
             ],
           };
@@ -316,11 +319,11 @@
   methods: {
     deleteAllLogs() {
       this.$bvModal
-        .msgBoxConfirm(this.$t('pageEventLogs.modal.deleteAllMessage'), {
-          title: this.$t('pageEventLogs.modal.deleteAllTitle'),
-          okTitle: this.$t('global.action.delete'),
+        .msgBoxConfirm(i18n.global.t('pageEventLogs.modal.deleteAllMessage'), {
+          title: i18n.global.t('pageEventLogs.modal.deleteAllTitle'),
+          okTitle: i18n.global.t('global.action.delete'),
           okVariant: 'danger',
-          cancelTitle: this.$t('global.action.cancel'),
+          cancelTitle: i18n.global.t('global.action.cancel'),
           autoFocusButton: 'cancel',
         })
         .then((deleteConfirmed) => {
@@ -361,11 +364,11 @@
         date.toString().split(':').join('-').split(' ')[4];
       let fileName;
       if (value === 'download') {
-        fileName = this.$t('pagePostCodeLogs.downloadFilePrefix');
+        fileName = i18n.global.t('pagePostCodeLogs.downloadFilePrefix');
       } else if (value === 'export') {
-        fileName = this.$t('pagePostCodeLogs.exportFilePrefix');
+        fileName = i18n.global.t('pagePostCodeLogs.exportFilePrefix');
       } else {
-        fileName = this.$t('pagePostCodeLogs.allExportFilePrefix');
+        fileName = i18n.global.t('pagePostCodeLogs.allExportFilePrefix');
       }
       return fileName + date;
     },
diff --git a/src/views/Operations/FactoryReset/FactoryReset.vue b/src/views/Operations/FactoryReset/FactoryReset.vue
index 40330b1..f59b0a2 100644
--- a/src/views/Operations/FactoryReset/FactoryReset.vue
+++ b/src/views/Operations/FactoryReset/FactoryReset.vue
@@ -60,6 +60,7 @@
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 import ModalReset from './FactoryResetModal';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'FactoryReset',
@@ -67,6 +68,7 @@
   mixins: [LoadingBarMixin, BVToastMixin],
   data() {
     return {
+      $t: useI18n().t,
       resetOption: 'resetBios',
     };
   },
diff --git a/src/views/Operations/FactoryReset/FactoryResetModal.vue b/src/views/Operations/FactoryReset/FactoryResetModal.vue
index 55ac176..8784d4a 100644
--- a/src/views/Operations/FactoryReset/FactoryResetModal.vue
+++ b/src/views/Operations/FactoryReset/FactoryResetModal.vue
@@ -32,13 +32,13 @@
       <b-form-checkbox
         v-model="confirm"
         aria-describedby="reset-to-default-warning"
-        @input="$v.confirm.$touch()"
+        @input="v$.confirm.$touch()"
       >
         {{ $t(`pageFactoryReset.modal.resetWarningCheckLabel`) }}
       </b-form-checkbox>
       <b-form-invalid-feedback
         role="alert"
-        :state="getValidationState($v.confirm)"
+        :state="getValidationState(v$.confirm)"
       >
         {{ $t('global.form.fieldRequired') }}
       </b-form-invalid-feedback>
@@ -66,6 +66,7 @@
 <script>
 import StatusIcon from '@/components/Global/StatusIcon';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   components: { StatusIcon },
@@ -78,6 +79,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       confirm: false,
     };
   },
@@ -98,15 +100,15 @@
   },
   methods: {
     handleConfirm() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('okConfirm');
       this.$nextTick(() => this.$refs.modal.hide());
       this.resetConfirm();
     },
     resetConfirm() {
       this.confirm = false;
-      this.$v.$reset();
+      this.v$.$reset();
     },
   },
 };
diff --git a/src/views/Operations/Firmware/Firmware.vue b/src/views/Operations/Firmware/Firmware.vue
index 44a721a..db1a4c7 100644
--- a/src/views/Operations/Firmware/Firmware.vue
+++ b/src/views/Operations/Firmware/Firmware.vue
@@ -46,6 +46,7 @@
 import PageTitle from '@/components/Global/PageTitle';
 
 import LoadingBarMixin, { loading } from '@/components/Mixins/LoadingBarMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'FirmwareSingleImage',
@@ -64,6 +65,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       loading,
       isServerPowerOffRequired:
         process.env.VUE_APP_SERVER_OFF_REQUIRED === 'true',
diff --git a/src/views/Operations/Firmware/FirmwareAlertServerPower.vue b/src/views/Operations/Firmware/FirmwareAlertServerPower.vue
index 08e4ae9..94cac57 100644
--- a/src/views/Operations/Firmware/FirmwareAlertServerPower.vue
+++ b/src/views/Operations/Firmware/FirmwareAlertServerPower.vue
@@ -32,6 +32,7 @@
 
 <script>
 import Alert from '@/components/Global/Alert';
+import { useI18n } from 'vue-i18n';
 
 export default {
   components: { Alert },
@@ -42,6 +43,11 @@
       default: true,
     },
   },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     isOperationInProgress() {
       return this.$store.getters['controls/isOperationInProgress'];
diff --git a/src/views/Operations/Firmware/FirmwareCardsBmc.vue b/src/views/Operations/Firmware/FirmwareCardsBmc.vue
index bfca14c..2d18d5b 100644
--- a/src/views/Operations/Firmware/FirmwareCardsBmc.vue
+++ b/src/views/Operations/Firmware/FirmwareCardsBmc.vue
@@ -58,6 +58,8 @@
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 
 import ModalSwitchToRunning from './FirmwareModalSwitchToRunning';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { IconSwitch, ModalSwitchToRunning, PageSection },
@@ -76,6 +78,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       loading,
       switchToBackupImageDisabled:
         process.env.VUE_APP_SWITCH_TO_BACKUP_IMAGE_DISABLED === 'true',
@@ -87,9 +90,9 @@
     },
     sectionTitle() {
       if (this.isSingleFileUploadEnabled) {
-        return this.$t('pageFirmware.sectionTitleBmcCardsCombined');
+        return i18n.global.t('pageFirmware.sectionTitleBmcCardsCombined');
       }
-      return this.$t('pageFirmware.sectionTitleBmcCards');
+      return i18n.global.t('pageFirmware.sectionTitleBmcCards');
     },
     running() {
       return this.$store.getters['firmware/activeBmcFirmware'];
@@ -117,18 +120,24 @@
       this.startLoader();
       const timerId = setTimeout(() => {
         this.endLoader();
-        this.infoToast(this.$t('pageFirmware.toast.verifySwitchMessage'), {
-          title: this.$t('pageFirmware.toast.verifySwitch'),
-          refreshAction: true,
-        });
+        this.infoToast(
+          i18n.global.t('pageFirmware.toast.verifySwitchMessage'),
+          {
+            title: i18n.global.t('pageFirmware.toast.verifySwitch'),
+            refreshAction: true,
+          },
+        );
       }, 60000);
 
       this.$store
         .dispatch('firmware/switchBmcFirmwareAndReboot')
         .then(() =>
-          this.infoToast(this.$t('pageFirmware.toast.rebootStartedMessage'), {
-            title: this.$t('pageFirmware.toast.rebootStarted'),
-          }),
+          this.infoToast(
+            i18n.global.t('pageFirmware.toast.rebootStartedMessage'),
+            {
+              title: i18n.global.t('pageFirmware.toast.rebootStarted'),
+            },
+          ),
         )
         .catch(({ message }) => {
           this.errorToast(message);
diff --git a/src/views/Operations/Firmware/FirmwareCardsHost.vue b/src/views/Operations/Firmware/FirmwareCardsHost.vue
index 8fd0cac..852e9fb 100644
--- a/src/views/Operations/Firmware/FirmwareCardsHost.vue
+++ b/src/views/Operations/Firmware/FirmwareCardsHost.vue
@@ -38,9 +38,15 @@
 
 <script>
 import PageSection from '@/components/Global/PageSection';
+import { useI18n } from 'vue-i18n';
 
 export default {
   components: { PageSection },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     running() {
       return this.$store.getters['firmware/activeHostFirmware'];
diff --git a/src/views/Operations/Firmware/FirmwareFormUpdate.vue b/src/views/Operations/Firmware/FirmwareFormUpdate.vue
index 554d1d4..dc3161b 100644
--- a/src/views/Operations/Firmware/FirmwareFormUpdate.vue
+++ b/src/views/Operations/Firmware/FirmwareFormUpdate.vue
@@ -82,6 +82,8 @@
 
 import FormFile from '@/components/Global/FormFile';
 import ModalUpdateFirmware from './FirmwareModalUpdateFirmware';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: { FormFile, ModalUpdateFirmware },
@@ -99,11 +101,12 @@
   },
   setup() {
     return {
-      v$: useVuelidate(),
+      $v: useVuelidate(),
     };
   },
   data() {
     return {
+      $t: useI18n().t,
       loading,
       isWorkstationSelected: true,
       file: null,
@@ -146,13 +149,16 @@
       this.startLoader();
       const timerId = setTimeout(() => {
         this.endLoader();
-        this.infoToast(this.$t('pageFirmware.toast.verifyUpdateMessage'), {
-          title: this.$t('pageFirmware.toast.verifyUpdate'),
-          refreshAction: true,
-        });
+        this.infoToast(
+          i18n.global.t('pageFirmware.toast.verifyUpdateMessage'),
+          {
+            title: i18n.global.t('pageFirmware.toast.verifyUpdate'),
+            refreshAction: true,
+          },
+        );
       }, 360000);
-      this.infoToast(this.$t('pageFirmware.toast.updateStartedMessage'), {
-        title: this.$t('pageFirmware.toast.updateStarted'),
+      this.infoToast(i18n.global.t('pageFirmware.toast.updateStartedMessage'), {
+        title: i18n.global.t('pageFirmware.toast.updateStarted'),
         timestamp: true,
       });
       if (this.isWorkstationSelected) {
diff --git a/src/views/Operations/Firmware/FirmwareModalSwitchToRunning.vue b/src/views/Operations/Firmware/FirmwareModalSwitchToRunning.vue
index dc4a497..9af8fb5 100644
--- a/src/views/Operations/Firmware/FirmwareModalSwitchToRunning.vue
+++ b/src/views/Operations/Firmware/FirmwareModalSwitchToRunning.vue
@@ -20,6 +20,7 @@
 </template>
 
 <script>
+import { useI18n } from 'vue-i18n';
 export default {
   props: {
     backup: {
@@ -27,5 +28,10 @@
       required: true,
     },
   },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
 };
 </script>
diff --git a/src/views/Operations/Firmware/FirmwareModalUpdateFirmware.vue b/src/views/Operations/Firmware/FirmwareModalUpdateFirmware.vue
index 1835521..183cab7 100644
--- a/src/views/Operations/Firmware/FirmwareModalUpdateFirmware.vue
+++ b/src/views/Operations/Firmware/FirmwareModalUpdateFirmware.vue
@@ -28,7 +28,13 @@
 </template>
 
 <script>
+import { useI18n } from 'vue-i18n';
 export default {
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     runningBmc() {
       return this.$store.getters['firmware/activeBmcFirmware'];
diff --git a/src/views/Operations/KeyClear/KeyClear.vue b/src/views/Operations/KeyClear/KeyClear.vue
index fbdf4c4..7baad34 100644
--- a/src/views/Operations/KeyClear/KeyClear.vue
+++ b/src/views/Operations/KeyClear/KeyClear.vue
@@ -69,6 +69,8 @@
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 import Alert from '@/components/Global/Alert';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'KeyClear',
@@ -76,6 +78,7 @@
   mixins: [LoadingBarMixin, BVToastMixin],
   data() {
     return {
+      $t: useI18n().t,
       keyOption: 'NONE',
       username: this.$store.getters['global/username'],
     };
@@ -86,11 +89,11 @@
   methods: {
     onKeyClearSubmit(valueSelected) {
       this.$bvModal
-        .msgBoxConfirm(this.$t('pageKeyClear.modal.clearAllMessage'), {
-          title: this.$t('pageKeyClear.modal.clearAllTitle'),
-          okTitle: this.$t('pageKeyClear.modal.clear'),
+        .msgBoxConfirm(i18n.global.t('pageKeyClear.modal.clearAllMessage'), {
+          title: i18n.global.t('pageKeyClear.modal.clearAllTitle'),
+          okTitle: i18n.global.t('pageKeyClear.modal.clear'),
           okVariant: 'danger',
-          cancelTitle: this.$t('global.action.cancel'),
+          cancelTitle: i18n.global.t('global.action.cancel'),
           autoFocusButton: 'cancel',
         })
         .then((clearConfirmed) => {
diff --git a/src/views/Operations/Kvm/KvmConsole.vue b/src/views/Operations/Kvm/KvmConsole.vue
index cc623e4..6e2a4ea 100644
--- a/src/views/Operations/Kvm/KvmConsole.vue
+++ b/src/views/Operations/Kvm/KvmConsole.vue
@@ -46,6 +46,8 @@
 import IconLaunch from '@carbon/icons-vue/es/launch/20';
 import IconArrowDown from '@carbon/icons-vue/es/arrow--down/16';
 import { throttle } from 'lodash';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 const Connecting = 0;
 const Connected = 1;
@@ -62,6 +64,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       rfb: null,
       isConnected: false,
       terminalClass: this.isFullWindow ? 'full-window' : '',
@@ -82,11 +85,11 @@
     },
     serverStatus() {
       if (this.status === Connected) {
-        return this.$t('pageKvm.connected');
+        return i18n.global.t('pageKvm.connected');
       } else if (this.status === Disconnected) {
-        return this.$t('pageKvm.disconnected');
+        return i18n.global.t('pageKvm.disconnected');
       }
-      return this.$t('pageKvm.connecting');
+      return i18n.global.t('pageKvm.connecting');
     },
   },
   created() {
diff --git a/src/views/Operations/RebootBmc/RebootBmc.vue b/src/views/Operations/RebootBmc/RebootBmc.vue
index e56e968..0865d77 100644
--- a/src/views/Operations/RebootBmc/RebootBmc.vue
+++ b/src/views/Operations/RebootBmc/RebootBmc.vue
@@ -11,8 +11,8 @@
                   {{ $t('pageRebootBmc.lastReboot') }}
                 </dt>
                 <dd v-if="lastBmcRebootTime">
-                  {{ lastBmcRebootTime }}
-                  {{ lastBmcRebootTime }}
+                  {{ $filters.formatDate(lastBmcRebootTime) }}
+                  {{ $filters.formatTime(lastBmcRebootTime) }}
                 </dd>
                 <dd v-else>--</dd>
               </dl>
@@ -38,6 +38,8 @@
 import PageSection from '@/components/Global/PageSection';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'RebootBmc',
@@ -47,6 +49,11 @@
     this.hideLoader();
     next();
   },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
   computed: {
     lastBmcRebootTime() {
       return this.$store.getters['controls/lastBmcRebootTime'];
@@ -61,10 +68,10 @@
   methods: {
     onClick() {
       this.$bvModal
-        .msgBoxConfirm(this.$t('pageRebootBmc.modal.confirmMessage'), {
-          title: this.$t('pageRebootBmc.modal.confirmTitle'),
-          okTitle: this.$t('global.action.confirm'),
-          cancelTitle: this.$t('global.action.cancel'),
+        .msgBoxConfirm(i18n.global.t('pageRebootBmc.modal.confirmMessage'), {
+          title: i18n.global.t('pageRebootBmc.modal.confirmTitle'),
+          okTitle: i18n.global.t('global.action.confirm'),
+          cancelTitle: i18n.global.t('global.action.cancel'),
           autoFocusButton: 'ok',
         })
         .then((confirmed) => {
diff --git a/src/views/Operations/SerialOverLan/SerialOverLan.vue b/src/views/Operations/SerialOverLan/SerialOverLan.vue
index 48a6834..b9d3f2e 100644
--- a/src/views/Operations/SerialOverLan/SerialOverLan.vue
+++ b/src/views/Operations/SerialOverLan/SerialOverLan.vue
@@ -12,6 +12,7 @@
 import PageTitle from '@/components/Global/PageTitle';
 import PageSection from '@/components/Global/PageSection';
 import SerialOverLanConsole from './SerialOverLanConsole';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'SerialOverLan',
@@ -20,5 +21,10 @@
     PageTitle,
     SerialOverLanConsole,
   },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
 };
 </script>
diff --git a/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue b/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue
index 8b4cd22..b711422 100644
--- a/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue
+++ b/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue
@@ -50,6 +50,7 @@
 import { throttle } from 'lodash';
 import IconLaunch from '@carbon/icons-vue/es/launch/20';
 import StatusIcon from '@/components/Global/StatusIcon';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'SerialOverLanConsole',
@@ -66,6 +67,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       resizeConsoleWindow: null,
     };
   },
diff --git a/src/views/Operations/ServerPowerOperations/BootSettings.vue b/src/views/Operations/ServerPowerOperations/BootSettings.vue
index c74fd01..a7bcfaa 100644
--- a/src/views/Operations/ServerPowerOperations/BootSettings.vue
+++ b/src/views/Operations/ServerPowerOperations/BootSettings.vue
@@ -21,7 +21,7 @@
         v-model="form.oneTimeBoot"
         class="mb-4"
         :disabled="form.bootOption === 'None'"
-        @change="$v.form.oneTimeBoot.$touch()"
+        @change="v$.form.oneTimeBoot.$touch()"
       >
         {{ $t('pageServerPowerOperations.bootSettings.enableOneTimeBoot') }}
       </b-form-checkbox>
@@ -37,7 +37,7 @@
           id="tpm-required-policy"
           v-model="form.tpmPolicyOn"
           aria-describedby="tpm-required-policy-help-block"
-          @change="$v.form.tpmPolicyOn.$touch()"
+          @change="v$.form.tpmPolicyOn.$touch()"
         >
           {{ $t('global.status.enabled') }}
         </b-form-checkbox>
@@ -53,12 +53,14 @@
 import { mapState } from 'vuex';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'BootSettings',
   mixins: [BVToastMixin, LoadingBarMixin],
   data() {
     return {
+      $t: useI18n().t,
       form: {
         bootOption: this.$store.getters['serverBootSettings/bootSource'],
         oneTimeBoot: this.$store.getters['serverBootSettings/overrideEnabled'],
@@ -104,7 +106,7 @@
   methods: {
     handleSubmit() {
       this.startLoader();
-      const tpmPolicyChanged = this.$v.form.tpmPolicyOn.$dirty;
+      const tpmPolicyChanged = this.v$.form.tpmPolicyOn.$dirty;
       let settings;
       let bootSource = this.form.bootOption;
       let overrideEnabled = this.form.oneTimeBoot;
@@ -118,12 +120,12 @@
         .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => {
-          this.$v.form.$reset();
+          this.v$.form.$reset();
           this.endLoader();
         });
     },
     onChangeSelect(selectedOption) {
-      this.$v.form.bootOption.$touch();
+      this.v$.form.bootOption.$touch();
       // Disable one time boot if selected boot option is 'None'
       if (selectedOption === 'None') this.form.oneTimeBoot = false;
     },
diff --git a/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue b/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue
index 4e26ee1..caa608e 100644
--- a/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue
+++ b/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue
@@ -44,8 +44,8 @@
                   v-if="lastPowerOperationTime"
                   data-test-id="powerServerOps-text-lastPowerOp"
                 >
-                  {{ lastPowerOperationTime }}
-                  {{ lastPowerOperationTime }}
+                  {{ $filters.formatDate(lastPowerOperationTime) }}
+                  {{ $filters.formatTime(lastPowerOperationTime) }}
                 </dd>
                 <dd v-else>--</dd>
               </dl>
@@ -158,6 +158,8 @@
 import BootSettings from './BootSettings';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 import Alert from '@/components/Global/Alert';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'ServerPowerOperations',
@@ -169,6 +171,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         rebootOption: 'orderly',
         shutdownOption: 'orderly',
@@ -212,13 +215,15 @@
       this.$store.dispatch('controls/serverPowerOn');
     },
     rebootServer() {
-      const modalMessage = this.$t(
+      const modalMessage = i18n.global.t(
         'pageServerPowerOperations.modal.confirmRebootMessage',
       );
       const modalOptions = {
-        title: this.$t('pageServerPowerOperations.modal.confirmRebootTitle'),
-        okTitle: this.$t('global.action.confirm'),
-        cancelTitle: this.$t('global.action.cancel'),
+        title: i18n.global.t(
+          'pageServerPowerOperations.modal.confirmRebootTitle',
+        ),
+        okTitle: i18n.global.t('global.action.confirm'),
+        cancelTitle: i18n.global.t('global.action.cancel'),
         autoFocusButton: 'ok',
       };
 
@@ -237,13 +242,15 @@
       }
     },
     shutdownServer() {
-      const modalMessage = this.$t(
+      const modalMessage = i18n.global.t(
         'pageServerPowerOperations.modal.confirmShutdownMessage',
       );
       const modalOptions = {
-        title: this.$t('pageServerPowerOperations.modal.confirmShutdownTitle'),
-        okTitle: this.$t('global.action.confirm'),
-        cancelTitle: this.$t('global.action.cancel'),
+        title: i18n.global.t(
+          'pageServerPowerOperations.modal.confirmShutdownTitle',
+        ),
+        okTitle: i18n.global.t('global.action.confirm'),
+        cancelTitle: i18n.global.t('global.action.cancel'),
         autoFocusButton: 'ok',
       };
 
diff --git a/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue b/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue
index 61e2050..f8d4af0 100644
--- a/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue
+++ b/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue
@@ -18,12 +18,12 @@
           id="serverUri"
           v-model="form.serverUri"
           type="text"
-          :state="getValidationState($v.form.serverUri)"
+          :state="getValidationState(v$.form.serverUri)"
           data-test-id="configureConnection-input-serverUri"
-          @input="$v.form.serverUri.$touch()"
+          @input="v$.form.serverUri.$touch()"
         />
         <b-form-invalid-feedback role="alert">
-          <template v-if="!$v.form.serverUri.required">
+          <template v-if="!v$.form.serverUri.required">
             {{ $t('global.form.fieldRequired') }}
           </template>
         </b-form-invalid-feedback>
@@ -73,6 +73,7 @@
 import { required } from '@vuelidate/validators';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
 
 export default {
   mixins: [VuelidateMixin],
@@ -93,6 +94,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         serverUri: null,
         username: null,
@@ -118,8 +120,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       let connectionData = {};
       Object.assign(connectionData, this.form);
       this.$emit('ok', connectionData);
@@ -140,7 +142,7 @@
       this.form.username = null;
       this.form.password = null;
       this.form.isRW = false;
-      this.$v.$reset();
+      this.v$.$reset();
     },
     onOk(bvModalEvt) {
       bvModalEvt.preventDefault();
diff --git a/src/views/Operations/VirtualMedia/VirtualMedia.vue b/src/views/Operations/VirtualMedia/VirtualMedia.vue
index 9ad1b1e..e158059 100644
--- a/src/views/Operations/VirtualMedia/VirtualMedia.vue
+++ b/src/views/Operations/VirtualMedia/VirtualMedia.vue
@@ -104,6 +104,8 @@
 import ModalConfigureConnection from './ModalConfigureConnection';
 import NbdServer from '@/utilities/NBDServer';
 import FormFile from '@/components/Global/FormFile';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'VirtualMedia',
@@ -111,6 +113,7 @@
   mixins: [BVToastMixin, LoadingBarMixin],
   data() {
     return {
+      $t: useI18n().t,
       modalConfigureConnection: null,
       loadImageFromExternalServer:
         process.env.VUE_APP_VIRTUAL_MEDIA_LIST_ENABLED === 'true'
@@ -144,17 +147,21 @@
         token,
       );
       device.nbd.socketStarted = () =>
-        this.successToast(this.$t('pageVirtualMedia.toast.serverRunning'));
+        this.successToast(
+          i18n.global.t('pageVirtualMedia.toast.serverRunning'),
+        );
       device.nbd.errorReadingFile = () =>
-        this.errorToast(this.$t('pageVirtualMedia.toast.errorReadingFile'));
+        this.errorToast(
+          i18n.global.t('pageVirtualMedia.toast.errorReadingFile'),
+        );
       device.nbd.socketClosed = (code) => {
         if (code === 1000)
           this.successToast(
-            this.$t('pageVirtualMedia.toast.serverClosedSuccessfully'),
+            i18n.global.t('pageVirtualMedia.toast.serverClosedSuccessfully'),
           );
         else
           this.errorToast(
-            this.$t('pageVirtualMedia.toast.serverClosedWithErrors'),
+            i18n.global.t('pageVirtualMedia.toast.serverClosedWithErrors'),
           );
         device.file = null;
         device.isActive = false;
@@ -180,12 +187,14 @@
         })
         .then(() => {
           this.successToast(
-            this.$t('pageVirtualMedia.toast.serverConnectionEstablished'),
+            i18n.global.t('pageVirtualMedia.toast.serverConnectionEstablished'),
           );
           connectionData.isActive = true;
         })
         .catch(() => {
-          this.errorToast(this.$t('pageVirtualMedia.toast.errorMounting'));
+          this.errorToast(
+            i18n.global.t('pageVirtualMedia.toast.errorMounting'),
+          );
           this.isActive = false;
         })
         .finally(() => this.endLoader());
@@ -195,12 +204,14 @@
         .dispatch('virtualMedia/unmountImage', connectionData.id)
         .then(() => {
           this.successToast(
-            this.$t('pageVirtualMedia.toast.serverClosedSuccessfully'),
+            i18n.global.t('pageVirtualMedia.toast.serverClosedSuccessfully'),
           );
           connectionData.isActive = false;
         })
         .catch(() =>
-          this.errorToast(this.$t('pageVirtualMedia.toast.errorUnmounting')),
+          this.errorToast(
+            i18n.global.t('pageVirtualMedia.toast.errorUnmounting'),
+          ),
         )
         .finally(() => this.endLoader());
     },
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index ef9ab12..506de11 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -5,7 +5,8 @@
         <dl>
           <dt>{{ $t('pageOverview.bmcTime') }}</dt>
           <dd v-if="bmcTime" data-test-id="overviewQuickLinks-text-bmcTime">
-            {{ bmcTime }} {{ bmcTime }}
+            {{ $filters.formatDate(bmcTime) }}
+            {{ $filters.formatDate(bmcTime) }}
           </dd>
           <dd v-else>--</dd>
         </dl>
diff --git a/src/views/PageNotFound/PageNotFound.vue b/src/views/PageNotFound/PageNotFound.vue
index 91341db..77e596c 100644
--- a/src/views/PageNotFound/PageNotFound.vue
+++ b/src/views/PageNotFound/PageNotFound.vue
@@ -5,8 +5,15 @@
 </template>
 <script>
 import PageTitle from '@/components/Global/PageTitle';
+import { useI18n } from 'vue-i18n';
+
 export default {
   name: 'PageNotFound',
   components: { PageTitle },
+  data() {
+    return {
+      $t: useI18n().t,
+    };
+  },
 };
 </script>
diff --git a/src/views/ProfileSettings/ProfileSettings.vue b/src/views/ProfileSettings/ProfileSettings.vue
index aa32574..6fc9c1e 100644
--- a/src/views/ProfileSettings/ProfileSettings.vue
+++ b/src/views/ProfileSettings/ProfileSettings.vue
@@ -57,16 +57,16 @@
                   v-model="form.newPassword"
                   type="password"
                   aria-describedby="password-help-block"
-                  :state="getValidationState($v.form.newPassword)"
+                  :state="getValidationState(v$.form.newPassword)"
                   data-test-id="profileSettings-input-newPassword"
                   class="form-control-with-button"
-                  @input="$v.form.newPassword.$touch()"
+                  @input="v$.form.newPassword.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
                   <template
                     v-if="
-                      !$v.form.newPassword.minLength ||
-                      !$v.form.newPassword.maxLength
+                      !v$.form.newPassword.minLength ||
+                      !v$.form.newPassword.maxLength
                     "
                   >
                     {{
@@ -89,13 +89,13 @@
                   id="password-confirmation"
                   v-model="form.confirmPassword"
                   type="password"
-                  :state="getValidationState($v.form.confirmPassword)"
+                  :state="getValidationState(v$.form.confirmPassword)"
                   data-test-id="profileSettings-input-confirmPassword"
                   class="form-control-with-button"
-                  @input="$v.form.confirmPassword.$touch()"
+                  @input="v$.form.confirmPassword.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
-                  <template v-if="!$v.form.confirmPassword.sameAsPassword">
+                  <template v-if="!v$.form.confirmPassword.sameAsPassword">
                     {{ $t('pageProfileSettings.passwordsDoNotMatch') }}
                   </template>
                 </b-form-invalid-feedback>
@@ -152,6 +152,8 @@
 import PageSection from '@/components/Global/PageSection';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'ProfileSettings',
@@ -169,6 +171,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         newPassword: '',
         confirmPassword: '',
@@ -209,9 +212,9 @@
   },
   methods: {
     saveNewPasswordInputData() {
-      this.$v.form.confirmPassword.$touch();
-      this.$v.form.newPassword.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.form.confirmPassword.$touch();
+      this.v$.form.newPassword.$touch();
+      if (this.v$.$invalid) return;
       let userData = {
         originalUsername: this.username,
         password: this.form.newPassword,
@@ -223,7 +226,7 @@
           (this.form.newPassword = ''),
             (this.form.confirmPassword = ''),
             (this.form.currentPassword = '');
-          this.$v.$reset();
+          this.v$.$reset();
           this.successToast(message);
           this.$store.dispatch('authentication/logout');
         })
@@ -233,7 +236,7 @@
       localStorage.setItem('storedUtcDisplay', this.form.isUtcDisplay);
       this.$store.commit('global/setUtcTime', this.form.isUtcDisplay);
       this.successToast(
-        this.$t('pageProfileSettings.toast.successUpdatingTimeZone'),
+        i18n.global.t('pageProfileSettings.toast.successUpdatingTimeZone'),
       );
     },
     submitForm() {
@@ -251,8 +254,8 @@
       }
     },
     confirmAuthenticate() {
-      this.$v.form.newPassword.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.form.newPassword.$touch();
+      if (this.v$.$invalid) return;
 
       const username = this.username;
       const password = this.form.currentPassword;
@@ -263,9 +266,9 @@
           this.saveNewPasswordInputData();
         })
         .catch(() => {
-          this.$v.$reset();
+          this.v$.$reset();
           this.errorToast(
-            this.$t('pageProfileSettings.toast.wrongCredentials'),
+            i18n.global.t('pageProfileSettings.toast.wrongCredentials'),
           );
         });
     },
diff --git a/src/views/ResourceManagement/Power.vue b/src/views/ResourceManagement/Power.vue
index 8a9503f..12e4868 100644
--- a/src/views/ResourceManagement/Power.vue
+++ b/src/views/ResourceManagement/Power.vue
@@ -56,14 +56,14 @@
                 data-test-id="power-input-powerCapValue"
                 type="number"
                 aria-describedby="power-help-text"
-                :state="getValidationState($v.powerCapValue)"
+                :state="getValidationState(v$.powerCapValue)"
               ></b-form-input>
 
               <b-form-invalid-feedback id="input-live-feedback" role="alert">
-                <template v-if="!$v.powerCapValue.required">
+                <template v-if="!v$.powerCapValue.required">
                   {{ $t('global.form.fieldRequired') }}
                 </template>
-                <template v-else-if="!$v.powerCapValue.between">
+                <template v-else-if="!v$.powerCapValue.between">
                   {{ $t('global.form.invalidValue') }}
                 </template>
               </b-form-invalid-feedback>
@@ -92,6 +92,7 @@
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import { requiredIf, between } from '@vuelidate/validators';
 import { mapGetters } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Power',
@@ -108,6 +109,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       loading,
     };
   },
@@ -125,7 +127,7 @@
         return this.powerCapValue !== null;
       },
       set(value) {
-        this.$v.$reset();
+        this.v$.$reset();
         let newValue = null;
         if (value) {
           if (this.powerCapValue) {
@@ -142,7 +144,7 @@
         return this.$store.getters['powerControl/powerCapValue'];
       },
       set(value) {
-        this.$v.$touch();
+        this.v$.$touch();
         this.$store.dispatch('powerControl/setPowerCapUpdatedValue', value);
       },
     },
@@ -163,8 +165,8 @@
   },
   methods: {
     submitForm() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.startLoader();
       this.$store
         .dispatch('powerControl/setPowerControl', this.powerCapValue)
diff --git a/src/views/SecurityAndAccess/Certificates/Certificates.vue b/src/views/SecurityAndAccess/Certificates/Certificates.vue
index bceab5d..a55b66c 100644
--- a/src/views/SecurityAndAccess/Certificates/Certificates.vue
+++ b/src/views/SecurityAndAccess/Certificates/Certificates.vue
@@ -63,7 +63,7 @@
           :empty-text="$t('global.table.emptyMessage')"
         >
           <template #cell(validFrom)="{ value }">
-            {{ value }}
+            {{ $filters.formatDate(value) }}
           </template>
 
           <template #cell(validUntil)="{ value }">
@@ -71,7 +71,7 @@
               v-if="getDaysUntilExpired(value) < 31"
               :status="getIconStatus(value)"
             />
-            {{ value }}
+            {{ $filters.formatDate(value) }}
           </template>
 
           <template #cell(actions)="{ value, item }">
@@ -113,6 +113,8 @@
 
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'Certificates',
@@ -134,29 +136,30 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       modalCertificate: null,
       fileTypeCorrect: undefined,
       fields: [
         {
           key: 'certificate',
-          label: this.$t('pageCertificates.table.certificate'),
+          label: i18n.global.t('pageCertificates.table.certificate'),
         },
         {
           key: 'issuedBy',
-          label: this.$t('pageCertificates.table.issuedBy'),
+          label: i18n.global.t('pageCertificates.table.issuedBy'),
         },
         {
           key: 'issuedTo',
-          label: this.$t('pageCertificates.table.issuedTo'),
+          label: i18n.global.t('pageCertificates.table.issuedTo'),
         },
         {
           key: 'validFrom',
-          label: this.$t('pageCertificates.table.validFrom'),
+          label: i18n.global.t('pageCertificates.table.validFrom'),
         },
         {
           key: 'validUntil',
-          label: this.$t('pageCertificates.table.validUntil'),
+          label: i18n.global.t('pageCertificates.table.validUntil'),
         },
         {
           key: 'actions',
@@ -177,11 +180,11 @@
           actions: [
             {
               value: 'replace',
-              title: this.$t('pageCertificates.replaceCertificate'),
+              title: i18n.global.t('pageCertificates.replaceCertificate'),
             },
             {
               value: 'delete',
-              title: this.$t('pageCertificates.deleteCertificate'),
+              title: i18n.global.t('pageCertificates.deleteCertificate'),
               enabled:
                 certificate.type === 'TrustStore Certificate' ? true : false,
             },
@@ -242,14 +245,14 @@
     initModalDeleteCertificate(certificate) {
       this.$bvModal
         .msgBoxConfirm(
-          this.$t('pageCertificates.modal.deleteConfirmMessage', {
+          i18n.global.t('pageCertificates.modal.deleteConfirmMessage', {
             issuedBy: certificate.issuedBy,
             certificate: certificate.certificate,
           }),
           {
-            title: this.$t('pageCertificates.deleteCertificate'),
-            okTitle: this.$t('global.action.delete'),
-            cancelTitle: this.$t('global.action.cancel'),
+            title: i18n.global.t('pageCertificates.deleteCertificate'),
+            okTitle: i18n.global.t('global.action.delete'),
+            cancelTitle: i18n.global.t('global.action.cancel'),
             autoFocusButton: 'ok',
           },
         )
@@ -265,9 +268,13 @@
           this.addNewCertificate(file, type);
         } else {
           this.errorToast(
-            this.$t('pageCertificates.alert.incorrectCertificateFileType'),
+            i18n.global.t(
+              'pageCertificates.alert.incorrectCertificateFileType',
+            ),
             {
-              title: this.$t('pageCertificates.toast.errorAddCertificate'),
+              title: i18n.global.t(
+                'pageCertificates.toast.errorAddCertificate',
+              ),
             },
           );
         }
diff --git a/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue b/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
index 03ab8f4..a74a1e4 100644
--- a/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
+++ b/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
@@ -8,7 +8,7 @@
       :title="$t('pageCertificates.modal.generateACertificateSigningRequest')"
       @ok="onOkGenerateCsrModal"
       @cancel="resetForm"
-      @hidden="$v.$reset()"
+      @hidden="v$.$reset()"
     >
       <b-form id="generate-csr-form" novalidate>
         <b-container fluid>
@@ -25,8 +25,8 @@
                       v-model="form.certificateType"
                       data-test-id="modalGenerateCsr-select-certificateType"
                       :options="certificateOptions"
-                      :state="getValidationState($v.form.certificateType)"
-                      @input="$v.form.certificateType.$touch()"
+                      :state="getValidationState(v$.form.certificateType)"
+                      @input="v$.form.certificateType.$touch()"
                     >
                       <template #first>
                         <b-form-select-option :value="null" disabled>
@@ -49,8 +49,8 @@
                       v-model="form.country"
                       data-test-id="modalGenerateCsr-select-country"
                       :options="countryOptions"
-                      :state="getValidationState($v.form.country)"
-                      @input="$v.form.country.$touch()"
+                      :state="getValidationState(v$.form.country)"
+                      @input="v$.form.country.$touch()"
                     >
                       <template #first>
                         <b-form-select-option :value="null" disabled>
@@ -75,7 +75,7 @@
                       v-model="form.state"
                       type="text"
                       data-test-id="modalGenerateCsr-input-state"
-                      :state="getValidationState($v.form.state)"
+                      :state="getValidationState(v$.form.state)"
                     />
                     <b-form-invalid-feedback role="alert">
                       {{ $t('global.form.fieldRequired') }}
@@ -92,7 +92,7 @@
                       v-model="form.city"
                       type="text"
                       data-test-id="modalGenerateCsr-input-city"
-                      :state="getValidationState($v.form.city)"
+                      :state="getValidationState(v$.form.city)"
                     />
                     <b-form-invalid-feedback role="alert">
                       {{ $t('global.form.fieldRequired') }}
@@ -111,7 +111,7 @@
                       v-model="form.companyName"
                       type="text"
                       data-test-id="modalGenerateCsr-input-companyName"
-                      :state="getValidationState($v.form.companyName)"
+                      :state="getValidationState(v$.form.companyName)"
                     />
                     <b-form-invalid-feedback role="alert">
                       {{ $t('global.form.fieldRequired') }}
@@ -128,7 +128,7 @@
                       v-model="form.companyUnit"
                       type="text"
                       data-test-id="modalGenerateCsr-input-companyUnit"
-                      :state="getValidationState($v.form.companyUnit)"
+                      :state="getValidationState(v$.form.companyUnit)"
                     />
                     <b-form-invalid-feedback role="alert">
                       {{ $t('global.form.fieldRequired') }}
@@ -147,7 +147,7 @@
                       v-model="form.commonName"
                       type="text"
                       data-test-id="modalGenerateCsr-input-commonName"
-                      :state="getValidationState($v.form.commonName)"
+                      :state="getValidationState(v$.form.commonName)"
                     />
                     <b-form-invalid-feedback role="alert">
                       {{ $t('global.form.fieldRequired') }}
@@ -240,8 +240,8 @@
                       v-model="form.keyPairAlgorithm"
                       data-test-id="modalGenerateCsr-select-keyPairAlgorithm"
                       :options="keyPairAlgorithmOptions"
-                      :state="getValidationState($v.form.keyPairAlgorithm)"
-                      @input="$v.form.keyPairAlgorithm.$touch()"
+                      :state="getValidationState(v$.form.keyPairAlgorithm)"
+                      @input="v$.form.keyPairAlgorithm.$touch()"
                     >
                       <template #first>
                         <b-form-select-option :value="null" disabled>
@@ -257,7 +257,7 @@
               </b-row>
               <b-row>
                 <b-col lg="12">
-                  <template v-if="$v.form.keyPairAlgorithm.$model === 'EC'">
+                  <template v-if="v$.form.keyPairAlgorithm.$model === 'EC'">
                     <b-form-group
                       :label="$t('pageCertificates.modal.keyCurveId')"
                       label-for="key-curve-id"
@@ -267,8 +267,8 @@
                         v-model="form.keyCurveId"
                         data-test-id="modalGenerateCsr-select-keyCurveId"
                         :options="keyCurveIdOptions"
-                        :state="getValidationState($v.form.keyCurveId)"
-                        @input="$v.form.keyCurveId.$touch()"
+                        :state="getValidationState(v$.form.keyCurveId)"
+                        @input="v$.form.keyCurveId.$touch()"
                       >
                         <template #first>
                           <b-form-select-option :value="null" disabled>
@@ -281,7 +281,7 @@
                       </b-form-invalid-feedback>
                     </b-form-group>
                   </template>
-                  <template v-if="$v.form.keyPairAlgorithm.$model === 'RSA'">
+                  <template v-if="v$.form.keyPairAlgorithm.$model === 'RSA'">
                     <b-form-group
                       :label="$t('pageCertificates.modal.keyBitLength')"
                       label-for="key-bit-length"
@@ -291,8 +291,8 @@
                         v-model="form.keyBitLength"
                         data-test-id="modalGenerateCsr-select-keyBitLength"
                         :options="keyBitLengthOptions"
-                        :state="getValidationState($v.form.keyBitLength)"
-                        @input="$v.form.keyBitLength.$touch()"
+                        :state="getValidationState(v$.form.keyBitLength)"
+                        @input="v$.form.keyBitLength.$touch()"
                       >
                         <template #first>
                           <b-form-select-option :value="null" disabled>
@@ -369,6 +369,7 @@
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'ModalGenerateCsr',
@@ -381,6 +382,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         certificateType: null,
         country: null,
@@ -449,14 +451,14 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$store
         .dispatch('certificates/generateCsr', this.form)
         .then(({ data: { CSRString } }) => {
           this.csrString = CSRString;
           this.$bvModal.show('csr-string');
-          this.$v.$reset();
+          this.v$.$reset();
         });
     },
     resetForm() {
diff --git a/src/views/SecurityAndAccess/Certificates/ModalUploadCertificate.vue b/src/views/SecurityAndAccess/Certificates/ModalUploadCertificate.vue
index 60170f1..3a8cd3f 100644
--- a/src/views/SecurityAndAccess/Certificates/ModalUploadCertificate.vue
+++ b/src/views/SecurityAndAccess/Certificates/ModalUploadCertificate.vue
@@ -27,12 +27,12 @@
             id="certificate-type"
             v-model="form.certificateType"
             :options="certificateOptions"
-            :state="getValidationState($v.form.certificateType)"
-            @input="$v.form.certificateType.$touch()"
+            :state="getValidationState(v$.form.certificateType)"
+            @input="v$.form.certificateType.$touch()"
           >
           </b-form-select>
           <b-form-invalid-feedback role="alert">
-            <template v-if="!$v.form.certificateType.required">
+            <template v-if="!v$.form.certificateType.required">
               {{ $t('global.form.fieldRequired') }}
             </template>
           </b-form-invalid-feedback>
@@ -44,7 +44,7 @@
           id="certificate-file"
           v-model="form.file"
           accept=".pem"
-          :state="getValidationState($v.form.file)"
+          :state="getValidationState(v$.form.file)"
         >
           <template #invalid>
             <b-form-invalid-feedback role="alert">
@@ -74,6 +74,7 @@
 import { useVuelidate } from '@vuelidate/core';
 
 import FormFile from '@/components/Global/FormFile';
+import { useI18n } from 'vue-i18n';
 
 export default {
   components: { FormFile },
@@ -98,6 +99,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         certificateType: null,
         file: null,
@@ -140,8 +142,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', {
         addNew: !this.certificate,
         file: this.form.file,
@@ -162,7 +164,7 @@
         ? this.certificateOptions[0].value
         : null;
       this.form.file = null;
-      this.$v.$reset();
+      this.v$.$reset();
     },
     onOk(bvModalEvt) {
       // prevent modal close
diff --git a/src/views/SecurityAndAccess/Ldap/Ldap.vue b/src/views/SecurityAndAccess/Ldap/Ldap.vue
index 28d2b1c..eab2737 100644
--- a/src/views/SecurityAndAccess/Ldap/Ldap.vue
+++ b/src/views/SecurityAndAccess/Ldap/Ldap.vue
@@ -44,7 +44,7 @@
                     :disabled="
                       !caCertificateExpiration || !ldapCertificateExpiration
                     "
-                    @change="$v.form.secureLdapEnabled.$touch()"
+                    @change="v$.form.secureLdapEnabled.$touch()"
                   >
                     {{ $t('global.action.enable') }}
                   </b-form-checkbox>
@@ -52,12 +52,12 @@
                 <dl>
                   <dt>{{ $t('pageLdap.form.caCertificateValidUntil') }}</dt>
                   <dd v-if="caCertificateExpiration">
-                    {{ caCertificateExpiration }}
+                    {{ $filters.formatDate(caCertificateExpiration) }}
                   </dd>
                   <dd v-else>--</dd>
                   <dt>{{ $t('pageLdap.form.ldapCertificateValidUntil') }}</dt>
                   <dd v-if="ldapCertificateExpiration">
-                    {{ ldapCertificateExpiration }}
+                    {{ $filters.formatDate(ldapCertificateExpiration) }}
                   </dd>
                   <dd v-else>--</dd>
                 </dl>
@@ -105,8 +105,8 @@
                           id="server-uri"
                           v-model="form.serverUri"
                           data-test-id="ldap-input-serverUri"
-                          :state="getValidationState($v.form.serverUri)"
-                          @change="$v.form.serverUri.$touch()"
+                          :state="getValidationState(v$.form.serverUri)"
+                          @change="v$.form.serverUri.$touch()"
                         />
                         <b-form-invalid-feedback role="alert">
                           {{ $t('global.form.fieldRequired') }}
@@ -123,8 +123,8 @@
                         id="bind-dn"
                         v-model="form.bindDn"
                         data-test-id="ldap-input-bindDn"
-                        :state="getValidationState($v.form.bindDn)"
-                        @change="$v.form.bindDn.$touch()"
+                        :state="getValidationState(v$.form.bindDn)"
+                        @change="v$.form.bindDn.$touch()"
                       />
                       <b-form-invalid-feedback role="alert">
                         {{ $t('global.form.fieldRequired') }}
@@ -143,9 +143,9 @@
                           id="bind-password"
                           v-model="form.bindPassword"
                           type="password"
-                          :state="getValidationState($v.form.bindPassword)"
+                          :state="getValidationState(v$.form.bindPassword)"
                           class="form-control-with-button"
-                          @change="$v.form.bindPassword.$touch()"
+                          @change="v$.form.bindPassword.$touch()"
                         />
                         <b-form-invalid-feedback role="alert">
                           {{ $t('global.form.fieldRequired') }}
@@ -162,8 +162,8 @@
                         id="base-dn"
                         v-model="form.baseDn"
                         data-test-id="ldap-input-baseDn"
-                        :state="getValidationState($v.form.baseDn)"
-                        @change="$v.form.baseDn.$touch()"
+                        :state="getValidationState(v$.form.baseDn)"
+                        @change="v$.form.baseDn.$touch()"
                       />
                       <b-form-invalid-feedback role="alert">
                         {{ $t('global.form.fieldRequired') }}
@@ -182,7 +182,7 @@
                         id="user-id-attribute"
                         v-model="form.userIdAttribute"
                         data-test-id="ldap-input-userIdAttribute"
-                        @change="$v.form.userIdAttribute.$touch()"
+                        @change="v$.form.userIdAttribute.$touch()"
                       />
                     </b-form-group>
                   </b-col>
@@ -198,7 +198,7 @@
                         id="group-id-attribute"
                         v-model="form.groupIdAttribute"
                         data-test-id="ldap-input-groupIdAttribute"
-                        @change="$v.form.groupIdAttribute.$touch()"
+                        @change="v$.form.groupIdAttribute.$touch()"
                       />
                     </b-form-group>
                   </b-col>
@@ -243,6 +243,7 @@
 import PageSection from '@/components/Global/PageSection';
 import InfoTooltip from '@/components/Global/InfoTooltip';
 import TableRoleGroups from './TableRoleGroups';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Ldap',
@@ -265,6 +266,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         ldapAuthenticationEnabled: this.$store.getters['ldap/isServiceEnabled'],
         secureLdapEnabled: false,
@@ -388,8 +390,8 @@
       this.form.groupIdAttribute = groupsAttribute;
     },
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       const data = {
         serviceEnabled: this.form.ldapAuthenticationEnabled,
         activeDirectoryEnabled: this.form.activeDirectoryEnabled,
@@ -411,12 +413,12 @@
         })
         .finally(() => {
           this.form.bindPassword = '';
-          this.$v.form.$reset();
+          this.v$.form.$reset();
           this.endLoader();
         });
     },
     onChangeServiceType(isActiveDirectoryEnabled) {
-      this.$v.form.activeDirectoryEnabled.$touch();
+      this.v$.form.activeDirectoryEnabled.$touch();
       const serviceType = isActiveDirectoryEnabled
         ? this.activeDirectory
         : this.ldap;
@@ -425,7 +427,7 @@
       this.setFormValues(serviceType);
     },
     onChangeldapAuthenticationEnabled(isServiceEnabled) {
-      this.$v.form.ldapAuthenticationEnabled.$touch();
+      this.v$.form.ldapAuthenticationEnabled.$touch();
       if (!isServiceEnabled) {
         // Request will fail if sent with empty values.
         // The frontend only checks for required fields
diff --git a/src/views/SecurityAndAccess/Ldap/ModalAddRoleGroup.vue b/src/views/SecurityAndAccess/Ldap/ModalAddRoleGroup.vue
index 9b50abd..d22aa6a 100644
--- a/src/views/SecurityAndAccess/Ldap/ModalAddRoleGroup.vue
+++ b/src/views/SecurityAndAccess/Ldap/ModalAddRoleGroup.vue
@@ -29,8 +29,8 @@
                 <b-form-input
                   id="role-group-name"
                   v-model="form.groupName"
-                  :state="getValidationState($v.form.groupName)"
-                  @input="$v.form.groupName.$touch()"
+                  :state="getValidationState(v$.form.groupName)"
+                  @input="v$.form.groupName.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
                   {{ $t('global.form.fieldRequired') }}
@@ -46,8 +46,8 @@
                 id="privilege"
                 v-model="form.groupPrivilege"
                 :options="accountRoles"
-                :state="getValidationState($v.form.groupPrivilege)"
-                @input="$v.form.groupPrivilege.$touch()"
+                :state="getValidationState(v$.form.groupPrivilege)"
+                @input="v$.form.groupPrivilege.$touch()"
               >
                 <template v-if="!roleGroup" #first>
                   <b-form-select-option :value="null" disabled>
@@ -83,6 +83,7 @@
 import { required, requiredIf } from '@vuelidate/validators';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
 
 export default {
   mixins: [VuelidateMixin],
@@ -106,6 +107,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         groupName: null,
         groupPrivilege: null,
@@ -140,8 +142,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', {
         addNew: !this.roleGroup,
         groupName: this.form.groupName,
@@ -157,7 +159,7 @@
     resetForm() {
       this.form.groupName = null;
       this.form.groupPrivilege = null;
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     onOk(bvModalEvt) {
diff --git a/src/views/SecurityAndAccess/Ldap/TableRoleGroups.vue b/src/views/SecurityAndAccess/Ldap/TableRoleGroups.vue
index eeebfb9..f73d927 100644
--- a/src/views/SecurityAndAccess/Ldap/TableRoleGroups.vue
+++ b/src/views/SecurityAndAccess/Ldap/TableRoleGroups.vue
@@ -108,6 +108,8 @@
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import ModalAddRoleGroup from './ModalAddRoleGroup';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: {
@@ -122,6 +124,7 @@
   mixins: [BVTableSelectableMixin, BVToastMixin, LoadingBarMixin],
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       activeRoleGroup: null,
       fields: [
@@ -132,12 +135,12 @@
         {
           key: 'groupName',
           sortable: true,
-          label: this.$t('pageLdap.tableRoleGroups.groupName'),
+          label: i18n.global.t('pageLdap.tableRoleGroups.groupName'),
         },
         {
           key: 'groupPrivilege',
           sortable: true,
-          label: this.$t('pageLdap.tableRoleGroups.groupPrivilege'),
+          label: i18n.global.t('pageLdap.tableRoleGroups.groupPrivilege'),
         },
         {
           key: 'actions',
@@ -149,7 +152,7 @@
       batchActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete'),
+          label: i18n.global.t('global.action.delete'),
         },
       ],
       selectedRows: selectedRows,
@@ -167,12 +170,12 @@
           actions: [
             {
               value: 'edit',
-              title: this.$t('global.action.edit'),
+              title: i18n.global.t('global.action.edit'),
               enabled: this.isServiceEnabled,
             },
             {
               value: 'delete',
-              title: this.$t('global.action.delete'),
+              title: i18n.global.t('global.action.delete'),
               enabled: this.isServiceEnabled,
             },
           ],
@@ -189,14 +192,14 @@
     onBatchAction() {
       this.$bvModal
         .msgBoxConfirm(
-          this.$tc(
+          i18n.global.t(
             'pageLdap.modal.deleteRoleGroupBatchConfirmMessage',
             this.selectedRows.length,
           ),
           {
-            title: this.$t('pageLdap.modal.deleteRoleGroup'),
-            okTitle: this.$t('global.action.delete'),
-            cancelTitle: this.$t('global.action.cancel'),
+            title: i18n.global.t('pageLdap.modal.deleteRoleGroup'),
+            okTitle: i18n.global.t('global.action.delete'),
+            cancelTitle: i18n.global.t('global.action.cancel'),
             autoFocusButton: 'ok',
           },
         )
@@ -221,13 +224,13 @@
         case 'delete':
           this.$bvModal
             .msgBoxConfirm(
-              this.$t('pageLdap.modal.deleteRoleGroupConfirmMessage', {
+              i18n.global.t('pageLdap.modal.deleteRoleGroupConfirmMessage', {
                 groupName: row.groupName,
               }),
               {
-                title: this.$t('pageLdap.modal.deleteRoleGroup'),
-                okTitle: this.$t('global.action.delete'),
-                cancelTitle: this.$t('global.action.cancel'),
+                title: i18n.global.t('pageLdap.modal.deleteRoleGroup'),
+                okTitle: i18n.global.t('global.action.delete'),
+                cancelTitle: i18n.global.t('global.action.cancel'),
                 autoFocusButton: 'ok',
               },
             )
diff --git a/src/views/SecurityAndAccess/Policies/Policies.vue b/src/views/SecurityAndAccess/Policies/Policies.vue
index fb52175..6cba883 100644
--- a/src/views/SecurityAndAccess/Policies/Policies.vue
+++ b/src/views/SecurityAndAccess/Policies/Policies.vue
@@ -137,6 +137,8 @@
 
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'Policies',
@@ -148,15 +150,16 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       modifySSHPolicyDisabled:
         process.env.VUE_APP_MODIFY_SSH_POLICY_DISABLED === 'true',
       sessionTimeOutOptions: [
-        { value: 1800, text: this.$t('pagePolicies.options.30minutes') },
-        { value: 3600, text: this.$t('pagePolicies.options.1hour') },
-        { value: 7200, text: this.$t('pagePolicies.options.2hours') },
-        { value: 14400, text: this.$t('pagePolicies.options.4hours') },
-        { value: 28800, text: this.$t('pagePolicies.options.8hours') },
-        { value: 86400, text: this.$t('pagePolicies.options.1day') },
+        { value: 1800, text: i18n.global.t('pagePolicies.options.30minutes') },
+        { value: 3600, text: i18n.global.t('pagePolicies.options.1hour') },
+        { value: 7200, text: i18n.global.t('pagePolicies.options.2hours') },
+        { value: 14400, text: i18n.global.t('pagePolicies.options.4hours') },
+        { value: 28800, text: i18n.global.t('pagePolicies.options.8hours') },
+        { value: 86400, text: i18n.global.t('pagePolicies.options.1day') },
       ],
     };
   },
diff --git a/src/views/SecurityAndAccess/Sessions/Sessions.vue b/src/views/SecurityAndAccess/Sessions/Sessions.vue
index 636aafe..74dcf74 100644
--- a/src/views/SecurityAndAccess/Sessions/Sessions.vue
+++ b/src/views/SecurityAndAccess/Sessions/Sessions.vue
@@ -135,6 +135,8 @@
 import SearchFilterMixin, {
   searchFilter,
 } from '@/components/Mixins/SearchFilterMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   components: {
@@ -159,6 +161,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       fields: [
         {
@@ -167,22 +170,22 @@
         },
         {
           key: 'sessionID',
-          label: this.$t('pageSessions.table.sessionID'),
+          label: i18n.global.t('pageSessions.table.sessionID'),
           class: 'text-center',
         },
         {
           key: 'context',
-          label: this.$t('pageSessions.table.context'),
+          label: i18n.global.t('pageSessions.table.context'),
           class: 'text-center',
         },
         {
           key: 'username',
-          label: this.$t('pageSessions.table.username'),
+          label: i18n.global.t('pageSessions.table.username'),
           class: 'text-center',
         },
         {
           key: 'ipAddress',
-          label: this.$t('pageSessions.table.ipAddress'),
+          label: i18n.global.t('pageSessions.table.ipAddress'),
           class: 'text-center',
         },
         {
@@ -194,7 +197,7 @@
       batchActions: [
         {
           value: 'disconnect',
-          label: this.$t('pageSessions.action.disconnect'),
+          label: i18n.global.t('pageSessions.action.disconnect'),
         },
       ],
       currentPage: currentPage,
@@ -220,7 +223,7 @@
           actions: [
             {
               value: 'disconnect',
-              title: this.$t('pageSessions.action.disconnect'),
+              title: i18n.global.t('pageSessions.action.disconnect'),
             },
           ],
         };
@@ -257,12 +260,15 @@
     onTableRowAction(action, { uri }) {
       if (action === 'disconnect') {
         this.$bvModal
-          .msgBoxConfirm(this.$tc('pageSessions.modal.disconnectMessage'), {
-            title: this.$tc('pageSessions.modal.disconnectTitle'),
-            okTitle: this.$t('pageSessions.action.disconnect'),
-            cancelTitle: this.$t('global.action.cancel'),
-            autoFocusButton: 'ok',
-          })
+          .msgBoxConfirm(
+            i18n.global.t('pageSessions.modal.disconnectMessage'),
+            {
+              title: i18n.global.t('pageSessions.modal.disconnectTitle'),
+              okTitle: i18n.global.t('pageSessions.action.disconnect'),
+              cancelTitle: i18n.global.t('global.action.cancel'),
+              autoFocusButton: 'ok',
+            },
+          )
           .then((deleteConfirmed) => {
             if (deleteConfirmed) this.disconnectSessions([uri]);
           });
@@ -273,17 +279,17 @@
         const uris = this.selectedRows.map((row) => row.uri);
         this.$bvModal
           .msgBoxConfirm(
-            this.$tc(
+            i18n.global.t(
               'pageSessions.modal.disconnectMessage',
               this.selectedRows.length,
             ),
             {
-              title: this.$tc(
+              title: i18n.global.t(
                 'pageSessions.modal.disconnectTitle',
                 this.selectedRows.length,
               ),
-              okTitle: this.$t('pageSessions.action.disconnect'),
-              cancelTitle: this.$t('global.action.cancel'),
+              okTitle: i18n.global.t('pageSessions.action.disconnect'),
+              cancelTitle: i18n.global.t('global.action.cancel'),
               autoFocusButton: 'ok',
             },
           )
diff --git a/src/views/SecurityAndAccess/UserManagement/ModalSettings.vue b/src/views/SecurityAndAccess/UserManagement/ModalSettings.vue
index 8932eb5..91db825 100644
--- a/src/views/SecurityAndAccess/UserManagement/ModalSettings.vue
+++ b/src/views/SecurityAndAccess/UserManagement/ModalSettings.vue
@@ -27,17 +27,17 @@
                 type="number"
                 aria-describedby="lockout-threshold-help-block"
                 data-test-id="userManagement-input-lockoutThreshold"
-                :state="getValidationState($v.form.lockoutThreshold)"
-                @input="$v.form.lockoutThreshold.$touch()"
+                :state="getValidationState(v$.form.lockoutThreshold)"
+                @input="v$.form.lockoutThreshold.$touch()"
               />
               <b-form-invalid-feedback role="alert">
-                <template v-if="!$v.form.lockoutThreshold.required">
+                <template v-if="!v$.form.lockoutThreshold.required">
                   {{ $t('global.form.fieldRequired') }}
                 </template>
                 <template
                   v-if="
-                    !$v.form.lockoutThreshold.minLength ||
-                    !$v.form.lockoutThreshold.maxLength
+                    !v$.form.lockoutThreshold.minLength ||
+                    !v$.form.lockoutThreshold.maxLength
                   "
                 >
                   {{
@@ -60,7 +60,7 @@
                 class="mb-2"
                 :value="0"
                 data-test-id="userManagement-radio-manualUnlock"
-                @input="$v.form.unlockMethod.$touch()"
+                @input="v$.form.unlockMethod.$touch()"
               >
                 {{ $t('pageUserManagement.modal.manual') }}
               </b-form-radio>
@@ -69,7 +69,7 @@
                 name="unlock-method"
                 :value="1"
                 data-test-id="userManagement-radio-automaticUnlock"
-                @input="$v.form.unlockMethod.$touch()"
+                @input="v$.form.unlockMethod.$touch()"
               >
                 {{ $t('pageUserManagement.modal.automaticAfterTimeout') }}
               </b-form-radio>
@@ -82,15 +82,15 @@
                   aria-describedby="lockout-duration-help-block"
                   type="number"
                   data-test-id="userManagement-input-lockoutDuration"
-                  :state="getValidationState($v.form.lockoutDuration)"
-                  :readonly="$v.form.unlockMethod.$model === 0"
-                  @input="$v.form.lockoutDuration.$touch()"
+                  :state="getValidationState(v$.form.lockoutDuration)"
+                  :readonly="v$.form.unlockMethod.$model === 0"
+                  @input="v$.form.lockoutDuration.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
-                  <template v-if="!$v.form.lockoutDuration.required">
+                  <template v-if="!v$.form.lockoutDuration.required">
                     {{ $t('global.form.fieldRequired') }}
                   </template>
-                  <template v-else-if="!$v.form.lockoutDuration.minvalue">
+                  <template v-else-if="!v$.form.lockoutDuration.minvalue">
                     {{ $t('global.form.mustBeAtLeast', { value: 1 }) }}
                   </template>
                 </b-form-invalid-feedback>
@@ -124,6 +124,7 @@
 <script>
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
 
 import {
   required,
@@ -147,6 +148,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         lockoutThreshold: 0,
         unlockMethod: 0,
@@ -181,15 +183,15 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
 
       let lockoutThreshold;
       let lockoutDuration;
-      if (this.$v.form.lockoutThreshold.$dirty) {
+      if (this.v$.form.lockoutThreshold.$dirty) {
         lockoutThreshold = this.form.lockoutThreshold;
       }
-      if (this.$v.form.unlockMethod.$dirty) {
+      if (this.v$.form.unlockMethod.$dirty) {
         lockoutDuration = this.form.unlockMethod
           ? this.form.lockoutDuration
           : 0;
@@ -215,7 +217,7 @@
       this.form.lockoutDuration = this.settings.lockoutDuration
         ? this.settings.lockoutDuration
         : null;
-      this.$v.$reset(); // clear validations
+      this.v$.$reset(); // clear validations
     },
   },
 };
diff --git a/src/views/SecurityAndAccess/UserManagement/ModalUser.vue b/src/views/SecurityAndAccess/UserManagement/ModalUser.vue
index dca9736..44ab516 100644
--- a/src/views/SecurityAndAccess/UserManagement/ModalUser.vue
+++ b/src/views/SecurityAndAccess/UserManagement/ModalUser.vue
@@ -14,7 +14,7 @@
         <b-row v-if="!newUser && manualUnlockPolicy && user.Locked">
           <b-col sm="9">
             <alert :show="true" variant="warning" small>
-              <template v-if="!$v.form.manualUnlock.$dirty">
+              <template v-if="!v$.form.manualUnlock.$dirty">
                 {{ $t('pageUserManagement.modal.accountLocked') }}
               </template>
               <template v-else>
@@ -30,9 +30,9 @@
             />
             <b-button
               variant="primary"
-              :disabled="$v.form.manualUnlock.$dirty"
+              :disabled="v$.form.manualUnlock.$dirty"
               data-test-id="userManagement-button-manualUnlock"
-              @click="$v.form.manualUnlock.$touch()"
+              @click="v$.form.manualUnlock.$touch()"
             >
               {{ $t('pageUserManagement.modal.unlock') }}
             </b-button>
@@ -46,7 +46,7 @@
                 name="user-status"
                 :value="true"
                 data-test-id="userManagement-radioButton-statusEnabled"
-                @input="$v.form.status.$touch()"
+                @input="v$.form.status.$touch()"
               >
                 {{ $t('global.status.enabled') }}
               </b-form-radio>
@@ -56,7 +56,7 @@
                 data-test-id="userManagement-radioButton-statusDisabled"
                 :value="false"
                 :disabled="!newUser && originalUsername === disabled"
-                @input="$v.form.status.$touch()"
+                @input="v$.form.status.$touch()"
               >
                 {{ $t('global.status.disabled') }}
               </b-form-radio>
@@ -80,20 +80,20 @@
                 type="text"
                 aria-describedby="username-help-block"
                 data-test-id="userManagement-input-username"
-                :state="getValidationState($v.form.username)"
+                :state="getValidationState(v$.form.username)"
                 :disabled="!newUser && originalUsername === disabled"
-                @input="$v.form.username.$touch()"
+                @input="v$.form.username.$touch()"
               />
               <b-form-invalid-feedback role="alert">
-                <template v-if="!$v.form.username.required">
+                <template v-if="!v$.form.username.required">
                   {{ $t('global.form.fieldRequired') }}
                 </template>
-                <template v-else-if="!$v.form.username.maxLength">
+                <template v-else-if="!v$.form.username.maxLength">
                   {{
                     $t('global.form.lengthMustBeBetween', { min: 1, max: 16 })
                   }}
                 </template>
-                <template v-else-if="!$v.form.username.pattern">
+                <template v-else-if="!v$.form.username.pattern">
                   {{ $t('global.form.invalidFormat') }}
                 </template>
               </b-form-invalid-feedback>
@@ -107,9 +107,9 @@
                 v-model="form.privilege"
                 :options="privilegeTypes"
                 data-test-id="userManagement-select-privilege"
-                :state="getValidationState($v.form.privilege)"
+                :state="getValidationState(v$.form.privilege)"
                 :disabled="!newUser && originalUsername === 'root'"
-                @input="$v.form.privilege.$touch()"
+                @input="v$.form.privilege.$touch()"
               >
                 <template #first>
                   <b-form-select-option :value="null" disabled>
@@ -118,7 +118,7 @@
                 </template>
               </b-form-select>
               <b-form-invalid-feedback role="alert">
-                <template v-if="!$v.form.privilege.required">
+                <template v-if="!v$.form.privilege.required">
                   {{ $t('global.form.fieldRequired') }}
                 </template>
               </b-form-invalid-feedback>
@@ -144,17 +144,17 @@
                   type="password"
                   data-test-id="userManagement-input-password"
                   aria-describedby="password-help-block"
-                  :state="getValidationState($v.form.password)"
+                  :state="getValidationState(v$.form.password)"
                   class="form-control-with-button"
-                  @input="$v.form.password.$touch()"
+                  @input="v$.form.password.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
-                  <template v-if="!$v.form.password.required">
+                  <template v-if="!v$.form.password.required">
                     {{ $t('global.form.fieldRequired') }}
                   </template>
                   <template
                     v-if="
-                      !$v.form.password.minLength || !$v.form.password.maxLength
+                      !v$.form.password.minLength || !v$.form.password.maxLength
                     "
                   >
                     {{
@@ -177,16 +177,16 @@
                   v-model="form.passwordConfirmation"
                   data-test-id="userManagement-input-passwordConfirmation"
                   type="password"
-                  :state="getValidationState($v.form.passwordConfirmation)"
+                  :state="getValidationState(v$.form.passwordConfirmation)"
                   class="form-control-with-button"
-                  @input="$v.form.passwordConfirmation.$touch()"
+                  @input="v$.form.passwordConfirmation.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
-                  <template v-if="!$v.form.passwordConfirmation.required">
+                  <template v-if="!v$.form.passwordConfirmation.required">
                     {{ $t('global.form.fieldRequired') }}
                   </template>
                   <template
-                    v-else-if="!$v.form.passwordConfirmation.sameAsPassword"
+                    v-else-if="!v$.form.passwordConfirmation.sameAsPassword"
                   >
                     {{ $t('pageUserManagement.modal.passwordsDoNotMatch') }}
                   </template>
@@ -237,6 +237,7 @@
 
 import InputPasswordToggle from '@/components/Global/InputPasswordToggle';
 import Alert from '@/components/Global/Alert';
+import { useI18n } from 'vue-i18n';
 
 export default {
   components: { Alert, InputPasswordToggle },
@@ -258,6 +259,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       originalUsername: '',
       form: {
         status: true,
@@ -329,28 +331,28 @@
       let userData = {};
 
       if (this.newUser) {
-        this.$v.$touch();
-        if (this.$v.$invalid) return;
+        this.v$.$touch();
+        if (this.v$.$invalid) return;
         userData.username = this.form.username;
         userData.status = this.form.status;
         userData.privilege = this.form.privilege;
         userData.password = this.form.password;
       } else {
-        if (this.$v.$invalid) return;
+        if (this.v$.$invalid) return;
         userData.originalUsername = this.originalUsername;
-        if (this.$v.form.status.$dirty) {
+        if (this.v$.form.status.$dirty) {
           userData.status = this.form.status;
         }
-        if (this.$v.form.username.$dirty) {
+        if (this.v$.form.username.$dirty) {
           userData.username = this.form.username;
         }
-        if (this.$v.form.privilege.$dirty) {
+        if (this.v$.form.privilege.$dirty) {
           userData.privilege = this.form.privilege;
         }
-        if (this.$v.form.password.$dirty) {
+        if (this.v$.form.password.$dirty) {
           userData.password = this.form.password;
         }
-        if (this.$v.form.manualUnlock.$dirty) {
+        if (this.v$.form.manualUnlock.$dirty) {
           // If form manualUnlock control $dirty then
           // set user Locked property to false
           userData.locked = false;
@@ -376,13 +378,13 @@
       this.form.privilege = null;
       this.form.password = '';
       this.form.passwordConfirmation = '';
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     requirePassword() {
       if (this.newUser) return true;
-      if (this.$v.form.password.$dirty) return true;
-      if (this.$v.form.passwordConfirmation.$dirty) return true;
+      if (this.v$.form.password.$dirty) return true;
+      if (this.v$.form.passwordConfirmation.$dirty) return true;
       return false;
     },
     onOk(bvModalEvt) {
diff --git a/src/views/SecurityAndAccess/UserManagement/TableRoles.vue b/src/views/SecurityAndAccess/UserManagement/TableRoles.vue
index 9fb8013..5d92856 100644
--- a/src/views/SecurityAndAccess/UserManagement/TableRoles.vue
+++ b/src/views/SecurityAndAccess/UserManagement/TableRoles.vue
@@ -25,6 +25,7 @@
 
 <script>
 import Checkmark20 from '@carbon/icons-vue/es/checkmark/20';
+import i18n from '@/i18n';
 
 export default {
   components: {
@@ -34,7 +35,7 @@
     return {
       items: [
         {
-          description: this.$t(
+          description: i18n.global.t(
             'pageUserManagement.tableRoles.configureComponentsManagedByThisService',
           ),
           administrator: true,
@@ -43,7 +44,7 @@
           noaccess: false,
         },
         {
-          description: this.$t(
+          description: i18n.global.t(
             'pageUserManagement.tableRoles.configureManagerResources',
           ),
           administrator: true,
@@ -52,7 +53,7 @@
           noaccess: false,
         },
         {
-          description: this.$t(
+          description: i18n.global.t(
             'pageUserManagement.tableRoles.updatePasswordForCurrentUserAccount',
           ),
           administrator: true,
@@ -61,7 +62,7 @@
           noaccess: false,
         },
         {
-          description: this.$t(
+          description: i18n.global.t(
             'pageUserManagement.tableRoles.configureUsersAndTheirAccounts',
           ),
           administrator: true,
@@ -70,7 +71,7 @@
           noaccess: false,
         },
         {
-          description: this.$t(
+          description: i18n.global.t(
             'pageUserManagement.tableRoles.logInToTheServiceAndReadResources',
           ),
           administrator: true,
@@ -82,26 +83,26 @@
       fields: [
         {
           key: 'description',
-          label: this.$t('pageUserManagement.tableRoles.privilege'),
+          label: i18n.global.t('pageUserManagement.tableRoles.privilege'),
         },
         {
           key: 'administrator',
-          label: this.$t('pageUserManagement.tableRoles.administrator'),
+          label: i18n.global.t('pageUserManagement.tableRoles.administrator'),
           class: 'text-center',
         },
         {
           key: 'operator',
-          label: this.$t('pageUserManagement.tableRoles.operator'),
+          label: i18n.global.t('pageUserManagement.tableRoles.operator'),
           class: 'text-center',
         },
         {
           key: 'readonly',
-          label: this.$t('pageUserManagement.tableRoles.readOnly'),
+          label: i18n.global.t('pageUserManagement.tableRoles.readOnly'),
           class: 'text-center',
         },
         {
           key: 'noaccess',
-          label: this.$t('pageUserManagement.tableRoles.noAccess'),
+          label: i18n.global.t('pageUserManagement.tableRoles.noAccess'),
           class: 'text-center',
         },
       ],
diff --git a/src/views/SecurityAndAccess/UserManagement/UserManagement.vue b/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
index 9e33a63..81b5d99 100644
--- a/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
+++ b/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
@@ -133,6 +133,8 @@
 } from '@/components/Mixins/BVTableSelectableMixin';
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'UserManagement',
@@ -156,6 +158,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       isBusy: true,
       activeUser: null,
       setting: {},
@@ -165,15 +168,15 @@
         },
         {
           key: 'username',
-          label: this.$t('pageUserManagement.table.username'),
+          label: i18n.global.t('pageUserManagement.table.username'),
         },
         {
           key: 'privilege',
-          label: this.$t('pageUserManagement.table.privilege'),
+          label: i18n.global.t('pageUserManagement.table.privilege'),
         },
         {
           key: 'status',
-          label: this.$t('pageUserManagement.table.status'),
+          label: i18n.global.t('pageUserManagement.table.status'),
         },
         {
           key: 'actions',
@@ -184,15 +187,15 @@
       tableToolbarActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete'),
+          label: i18n.global.t('global.action.delete'),
         },
         {
           value: 'enable',
-          label: this.$t('global.action.enable'),
+          label: i18n.global.t('global.action.enable'),
         },
         {
           value: 'disable',
-          label: this.$t('global.action.disable'),
+          label: i18n.global.t('global.action.disable'),
         },
       ],
       selectedRows: selectedRows,
@@ -219,7 +222,7 @@
             {
               value: 'edit',
               enabled: this.editEnable(user),
-              title: this.$t('pageUserManagement.editUser'),
+              title: i18n.global.t('pageUserManagement.editUser'),
             },
             {
               value: 'delete',
@@ -229,7 +232,7 @@
                   : true && user.UserName === 'root'
                     ? false
                     : true,
-              title: this.$tc('pageUserManagement.deleteUser'),
+              title: i18n.global.t('pageUserManagement.deleteUser'),
             },
           ],
           ...user,
@@ -267,13 +270,13 @@
     initModalDelete(user) {
       this.$bvModal
         .msgBoxConfirm(
-          this.$t('pageUserManagement.modal.deleteConfirmMessage', {
+          i18n.global.t('pageUserManagement.modal.deleteConfirmMessage', {
             user: user.username,
           }),
           {
-            title: this.$tc('pageUserManagement.deleteUser'),
-            okTitle: this.$tc('pageUserManagement.deleteUser'),
-            cancelTitle: this.$t('global.action.cancel'),
+            title: i18n.global.t('pageUserManagement.deleteUser'),
+            okTitle: i18n.global.t('pageUserManagement.deleteUser'),
+            cancelTitle: i18n.global.t('global.action.cancel'),
             autoFocusButton: 'ok',
           },
         )
@@ -316,20 +319,20 @@
         case 'delete':
           this.$bvModal
             .msgBoxConfirm(
-              this.$tc(
+              i18n.global.t(
                 'pageUserManagement.modal.batchDeleteConfirmMessage',
                 this.selectedRows.length,
               ),
               {
-                title: this.$tc(
+                title: i18n.global.t(
                   'pageUserManagement.deleteUser',
                   this.selectedRows.length,
                 ),
-                okTitle: this.$tc(
+                okTitle: i18n.global.t(
                   'pageUserManagement.deleteUser',
                   this.selectedRows.length,
                 ),
-                cancelTitle: this.$t('global.action.cancel'),
+                cancelTitle: i18n.global.t('global.action.cancel'),
                 autoFocusButton: 'ok',
               },
             )
diff --git a/src/views/Settings/DateTime/DateTime.vue b/src/views/Settings/DateTime/DateTime.vue
index 00d7b45..b86ebd2 100644
--- a/src/views/Settings/DateTime/DateTime.vue
+++ b/src/views/Settings/DateTime/DateTime.vue
@@ -18,14 +18,14 @@
         <b-col lg="3">
           <dl>
             <dt>{{ $t('pageDateTime.form.date') }}</dt>
-            <dd v-if="bmcTime">{{ bmcTime }}</dd>
+            <dd v-if="bmcTime">{{ $filters.formatDate(bmcTime) }}</dd>
             <dd v-else>--</dd>
           </dl>
         </b-col>
         <b-col lg="3">
           <dl>
             <dt>{{ $t('pageDateTime.form.time.label') }}</dt>
-            <dd v-if="bmcTime">{{ bmcTime }}</dd>
+            <dd v-if="bmcTime">{{ $filters.formatTime(bmcTime) }}</dd>
             <dd v-else>--</dd>
           </dl>
         </b-col>
@@ -56,17 +56,17 @@
                   <b-form-input
                     id="input-manual-date"
                     v-model="form.manual.date"
-                    :state="getValidationState($v.form.manual.date)"
+                    :state="getValidationState(v$.form.manual.date)"
                     :disabled="ntpOptionSelected"
                     data-test-id="dateTime-input-manualDate"
                     class="form-control-with-button"
-                    @blur="$v.form.manual.date.$touch()"
+                    @blur="v$.form.manual.date.$touch()"
                   />
                   <b-form-invalid-feedback role="alert">
-                    <div v-if="!$v.form.manual.date.pattern">
+                    <div v-if="!v$.form.manual.date.pattern">
                       {{ $t('global.form.invalidFormat') }}
                     </div>
-                    <div v-if="!$v.form.manual.date.required">
+                    <div v-if="!v$.form.manual.date.required">
                       {{ $t('global.form.fieldRequired') }}
                     </div>
                   </b-form-invalid-feedback>
@@ -105,16 +105,16 @@
                   <b-form-input
                     id="input-manual-time"
                     v-model="form.manual.time"
-                    :state="getValidationState($v.form.manual.time)"
+                    :state="getValidationState(v$.form.manual.time)"
                     :disabled="ntpOptionSelected"
                     data-test-id="dateTime-input-manualTime"
-                    @blur="$v.form.manual.time.$touch()"
+                    @blur="v$.form.manual.time.$touch()"
                   />
                   <b-form-invalid-feedback role="alert">
-                    <div v-if="!$v.form.manual.time.pattern">
+                    <div v-if="!v$.form.manual.time.pattern">
                       {{ $t('global.form.invalidFormat') }}
                     </div>
-                    <div v-if="!$v.form.manual.time.required">
+                    <div v-if="!v$.form.manual.time.required">
                       {{ $t('global.form.fieldRequired') }}
                     </div>
                   </b-form-invalid-feedback>
@@ -139,13 +139,13 @@
                   <b-form-input
                     id="input-ntp-1"
                     v-model="form.ntp.firstAddress"
-                    :state="getValidationState($v.form.ntp.firstAddress)"
+                    :state="getValidationState(v$.form.ntp.firstAddress)"
                     :disabled="manualOptionSelected"
                     data-test-id="dateTime-input-ntpServer1"
-                    @blur="$v.form.ntp.firstAddress.$touch()"
+                    @blur="v$.form.ntp.firstAddress.$touch()"
                   />
                   <b-form-invalid-feedback role="alert">
-                    <div v-if="!$v.form.ntp.firstAddress.required">
+                    <div v-if="!v$.form.ntp.firstAddress.required">
                       {{ $t('global.form.fieldRequired') }}
                     </div>
                   </b-form-invalid-feedback>
@@ -210,6 +210,7 @@
 
 import { mapState } from 'vuex';
 import { requiredIf, helpers } from '@vuelidate/validators';
+import { useI18n } from 'vue-i18n';
 
 const isoDateRegex = /([12]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01]))/;
 const isoTimeRegex = /^(0[0-9]|1[0-9]|2[0-3]):[0-5][0-9]$/;
@@ -234,6 +235,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       locale: this.$store.getters['global/languagePreference'],
       form: {
         configurationSelected: 'manual',
@@ -302,10 +304,10 @@
       this.emitChange();
     },
     bmcTime() {
-      this.form.manual.date = this.$options.filters.formatDate(
+      this.form.manual.date = this.$filters.formatDate(
         this.$store.getters['global/bmcTime'],
       );
-      this.form.manual.time = this.$options.filters
+      this.form.manual.time = this.$filters
         .formatTime(this.$store.getters['global/bmcTime'])
         .slice(0, 5);
     },
@@ -320,8 +322,8 @@
   },
   methods: {
     emitChange() {
-      if (this.$v.$invalid) return;
-      this.$v.$reset(); //reset to re-validate on blur
+      if (this.v$.$invalid) return;
+      this.v$.$reset(); //reset to re-validate on blur
       this.$emit('change', {
         manualDate: this.manualDate ? new Date(this.manualDate) : null,
       });
@@ -337,8 +339,8 @@
       ] = [this.ntpServers[0], this.ntpServers[1], this.ntpServers[2]];
     },
     submitForm() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.startLoader();
 
       let dateTimeForm = {};
@@ -398,7 +400,7 @@
         })
         .catch(({ message }) => this.errorToast(message))
         .finally(() => {
-          this.$v.form.$reset();
+          this.v$.form.$reset();
           this.endLoader();
         });
     },
diff --git a/src/views/Settings/Network/ModalDns.vue b/src/views/Settings/Network/ModalDns.vue
index 8fe371e..0e1bd88 100644
--- a/src/views/Settings/Network/ModalDns.vue
+++ b/src/views/Settings/Network/ModalDns.vue
@@ -16,14 +16,14 @@
               id="staticDns"
               v-model="form.staticDns"
               type="text"
-              :state="getValidationState($v.form.staticDns)"
-              @input="$v.form.staticDns.$touch()"
+              :state="getValidationState(v$.form.staticDns)"
+              @input="v$.form.staticDns.$touch()"
             />
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.staticDns.required">
+              <template v-if="!v$.form.staticDns.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
-              <template v-if="!$v.form.staticDns.ipAddress">
+              <template v-if="!v$.form.staticDns.ipAddress">
                 {{ $t('global.form.invalidFormat') }}
               </template>
             </b-form-invalid-feedback>
@@ -47,6 +47,7 @@
 import { useVuelidate } from '@vuelidate/core';
 
 import { ipAddress, required } from '@vuelidate/validators';
+import { useI18n } from 'vue-i18n';
 
 export default {
   mixins: [VuelidateMixin],
@@ -57,6 +58,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         staticDns: null,
       },
@@ -74,8 +76,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', [this.form.staticDns]);
       this.closeModal();
     },
@@ -86,7 +88,7 @@
     },
     resetForm() {
       this.form.staticDns = null;
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     onOk(bvModalEvt) {
diff --git a/src/views/Settings/Network/ModalHostname.vue b/src/views/Settings/Network/ModalHostname.vue
index 1b3bab1..b2155b7 100644
--- a/src/views/Settings/Network/ModalHostname.vue
+++ b/src/views/Settings/Network/ModalHostname.vue
@@ -16,14 +16,14 @@
               id="hostname"
               v-model="form.hostname"
               type="text"
-              :state="getValidationState($v.form.hostname)"
-              @input="$v.form.hostname.$touch()"
+              :state="getValidationState(v$.form.hostname)"
+              @input="v$.form.hostname.$touch()"
             />
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.hostname.required">
+              <template v-if="!v$.form.hostname.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
-              <template v-if="!$v.form.hostname.validateHostname">
+              <template v-if="!v$.form.hostname.validateHostname">
                 {{ $t('global.form.lengthMustBeBetween', { min: 1, max: 64 }) }}
               </template>
             </b-form-invalid-feedback>
@@ -52,6 +52,7 @@
 import { useVuelidate } from '@vuelidate/core';
 
 import { required, helpers } from '@vuelidate/validators';
+import { useI18n } from 'vue-i18n';
 
 const validateHostname = helpers.regex('validateHostname', /^\S{0,64}$/);
 
@@ -70,6 +71,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         hostname: '',
       },
@@ -92,8 +94,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', { HostName: this.form.hostname });
       this.closeModal();
     },
@@ -104,7 +106,7 @@
     },
     resetForm() {
       this.form.hostname = this.hostname;
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     onOk(bvModalEvt) {
diff --git a/src/views/Settings/Network/ModalIpv4.vue b/src/views/Settings/Network/ModalIpv4.vue
index 2c3d9e8..a3b5482 100644
--- a/src/views/Settings/Network/ModalIpv4.vue
+++ b/src/views/Settings/Network/ModalIpv4.vue
@@ -16,14 +16,14 @@
               id="ipAddress"
               v-model="form.ipAddress"
               type="text"
-              :state="getValidationState($v.form.ipAddress)"
-              @input="$v.form.ipAddress.$touch()"
+              :state="getValidationState(v$.form.ipAddress)"
+              @input="v$.form.ipAddress.$touch()"
             />
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.ipAddress.required">
+              <template v-if="!v$.form.ipAddress.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
-              <template v-if="!$v.form.ipAddress.ipAddress">
+              <template v-if="!v$.form.ipAddress.ipAddress">
                 {{ $t('global.form.invalidFormat') }}
               </template>
             </b-form-invalid-feedback>
@@ -38,14 +38,14 @@
               id="gateway"
               v-model="form.gateway"
               type="text"
-              :state="getValidationState($v.form.gateway)"
-              @input="$v.form.gateway.$touch()"
+              :state="getValidationState(v$.form.gateway)"
+              @input="v$.form.gateway.$touch()"
             />
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.gateway.required">
+              <template v-if="!v$.form.gateway.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
-              <template v-if="!$v.form.gateway.ipAddress">
+              <template v-if="!v$.form.gateway.ipAddress">
                 {{ $t('global.form.invalidFormat') }}
               </template>
             </b-form-invalid-feedback>
@@ -62,14 +62,14 @@
               id="subnetMask"
               v-model="form.subnetMask"
               type="text"
-              :state="getValidationState($v.form.subnetMask)"
-              @input="$v.form.subnetMask.$touch()"
+              :state="getValidationState(v$.form.subnetMask)"
+              @input="v$.form.subnetMask.$touch()"
             />
             <b-form-invalid-feedback role="alert">
-              <template v-if="!$v.form.subnetMask.required">
+              <template v-if="!v$.form.subnetMask.required">
                 {{ $t('global.form.fieldRequired') }}
               </template>
-              <template v-if="!$v.form.subnetMask.ipAddress">
+              <template v-if="!v$.form.subnetMask.ipAddress">
                 {{ $t('global.form.invalidFormat') }}
               </template>
             </b-form-invalid-feedback>
@@ -93,6 +93,7 @@
 import { useVuelidate } from '@vuelidate/core';
 
 import { ipAddress, required } from '@vuelidate/validators';
+import { useI18n } from 'vue-i18n';
 
 export default {
   mixins: [VuelidateMixin],
@@ -109,6 +110,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         ipAddress: '',
         gateway: '',
@@ -141,8 +143,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', {
         Address: this.form.ipAddress,
         Gateway: this.form.gateway,
@@ -159,7 +161,7 @@
       this.form.ipAddress = null;
       this.form.gateway = this.defaultGateway;
       this.form.subnetMask = null;
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     onOk(bvModalEvt) {
diff --git a/src/views/Settings/Network/ModalMacAddress.vue b/src/views/Settings/Network/ModalMacAddress.vue
index 307eb8d..f3fcc02 100644
--- a/src/views/Settings/Network/ModalMacAddress.vue
+++ b/src/views/Settings/Network/ModalMacAddress.vue
@@ -17,14 +17,14 @@
               v-model.trim="form.macAddress"
               data-test-id="network-input-macAddress"
               type="text"
-              :state="getValidationState($v.form.macAddress)"
-              @change="$v.form.macAddress.$touch()"
+              :state="getValidationState(v$.form.macAddress)"
+              @change="v$.form.macAddress.$touch()"
             />
             <b-form-invalid-feedback role="alert">
-              <div v-if="!$v.form.macAddress.required">
+              <div v-if="!v$.form.macAddress.required">
                 {{ $t('global.form.fieldRequired') }}
               </div>
-              <div v-if="!$v.form.macAddress.macAddress">
+              <div v-if="!v$.form.macAddress.macAddress">
                 {{ $t('global.form.invalidFormat') }}
               </div>
             </b-form-invalid-feedback>
@@ -53,6 +53,7 @@
 import { useVuelidate } from '@vuelidate/core';
 
 import { macAddress, required } from '@vuelidate/validators';
+import { useI18n } from 'vue-i18n';
 
 export default {
   mixins: [VuelidateMixin],
@@ -69,6 +70,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         macAddress: '',
       },
@@ -91,8 +93,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', { MACAddress: this.form.macAddress });
       this.closeModal();
     },
@@ -103,7 +105,7 @@
     },
     resetForm() {
       this.form.macAddress = this.macAddress;
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     onOk(bvModalEvt) {
diff --git a/src/views/Settings/Network/Network.vue b/src/views/Settings/Network/Network.vue
index 0279cbe..7a2e014 100644
--- a/src/views/Settings/Network/Network.vue
+++ b/src/views/Settings/Network/Network.vue
@@ -64,6 +64,7 @@
 import TableIpv6 from './TableIpv6.vue';
 import TableDns from './TableDns.vue';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Network',
@@ -89,6 +90,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       currentHostname: '',
       currentMacAddress: '',
       defaultGateway: '',
diff --git a/src/views/Settings/Network/NetworkGlobalSettings.vue b/src/views/Settings/Network/NetworkGlobalSettings.vue
index 0c062ea..23ce6ca 100644
--- a/src/views/Settings/Network/NetworkGlobalSettings.vue
+++ b/src/views/Settings/Network/NetworkGlobalSettings.vue
@@ -133,6 +133,7 @@
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
 import PageSection from '@/components/Global/PageSection';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'GlobalNetworkSettings',
@@ -141,6 +142,7 @@
 
   data() {
     return {
+      $t: useI18n().t,
       hostname: '',
     };
   },
diff --git a/src/views/Settings/Network/NetworkInterfaceSettings.vue b/src/views/Settings/Network/NetworkInterfaceSettings.vue
index 023d29b..ea83757 100644
--- a/src/views/Settings/Network/NetworkInterfaceSettings.vue
+++ b/src/views/Settings/Network/NetworkInterfaceSettings.vue
@@ -62,6 +62,7 @@
 import PageSection from '@/components/Global/PageSection';
 import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'Ipv4Table',
@@ -78,6 +79,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       selectedInterface: '',
       linkStatus: '',
       linkSpeed: '',
diff --git a/src/views/Settings/Network/TableDns.vue b/src/views/Settings/Network/TableDns.vue
index 569109f..0de1dca 100644
--- a/src/views/Settings/Network/TableDns.vue
+++ b/src/views/Settings/Network/TableDns.vue
@@ -46,6 +46,7 @@
 import PageSection from '@/components/Global/PageSection';
 import TableRowAction from '@/components/Global/TableRowAction';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
 
 export default {
   name: 'DNSTable',
@@ -65,23 +66,24 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         dnsStaticTableItems: [],
       },
       actions: [
         {
           value: 'edit',
-          title: this.$t('global.action.edit'),
+          title: 'global.action.edit',
         },
         {
           value: 'delete',
-          title: this.$t('global.action.delete'),
+          title: 'global.action.delete',
         },
       ],
       dnsTableFields: [
         {
           key: 'address',
-          label: this.$t('pageNetwork.table.ipAddress'),
+          label: 'pageNetwork.table.ipAddress',
         },
         { key: 'actions', label: '', tdClass: 'text-right' },
       ],
@@ -116,7 +118,7 @@
           actions: [
             {
               value: 'delete',
-              title: this.$t('pageNetwork.table.deleteDns'),
+              title: 'pageNetwork.table.deleteDns',
             },
           ],
         };
diff --git a/src/views/Settings/Network/TableIpv4.vue b/src/views/Settings/Network/TableIpv4.vue
index 0a06e0e..b95e7d3 100644
--- a/src/views/Settings/Network/TableIpv4.vue
+++ b/src/views/Settings/Network/TableIpv4.vue
@@ -71,6 +71,8 @@
 import PageSection from '@/components/Global/PageSection';
 import TableRowAction from '@/components/Global/TableRowAction';
 import { mapState } from 'vuex';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'Ipv4Table',
@@ -90,35 +92,36 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         ipv4TableItems: [],
       },
       actions: [
         {
           value: 'edit',
-          title: this.$t('global.action.edit'),
+          title: i18n.global.t('global.action.edit'),
         },
         {
           value: 'delete',
-          title: this.$t('global.action.delete'),
+          title: i18n.global.t('global.action.delete'),
         },
       ],
       ipv4TableFields: [
         {
           key: 'Address',
-          label: this.$t('pageNetwork.table.ipAddress'),
+          label: i18n.global.t('pageNetwork.table.ipAddress'),
         },
         {
           key: 'Gateway',
-          label: this.$t('pageNetwork.table.gateway'),
+          label: i18n.global.t('pageNetwork.table.gateway'),
         },
         {
           key: 'SubnetMask',
-          label: this.$t('pageNetwork.table.subnet'),
+          label: i18n.global.t('pageNetwork.table.subnet'),
         },
         {
           key: 'AddressOrigin',
-          label: this.$t('pageNetwork.table.addressOrigin'),
+          label: i18n.global.t('pageNetwork.table.addressOrigin'),
         },
         { key: 'actions', label: '', tdClass: 'text-right' },
       ],
@@ -178,7 +181,7 @@
           actions: [
             {
               value: 'delete',
-              title: this.$t('pageNetwork.table.deleteIpv4'),
+              title: i18n.global.t('pageNetwork.table.deleteIpv4'),
             },
           ],
         };
@@ -211,19 +214,19 @@
       this.$bvModal
         .msgBoxConfirm(
           state
-            ? this.$t('pageNetwork.modal.confirmEnableDhcp')
-            : this.$t('pageNetwork.modal.confirmDisableDhcp'),
+            ? i18n.global.t('pageNetwork.modal.confirmEnableDhcp')
+            : i18n.global.t('pageNetwork.modal.confirmDisableDhcp'),
           {
-            title: this.$t('pageNetwork.modal.dhcpConfirmTitle', {
+            title: i18n.global.t('pageNetwork.modal.dhcpConfirmTitle', {
               dhcpState: state
-                ? this.$t('global.action.enable')
-                : this.$t('global.action.disable'),
+                ? i18n.global.t('global.action.enable')
+                : i18n.global.t('global.action.disable'),
             }),
             okTitle: state
-              ? this.$t('global.action.enable')
-              : this.$t('global.action.disable'),
+              ? i18n.global.t('global.action.enable')
+              : i18n.global.t('global.action.disable'),
             okVariant: 'danger',
-            cancelTitle: this.$t('global.action.cancel'),
+            cancelTitle: i18n.global.t('global.action.cancel'),
             autoFocusButton: 'cancel',
           },
         )
diff --git a/src/views/Settings/PowerRestorePolicy/PowerRestorePolicy.vue b/src/views/Settings/PowerRestorePolicy/PowerRestorePolicy.vue
index dfa4865..348540a 100644
--- a/src/views/Settings/PowerRestorePolicy/PowerRestorePolicy.vue
+++ b/src/views/Settings/PowerRestorePolicy/PowerRestorePolicy.vue
@@ -28,6 +28,8 @@
 import { useVuelidate } from '@vuelidate/core';
 
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
 
 export default {
   name: 'PowerRestorePolicy',
@@ -44,6 +46,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       policyValue: null,
       options: [],
     };
@@ -74,7 +77,9 @@
         this.options.length = 0;
         this.powerRestorePolicies.map((item) => {
           this.options.push({
-            text: this.$t(`pagePowerRestorePolicy.policiesDesc.${item.state}`),
+            text: i18n.global.t(
+              `pagePowerRestorePolicy.policiesDesc.${item.state}`,
+            ),
             value: `${item.state}`,
           });
         });
diff --git a/src/views/Settings/SnmpAlerts/ModalAddDestination.vue b/src/views/Settings/SnmpAlerts/ModalAddDestination.vue
index f52acd7..91ef34f 100644
--- a/src/views/Settings/SnmpAlerts/ModalAddDestination.vue
+++ b/src/views/Settings/SnmpAlerts/ModalAddDestination.vue
@@ -15,17 +15,17 @@
               <b-form-input
                 id="ip-Address"
                 v-model="form.ipAddress"
-                :state="getValidationState($v.form.ipAddress)"
+                :state="getValidationState(v$.form.ipAddress)"
                 data-test-id="snmpAlerts-input-ipAddress"
                 type="text"
-                @blur="$v.form.ipAddress.$touch()"
+                @blur="v$.form.ipAddress.$touch()"
               />
 
               <b-form-invalid-feedback role="alert">
-                <template v-if="!$v.form.ipAddress.required">
+                <template v-if="!v$.form.ipAddress.required">
                   {{ $t('global.form.fieldRequired') }}
                 </template>
-                <template v-if="!$v.form.ipAddress.ipAddress">
+                <template v-if="!v$.form.ipAddress.ipAddress">
                   {{ $t('global.form.invalidFormat') }}
                 </template>
               </b-form-invalid-feedback>
@@ -43,13 +43,13 @@
                 id="port"
                 v-model="form.port"
                 type="text"
-                :state="getValidationState($v.form.port)"
+                :state="getValidationState(v$.form.port)"
                 data-test-id="snmpAlerts-input-port"
-                @blur="$v.form.port.$touch()"
+                @blur="v$.form.port.$touch()"
               />
               <b-form-invalid-feedback role="alert">
                 <template
-                  v-if="!$v.form.port.minLength || !$v.form.port.maxLength"
+                  v-if="!v$.form.port.minLength || !v$.form.port.maxLength"
                 >
                   {{
                     $t('global.form.valueMustBeBetween', {
@@ -85,6 +85,7 @@
 import { required, ipAddress, minValue, maxValue } from '@vuelidate/validators';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import { useVuelidate } from '@vuelidate/core';
+import { useI18n } from 'vue-i18n';
 
 export default {
   mixins: [VuelidateMixin],
@@ -95,6 +96,7 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       form: {
         ipaddress: null,
         port: null,
@@ -117,8 +119,8 @@
   },
   methods: {
     handleSubmit() {
-      this.$v.$touch();
-      if (this.$v.$invalid) return;
+      this.v$.$touch();
+      if (this.v$.$invalid) return;
       this.$emit('ok', {
         ipAddress: this.form.ipAddress,
         port: this.form.port,
@@ -133,7 +135,7 @@
     resetForm() {
       this.form.ipAddress = '';
       this.form.port = '';
-      this.$v.$reset();
+      this.v$.$reset();
       this.$emit('hidden');
     },
     onOk(bvModalEvt) {
diff --git a/src/views/Settings/SnmpAlerts/SnmpAlerts.vue b/src/views/Settings/SnmpAlerts/SnmpAlerts.vue
index dba181f..d18ea75 100644
--- a/src/views/Settings/SnmpAlerts/SnmpAlerts.vue
+++ b/src/views/Settings/SnmpAlerts/SnmpAlerts.vue
@@ -90,6 +90,9 @@
   tableHeaderCheckboxModel,
   tableHeaderCheckboxIndeterminate,
 } from '@/components/Mixins/BVTableSelectableMixin';
+import { useI18n } from 'vue-i18n';
+import i18n from '@/i18n';
+
 export default {
   name: 'SnmpAlerts',
   components: {
@@ -107,17 +110,18 @@
   },
   data() {
     return {
+      $t: useI18n().t,
       fields: [
         {
           key: 'checkbox',
         },
         {
           key: 'IP',
-          label: this.$t('pageSnmpAlerts.table.ipaddress'),
+          label: i18n.global.t('pageSnmpAlerts.table.ipaddress'),
         },
         {
           key: 'Port',
-          label: this.$t('pageSnmpAlerts.table.port'),
+          label: i18n.global.t('pageSnmpAlerts.table.port'),
         },
         {
           key: 'actions',
@@ -128,7 +132,7 @@
       tableToolbarActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete'),
+          label: i18n.global.t('global.action.delete'),
         },
       ],
       selectedRows: selectedRows,
@@ -164,7 +168,7 @@
             {
               value: 'delete',
               enabled: true,
-              title: this.$tc('pageSnmpAlerts.deleteDestination'),
+              title: i18n.global.t('pageSnmpAlerts.deleteDestination'),
             },
           ],
           ...subscriptions,
@@ -202,13 +206,15 @@
     initModalDeleteDestination(destination) {
       this.$bvModal
         .msgBoxConfirm(
-          this.$t('pageSnmpAlerts.modal.deleteConfirmMessage', {
+          i18n.global.t('pageSnmpAlerts.modal.deleteConfirmMessage', {
             destination: destination.id,
           }),
           {
-            title: this.$tc('pageSnmpAlerts.modal.deleteSnmpDestinationTitle'),
-            okTitle: this.$tc('pageSnmpAlerts.deleteDestination'),
-            cancelTitle: this.$t('global.action.cancel'),
+            title: i18n.global.t(
+              'pageSnmpAlerts.modal.deleteSnmpDestinationTitle',
+            ),
+            okTitle: i18n.global.t('pageSnmpAlerts.deleteDestination'),
+            cancelTitle: i18n.global.t('global.action.cancel'),
             autoFocusButton: 'ok',
           },
         )
@@ -230,20 +236,20 @@
       if (action === 'delete') {
         this.$bvModal
           .msgBoxConfirm(
-            this.$tc(
+            i18n.global.t(
               'pageSnmpAlerts.modal.batchDeleteConfirmMessage',
               this.selectedRows.length,
             ),
             {
-              title: this.$tc(
+              title: i18n.global.t(
                 'pageSnmpAlerts.modal.deleteSnmpDestinationTitle',
                 this.selectedRows.length,
               ),
-              okTitle: this.$tc(
+              okTitle: i18n.global.t(
                 'pageSnmpAlerts.deleteDestination',
                 this.selectedRows.length,
               ),
-              cancelTitle: this.$t('global.action.cancel'),
+              cancelTitle: i18n.global.t('global.action.cancel'),
               autoFocusButton: 'ok',
             },
           )