diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-06-19 00:29:57 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-06-27 23:19:20 +0300 |
commit | 130b1b6795e576b0533cf4691319afbcc7727297 (patch) | |
tree | de29f2cacfb0f15ed1a14e4a08615a038944bce4 /src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue | |
parent | ed06dc11747d4ffb1dbbe0f3568308c6737c94c0 (diff) | |
download | webui-vue-130b1b6795e576b0533cf4691319afbcc7727297.tar.xz |
Add Search to Power supplies table on Hardware status page
Adds ability to filter Power supplies table by a search input.
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I9f3131294d316edd70e3b6bcc4fee307ac69f2d5
Diffstat (limited to 'src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue')
-rw-r--r-- | src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue | 15 |
1 files changed, 13 insertions, 2 deletions
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue b/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue index 763ab267..be330efe 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue @@ -1,5 +1,10 @@ <template> <page-section :section-title="$t('pageHardwareStatus.powerSupplies')"> + <b-row> + <b-col sm="6" md="5" xl="4"> + <search @changeSearch="onChangeSearchInput" /> + </b-col> + </b-row> <b-table sort-icon-left no-sort-reset @@ -8,6 +13,7 @@ :fields="fields" :sort-desc="true" :sort-compare="sortCompare" + :filter="searchFilter" > <!-- Expand chevron icon --> <template v-slot:cell(expandRow)="row"> @@ -69,9 +75,10 @@ import IconChevron from '@carbon/icons-vue/es/chevron--down/20'; import StatusIcon from '@/components/Global/StatusIcon'; import TableDataFormatterMixin from '@/components/Mixins/TableDataFormatterMixin'; import TableSortMixin from '@/components/Mixins/TableSortMixin'; +import Search from '@/components/Global/Search'; export default { - components: { IconChevron, PageSection, StatusIcon }, + components: { IconChevron, PageSection, StatusIcon, Search }, mixins: [TableDataFormatterMixin, TableSortMixin], data() { return { @@ -106,7 +113,8 @@ export default { formatter: this.tableFormatter, sortable: true } - ] + ], + searchFilter: null }; }, computed: { @@ -125,6 +133,9 @@ export default { if (key === 'health') { return this.sortStatus(a, b, key); } + }, + onChangeSearchInput(searchValue) { + this.searchFilter = searchValue; } } }; |