add bmc time to header

2 files changed, 37 insertions, 21 deletions

diff --git a/src/components/_sila/AppHeader/AppHeader.vue b/src/components/_sila/AppHeader/AppHeader.vue
index 98bdc59f..64f17adb 100644
--- a/src/components/_sila/AppHeader/AppHeader.vue
+++ b/src/components/_sila/AppHeader/AppHeader.vue
@@ -50,24 +50,26 @@
         </b-navbar-nav>
         <!-- Right aligned nav items -->
         <b-navbar-nav class="ml-auto helper-menu">
-          <b-nav-item
-            to="/logs/event-logs"
-            class="header-nav"
-            data-test-id="appHeader-container-health"
-          >
-            <status-icon :status="healthStatusIcon" />
-            {{ $t('appHeader.health') }}
-          </b-nav-item>
-          <b-nav-item
-            to="/operations/server-power-operations"
-            class="header-nav"
-            data-test-id="appHeader-container-power"
-          >
-            <status-icon :status="serverStatusIcon" />
-            {{ $t('appHeader.power') }}
-          </b-nav-item>
-          <!-- Using LI elements instead of b-nav-item to support semantic button elements -->
+          <span v-if="bmcTime" class="bmcTime">
+            {{ bmcTime }}
+          </span>
           <div class="display--flex align-items--center">
+            <b-nav-item
+              to="/logs/event-logs"
+              class="header-nav"
+              data-test-id="appHeader-container-health"
+            >
+              <status-icon :status="healthStatusIcon" />
+              {{ $t('appHeader.health') }}
+            </b-nav-item>
+            <b-nav-item
+              to="/operations/server-power-operations"
+              class="header-nav"
+              data-test-id="appHeader-container-power"
+            >
+              <status-icon :status="serverStatusIcon" />
+              {{ $t('appHeader.power') }}
+            </b-nav-item>
             <li class="nav-item header-nav">
               <b-button
                 id="app-header-refresh"
@@ -81,6 +83,9 @@
                 }}</span>
               </b-button>
             </li>
+          </div>
+          <!-- Using LI elements instead of b-nav-item to support semantic button elements -->
+          <div class="display--flex align-items--center">
             <li class="nav-item header-nav notifications">
               <b-dropdown id="app-notifications" variant="link" right>
                 <template #button-content>
@@ -254,6 +259,9 @@ export default {
     isNavTagPresent() {
       return this.assetTag || this.modelType || this.serialNumber;
     },
+    bmcTime() {
+      return this.$store.getters['global/bmcTime']?.toLocaleTimeString();
+    },
     assetTag() {
       return this.$store.getters['global/assetTag'];
     },
@@ -316,6 +324,7 @@ export default {
     this.$store.dispatch('authentication/resetStoreState');
     this.getSystemInfo();
     this.getEvents();
+    this.getBmcTime();
   },
   mounted() {
     this.$root.$on(
@@ -340,6 +349,9 @@ export default {
     getEvents() {
       this.$store.dispatch('eventLog/getEventLogData');
     },
+    getBmcTime() {
+      this.$store.dispatch('global/getBmcTime');
+    },
     refresh() {
       this.$emit('refresh');
     },
@@ -587,4 +599,8 @@ export default {
     display: none;
   }
 }
+.bmcTime {
+  padding: 0 8px;
+  color: lightgoldenrodyellow;
+}
 </style>
diff --git a/src/views/_sila/Overview/DateTime/DateTime.vue b/src/views/_sila/Overview/DateTime/DateTime.vue
index e9de12c5..a3714787 100644
--- a/src/views/_sila/Overview/DateTime/DateTime.vue
+++ b/src/views/_sila/Overview/DateTime/DateTime.vue
@@ -356,10 +356,10 @@ export default {
   created() {
     this.startLoader();
     this.setNtpValues();
-    Promise.all([
-      this.$store.dispatch('global/getBmcTime'),
-      this.$store.dispatch('dateTime/getNtpData'),
-    ]).finally(() => this.endLoader());
+    this.$store.dispatch('dateTime/getNtpData').finally(() => {
+      this.endLoader();
+      this.isBusy = false;
+    });
   },
   methods: {
     emitChange() {