Vuelidate, I18n, and filter are upgraded to vue3
While navigating to the pages i18n, vuelidate, and filters errors
occurred. i18n, and vuelidate code changes in each page adapted to
vue3. Filter global function for date and time format implemented
in the main.js file and those files which as called the filter
functions.
Change-Id: If1a2ee22d47750faef1c35ef2c263299067d9a20
Signed-off-by: Surya Venkatesan <suryav@ami.com>
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 af4b461..373ecc8 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
@@ -119,6 +119,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 },
@@ -130,6 +132,7 @@
],
data() {
return {
+ $t: useI18n().t,
isBusy: true,
fields: [
{
@@ -140,13 +143,13 @@
},
{
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',
@@ -159,13 +162,13 @@
},
{
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 0ce8c82..78b2a96 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
@@ -140,6 +140,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 },
@@ -151,6 +153,7 @@
],
data() {
return {
+ $t: useI18n().t,
isBusy: true,
fields: [
{
@@ -161,13 +164,13 @@
},
{
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',
@@ -180,13 +183,13 @@
},
{
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,
},
],