diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-05-18 19:49:37 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-06-13 07:49:18 +0300 |
commit | 68bbba296c6f99b81d2882e1fef6f37cf4a6bb51 (patch) | |
tree | f07d9fef5079ef7e9728bcbfc71a4dd3e5cc5aa3 /src/views | |
parent | 71724befc716d373e2fd6396fcd6934277f38f66 (diff) | |
download | webui-vue-68bbba296c6f99b81d2882e1fef6f37cf4a6bb51.tar.xz |
Add date filter on Event logs page
Created global TableDateFilter component that uses the BootstrapVue
Datepicker with a native text input. This will allow users to manually
enter a date in ISO format or use the Bootstrap calendar dropdown.
Storing language preference from Login to use locale prop on
BootstrapVue Datepicker component.
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I66de9fb04451572c9a90f90d8522934b6204aed2
Diffstat (limited to 'src/views')
-rw-r--r-- | src/views/Health/EventLogs/EventLogs.vue | 42 | ||||
-rw-r--r-- | src/views/Login/Login.vue | 5 |
2 files changed, 32 insertions, 15 deletions
diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Health/EventLogs/EventLogs.vue index a5ef3757..44a24859 100644 --- a/src/views/Health/EventLogs/EventLogs.vue +++ b/src/views/Health/EventLogs/EventLogs.vue @@ -1,6 +1,11 @@ <template> <b-container fluid="xl"> <page-title /> + <b-row class="mb-3"> + <b-col md="6" lg="7" xl="5" offset-md="6" offset-lg="5" offset-xl="7"> + <table-date-filter @change="onChangeDateTimeFilter" /> + </b-col> + </b-row> <b-row> <b-col class="text-right"> <table-filter :filters="tableFilters" @filterChange="onFilterChange" /> @@ -121,6 +126,7 @@ import { omit } from 'lodash'; import PageTitle from '@/components/Global/PageTitle'; import StatusIcon from '@/components/Global/StatusIcon'; +import TableDateFilter from '@/components/Global/TableDateFilter'; import TableFilter from '@/components/Global/TableFilter'; import TableRowAction from '@/components/Global/TableRowAction'; import TableToolbar from '@/components/Global/TableToolbar'; @@ -143,7 +149,8 @@ export default { TableFilter, TableRowAction, TableToolbar, - TableToolbarExport + TableToolbarExport, + TableDateFilter }, mixins: [ BVPaginationMixin, @@ -202,7 +209,9 @@ export default { value: 'delete', label: this.$t('global.action.delete') } - ] + ], + filterStartDate: null, + filterEndDate: null }; }, computed: { @@ -223,16 +232,21 @@ export default { }; }); }, - filteredLogs: { - get: function() { - return this.getFilteredTableData(this.allLogs, this.activeFilters); - }, - set: function(newVal) { - return newVal; - } - }, batchExportData() { return this.selectedRows.map(row => omit(row, 'actions')); + }, + filteredLogsByDate() { + return this.getFilteredTableDataByDate( + this.allLogs, + this.filterStartDate, + this.filterEndDate + ); + }, + filteredLogs() { + return this.getFilteredTableData( + this.filteredLogsByDate, + this.activeFilters + ); } }, created() { @@ -273,10 +287,6 @@ export default { }, onFilterChange({ activeFilters }) { this.activeFilters = activeFilters; - this.filteredLogs = this.getFilteredTableData( - this.allLogs, - activeFilters - ); }, onSortCompare(a, b, key) { if (key === 'severity') { @@ -316,6 +326,10 @@ export default { if (deleteConfirmed) this.deleteLogs(uris); }); } + }, + onChangeDateTimeFilter({ fromDate, toDate }) { + this.filterStartDate = fromDate; + this.filterEndDate = toDate; } } }; diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue index d373be22..4d8f2484 100644 --- a/src/views/Login/Login.vue +++ b/src/views/Login/Login.vue @@ -136,7 +136,10 @@ export default { this.$store .dispatch('authentication/login', [username, password]) .then(() => this.$router.push('/')) - .then(localStorage.setItem('storedLanguage', i18n.locale)) + .then(() => { + localStorage.setItem('storedLanguage', i18n.locale); + this.$store.commit('global/setLanguagePreference', i18n.locale); + }) .catch(error => console.log(error)) .finally(() => (this.disableSubmitButton = false)); } |