38 lines
956 B
Vue
38 lines
956 B
Vue
<template>
|
|
<b-navbar toggleable="sm" type="dark" variant="dark" fixed="top">
|
|
|
|
<b-navbar-brand>
|
|
<b>onSpot</b>
|
|
</b-navbar-brand>
|
|
|
|
|
|
<b-navbar-toggle target="nav-text-collapse"></b-navbar-toggle>
|
|
|
|
<b-collapse id="nav-text-collapse" is-nav>
|
|
|
|
<b-navbar-nav>
|
|
<b-nav-item v-if="$store.getters.isLoggedIn" to="/">My Collections</b-nav-item>
|
|
<b-nav-item v-else to="/login">Login</b-nav-item>
|
|
<b-nav-item to="/about">About</b-nav-item>
|
|
</b-navbar-nav>
|
|
|
|
<b-navbar-nav class="ml-auto" v-if="$store.getters.isLoggedIn">
|
|
<b-nav-item-dropdown :text="$store.state.userdata.name" right>
|
|
<b-dropdown-text>Lorem Ipsum dolor sit amaet</b-dropdown-text>
|
|
<b-dropdown-item href="#">Logout</b-dropdown-item>
|
|
</b-nav-item-dropdown>
|
|
</b-navbar-nav>
|
|
|
|
</b-collapse>
|
|
</b-navbar>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "Navbar"
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style> |