17affc529SSandeepa Singh<template> 27affc529SSandeepa Singh <page-section :section-title="$t('pageInventory.dimmSlot')"> 37affc529SSandeepa Singh <b-row class="align-items-end"> 47affc529SSandeepa Singh <b-col sm="6" md="5" xl="4"> 57affc529SSandeepa Singh <search 67affc529SSandeepa Singh @change-search="onChangeSearchInput" 77affc529SSandeepa Singh @clear-search="onClearSearchInput" 87affc529SSandeepa Singh /> 97affc529SSandeepa Singh </b-col> 107affc529SSandeepa Singh <b-col sm="6" md="3" xl="2"> 117affc529SSandeepa Singh <table-cell-count 127affc529SSandeepa Singh :filtered-items-count="filteredRows" 137affc529SSandeepa Singh :total-number-of-cells="dimms.length" 147affc529SSandeepa Singh ></table-cell-count> 157affc529SSandeepa Singh </b-col> 167affc529SSandeepa Singh </b-row> 177affc529SSandeepa Singh <b-table 187affc529SSandeepa Singh sort-icon-left 197affc529SSandeepa Singh no-sort-reset 207affc529SSandeepa Singh hover 217affc529SSandeepa Singh sort-by="health" 227affc529SSandeepa Singh responsive="md" 237affc529SSandeepa Singh show-empty 247affc529SSandeepa Singh :items="dimms" 257affc529SSandeepa Singh :fields="fields" 267affc529SSandeepa Singh :sort-desc="true" 277affc529SSandeepa Singh :sort-compare="sortCompare" 287affc529SSandeepa Singh :filter="searchFilter" 297affc529SSandeepa Singh :empty-text="$t('global.table.emptyMessage')" 307affc529SSandeepa Singh :empty-filtered-text="$t('global.table.emptySearchMessage')" 3141057853SKenneth Fullbright :busy="isBusy" 327affc529SSandeepa Singh @filtered="onFiltered" 337affc529SSandeepa Singh > 347affc529SSandeepa Singh <!-- Expand chevron icon --> 357affc529SSandeepa Singh <template #cell(expandRow)="row"> 367affc529SSandeepa Singh <b-button 377affc529SSandeepa Singh variant="link" 387affc529SSandeepa Singh data-test-id="hardwareStatus-button-expandDimms" 397affc529SSandeepa Singh :title="expandRowLabel" 407affc529SSandeepa Singh class="btn-icon-only" 417affc529SSandeepa Singh @click="toggleRowDetails(row)" 427affc529SSandeepa Singh > 437affc529SSandeepa Singh <icon-chevron /> 447affc529SSandeepa Singh <span class="sr-only">{{ expandRowLabel }}</span> 457affc529SSandeepa Singh </b-button> 467affc529SSandeepa Singh </template> 477affc529SSandeepa Singh 487affc529SSandeepa Singh <!-- Health --> 497affc529SSandeepa Singh <template #cell(health)="{ value }"> 507affc529SSandeepa Singh <status-icon :status="statusIcon(value)" /> 517affc529SSandeepa Singh {{ value }} 527affc529SSandeepa Singh </template> 535d86af86SHuyLe 545d86af86SHuyLe <!-- StatusState --> 555d86af86SHuyLe <template #cell(statusState)="{ value }"> 565d86af86SHuyLe <status-icon :status="statusStateIcon(value)" /> 575d86af86SHuyLe {{ value }} 585d86af86SHuyLe </template> 595d86af86SHuyLe 6081876788SSandeepa Singh <!-- Toggle identify LED --> 6181876788SSandeepa Singh <template #cell(identifyLed)="row"> 6281876788SSandeepa Singh <b-form-checkbox 63b24a483eSKonstantin Aladyshev v-if="hasIdentifyLed(row.item.identifyLed)" 6481876788SSandeepa Singh v-model="row.item.identifyLed" 6581876788SSandeepa Singh name="switch" 6681876788SSandeepa Singh switch 6781876788SSandeepa Singh @change="toggleIdentifyLedValue(row.item)" 6881876788SSandeepa Singh > 6981876788SSandeepa Singh <span v-if="row.item.identifyLed"> 7081876788SSandeepa Singh {{ $t('global.status.on') }} 7181876788SSandeepa Singh </span> 7281876788SSandeepa Singh <span v-else> {{ $t('global.status.off') }} </span> 7381876788SSandeepa Singh </b-form-checkbox> 74b24a483eSKonstantin Aladyshev <div v-else>--</div> 7581876788SSandeepa Singh </template> 767affc529SSandeepa Singh <template #row-details="{ item }"> 777affc529SSandeepa Singh <b-container fluid> 787affc529SSandeepa Singh <b-row> 7981876788SSandeepa Singh <b-col sm="6" xl="6"> 807affc529SSandeepa Singh <dl> 81af76e2bcSJason M. Bills <!-- Manufacturer --> 82af76e2bcSJason M. Bills <dt>{{ $t('pageInventory.table.manufacturer') }}:</dt> 83af76e2bcSJason M. Bills <dd>{{ dataFormatter(item.manufacturer) }}</dd> 84af76e2bcSJason M. Bills </dl> 85af76e2bcSJason M. Bills <dl> 8681876788SSandeepa Singh <!-- Part Number --> 8781876788SSandeepa Singh <dt>{{ $t('pageInventory.table.partNumber') }}:</dt> 8881876788SSandeepa Singh <dd>{{ dataFormatter(item.partNumber) }}</dd> 8981876788SSandeepa Singh </dl> 9081876788SSandeepa Singh <dl> 9181876788SSandeepa Singh <!-- Serial Number --> 9281876788SSandeepa Singh <dt>{{ $t('pageInventory.table.serialNumber') }}:</dt> 9381876788SSandeepa Singh <dd>{{ dataFormatter(item.serialNumber) }}</dd> 9481876788SSandeepa Singh </dl> 9581876788SSandeepa Singh <dl> 9681876788SSandeepa Singh <!-- Spare Part Number --> 9781876788SSandeepa Singh <dt>{{ $t('pageInventory.table.sparePartNumber') }}:</dt> 9881876788SSandeepa Singh <dd>{{ dataFormatter(item.sparePartNumber) }}</dd> 9981876788SSandeepa Singh </dl> 10081876788SSandeepa Singh <dl> 10181876788SSandeepa Singh <!-- Model --> 10281876788SSandeepa Singh <dt>{{ $t('pageInventory.table.model') }}:</dt> 10381876788SSandeepa Singh <dd>{{ dataFormatter(item.model) }}</dd> 10481876788SSandeepa Singh </dl> 10581876788SSandeepa Singh </b-col> 10681876788SSandeepa Singh <b-col sm="6" xl="6"> 10781876788SSandeepa Singh <dl> 108ba60e9c3SGlukhov Mikhail <!-- Capacity MiB --> 109ba60e9c3SGlukhov Mikhail <dt>{{ $t('pageInventory.table.capacityMiB') }}:</dt> 110d0b078f6SGlukhov Mikhail <dd> 111d0b078f6SGlukhov Mikhail {{ dataFormatter(item.capacityMiB) }} 112d0b078f6SGlukhov Mikhail {{ $t('unit.MiB') }} 113d0b078f6SGlukhov Mikhail </dd> 11481876788SSandeepa Singh </dl> 11581876788SSandeepa Singh <dl> 116af76e2bcSJason M. Bills <!-- Rank Count --> 117af76e2bcSJason M. Bills <dt>{{ $t('pageInventory.table.rankCount') }}:</dt> 118af76e2bcSJason M. Bills <dd>{{ dataFormatter(item.rankCount) }}</dd> 119af76e2bcSJason M. Bills </dl> 120af76e2bcSJason M. Bills <dl> 12181876788SSandeepa Singh <!-- Status--> 1227affc529SSandeepa Singh <dt>{{ $t('pageInventory.table.statusState') }}:</dt> 1239726f9a7SDixsie Wolmers <dd>{{ dataFormatter(item.statusState) }}</dd> 1247affc529SSandeepa Singh </dl> 12561fdd942SSandeepa Singh <dl> 12661fdd942SSandeepa Singh <!-- Enabled--> 12761fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.enabled') }}:</dt> 12861fdd942SSandeepa Singh <dd>{{ dataFormatter(item.enabled) }}</dd> 12961fdd942SSandeepa Singh </dl> 13061fdd942SSandeepa Singh </b-col> 13161fdd942SSandeepa Singh </b-row> 13261fdd942SSandeepa Singh <div class="section-divider mb-3 mt-3"></div> 13361fdd942SSandeepa Singh <b-row> 13461fdd942SSandeepa Singh <b-col sm="6" xl="6"> 13561fdd942SSandeepa Singh <dl> 13661fdd942SSandeepa Singh <!-- Description --> 13761fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.description') }}:</dt> 13861fdd942SSandeepa Singh <dd>{{ dataFormatter(item.description) }}</dd> 13961fdd942SSandeepa Singh </dl> 14061fdd942SSandeepa Singh <dl> 14161fdd942SSandeepa Singh <!-- Memory Type --> 14261fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.memoryType') }}:</dt> 14361fdd942SSandeepa Singh <dd>{{ dataFormatter(item.memoryType) }}</dd> 14461fdd942SSandeepa Singh </dl> 14561fdd942SSandeepa Singh <dl> 14661fdd942SSandeepa Singh <!-- Base Module Type --> 14761fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.baseModuleType') }}:</dt> 14861fdd942SSandeepa Singh <dd>{{ dataFormatter(item.baseModuleType) }}</dd> 14961fdd942SSandeepa Singh </dl> 15061fdd942SSandeepa Singh </b-col> 15161fdd942SSandeepa Singh <b-col sm="6" xl="6"> 15261fdd942SSandeepa Singh <dl> 15361fdd942SSandeepa Singh <!-- Bus Width Bits --> 15461fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.busWidthBits') }}:</dt> 155d0b078f6SGlukhov Mikhail <dd> 156d0b078f6SGlukhov Mikhail {{ dataFormatter(item.busWidthBits) }} 157d0b078f6SGlukhov Mikhail {{ $t('unit.bit') }} 158d0b078f6SGlukhov Mikhail </dd> 15961fdd942SSandeepa Singh </dl> 16061fdd942SSandeepa Singh <dl> 16161fdd942SSandeepa Singh <!-- Data Width Bits --> 16261fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.dataWidthBits') }}:</dt> 163d0b078f6SGlukhov Mikhail <dd> 164d0b078f6SGlukhov Mikhail {{ dataFormatter(item.dataWidthBits) }} 165d0b078f6SGlukhov Mikhail {{ $t('unit.bit') }} 166d0b078f6SGlukhov Mikhail </dd> 16761fdd942SSandeepa Singh </dl> 16861fdd942SSandeepa Singh <dl> 16961fdd942SSandeepa Singh <!-- Operating Speed Mhz --> 17061fdd942SSandeepa Singh <dt>{{ $t('pageInventory.table.operatingSpeedMhz') }}:</dt> 171d0b078f6SGlukhov Mikhail <dd> 172d0b078f6SGlukhov Mikhail {{ dataFormatter(item.operatingSpeedMhz) }} 173d0b078f6SGlukhov Mikhail {{ $t('unit.MHz') }} 174d0b078f6SGlukhov Mikhail </dd> 17561fdd942SSandeepa Singh </dl> 176af76e2bcSJason M. Bills <dl> 177af76e2bcSJason M. Bills <!-- Error Correction --> 178af76e2bcSJason M. Bills <dt>{{ $t('pageInventory.table.errorCorrection') }}:</dt> 179af76e2bcSJason M. Bills <dd>{{ dataFormatter(item.errorCorrection) }}</dd> 180af76e2bcSJason M. Bills </dl> 1817affc529SSandeepa Singh </b-col> 1827affc529SSandeepa Singh </b-row> 1837affc529SSandeepa Singh </b-container> 1847affc529SSandeepa Singh </template> 1857affc529SSandeepa Singh </b-table> 1867affc529SSandeepa Singh </page-section> 1877affc529SSandeepa Singh</template> 1887affc529SSandeepa Singh 1897affc529SSandeepa Singh<script> 1907affc529SSandeepa Singhimport PageSection from '@/components/Global/PageSection'; 1917affc529SSandeepa Singhimport IconChevron from '@carbon/icons-vue/es/chevron--down/20'; 1927affc529SSandeepa Singh 1937affc529SSandeepa Singhimport StatusIcon from '@/components/Global/StatusIcon'; 1947affc529SSandeepa Singhimport TableCellCount from '@/components/Global/TableCellCount'; 1957affc529SSandeepa Singh 196*f11a1901SNikhil Ashokaimport BVToastMixin from '@/components/Mixins/BVToastMixin'; 1979726f9a7SDixsie Wolmersimport DataFormatterMixin from '@/components/Mixins/DataFormatterMixin'; 1987affc529SSandeepa Singhimport TableSortMixin from '@/components/Mixins/TableSortMixin'; 1997affc529SSandeepa Singhimport Search from '@/components/Global/Search'; 2007affc529SSandeepa Singhimport SearchFilterMixin, { 2017affc529SSandeepa Singh searchFilter, 2027affc529SSandeepa Singh} from '@/components/Mixins/SearchFilterMixin'; 2037affc529SSandeepa Singhimport TableRowExpandMixin, { 2047affc529SSandeepa Singh expandRowLabel, 2057affc529SSandeepa Singh} from '@/components/Mixins/TableRowExpandMixin'; 2067affc529SSandeepa Singh 2077affc529SSandeepa Singhexport default { 2087affc529SSandeepa Singh components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount }, 2097affc529SSandeepa Singh mixins: [ 210*f11a1901SNikhil Ashoka BVToastMixin, 2117affc529SSandeepa Singh TableRowExpandMixin, 2129726f9a7SDixsie Wolmers DataFormatterMixin, 2137affc529SSandeepa Singh TableSortMixin, 2147affc529SSandeepa Singh SearchFilterMixin, 2157affc529SSandeepa Singh ], 2167affc529SSandeepa Singh data() { 2177affc529SSandeepa Singh return { 21841057853SKenneth Fullbright isBusy: true, 2197affc529SSandeepa Singh fields: [ 2207affc529SSandeepa Singh { 2217affc529SSandeepa Singh key: 'expandRow', 2227affc529SSandeepa Singh label: '', 2237affc529SSandeepa Singh tdClass: 'table-row-expand', 2247affc529SSandeepa Singh }, 2257affc529SSandeepa Singh { 2267affc529SSandeepa Singh key: 'id', 2277affc529SSandeepa Singh label: this.$t('pageInventory.table.id'), 2289726f9a7SDixsie Wolmers formatter: this.dataFormatter, 2297affc529SSandeepa Singh }, 2307affc529SSandeepa Singh { 2317affc529SSandeepa Singh key: 'health', 2327affc529SSandeepa Singh label: this.$t('pageInventory.table.health'), 2339726f9a7SDixsie Wolmers formatter: this.dataFormatter, 2347affc529SSandeepa Singh tdClass: 'text-nowrap', 2357affc529SSandeepa Singh }, 2367affc529SSandeepa Singh { 2375d86af86SHuyLe key: 'statusState', 2385d86af86SHuyLe label: this.$t('pageInventory.table.state'), 2395d86af86SHuyLe formatter: this.dataFormatter, 2405d86af86SHuyLe tdClass: 'text-nowrap', 2415d86af86SHuyLe }, 2425d86af86SHuyLe { 24381876788SSandeepa Singh key: 'locationNumber', 24481876788SSandeepa Singh label: this.$t('pageInventory.table.locationNumber'), 2459726f9a7SDixsie Wolmers formatter: this.dataFormatter, 2467affc529SSandeepa Singh }, 2477affc529SSandeepa Singh { 24881876788SSandeepa Singh key: 'identifyLed', 24981876788SSandeepa Singh label: this.$t('pageInventory.table.identifyLed'), 2509726f9a7SDixsie Wolmers formatter: this.dataFormatter, 2517affc529SSandeepa Singh }, 2527affc529SSandeepa Singh ], 2537affc529SSandeepa Singh searchFilter: searchFilter, 2547affc529SSandeepa Singh searchTotalFilteredRows: 0, 2557affc529SSandeepa Singh expandRowLabel: expandRowLabel, 2567affc529SSandeepa Singh }; 2577affc529SSandeepa Singh }, 2587affc529SSandeepa Singh computed: { 2597affc529SSandeepa Singh filteredRows() { 2607affc529SSandeepa Singh return this.searchFilter 2617affc529SSandeepa Singh ? this.searchTotalFilteredRows 2627affc529SSandeepa Singh : this.dimms.length; 2637affc529SSandeepa Singh }, 2647affc529SSandeepa Singh dimms() { 2657affc529SSandeepa Singh return this.$store.getters['memory/dimms']; 2667affc529SSandeepa Singh }, 2677affc529SSandeepa Singh }, 2687affc529SSandeepa Singh created() { 2697affc529SSandeepa Singh this.$store.dispatch('memory/getDimms').finally(() => { 2707affc529SSandeepa Singh // Emit initial data fetch complete to parent component 2717affc529SSandeepa Singh this.$root.$emit('hardware-status-dimm-slot-complete'); 27241057853SKenneth Fullbright this.isBusy = false; 2737affc529SSandeepa Singh }); 2747affc529SSandeepa Singh }, 2757affc529SSandeepa Singh methods: { 2767affc529SSandeepa Singh sortCompare(a, b, key) { 2777affc529SSandeepa Singh if (key === 'health') { 2787affc529SSandeepa Singh return this.sortStatus(a, b, key); 2795d86af86SHuyLe } else if (key === 'statusState') { 2805d86af86SHuyLe return this.sortStatusState(a, b, key); 2817affc529SSandeepa Singh } 2827affc529SSandeepa Singh }, 2837affc529SSandeepa Singh onFiltered(filteredItems) { 2847affc529SSandeepa Singh this.searchTotalFilteredRows = filteredItems.length; 2857affc529SSandeepa Singh }, 28681876788SSandeepa Singh toggleIdentifyLedValue(row) { 28781876788SSandeepa Singh this.$store 28881876788SSandeepa Singh .dispatch('memory/updateIdentifyLedValue', { 28981876788SSandeepa Singh uri: row.uri, 29081876788SSandeepa Singh identifyLed: row.identifyLed, 29181876788SSandeepa Singh }) 292*f11a1901SNikhil Ashoka .then((message) => this.successToast(message)) 29381876788SSandeepa Singh .catch(({ message }) => this.errorToast(message)); 29481876788SSandeepa Singh }, 295b24a483eSKonstantin Aladyshev hasIdentifyLed(identifyLed) { 296b24a483eSKonstantin Aladyshev return typeof identifyLed === 'boolean'; 297b24a483eSKonstantin Aladyshev }, 2985d86af86SHuyLe statusStateIcon(status) { 2995d86af86SHuyLe switch (status) { 3005d86af86SHuyLe case 'Enabled': 3015d86af86SHuyLe return 'success'; 3025d86af86SHuyLe case 'Absent': 3035d86af86SHuyLe return 'warning'; 3045d86af86SHuyLe default: 3055d86af86SHuyLe return ''; 3065d86af86SHuyLe } 3075d86af86SHuyLe }, 3085d86af86SHuyLe sortStatusState(a, b, key) { 3095d86af86SHuyLe const statusState = ['Enabled', 'Absent']; 3105d86af86SHuyLe return statusState.indexOf(a[key]) - statusState.indexOf(b[key]); 3115d86af86SHuyLe }, 3127affc529SSandeepa Singh }, 3137affc529SSandeepa Singh}; 3147affc529SSandeepa Singh</script> 315