mirror of https://github.com/statping/statping
62 lines
2.2 KiB
Vue
62 lines
2.2 KiB
Vue
<template>
|
|
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
|
<router-link to="/" class="navbar-brand">Statping</router-link>
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
|
|
<div class="collapse navbar-collapse" id="navbarText">
|
|
<ul class="navbar-nav mr-auto">
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('DashboardIndex', '/dashboard')" class="nav-link" href="#">Dashboard</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('DashboardServices', '/dashboard/services')" class="nav-link" href="#">Services</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('DashboardUsers', '/dashboard/users')" class="nav-link" href="#">Users</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('DashboardMessages', '/dashboard/messages')" class="nav-link" href="#">Messages</a>
|
|
</li>
|
|
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('Settings', '/dashboard/settings')" class="nav-link" href="#">Settings</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('Logs', '/dashboard/logs')" class="nav-link" href="#">Logs</a>
|
|
</li>
|
|
|
|
<li class="nav-item">
|
|
<a v-on:click="changeView('DashboardIndex', '/dashboard/help')" class="nav-link" href="#">Help</a>
|
|
</li>
|
|
</ul>
|
|
<span class="navbar-text">
|
|
<a href="#" class="nav-link" v-on:click="logout">Logout</a>
|
|
</span>
|
|
</div>
|
|
</nav>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import Api from "../API"
|
|
|
|
export default {
|
|
name: 'TopNav',
|
|
props: {
|
|
changeView: Function
|
|
},
|
|
methods: {
|
|
async logout () {
|
|
await Api.logout()
|
|
await this.$router.push('/')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
<style scoped>
|
|
</style>
|