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(
49          (log) =>
50            log.severity === 'Critical' && log.filterByStatus === 'Unresolved',
51        )
52        .map((log) => {
53          return log;
54        });
55    },
56    warningEvents() {
57      return this.eventLogData
58        .filter(
59          (log) =>
60            log.severity === 'Warning' && log.filterByStatus === 'Unresolved',
61        )
62        .map((log) => {
63          return log;
64        });
65    },
66  },
67  created() {
68    this.$store.dispatch('eventLog/getEventLogData').finally(() => {
69      this.$root.$emit('overview-events-complete');
70    });
71  },
72  methods: {
73    exportFileNameByDate() {
74      // Create export file name based on date
75      let date = new Date();
76      date =
77        date.toISOString().slice(0, 10) +
78        '_' +
79        date.toString().split(':').join('-').split(' ')[4];
80      let fileName = 'all_event_logs_';
81      return fileName + date;
82    },
83  },
84};
85</script>
86
87<style lang="scss" scoped>
88.status-icon {
89  vertical-align: text-top;
90}
91</style>
92