71 lines
2.3 KiB
Vue
71 lines
2.3 KiB
Vue
|
<template>
|
||
|
|
<b-navbar toggleable="lg" type="dark" variant="dark" fixed="top">
|
||
|
|
<b-navbar-brand to="/">
|
||
|
|
<img src="/build/images/24unix/24_logo_bg_96x96.png" alt="24unix.net" id="site-logo">
|
||
|
|
</b-navbar-brand>
|
||
|
|
|
||
|
|
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
|
||
|
|
|
||
|
|
<b-collapse id="nav-collapse" is-nav>
|
||
|
|
|
||
|
|
<!--
|
||
|
|
<b-nav-form>
|
||
|
|
<b-form-input size="sm" class="mr-sm-2" placeholder="Search"></b-form-input>
|
||
|
|
<b-button size="sm" class="my-2 my-sm-0" type="submit">Search</b-button>
|
||
|
|
</b-nav-form>
|
||
|
|
-->
|
||
|
|
<!--
|
||
|
|
<b-nav-item-dropdown text="Lang" right>
|
||
|
|
<b-dropdown-item href="#">EN</b-dropdown-item>
|
||
|
|
<b-dropdown-item href="#">ES</b-dropdown-item>
|
||
|
|
<b-dropdown-item href="#">RU</b-dropdown-item>
|
||
|
|
<b-dropdown-item href="#">FA</b-dropdown-item>
|
||
|
|
</b-nav-item-dropdown>
|
||
|
|
-->
|
||
|
|
<b-navbar-nav class="ml-auto mr-5">
|
||
|
|
<b-button v-if="!isLoggedIn" to="/form_login">Login</b-button>
|
||
|
|
<b-dropdown v-else id="dropdown" :text="user.username" class="m-md-2" type="dark">
|
||
|
|
<b-dropdown-item to="/profile">
|
||
|
|
<span class="fa fa-lg fa-fw fa-user" aria-hidden="true"></span> Profile
|
||
|
|
</b-dropdown-item>
|
||
|
|
<b-dropdown-item>
|
||
|
|
<span class="fa fa-lg fa-fw fa-wrench" aria-hidden="true"></span> Settings
|
||
|
|
</b-dropdown-item>
|
||
|
|
<b-dropdown-divider></b-dropdown-divider>
|
||
|
|
<b-dropdown-item @click="logout">
|
||
|
|
<span class="fa fa-lg fa-fw fa-sign-out" aria-hidden="true"></span> Logout
|
||
|
|
</b-dropdown-item>
|
||
|
|
</b-dropdown>
|
||
|
|
</b-navbar-nav>
|
||
|
|
</b-collapse>
|
||
|
|
</b-navbar>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import axios from "axios";
|
||
|
|
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "Navbar",
|
||
|
|
props: ["user"],
|
||
|
|
computed: {
|
||
|
|
isLoggedIn() {
|
||
|
|
return !!this.user;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
logout() {
|
||
|
|
console.log("logout");
|
||
|
|
axios
|
||
|
|
.get("/logout")
|
||
|
|
.then(this.$emit("invalidate-user"));
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
</style>
|
||
|
|
|