Add status state info to inventory tables
Add status state information to the inventory tables
for fans and power supplies.
Also updates sortCompare to be able to sort by the
state.
Change-Id: Ic830dd0867daee0bf6052a5d1cff5592b98fc009
Signed-off-by: Farah Rasheed <Farah.Rasheed1@dell.com>
diff --git a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
index 62f0b76..af4b461 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue
@@ -51,6 +51,12 @@
{{ value }}
</template>
+ <!-- StatusState -->
+ <template #cell(statusState)="{ value }">
+ <status-icon :status="statusStateIcon(value)" />
+ {{ value }}
+ </template>
+
<template #row-details="{ item }">
<b-container fluid>
<b-row>
@@ -146,6 +152,12 @@
tdClass: 'text-nowrap',
},
{
+ key: 'statusState',
+ label: this.$t('pageInventory.table.state'),
+ formatter: this.dataFormatter,
+ tdClass: 'text-nowrap',
+ },
+ {
key: 'partNumber',
label: this.$t('pageInventory.table.partNumber'),
formatter: this.dataFormatter,
@@ -183,11 +195,40 @@
sortCompare(a, b, key) {
if (key === 'health') {
return this.sortStatus(a, b, key);
+ } else if (key === 'statusState') {
+ return this.sortStatusState(a, b, key);
}
},
onFiltered(filteredItems) {
this.searchTotalFilteredRows = filteredItems.length;
},
+ /**
+ * Returns the appropriate icon based on the given status.
+ *
+ * @param {string} status - The status to determine the icon for.
+ * @return {string} The icon corresponding to the given status.
+ */
+ statusStateIcon(status) {
+ switch (status) {
+ case 'Enabled':
+ return 'success';
+ case 'Absent':
+ return 'warning';
+ default:
+ return '';
+ }
+ },
+ /**
+ * Sorts the status state of two objects based on the provided key.
+ *
+ * @param {Object} a - The first object to compare.
+ * @param {Object} b - The second object to compare.
+ * @param {string} key - The key to use for comparison.
+ */
+ sortStatusState(a, b, key) {
+ const statusState = ['Enabled', 'Absent'];
+ return statusState.indexOf(a[key]) - statusState.indexOf(b[key]);
+ },
},
};
</script>
diff --git a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
index df03fdf..0ce8c82 100644
--- a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
+++ b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue
@@ -51,6 +51,12 @@
{{ value }}
</template>
+ <!-- StatusState -->
+ <template #cell(statusState)="{ value }">
+ <status-icon :status="statusStateIcon(value)" />
+ {{ value }}
+ </template>
+
<template #row-details="{ item }">
<b-container fluid>
<b-row>
@@ -167,6 +173,12 @@
tdClass: 'text-nowrap',
},
{
+ key: 'statusState',
+ label: this.$t('pageInventory.table.state'),
+ formatter: this.dataFormatter,
+ tdClass: 'text-nowrap',
+ },
+ {
key: 'locationNumber',
label: this.$t('pageInventory.table.locationNumber'),
formatter: this.dataFormatter,
@@ -204,11 +216,38 @@
sortCompare(a, b, key) {
if (key === 'health') {
return this.sortStatus(a, b, key);
+ } else if (key === 'statusState') {
+ return this.sortStatusState(a, b, key);
}
},
onFiltered(filteredItems) {
this.searchTotalFilteredRows = filteredItems.length;
},
+ /**
+ * Returns the icon to use for status state based on the given status.
+ * @param {string} status The status to determine the icon for.
+ * @return {string} The icon for the given status.
+ */
+ statusStateIcon(status) {
+ switch (status) {
+ case 'Enabled':
+ return 'success';
+ case 'Absent':
+ return 'warning';
+ default:
+ return '';
+ }
+ },
+ /**
+ * Sorts the status state of two objects based on the provided key.
+ * @param {Object} a The first object to compare.
+ * @param {Object} b The second object to compare.
+ * @param {string} key The key to use for comparison.
+ */
+ sortStatusState(a, b, key) {
+ const statusState = ['Enabled', 'Absent'];
+ return statusState.indexOf(a[key]) - statusState.indexOf(b[key]);
+ },
},
};
</script>