summaryrefslogtreecommitdiff
path: root/src/views/HardwareStatus/Inventory/Inventory.vue
diff options
context:
space:
mode:
authorSandeepa Singh <sandeepa.singh@ibm.com>2021-07-06 13:59:10 +0300
committerDerick Montague <derick.montague@ibm.com>2021-08-10 22:20:42 +0300
commit7affc529b7fba41193c4d48764707e9961cdd22d (patch)
treed198c2026a40faf07d622492297aed488b17fccb /src/views/HardwareStatus/Inventory/Inventory.vue
parent828dda9b187684902710bb11621eca27bf0c6eec (diff)
downloadwebui-vue-7affc529b7fba41193c4d48764707e9961cdd22d.tar.xz
IA update: Update health section
This is the second update to information architecture changes and has the following changes: - Health section is updated to hardware status section - Hardware status page is updated to inventory and LEDs page - Route for sensors page has been updated Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com> Change-Id: Ia1ba3a15a243a00f59a2ec646132436eb355a999
Diffstat (limited to 'src/views/HardwareStatus/Inventory/Inventory.vue')
-rw-r--r--src/views/HardwareStatus/Inventory/Inventory.vue180
1 files changed, 180 insertions, 0 deletions
diff --git a/src/views/HardwareStatus/Inventory/Inventory.vue b/src/views/HardwareStatus/Inventory/Inventory.vue
new file mode 100644
index 00000000..d8b46b25
--- /dev/null
+++ b/src/views/HardwareStatus/Inventory/Inventory.vue
@@ -0,0 +1,180 @@
+<template>
+ <b-container fluid="xl">
+ <page-title />
+
+ <!-- Quicklinks section -->
+ <page-section :section-title="$t('pageInventory.quicklinkTitle')">
+ <b-row class="w-75">
+ <b-col v-for="column in quicklinkColumns" :key="column.id" xl="4">
+ <div v-for="item in column" :key="item.id">
+ <b-link
+ :href="item.href"
+ :data-ref="item.dataRef"
+ @click.prevent="scrollToOffset"
+ >
+ <jump-link /> {{ item.linkText }}
+ </b-link>
+ </div>
+ </b-col>
+ </b-row>
+ </page-section>
+
+ <!-- System table -->
+ <table-system ref="system" />
+
+ <!-- BMC manager table -->
+ <table-bmc-manager ref="bmc" />
+
+ <!-- Chassis table -->
+ <table-chassis ref="chassis" />
+
+ <!-- DIMM slot table -->
+ <table-dimm-slot ref="dimms" />
+
+ <!-- Fans table -->
+ <table-fans ref="fans" />
+
+ <!-- Power supplies table -->
+ <table-power-supplies ref="powerSupply" />
+
+ <!-- Processors table -->
+ <table-processors ref="processors" />
+ </b-container>
+</template>
+
+<script>
+import PageTitle from '@/components/Global/PageTitle';
+import TableSystem from './InventoryTableSystem';
+import TablePowerSupplies from './InventoryTablePowerSupplies';
+import TableDimmSlot from './InventoryTableDimmSlot';
+import TableFans from './InventoryTableFans';
+import TableBmcManager from './InventoryTableBmcManager';
+import TableChassis from './InventoryTableChassis';
+import TableProcessors from './InventoryTableProcessors';
+import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+import PageSection from '@/components/Global/PageSection';
+import JumpLink16 from '@carbon/icons-vue/es/jump-link/16';
+
+import JumpLinkMixin from '@/components/Mixins/JumpLinkMixin';
+
+import { chunk } from 'lodash';
+
+export default {
+ components: {
+ PageTitle,
+ TableDimmSlot,
+ TablePowerSupplies,
+ TableSystem,
+ TableFans,
+ TableBmcManager,
+ TableChassis,
+ TableProcessors,
+ PageSection,
+ JumpLink: JumpLink16,
+ },
+ mixins: [LoadingBarMixin, JumpLinkMixin],
+ beforeRouteLeave(to, from, next) {
+ // Hide loader if user navigates away from page
+ // before requests complete
+ this.hideLoader();
+ next();
+ },
+ data() {
+ return {
+ links: [
+ {
+ id: 'system',
+ dataRef: 'system',
+ href: '#system',
+ linkText: this.$t('pageInventory.system'),
+ },
+ {
+ id: 'bmc',
+ dataRef: 'bmc',
+ href: '#bmc',
+ linkText: this.$t('pageInventory.bmcManager'),
+ },
+ {
+ id: 'chassis',
+ dataRef: 'chassis',
+ href: '#chassis',
+ linkText: this.$t('pageInventory.chassis'),
+ },
+ {
+ id: 'dimms',
+ dataRef: 'dimms',
+ href: '#dimms',
+ linkText: this.$t('pageInventory.dimmSlot'),
+ },
+ {
+ id: 'fans',
+ dataRef: 'fans',
+ href: '#fans',
+ linkText: this.$t('pageInventory.fans'),
+ },
+ {
+ id: 'powerSupply',
+ dataRef: 'powerSupply',
+ href: '#powerSupply',
+ linkText: this.$t('pageInventory.powerSupplies'),
+ },
+ {
+ id: 'processors',
+ dataRef: 'processors',
+ href: '#processors',
+ linkText: this.$t('pageInventory.processors'),
+ },
+ {
+ id: 'system',
+ dataRef: 'system',
+ href: '#system',
+ linkText: this.$t('pageInventory.system'),
+ },
+ ],
+ };
+ },
+ computed: {
+ quicklinkColumns() {
+ // Chunk links array to 3 array's to display 3 items per column
+ return chunk(this.links, 3);
+ },
+ },
+ created() {
+ this.startLoader();
+ const systemTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-system-complete', () => resolve());
+ });
+ const bmcManagerTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-bmc-manager-complete', () => resolve());
+ });
+ const chassisTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-chassis-complete', () => resolve());
+ });
+ const dimmSlotTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-dimm-slot-complete', () => resolve());
+ });
+ const fansTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-fans-complete', () => resolve());
+ });
+ const powerSuppliesTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-power-supplies-complete', () =>
+ resolve()
+ );
+ });
+ const processorsTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-processors-complete', () => resolve());
+ });
+ // Combine all child component Promises to indicate
+ // when page data load complete
+ Promise.all([
+ systemTablePromise,
+ bmcManagerTablePromise,
+ chassisTablePromise,
+ dimmSlotTablePromise,
+ fansTablePromise,
+ powerSuppliesTablePromise,
+ processorsTablePromise,
+ ]).finally(() => this.endLoader());
+ },
+};
+</script>