diff options
Diffstat (limited to 'src/views/Health/EventLogs')
-rw-r--r-- | src/views/Health/EventLogs/EventLogs.vue | 131 | ||||
-rw-r--r-- | src/views/Health/EventLogs/index.js | 2 |
2 files changed, 133 insertions, 0 deletions
diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Health/EventLogs/EventLogs.vue new file mode 100644 index 00000000..883b55cb --- /dev/null +++ b/src/views/Health/EventLogs/EventLogs.vue @@ -0,0 +1,131 @@ +<template> + <b-container fluid="xl"> + <page-title /> + <b-row> + <b-col class="text-right"> + <table-filter :filters="tableFilters" @filterChange="onFilterChange" /> + </b-col> + </b-row> + <b-row> + <b-col> + <b-table + :fields="fields" + :items="filteredLogs" + sort-icon-left + no-sort-reset + sort-desc + show-empty + sort-by="date" + :sort-compare="onSortCompare" + :empty-text="$t('pageEventLogs.table.emptyMessage')" + > + <template v-slot:cell(severity)="{ value }"> + <status-icon :status="getStatus(value)" /> + {{ value }} + </template> + <template v-slot:cell(date)="{ value }"> + {{ value | formatDate }} {{ value | formatTime }} + </template> + </b-table> + </b-col> + </b-row> + </b-container> +</template> + +<script> +import PageTitle from '@/components/Global/PageTitle'; +import StatusIcon from '@/components/Global/StatusIcon'; +import TableFilter from '@/components/Global/TableFilter'; + +import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin'; +import TableFilterMixin from '@/components/Mixins/TableFilterMixin'; + +const SEVERITY = ['OK', 'Warning', 'Critical']; + +export default { + components: { PageTitle, StatusIcon, TableFilter }, + mixins: [LoadingBarMixin, TableFilterMixin], + data() { + return { + fields: [ + { + key: 'id', + label: this.$t('pageEventLogs.table.id'), + sortable: true + }, + { + key: 'severity', + label: this.$t('pageEventLogs.table.severity'), + sortable: true + }, + { + key: 'type', + label: this.$t('pageEventLogs.table.type'), + sortable: true + }, + { + key: 'date', + label: this.$t('pageEventLogs.table.date'), + sortable: true + }, + { + key: 'description', + label: this.$t('pageEventLogs.table.description') + } + ], + tableFilters: [ + { + label: this.$t('pageEventLogs.table.severity'), + values: SEVERITY + } + ], + activeFilters: [] + }; + }, + computed: { + allLogs() { + return this.$store.getters['eventLog/allEvents']; + }, + filteredLogs: { + get: function() { + return this.getFilteredTableData(this.allLogs, this.activeFilters); + }, + set: function(newVal) { + return newVal; + } + } + }, + created() { + this.startLoader(); + this.$store + .dispatch('eventLog/getEventLogData') + .finally(() => this.endLoader()); + }, + methods: { + getStatus(serverity) { + switch (serverity) { + case SEVERITY[2]: + return 'danger'; + case SEVERITY[1]: + return 'warning'; + case SEVERITY[0]: + return 'success'; + default: + return ''; + } + }, + onFilterChange({ activeFilters }) { + this.activeFilters = activeFilters; + this.filteredLogs = this.getFilteredTableData( + this.allLogs, + activeFilters + ); + }, + onSortCompare(a, b, key) { + if (key === 'severity') { + return SEVERITY.indexOf(a.status) - SEVERITY.indexOf(b.status); + } + } + } +}; +</script> diff --git a/src/views/Health/EventLogs/index.js b/src/views/Health/EventLogs/index.js new file mode 100644 index 00000000..521efde4 --- /dev/null +++ b/src/views/Health/EventLogs/index.js @@ -0,0 +1,2 @@ +import EventLogs from './EventLogs.vue'; +export default EventLogs; |