Add Reboot BMC page
Created a ControlStore with the intention to consolidate actions
across multiple subnav pages under the 'Control' tab, instead of
creating a dedicated RebootBmc store with one action.
- Update PageSection component to make sectionTitle prop optional
- Changed PageTitle computed property to data since the value
doesn't change during the component lifecycle
- Change PageSection <section> element to <div> to avoid
accessibility issues
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I2877e2a7b9bfee245c48d52c70859978b74be7f3
diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index 2847e66..4c858e8 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -26,6 +26,7 @@
<b-nav-item href="javascript:void(0)">
Manage power usage
</b-nav-item>
+ <b-nav-item to="/control/reboot-bmc">Reboot BMC</b-nav-item>
<b-nav-item href="javascript:void(0)">Server LED</b-nav-item>
<b-nav-item href="javascript:void(0)">
Server power operations
diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue
index 03040b2..dcd85e6 100644
--- a/src/components/Global/PageSection.vue
+++ b/src/components/Global/PageSection.vue
@@ -1,8 +1,8 @@
<template>
- <section class="page-section">
- <h2>{{ sectionTitle }}</h2>
+ <div class="page-section">
+ <h2 v-if="sectionTitle">{{ sectionTitle }}</h2>
<slot />
- </section>
+ </div>
</template>
<script>
@@ -11,7 +11,7 @@
props: {
sectionTitle: {
type: String,
- required: true
+ default: ''
}
}
};
@@ -21,6 +21,7 @@
.page-section {
margin-bottom: $spacer * 2;
}
+
h2 {
@include font-size($h4-font-size);
margin-bottom: $spacer;
diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue
index 59bb6a1..17c0884 100644
--- a/src/components/Global/PageTitle.vue
+++ b/src/components/Global/PageTitle.vue
@@ -14,10 +14,10 @@
default: ''
}
},
- computed: {
- title() {
- return this.$t(this.$route.meta.title);
- }
+ data() {
+ return {
+ title: this.$t(this.$route.meta.title)
+ };
}
};
</script>