Add store modules needed to support overview view
- Update overview page to get data from store
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Id2fcad660efc0da5c7b878e872355bf5773c7ed7
diff --git a/src/views/Overview/Overview.vue b/src/views/Overview/Overview.vue
index bf3f27f..570f849 100644
--- a/src/views/Overview/Overview.vue
+++ b/src/views/Overview/Overview.vue
@@ -3,30 +3,30 @@
<PageTitle />
<b-row>
<b-col lg="8" sm="12">
- <PageSection sectionTitle="Server Information">
+ <PageSection sectionTitle="Server information">
<b-row>
<b-col sm="6">
<dl>
- <dt>MODEL</dt>
- <dd>{{ system.Model || "N/A" }}</dd>
+ <dt>Model</dt>
+ <dd>{{ serverModel }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>MANUFACTURER</dt>
- <dd>{{ system.Manufacturer || "N/A" }}</dd>
+ <dt>Manufacturer</dt>
+ <dd>{{ serverManufacturer }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>SERIAL NUMBER</dt>
- <dd>{{ system.SerialNumber || "N/A" }}</dd>
+ <dt>Serial number</dt>
+ <dd>{{ serverSerialNumber }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>FIRMWARE VERSION</dt>
- <dd>{{ software.Version || "N/A" }}</dd>
+ <dt>Firmware version</dt>
+ <dd>{{ hostActiveVersion }}</dd>
</dl>
</b-col>
</b-row>
@@ -35,26 +35,26 @@
<b-row>
<b-col sm="6">
<dl>
- <dt>HOSTNAME</dt>
- <dd>{{ network.config.HostName || "N/A" }}</dd>
+ <dt>Hostname</dt>
+ <dd>{{ hostName }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>MAC ADDRESS</dt>
- <dd>{{ network.eth0.MACAddress || "N/A" }}</dd>
+ <dt>MAC address</dt>
+ <dd>{{ macAddress }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>IP ADDRESS</dt>
- <dd>{{ network.ipv4.Address || "N/A" }}</dd>
+ <dt>IP address</dt>
+ <dd v-for="ip in ipAddress" v-bind:key="ip.id">{{ ip }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>FIRMWARE VERSION</dt>
- <dd>{{ logging.entry.Version || "N/A" }}</dd>
+ <dt>Firmware version</dt>
+ <dd>{{ bmcActiveVersion }}</dd>
</dl>
</b-col>
</b-row>
@@ -63,26 +63,25 @@
<b-row>
<b-col sm="6">
<dl>
- <dt>POWER CONSUMPTION</dt>
- <dd>{{ total_power.description || "N/A" }}</dd>
+ <dt>Power consumption</dt>
+ <dd>{{ powerConsumption }}</dd>
</dl>
</b-col>
<b-col sm="6">
<dl>
- <dt>POWER CAP</dt>
- <dd v-if="!power_cap.PowerCapEnable">Not enabled</dd>
- <dd v-else>{{ power_cap.PowerCap }}</dd>
+ <dt>Power cap</dt>
+ <dd>{{ powerCapValue }}</dd>
</dl>
</b-col>
</b-row>
</PageSection>
</b-col>
<b-col lg="4" sm="12">
- <quickLinks />
+ <OverviewQuickLinks />
</b-col>
</b-row>
<PageSection sectionTitle="High priority events">
- <events />
+ <OverviewEvents />
</PageSection>
</b-container>
</template>
@@ -92,56 +91,39 @@
import OverviewEvents from "./OverviewEvents";
import PageTitle from "../../components/Global/PageTitle";
import PageSection from "../../components/Global/PageSection";
-
+import { mapState } from "vuex";
export default {
name: "Overview",
components: {
- quickLinks: OverviewQuickLinks,
- events: OverviewEvents,
+ OverviewQuickLinks,
+ OverviewEvents,
PageTitle,
PageSection
},
- data() {
- return {
- logging: {
- entry: {
- Description:
- "An internal failure has occurred while performing an operation.",
- EventID: "ABCDEF123",
- Id: 1,
- Resolved: false,
- Severity: "CRITICAL",
- Timestamp: 1574782085071,
- Version: "openbmc-v1.0.0"
- }
- },
- network: {
- config: {
- HostName: "Name of the Host"
- },
- eth0: {
- MACAddress: "00:00:00:00:00:00"
- },
- ipv4: {
- Address: "00.00.00.00"
- }
- },
- power_cap: {
- PowerCap: 0,
- PowerCapEnable: false
- },
- software: {
- Version: "OPENBMC-v1"
- },
- system: {
- Manufacturer: "",
- Model: "0000000000000000",
- SerialNumber: "0000000000000000"
- },
- total_power: {
- description: "0"
- }
- };
+ created() {
+ this.getOverviewInfo();
+ },
+ computed: mapState({
+ serverModel: state => state.overview.serverModel,
+ serverManufacturer: state => state.overview.serverManufacturer,
+ serverSerialNumber: state => state.overview.serverSerialNumber,
+ hostName: state => state.global.hostName,
+ hostActiveVersion: state => state.firmware.hostActiveVersion,
+ bmcActiveVersion: state => state.firmware.bmcActiveVersion,
+ powerConsumption: state => state.powerConsumption.powerConsumption,
+ powerCapValue: state => state.powerCap.powerCapValue,
+ ipAddress: state => state.networkSettings.ipAddress,
+ macAddress: state => state.networkSettings.macAddress
+ }),
+ methods: {
+ getOverviewInfo() {
+ this.$store.dispatch("overview/getServerInfo");
+ this.$store.dispatch("global/getHostName");
+ this.$store.dispatch("firmware/getFirmwareInfo");
+ this.$store.dispatch("powerConsumption/getPowerData");
+ this.$store.dispatch("powerCap/getPowerCapData");
+ this.$store.dispatch("networkSettings/getNetworkData");
+ }
}
};
</script>
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index b49ed6e..0510606 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -1,43 +1,43 @@
<template>
- <b-list-group>
- <b-list-group-item href="#" class="flex-column align-items-start">
- #{{ logging.entry.Id }}
- <b-badge variant="danger">{{ logging.entry.Severity }}</b-badge>
- <div class="d-flex w-100 justify-content-between">
- <small>{{
- logging.entry.Timestamp | date("MMM, DD YYYY HH:MM:SS A ZZ")
- }}</small>
- <ChevronRight16 />
- </div>
- <p class="mb-1">
- {{ logging.entry.EventID }}: {{ logging.entry.Description }}
- </p>
- </b-list-group-item>
- </b-list-group>
+ <div>
+ <b-list-group v-for="logData in eventLogData" :key="logData.id">
+ <b-list-group-item href="#" class="flex-column align-items-start">
+ {{ "#" + logData.logId }}
+ <b-badge variant="danger">{{ logData.priority }}</b-badge>
+ <div class="d-flex w-100 justify-content-between">
+ <small>{{
+ logData.Timestamp | date("MMM DD YYYY HH:MM:SS A ZZ")
+ }}</small>
+ <ChevronRight16 />
+ </div>
+ <p class="mb-1">{{ logData.eventID }}: {{ logData.description }}</p>
+ </b-list-group-item>
+ </b-list-group>
+ <b-list-group v-if="!eventLogData">
+ There are no high priority events to display at this time.
+ </b-list-group>
+ </div>
</template>
<script>
import ChevronRight16 from "@carbon/icons-vue/es/chevron--right/16";
-
export default {
name: "events",
components: {
ChevronRight16
},
- data() {
- return {
- logging: {
- entry: {
- Description:
- "An internal failure has occurred while performing an operation.",
- EventID: "ABCDEF123",
- Id: 1,
- Resolved: false,
- Severity: "Error",
- Timestamp: 1574782085071
- }
- }
- };
+ created() {
+ this.getEventLogData();
+ },
+ computed: {
+ eventLogData() {
+ return this.$store.getters["eventLog/eventLogData"];
+ }
+ },
+ methods: {
+ getEventLogData() {
+ this.$store.dispatch("eventLog/getEventLogData");
+ }
}
};
</script>
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index f8806b2..577ea5f 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -1,22 +1,17 @@
<template>
<b-list-group>
- <b-list-group-item
- href="#"
- variant="danger"
- v-show="logging.entry.Severity === 'Error'"
- >View 1 high priority event</b-list-group-item
- >
+ <!-- TODO: add event log priority events count -->
<b-list-group-item>
<dl>
<dt>BMC time</dt>
- <dd>{{ bmc.Elapsed | date("MMM, DD YYYY HH:MM:SS A ZZ") }}</dd>
+ <dd>{{ bmcTime | date("MMM, DD YYYY HH:MM:SS A ZZ") }}</dd>
</dl>
</b-list-group-item>
<b-list-group-item>
<!-- TODO: add toggle LED on/off funtionality -->
- <b-form-checkbox v-model="checked" name="check-button" switch>
+ <b-form-checkbox v-model="serverLedChecked" name="check-button" switch>
Turn
- <span v-if="!checked">on</span>
+ <span v-if="!serverLedChecked">on</span>
<span v-else>off</span> server LED
</b-form-checkbox>
</b-list-group-item>
@@ -41,23 +36,27 @@
<script>
import ChevronRight16 from "@carbon/icons-vue/es/chevron--right/16";
-
export default {
name: "quickLinks",
components: {
ChevronRight16
},
+ created() {
+ this.getBmcTime();
+ },
+ computed: {
+ bmcTime() {
+ return this.$store.getters["global/bmcTime"];
+ }
+ },
+ methods: {
+ getBmcTime() {
+ this.$store.dispatch("global/getBmcTime");
+ }
+ },
data() {
return {
- bmc: {
- Elapsed: 1574782085071
- },
- logging: {
- entry: {
- Severity: "Error"
- }
- },
- checked: false
+ serverLedChecked: false
};
}
};