1<template>
2  <overview-card
3    :data="eventLogData"
4    :disabled="eventLogData.length === 0"
5    :export-button="true"
6    :file-name="exportFileNameByDate()"
7    :title="$t('pageOverview.eventLogs')"
8    :to="`/logs/event-logs`"
9  >
10    <b-row class="mt-3">
11      <b-col sm="6">
12        <dl>
13          <dt>{{ $t('pageOverview.criticalEvents') }}</dt>
14          <dd class="h3">
15            {{ dataFormatter(criticalEvents.length) }}
16            <status-icon status="danger" />
17          </dd>
18        </dl>
19      </b-col>
20      <b-col sm="6">
21        <dl>
22          <dt>{{ $t('pageOverview.warningEvents') }}</dt>
23          <dd class="h3">
24            {{ dataFormatter(warningEvents.length) }}
25            <status-icon status="warning" />
26          </dd>
27        </dl>
28      </b-col>
29    </b-row>
30  </overview-card>
31</template>
32
33<script>
34import OverviewCard from './OverviewCard';
35import StatusIcon from '@/components/Global/StatusIcon';
36import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
37
38export default {
39  name: 'Events',
40  components: { OverviewCard, StatusIcon },
41  mixins: [DataFormatterMixin],
42  computed: {
43    eventLogData() {
44      return this.$store.getters['eventLog/allEvents'];
45    },
46    criticalEvents() {
47      return this.eventLogData
48        .filter((log) => log.severity === 'Critical')
49        .map((log) => {
50          return log;
51        });
52    },
53    warningEvents() {
54      return this.eventLogData
55        .filter((log) => log.severity === 'Warning')
56        .map((log) => {
57          return log;
58        });
59    },
60  },
61  created() {
62    this.$store.dispatch('eventLog/getEventLogData').finally(() => {
63      this.$root.$emit('overview-events-complete');
64    });
65  },
66  methods: {
67    exportFileNameByDate() {
68      // Create export file name based on date
69      let date = new Date();
70      date =
71        date.toISOString().slice(0, 10) +
72        '_' +
73        date.toString().split(':').join('-').split(' ')[4];
74      let fileName = 'all_event_logs_';
75      return fileName + date;
76    },
77  },
78};
79</script>
80
81<style lang="scss" scoped>
82.status-icon {
83  vertical-align: text-top;
84}
85</style>
86