Update EventLogStore request to use Redfish

Changes to WebSocketPlugin to dispatch event log GET request
when new event interfaces are received.
By re-fetching the Redfish logs the health status icon in the
application header will always reflect the visible event logs.
The plugin was previously only updating the header status, so
it was possible for the header status and event logs to be
out of sync.

- Changed to use Redfish endpoint for event log GET request
  /redfish/v1/Systems/system/LogServices/EventLog/Entries
- Update AppHeader Health status icon to reflect changes
  made with Redfish log Severity property

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I73a3a441dcbbb3a29ef9a51f961c062689cb5add
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index ff9c302..64ba7fc 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -9,19 +9,19 @@
         {{ $t('pageOverview.events.viewAllButton') }}
       </b-button>
       <b-table
-        head-variant="dark"
         per-page="5"
-        sort-by="logId"
+        sort-by="date"
         sort-desc
         stacked="sm"
         :items="eventLogData"
         :fields="fields"
       >
-        <template v-slot:cell(timestamp)="data">
-          <div class="date-column">
-            {{ data.value | formatDate }} <br />
-            {{ data.value | formatTime }}
-          </div>
+        <template v-slot:cell(severity)="{ value }">
+          <status-icon status="danger" />
+          {{ value }}
+        </template>
+        <template v-slot:cell(date)="{ value }">
+          {{ value | formatDate }} {{ value | formatTime }}
         </template>
       </b-table>
     </div>
@@ -29,21 +29,28 @@
 </template>
 
 <script>
+import StatusIcon from '@/components/Global/StatusIcon';
+
 export default {
   name: 'Events',
+  components: { StatusIcon },
   data() {
     return {
       fields: [
         {
-          key: 'logId',
+          key: 'id',
           label: this.$t('pageOverview.events.id')
         },
         {
-          key: 'eventID',
-          label: this.$t('pageOverview.events.refCode')
+          key: 'severity',
+          label: this.$t('pageOverview.events.severity')
         },
         {
-          key: 'timestamp',
+          key: 'type',
+          label: this.$t('pageOverview.events.type')
+        },
+        {
+          key: 'date',
           label: this.$t('pageOverview.events.date')
         },
         {
@@ -65,9 +72,3 @@
   }
 };
 </script>
-
-<style lang="scss" scoped>
-.date-column {
-  min-width: 200px;
-}
-</style>