Add loading bar to Overview page
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I47ef77dda6b348c854e875aa458acfa44e287c49
diff --git a/src/store/modules/Configuration/FirmwareStore.js b/src/store/modules/Configuration/FirmwareStore.js
index b76748f..cae74eb 100644
--- a/src/store/modules/Configuration/FirmwareStore.js
+++ b/src/store/modules/Configuration/FirmwareStore.js
@@ -17,8 +17,8 @@
(state.hostFirmwareVersion = hostFirmwareVersion)
},
actions: {
- getBmcFirmware({ commit }) {
- api
+ async getBmcFirmware({ commit }) {
+ return await api
.get('/redfish/v1/Managers/bmc')
.then(response => {
const bmcFirmwareVersion = response.data.FirmwareVersion;
@@ -28,8 +28,8 @@
console.log(error);
});
},
- getHostFirmware({ commit }) {
- api
+ async getHostFirmware({ commit }) {
+ return await api
.get('/redfish/v1/Systems/system')
.then(response => {
const hostFirmwareVersion = response.data.BiosVersion;
diff --git a/src/store/modules/Configuration/NetworkSettingsStore.js b/src/store/modules/Configuration/NetworkSettingsStore.js
index 3b1f232..f6912c8 100644
--- a/src/store/modules/Configuration/NetworkSettingsStore.js
+++ b/src/store/modules/Configuration/NetworkSettingsStore.js
@@ -13,8 +13,8 @@
(state.ethernetData = ethernetData)
},
actions: {
- getEthernetData({ commit }) {
- api
+ async getEthernetData({ commit }) {
+ return await api
.get('/redfish/v1/Managers/bmc/EthernetInterfaces')
.then(response =>
response.data.Members.map(
diff --git a/src/store/modules/Control/PowerControlStore.js b/src/store/modules/Control/PowerControlStore.js
index 63ede2d..7858539 100644
--- a/src/store/modules/Control/PowerControlStore.js
+++ b/src/store/modules/Control/PowerControlStore.js
@@ -17,8 +17,8 @@
(state.powerConsumptionValue = powerConsumptionValue)
},
actions: {
- getPowerControl({ commit }) {
- api
+ async getPowerControl({ commit }) {
+ return await api
.get('/redfish/v1/Chassis/chassis/Power')
.then(response => {
const powerControl = response.data.PowerControl;
diff --git a/src/store/modules/GlobalStore.js b/src/store/modules/GlobalStore.js
index c9e92a7..879d8d8 100644
--- a/src/store/modules/GlobalStore.js
+++ b/src/store/modules/GlobalStore.js
@@ -40,8 +40,8 @@
(state.hostStatus = hostStateMapper(hostState))
},
actions: {
- getBmcTime({ commit }) {
- api
+ async getBmcTime({ commit }) {
+ return await api
.get('/redfish/v1/Managers/bmc')
.then(response => {
const bmcDateTime = response.data.DateTime;
diff --git a/src/store/modules/Health/EventLogStore.js b/src/store/modules/Health/EventLogStore.js
index d2f970a..418e455 100644
--- a/src/store/modules/Health/EventLogStore.js
+++ b/src/store/modules/Health/EventLogStore.js
@@ -62,8 +62,8 @@
setHealthStatus: (state, status) => (state.healthStatus = status)
},
actions: {
- getEventLogData({ commit }) {
- api
+ async getEventLogData({ commit }) {
+ return await api
.get('/xyz/openbmc_project/logging/enumerate')
.then(response => {
const responseData = response.data.data;
diff --git a/src/store/modules/Overview/OverviewStore.js b/src/store/modules/Overview/OverviewStore.js
index 30558d8..314728c 100644
--- a/src/store/modules/Overview/OverviewStore.js
+++ b/src/store/modules/Overview/OverviewStore.js
@@ -23,8 +23,8 @@
(state.serverSerialNumber = serverSerialNumber)
},
actions: {
- getServerInfo({ commit }) {
- api
+ async getServerInfo({ commit }) {
+ return await api
.get('/redfish/v1/Systems/system')
.then(response => {
const serverInfo = response.data;
diff --git a/src/views/Overview/Overview.vue b/src/views/Overview/Overview.vue
index 9ddf49d..59b5063 100644
--- a/src/views/Overview/Overview.vue
+++ b/src/views/Overview/Overview.vue
@@ -92,6 +92,7 @@
import PageTitle from '../../components/Global/PageTitle';
import PageSection from '../../components/Global/PageSection';
import { mapState } from 'vuex';
+import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
export default {
name: 'Overview',
@@ -102,6 +103,7 @@
PageTitle,
PageSection
},
+ mixins: [LoadingBarMixin],
computed: mapState({
serverModel: state => state.overview.serverModel,
serverManufacturer: state => state.overview.serverManufacturer,
@@ -112,15 +114,29 @@
powerConsumptionValue: state => state.powerControl.powerConsumptionValue
}),
created() {
- this.getOverviewInfo();
+ this.startLoader();
+ const quicklinksPromise = new Promise(resolve => {
+ this.$root.$on('overview::quicklinks::complete', () => resolve());
+ });
+ const networkPromise = new Promise(resolve => {
+ this.$root.$on('overview::network::complete', () => resolve());
+ });
+ const eventsPromise = new Promise(resolve => {
+ this.$root.$on('overview::events::complete', () => resolve());
+ });
+ Promise.all([
+ this.$store.dispatch('overview/getServerInfo'),
+ this.$store.dispatch('firmware/getBmcFirmware'),
+ this.$store.dispatch('firmware/getHostFirmware'),
+ this.$store.dispatch('powerControl/getPowerControl'),
+ quicklinksPromise,
+ networkPromise,
+ eventsPromise
+ ]).finally(() => this.endLoader());
},
- methods: {
- getOverviewInfo() {
- this.$store.dispatch('overview/getServerInfo');
- this.$store.dispatch('firmware/getBmcFirmware');
- this.$store.dispatch('firmware/getHostFirmware');
- this.$store.dispatch('powerControl/getPowerControl');
- }
+ beforeRouteLeave(to, from, next) {
+ this.hideLoader();
+ next();
}
};
</script>
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index 9d02d1c..ff9c302 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -59,12 +59,9 @@
}
},
created() {
- this.getEventLogData();
- },
- methods: {
- getEventLogData() {
- this.$store.dispatch('eventLog/getEventLogData');
- }
+ this.$store.dispatch('eventLog/getEventLogData').finally(() => {
+ this.$root.$emit('overview::events::complete');
+ });
}
};
</script>
diff --git a/src/views/Overview/OverviewNetwork.vue b/src/views/Overview/OverviewNetwork.vue
index ea338b3..a495fae 100644
--- a/src/views/Overview/OverviewNetwork.vue
+++ b/src/views/Overview/OverviewNetwork.vue
@@ -49,12 +49,9 @@
}
},
created() {
- this.getEthernetData();
- },
- methods: {
- getEthernetData() {
- this.$store.dispatch('networkSettings/getEthernetData');
- }
+ this.$store.dispatch('networkSettings/getEthernetData').finally(() => {
+ this.$root.$emit('overview::network::complete');
+ });
}
};
</script>
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index da56b5d..09e5a00 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -69,12 +69,9 @@
}
},
created() {
- this.getBmcTime();
- },
- methods: {
- getBmcTime() {
- this.$store.dispatch('global/getBmcTime');
- }
+ this.$store.dispatch('global/getBmcTime').finally(() => {
+ this.$root.$emit('overview::quicklinks::complete');
+ });
}
};
</script>