diff options
author | Sandeepa Singh <sandeepa.singh@ibm.com> | 2021-05-06 19:29:20 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2021-07-01 19:40:49 +0300 |
commit | 240c056c8989c5e3e0f0ff640f38f3e4cdbc6ac5 (patch) | |
tree | 5fabe5ede8ec55dfe5557a56d76a365ef0a16c84 /src | |
parent | 78b6b53d5248d9dc0293af8190c6a69fbaf2ccb0 (diff) | |
download | webui-vue-240c056c8989c5e3e0f0ff640f38f3e4cdbc6ac5.tar.xz |
Add chassis table missing properties
- Added the following properties: Name, Location number, Identify led,
Manufacturer, Chassis type, Asset tag, Max power watts, Min power watts
- Design has been updated for chassis table
Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Change-Id: Id2ef82573a4d17059dc9f4929155aa05cabef2aa
Diffstat (limited to 'src')
-rw-r--r-- | src/locales/en-US.json | 2 | ||||
-rw-r--r-- | src/store/modules/Health/ChassisStore.js | 34 | ||||
-rw-r--r-- | src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue | 109 |
3 files changed, 122 insertions, 23 deletions
diff --git a/src/locales/en-US.json b/src/locales/en-US.json index 8ec50e96..3196dcf8 100644 --- a/src/locales/en-US.json +++ b/src/locales/en-US.json @@ -397,6 +397,8 @@ "maxConcurrentSessions": "Max concurrent sessions", "maxSpeedMHz": "Max speed MHz", "minSpeedMHz": "Min speed MHz", + "maxPowerWatts": "Max power watts", + "minPowerWatts": "Min power watts", "model": "Model", "name": "Name", "partNumber": "Part number", diff --git a/src/store/modules/Health/ChassisStore.js b/src/store/modules/Health/ChassisStore.js index 251279e6..2faddfbf 100644 --- a/src/store/modules/Health/ChassisStore.js +++ b/src/store/modules/Health/ChassisStore.js @@ -1,4 +1,5 @@ import api from '@/store/api'; +import i18n from '@/i18n'; const ChassisStore = { namespaced: true, @@ -19,6 +20,11 @@ const ChassisStore = { ChassisType, Manufacturer, PowerState, + LocationIndicatorActive, + AssetTag, + MaxPowerWatts, + MinPowerWatts, + Name, } = chassis; return { @@ -31,6 +37,12 @@ const ChassisStore = { powerState: PowerState, statusState: Status.State, healthRollup: Status.HealthRollup, + assetTag: AssetTag, + maxPowerWatts: MaxPowerWatts, + minPowerWatts: MinPowerWatts, + name: Name, + identifyLed: LocationIndicatorActive, + uri: chassis['@odata.id'], }; }); }, @@ -49,6 +61,28 @@ const ChassisStore = { }) .catch((error) => console.log(error)); }, + async updateIdentifyLedValue({ dispatch }, led) { + const uri = led.uri; + const updatedIdentifyLedValue = { + LocationIndicatorActive: led.identifyLed, + }; + return await api + .patch(uri, updatedIdentifyLedValue) + .then(() => dispatch('getChassisInfo')) + .catch((error) => { + dispatch('getChassisInfo'); + console.log('error', error); + if (led.identifyLed) { + throw new Error( + i18n.t('pageHardwareStatus.toast.errorEnableIdentifyLed') + ); + } else { + throw new Error( + i18n.t('pageHardwareStatus.toast.errorDisableIdentifyLed') + ); + } + }); + }, }, }; diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue b/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue index c7e409a4..6b783c0f 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue @@ -27,33 +27,82 @@ <status-icon :status="statusIcon(value)" /> {{ value }} </template> - + <!-- Toggle identify LED --> + <template #cell(identifyLed)="row"> + <b-form-checkbox + v-if="hasIdentifyLed(row.item.identifyLed)" + v-model="row.item.identifyLed" + name="switch" + switch + @change="toggleIdentifyLedValue(row.item)" + > + <span v-if="row.item.identifyLed"> + {{ $t('global.status.on') }} + </span> + <span v-else> {{ $t('global.status.off') }} </span> + </b-form-checkbox> + <div v-else>--</div> + </template> <template #row-details="{ item }"> <b-container fluid> <b-row> - <b-col sm="6" xl="4"> + <b-col class="mt-2" sm="6" xl="6"> <dl> - <!-- Chassis type --> - <dt>{{ $t('pageHardwareStatus.table.chassisType') }}:</dt> - <dd>{{ tableFormatter(item.chassisType) }}</dd> - <!-- Manufacturer --> - <dt>{{ $t('pageHardwareStatus.table.manufacturer') }}:</dt> - <dd>{{ tableFormatter(item.manufacturer) }}</dd> - <!-- Power state --> - <dt>{{ $t('pageHardwareStatus.table.powerState') }}:</dt> - <dd>{{ tableFormatter(item.powerState) }}</dd> + <!-- Name --> + <dt>{{ $t('pageHardwareStatus.table.name') }}:</dt> + <dd>{{ tableFormatter(item.name) }}</dd> + <!-- Part number --> + <dt>{{ $t('pageHardwareStatus.table.partNumber') }}:</dt> + <dd>{{ tableFormatter(item.partNumber) }}</dd> + <!-- Serial Number --> + <dt>{{ $t('pageHardwareStatus.table.serialNumber') }}:</dt> + <dd>{{ tableFormatter(item.serialNumber) }}</dd> + <!-- Model --> + <dt>{{ $t('pageHardwareStatus.table.model') }}:</dt> + <dd class="mb-2"> + {{ tableFormatter(item.model) }} + </dd> + <!-- Asset tag --> + <dt>{{ $t('pageHardwareStatus.table.assetTag') }}:</dt> + <dd class="mb-2"> + {{ tableFormatter(item.assetTag) }} + </dd> </dl> </b-col> - <b-col sm="6" xl="4"> + <b-col class="mt-2" sm="6" xl="6"> <dl> - <!-- Health rollup --> - <dt> - {{ $t('pageHardwareStatus.table.statusHealthRollup') }}: - </dt> - <dd>{{ tableFormatter(item.healthRollup) }}</dd> <!-- Status state --> <dt>{{ $t('pageHardwareStatus.table.statusState') }}:</dt> <dd>{{ tableFormatter(item.statusState) }}</dd> + <!-- Power state --> + <dt>{{ $t('pageHardwareStatus.table.power') }}:</dt> + <dd>{{ tableFormatter(item.power) }}</dd> + <!-- Health rollup --> + <dt>{{ $t('pageHardwareStatus.table.healthRollup') }}:</dt> + <dd>{{ tableFormatter(item.healthRollup) }}</dd> + </dl> + </b-col> + </b-row> + <div class="section-divider mb-3 mt-3"></div> + <b-row> + <b-col class="mt-2" sm="6" xl="6"> + <dl> + <!-- Manufacturer --> + <dt>{{ $t('pageHardwareStatus.table.manufacturer') }}:</dt> + <dd>{{ tableFormatter(item.manufacturer) }}</dd> + <!-- Chassis Type --> + <dt>{{ $t('pageHardwareStatus.table.chassisType') }}:</dt> + <dd>{{ tableFormatter(item.chassisType) }}</dd> + </dl> + </b-col> + <b-col class="mt-2" sm="6" xl="6"> + <dl> + <!-- Min power --> + <dt>{{ $t('pageHardwareStatus.table.minPowerWatts') }}:</dt> + <dd>{{ tableFormatter(item.minPowerWatts) }}</dd> + <!-- Max power --> + <dt>{{ $t('pageHardwareStatus.table.maxPowerWatts') }}:</dt> + <dd>{{ tableFormatter(item.maxPowerWatts) }}</dd> </dl> </b-col> </b-row> @@ -66,7 +115,7 @@ <script> import PageSection from '@/components/Global/PageSection'; import IconChevron from '@carbon/icons-vue/es/chevron--down/20'; - +import BVToastMixin from '@/components/Mixins/BVToastMixin'; import StatusIcon from '@/components/Global/StatusIcon'; import TableRowExpandMixin, { @@ -76,7 +125,7 @@ import TableDataFormatterMixin from '@/components/Mixins/TableDataFormatterMixin export default { components: { IconChevron, PageSection, StatusIcon }, - mixins: [TableRowExpandMixin, TableDataFormatterMixin], + mixins: [BVToastMixin, TableRowExpandMixin, TableDataFormatterMixin], data() { return { fields: [ @@ -97,13 +146,13 @@ export default { tdClass: 'text-nowrap', }, { - key: 'partNumber', - label: this.$t('pageHardwareStatus.table.partNumber'), + key: 'locationNumber', + label: this.$t('pageHardwareStatus.table.locationNumber'), formatter: this.tableFormatter, }, { - key: 'serialNumber', - label: this.$t('pageHardwareStatus.table.serialNumber'), + key: 'identifyLed', + label: this.$t('pageHardwareStatus.table.identifyLed'), formatter: this.tableFormatter, }, ], @@ -121,5 +170,19 @@ export default { this.$root.$emit('hardware-status-chassis-complete'); }); }, + methods: { + toggleIdentifyLedValue(row) { + this.$store + .dispatch('chassis/updateIdentifyLedValue', { + uri: row.uri, + identifyLed: row.identifyLed, + }) + .catch(({ message }) => this.errorToast(message)); + }, + // TO DO: Remove this method when the LocationIndicatorActive is added from backend. + hasIdentifyLed(identifyLed) { + return typeof identifyLed === 'boolean'; + }, + }, }; </script> |