diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-04-29 20:52:39 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-05-05 07:25:19 +0300 |
commit | b1a7191eb287fe92c82d3346f2a9587e41c62d2b (patch) | |
tree | fef7e2b1f08703233183fd2c86dccb4ba193af0b /src/views/Health | |
parent | 3be801aa07ed85c8a90eb6f53a807a1cc57cdaa9 (diff) | |
download | webui-vue-b1a7191eb287fe92c82d3346f2a9587e41c62d2b.tar.xz |
Add export functionality to Sensors page
- Create TableToolbarExport component to be used as a slot
in TableToolbar
- Allows selected table items to be exported
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I929347e046af8a5d5188e4c4fd9fc874e067cce5
Diffstat (limited to 'src/views/Health')
-rw-r--r-- | src/views/Health/Sensors/Sensors.vue | 50 |
1 files changed, 48 insertions, 2 deletions
diff --git a/src/views/Health/Sensors/Sensors.vue b/src/views/Health/Sensors/Sensors.vue index fe9d3972..6de5c9e7 100644 --- a/src/views/Health/Sensors/Sensors.vue +++ b/src/views/Health/Sensors/Sensors.vue @@ -8,7 +8,22 @@ </b-row> <b-row> <b-col xl="12"> + <table-toolbar + ref="toolbar" + :selected-items-count="selectedRows.length" + @clearSelected="clearSelectedRows($refs.table)" + > + <template v-slot:export> + <table-toolbar-export + :data="selectedRows" + :file-name="$t('appPageTitle.sensors')" + /> + </template> + </table-toolbar> <b-table + ref="table" + selectable + no-select-on-click sort-icon-left no-sort-reset sticky-header="75vh" @@ -17,7 +32,23 @@ :fields="fields" :sort-desc="true" :sort-compare="sortCompare" + @row-selected="onRowSelected($event, filteredSensors.length)" > + <!-- Checkbox column --> + <template v-slot:head(checkbox)> + <b-form-checkbox + v-model="tableHeaderCheckboxModel" + :indeterminate="tableHeaderCheckboxIndeterminate" + @change="onChangeHeaderCheckbox($refs.table)" + /> + </template> + <template v-slot:cell(checkbox)="row"> + <b-form-checkbox + v-model="row.rowSelected" + @change="toggleSelectRow($refs.table, row.index)" + /> + </template> + <template v-slot:cell(status)="{ value }"> <status-icon :status="statusIcon(value)" /> {{ value }} @@ -47,7 +78,11 @@ import PageTitle from '../../../components/Global/PageTitle'; import StatusIcon from '../../../components/Global/StatusIcon'; import TableFilter from '../../../components/Global/TableFilter'; +import TableToolbar from '@/components/Global/TableToolbar'; +import TableToolbarExport from '@/components/Global/TableToolbarExport'; + import TableFilterMixin from '../../../components/Mixins/TableFilterMixin'; +import BVTableSelectableMixin from '@/components/Mixins/BVTableSelectableMixin'; const SENSOR_STATUS = ['OK', 'Warning', 'Critical']; @@ -60,12 +95,23 @@ const valueFormatter = value => { export default { name: 'Sensors', - components: { PageTitle, StatusIcon, TableFilter }, - mixins: [TableFilterMixin], + components: { + PageTitle, + StatusIcon, + TableFilter, + TableToolbar, + TableToolbarExport + }, + mixins: [TableFilterMixin, BVTableSelectableMixin], data() { return { fields: [ { + key: 'checkbox', + sortable: false, + label: '' + }, + { key: 'name', sortable: true, label: this.$t('pageSensors.table.name') |