diff --git a/src/components/Global/Search.vue b/src/components/Global/Search.vue index 913634de1c..5e34412af9 100644 --- a/src/components/Global/Search.vue +++ b/src/components/Global/Search.vue @@ -2,16 +2,21 @@
- + - + - + { + const spaceFilter = (value) => { + return value.toLowerCase().replace(/\s+/g, '-'); + }; + + return { spaceFilter }; +}; + +export default utilitiesFunctions; diff --git a/src/views/HardwareStatus/Inventory/InventoryFabricAdapters.vue b/src/views/HardwareStatus/Inventory/InventoryFabricAdapters.vue index 13d73bea2a..3df135a2b6 100644 --- a/src/views/HardwareStatus/Inventory/InventoryFabricAdapters.vue +++ b/src/views/HardwareStatus/Inventory/InventoryFabricAdapters.vue @@ -107,7 +107,7 @@ fabricAdapters, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } diff --git a/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue b/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue index 6d5a6e26eb..849393a0d1 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableAssembly.vue @@ -104,7 +104,7 @@ { label: t('pageInventory.table.partNumber'), formatter: dataFormatter, sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }); } return tempFields; @@ -302,6 +316,20 @@ watch( }, ); +watch( + () => items, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } diff --git a/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue b/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue index f559a4e46c..bbe53aa3d2 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableBmcManager.vue @@ -82,7 +82,7 @@ @@ -133,7 +133,7 @@ import PageSection from '@/components/Global/PageSection.vue'; import InfoTooltip from '@/components/Global/InfoTooltip.vue'; import IconChevron from '@carbon/icons-vue/es/chevron--down/20'; -import { reactive, ref, computed, onBeforeMount } from 'vue'; +import { reactive, ref, computed, onBeforeMount, watch, nextTick } from 'vue'; import useDataFormatterGlobal from '../../../components/Composables/useDataFormatterGlobal'; import useTableRowExpandComposable from '../../../components/Composables/useTableRowExpandComposable'; import stores from '../../../store'; @@ -155,32 +155,44 @@ const fields = reactive([ key: 'expandRow', label: '', tdClass: 'table-row-expand', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'name', label: t('pageInventory.table.name'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'health', label: t('pageInventory.table.health'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'status', label: t('pageUserManagement.table.status'), formatter: dataFormatter, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'locationNumber', label: t('pageInventory.table.locationNumber'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'identifyLed', label: t('pageInventory.table.identifyLed'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); @@ -205,6 +217,20 @@ const items = computed(() => { } }); +watch( + () => items, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function toggleIdentifyLedValue(row) { bmcStore .updateIdentifyLedValue({ uri: row.uri, identifyLed: row.identifyLed }) diff --git a/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue b/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue index e9dd4d638b..1c5a0822b3 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableChassis.vue @@ -78,7 +78,7 @@ @@ -119,7 +119,7 @@ import IconChevron from '@carbon/icons-vue/es/chevron--down/20'; import InfoTooltip from '@/components/Global/InfoTooltip.vue'; import useDataFormatterGlobal from '../../../components/Composables/useDataFormatterGlobal'; import useTableRowExpandComposable from '../../../components/Composables/useTableRowExpandComposable'; -import { reactive, ref, computed, onBeforeMount } from 'vue'; +import { reactive, ref, computed, onBeforeMount, watch, nextTick } from 'vue'; import { useI18n } from 'vue-i18n'; import stores from '../../../store'; import eventBus from '@/eventBus'; @@ -138,33 +138,45 @@ const fields = reactive([ key: 'expandRow', label: '', tdClass: 'table-row-expand', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'id', label: t('pageInventory.table.id'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'health', label: t('pageInventory.table.health'), formatter: dataFormatter, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'status', label: t('pageUserManagement.table.status'), formatter: dataFormatter, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'locationNumber', label: t('pageInventory.table.locationNumber'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'identifyLed', label: t('pageInventory.table.identifyLed'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); @@ -181,6 +193,20 @@ const chassis = computed(() => { return chassisStore.chassis; }); +watch( + () => chassis, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function toggleIdentifyLedValue(row) { chassisStore .updateIdentifyLedValue({ uri: row.uri, identifyLed: row.identifyLed }) diff --git a/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue b/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue index 7bfad647ae..c494ea5b86 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableDimmSlot.vue @@ -2,7 +2,11 @@ - + @@ -170,7 +174,7 @@ import useDataFormatterGlobal from '../../../components/Composables/useDataForma import { useI18n } from 'vue-i18n'; import eventBus from '@/eventBus'; import useToast from '@/components/Composables/useToastComposable'; -import { ref, reactive, computed, onBeforeMount } from 'vue'; +import { ref, reactive, computed, onBeforeMount, watch, nextTick } from 'vue'; import stores from '../../../store'; const { searchFilterInput, onChangeSearch, onClearSearch } = @@ -190,12 +194,16 @@ const fields = reactive([ key: 'expandRow', label: '', tdClass: 'table-row-expand', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'name', label: t('pageInventory.table.name'), formatter: dataFormatter, sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'health', @@ -203,6 +211,8 @@ const fields = reactive([ formatter: dataFormatter, tdClass: 'text-nowrap', sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'status', @@ -210,18 +220,24 @@ const fields = reactive([ formatter: dataFormatter, sortable: true, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'locationNumber', label: t('pageInventory.table.locationNumber'), formatter: dataFormatter, sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'identifyLed', label: t('pageInventory.table.identifyLed'), formatter: dataFormatter, sortable: false, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); @@ -244,6 +260,20 @@ const dimms = computed(() => { return memoryStore.dimmsGetter; }); +watch( + () => dimms, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } @@ -315,4 +345,8 @@ function getStatusTooltip(status) { top: 0; z-index: 1; } + +.b-table-sort-icon svg { + aria-hidden: true; +} diff --git a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue index 960c42190e..5f74887366 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableFans.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableFans.vue @@ -2,7 +2,11 @@ - + fans, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } diff --git a/src/views/HardwareStatus/Inventory/InventoryTablePcieSlots.vue b/src/views/HardwareStatus/Inventory/InventoryTablePcieSlots.vue index 073bca5741..1d959b630c 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTablePcieSlots.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTablePcieSlots.vue @@ -9,7 +9,11 @@ }} - + import PageSection from '@/components/Global/PageSection.vue'; import TableCellCount from '@/components/Global/TableCellCount.vue'; -import { reactive, ref, computed, watch, onBeforeMount } from 'vue'; +import { reactive, ref, computed, watch, onBeforeMount, nextTick } from 'vue'; import InfoTooltip from '@/components/Global/InfoTooltip.vue'; import useSearchFilterComposable from '../../../components/Composables/useSearchFilterComposable'; @@ -118,17 +122,23 @@ const fields = reactive([ formatter: dataFormatter, sortable: true, class: 'text-center', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'locationNumber', label: t('pageInventory.table.locationNumber'), formatter: dataFormatter, sortable: true, + thAttr: { scope: null }, + tdAttr: { scope: null }, }, { key: 'identifyLed', label: t('pageInventory.table.identifyLed'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); @@ -184,6 +194,20 @@ const setSlotListLength = (value) => { return; }; +watch( + () => pcieSlots, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } diff --git a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue index ac4f481234..a94bdf5c19 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTablePowerSupplies.vue @@ -2,7 +2,11 @@ - + powerSupplies, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } diff --git a/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue b/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue index 449a121428..ec81ca0301 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableProcessors.vue @@ -3,7 +3,11 @@ - + @@ -166,7 +170,7 @@ import InfoTooltip from '@/components/Global/InfoTooltip.vue'; import useDataFormatterGlobal from '../../../components/Composables/useDataFormatterGlobal'; import Search from '@/components/Global/Search.vue'; import ProcessorStore from '../../../store/modules/HardwareStatus/ProcessorStore'; -import { computed, onBeforeMount, reactive, ref } from 'vue'; +import { computed, onBeforeMount, reactive, ref, watch, nextTick } from 'vue'; import useToast from '@/components/Composables/useToastComposable'; import eventBus from '@/eventBus'; import { useI18n } from 'vue-i18n'; @@ -192,12 +196,16 @@ const fields = reactive([ label: '', tdClass: 'table-row-expand', sortable: false, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'id', label: t('pageInventory.table.name'), formatter: dataFormatter, sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'health', @@ -205,6 +213,8 @@ const fields = reactive([ formatter: dataFormatter, sortable: true, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'status', @@ -212,18 +222,24 @@ const fields = reactive([ formatter: dataFormatter, sortable: true, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'locationNumber', label: t('pageInventory.table.locationNumber'), formatter: dataFormatter, sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'identifyLed', label: t('pageInventory.table.identifyLed'), formatter: dataFormatter, sortable: false, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); @@ -250,6 +266,20 @@ function onFiltered(filteredItems) { searchTotalFilteredRows.value = filteredItems.length; } +watch( + () => processors, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function toggleIdentifyLedValue(row) { processorStore .updateIdentifyLedValue({ diff --git a/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue b/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue index bfe2081a6a..a1d225d8b7 100644 --- a/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue +++ b/src/views/HardwareStatus/Inventory/InventoryTableSystem.vue @@ -126,7 +126,7 @@ import IconChevron from '@carbon/icons-vue/es/chevron--down/20'; import InfoTooltip from '@/components/Global/InfoTooltip.vue'; import useDataFormatterGlobal from '../../../components/Composables/useDataFormatterGlobal'; import useTableRowExpandComposable from '../../../components/Composables/useTableRowExpandComposable'; -import { computed, onBeforeMount, reactive, ref } from 'vue'; +import { computed, onBeforeMount, reactive, ref, watch, nextTick } from 'vue'; import { useI18n } from 'vue-i18n'; import stores from '../../../store'; import eventBus from '@/eventBus'; @@ -143,23 +143,31 @@ const fields = reactive([ key: 'expandRow', label: '', tdClass: 'table-row-expand', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'name', label: t('pageInventory.table.name'), formatter: dataFormatter, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'health', label: t('pageInventory.table.health'), formatter: dataFormatter, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'status', label: t('pageUserManagement.table.status'), formatter: dataFormatter, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); @@ -175,6 +183,20 @@ const systems = computed(() => { return systemStore.systems; }); +watch( + () => systems, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function getStatusTooltip(status) { switch (status) { case 'Enabled': diff --git a/src/views/HardwareStatus/PcieTopology/PcieTopology.vue b/src/views/HardwareStatus/PcieTopology/PcieTopology.vue index cba498f699..c6b658cd6c 100644 --- a/src/views/HardwareStatus/PcieTopology/PcieTopology.vue +++ b/src/views/HardwareStatus/PcieTopology/PcieTopology.vue @@ -277,7 +277,6 @@ itemPerPage === 0 ? filteredEntries.length || 1 : itemPerPage " :total-rows="getTotalRowCount(filteredRows)" - aria-controls="table-event-logs" /> @@ -298,7 +297,15 @@ import TableFilter from '@/components/Global/TableFilter.vue'; import useDataFormatterGlobal from '../../../components/Composables/useDataFormatterGlobal'; import ModalReset from './ResetLinkModal.vue'; import ModalLeds from './IdentifyLedsModal.vue'; -import { onBeforeMount, onMounted, reactive, ref, computed } from 'vue'; +import { + onBeforeMount, + onMounted, + reactive, + ref, + computed, + watch, + nextTick, +} from 'vue'; import useTableRowExpandComposable from '../../../components/Composables/useTableRowExpandComposable'; import useSearchFilterComposable from '../../../components/Composables/useSearchFilterComposable'; import useTableFilter from '../../../components/Composables/useTableFilterComposable'; @@ -336,12 +343,16 @@ const fields = reactive([ label: '', formatter: dataFormatter, tdClass: 'table-row-expand', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'id', label: i18n.global.t('pagePcieTopology.id'), formatter: dataFormatter, sortable: true, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'parentId', @@ -349,6 +360,8 @@ const fields = reactive([ formatter: dataFormatter, sortable: true, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'linkStatus', @@ -356,6 +369,8 @@ const fields = reactive([ formatter: dataFormatter, sortable: false, tdClass: 'text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'localPortLocation', @@ -363,12 +378,16 @@ const fields = reactive([ formatter: dataFormatter, sortable: false, tdClass: 'text-break', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'remotePortLocation', label: i18n.global.t('pagePcieTopology.remotePortLocation'), formatter: dataFormatter, sortable: false, + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, { key: 'actions', @@ -376,6 +395,8 @@ const fields = reactive([ formatter: dataFormatter, label: ' ', tdClass: 'text-right text-nowrap', + thAttr: { scope: 'col' }, + tdAttr: { scope: null }, }, ]); const tableFilters = reactive([ @@ -467,6 +488,21 @@ const isServiceUser = computed(() => { return globalStore.isServiceUser; }); +watch( + () => filteredEntries, + () => { + nextTick(() => { + document + .querySelectorAll('.b-table-sortable-column svg') + .forEach((svg) => { + console.log('For triggered'); + svg.setAttribute('aria-hidden', 'true'); + }); + }); + }, + { deep: true }, +); + function checkIfInPhypStandby(checkCounter = 0) { checkCounter++; if (checkCounter > 50) return; diff --git a/src/views/HardwareStatus/Sensors/Sensors.vue b/src/views/HardwareStatus/Sensors/Sensors.vue index 2350803bb2..c4bebe930f 100644 --- a/src/views/HardwareStatus/Sensors/Sensors.vue +++ b/src/views/HardwareStatus/Sensors/Sensors.vue @@ -67,15 +67,22 @@