diff options
author | Sukanya Pandey <sukapan1@in.ibm.com> | 2020-12-23 10:48:55 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2021-03-23 03:02:54 +0300 |
commit | 47b047c7320aada2ceba3c774287462e4cba0089 (patch) | |
tree | 473f2f5ca8cc86a5398f8237068eecbe62d1d3ba /src/views | |
parent | 492875622b39cb2cf04bbb9248b6ed0c52ced2df (diff) | |
download | webui-vue-47b047c7320aada2ceba3c774287462e4cba0089.tar.xz |
Add event log details
- Add ability to expand and collapse table rows to show event log entry
details
- Add the following properties to display in the UI, Name,
Modified date
Change-Id: I3c90ce301878947e402eb87ca135dba0c47e84d5
Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Diffstat (limited to 'src/views')
-rw-r--r-- | src/views/Health/EventLogs/EventLogs.vue | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Health/EventLogs/EventLogs.vue index a01f3237..69545a57 100644 --- a/src/views/Health/EventLogs/EventLogs.vue +++ b/src/views/Health/EventLogs/EventLogs.vue @@ -85,6 +85,44 @@ </b-form-checkbox> </template> + <!-- Expand chevron icon --> + <template #cell(expandRow)="row"> + <b-button + variant="link" + :aria-label="expandRowLabel" + :title="expandRowLabel" + class="btn-icon-only" + @click="toggleRowDetails(row)" + > + <icon-chevron /> + </b-button> + </template> + + <template #row-details="{ item }"> + <b-container fluid> + <b-row> + <b-col sm="6" xl="4"> + <dl> + <!-- Name --> + <dt>{{ $t('pageEventLogs.table.name') }}:</dt> + <dd>{{ tableFormatter(item.name) }}</dd> + </dl> + </b-col> + <b-col sm="6" xl="4"> + <dl> + <!-- Modified date --> + <dt>{{ $t('pageEventLogs.table.modifiedDate') }}:</dt> + <dd v-if="item.modifiedDate"> + {{ item.modifiedDate | formatDate }} + {{ item.modifiedDate | formatTime }} + </dd> + <dd v-else>--</dd> + </dl> + </b-col> + </b-row> + </b-container> + </template> + <!-- Severity column --> <template #cell(severity)="{ value }"> <status-icon v-if="value" :status="statusIcon(value)" /> @@ -151,6 +189,7 @@ <script> import IconTrashcan from '@carbon/icons-vue/es/trash-can/20'; import IconExport from '@carbon/icons-vue/es/document--export/20'; +import IconChevron from '@carbon/icons-vue/es/chevron--down/20'; import { omit } from 'lodash'; import PageTitle from '@/components/Global/PageTitle'; @@ -178,6 +217,9 @@ import BVTableSelectableMixin, { import BVToastMixin from '@/components/Mixins/BVToastMixin'; import TableDataFormatterMixin from '@/components/Mixins/TableDataFormatterMixin'; import TableSortMixin from '@/components/Mixins/TableSortMixin'; +import TableRowExpandMixin, { + expandRowLabel, +} from '@/components/Mixins/TableRowExpandMixin'; import SearchFilterMixin, { searchFilter, } from '@/components/Mixins/SearchFilterMixin'; @@ -186,6 +228,7 @@ export default { components: { IconExport, IconTrashcan, + IconChevron, PageTitle, Search, StatusIcon, @@ -204,6 +247,7 @@ export default { TableFilterMixin, TableDataFormatterMixin, TableSortMixin, + TableRowExpandMixin, SearchFilterMixin, ], beforeRouteLeave(to, from, next) { @@ -216,6 +260,11 @@ export default { return { fields: [ { + key: 'expandRow', + label: '', + tdClass: 'table-row-expand', + }, + { key: 'checkbox', sortable: false, }, @@ -258,6 +307,7 @@ export default { values: ['OK', 'Warning', 'Critical'], }, ], + expandRowLabel, activeFilters: [], batchActions: [ { |