Add Health status to app header
Added logging path and interface to websocket subscription
data filter, to dynamically indicate Health status in the
app header.
- Update OverviewEvents to use highPriorityEvents data
- Refactor EventLogStore
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I35ad30b005c70625a5f6a69488d45db0fa049374
diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index 880c428..d411c1f 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -14,7 +14,7 @@
<b-nav>
<b-nav-item>
Health
- <status-icon :status="'danger'" />
+ <status-icon :status="healthStatusIcon" />
</b-nav-item>
<b-nav-item>
Power
@@ -46,6 +46,9 @@
hostStatus() {
return this.$store.getters['global/hostStatus'];
},
+ healthStatus() {
+ return this.$store.getters['eventLog/healthStatus'];
+ },
hostStatusIcon() {
switch (this.hostStatus) {
case 'on':
@@ -56,15 +59,31 @@
default:
return 'secondary';
}
+ },
+ healthStatusIcon() {
+ switch (this.healthStatus) {
+ case 'good':
+ return 'success';
+ case 'warning':
+ return 'warning';
+ case 'critical':
+ return 'danger';
+ default:
+ return 'secondary';
+ }
}
},
created() {
this.getHostInfo();
+ this.getEvents();
},
methods: {
getHostInfo() {
this.$store.dispatch('global/getHostStatus');
},
+ getEvents() {
+ this.$store.dispatch('eventLog/getEventLogData');
+ },
logout() {
this.$store.dispatch('authentication/logout');
}
@@ -84,6 +103,12 @@
transition-timing-function: cubic-bezier(0, 0, 0.3, 1);
}
}
+.navbar-dark {
+ .navbar-text,
+ .nav-link {
+ color: $white !important;
+ }
+}
.nav-item {
svg {
fill: $light;