diff options
Diffstat (limited to 'src/views/Health')
| -rw-r--r-- | src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue | 109 |
1 files changed, 86 insertions, 23 deletions
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> |