diff options
Diffstat (limited to 'src/components/AppHeader')
-rw-r--r-- | src/components/AppHeader/AppHeader.vue | 44 | ||||
-rw-r--r-- | src/components/AppHeader/index.js | 2 |
2 files changed, 46 insertions, 0 deletions
diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue new file mode 100644 index 00000000..b28927ee --- /dev/null +++ b/src/components/AppHeader/AppHeader.vue @@ -0,0 +1,44 @@ +<template> + <div> + <a href="#main-content">Skip to main content</a> + <header> + <b-navbar toggleable="lg" type="dark" variant="primary"> + <div> + <router-link to="/">{{ orgName }} System Management</router-link> + </div> + <div> + <span>{{ serverName }}</span> + <span>{{ ipAddress }}</span> + </div> + <div> + <b-button variant="link"> + <Renew20 /> + Refresh Data + </b-button> + <b-button variant="link"> + <user-avatar-20 /> + User Avatar + </b-button> + </div> + </b-navbar> + </header> + </div> +</template> + +<script> +import UserAvatar20 from "@carbon/icons-vue/es/user--avatar/20"; +import Renew20 from "@carbon/icons-vue/es/renew/20"; +export default { + name: "AppHeader", + components: { Renew20, UserAvatar20 }, + data() { + return { + orgName: "OpenBMC", + serverName: "Server Name", + ipAddress: "127.0.0.0" + }; + } +}; +</script> + +<style lang="scss" scoped></style> diff --git a/src/components/AppHeader/index.js b/src/components/AppHeader/index.js new file mode 100644 index 00000000..b8f3ab3c --- /dev/null +++ b/src/components/AppHeader/index.js @@ -0,0 +1,2 @@ +import AppHeader from "./AppHeader"; +export default AppHeader; |