diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-06-19 00:21:50 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-06-26 00:32:30 +0300 |
commit | c069c67a1adbe98ac8aa28edaec31900f4594039 (patch) | |
tree | d28a425b4f1f888fcfeb8c45b7ba5a04dccba24a /src/views/Health | |
parent | 83458ae710871f90852d5db0a976ed81bbb6648b (diff) | |
download | webui-vue-c069c67a1adbe98ac8aa28edaec31900f4594039.tar.xz |
Add Search component to Fans table on Hardware status page
Adds ability to filter Fan table by a search input.
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I0131ad21cc030320e291c79e8801b78c7c7dd668
Diffstat (limited to 'src/views/Health')
-rw-r--r-- | src/views/Health/HardwareStatus/HardwareStatusTableFans.vue | 15 |
1 files changed, 13 insertions, 2 deletions
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue b/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue index a4481e2d..fd000a9b 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue @@ -1,5 +1,10 @@ <template> <page-section :section-title="$t('pageHardwareStatus.fans')"> + <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"> @@ -46,9 +52,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 { @@ -83,7 +90,8 @@ export default { formatter: this.tableFormatter, sortable: true } - ] + ], + searchFilter: null }; }, computed: { @@ -102,6 +110,9 @@ export default { if (key === 'health') { return this.sortStatus(a, b, key); } + }, + onChangeSearchInput(searchValue) { + this.searchFilter = searchValue; } } }; |