101 lines
1.9 KiB
Vue
101 lines
1.9 KiB
Vue
|
<template>
|
||
|
|
<b-navbar
|
||
|
|
toggleable="lg"
|
||
|
|
type="dark"
|
||
|
|
variant="dark"
|
||
|
|
fixed="top"
|
||
|
|
>
|
||
|
|
<b-navbar-brand to="/">
|
||
|
|
<img
|
||
|
|
id="site-logo"
|
||
|
|
src="/build/images/24unix/24_logo_bg_96x96.png"
|
||
|
|
alt="24unix.net"
|
||
|
|
>
|
||
|
|
</b-navbar-brand>
|
||
|
|
|
||
|
|
<b-navbar-toggle target="nav-collapse" />
|
||
|
|
|
||
|
|
<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>
|
||
|
|
<b-link
|
||
|
|
:to="{ name: 'Profile' }"
|
||
|
|
class="fa fa-lg fa-fw fa-user"
|
||
|
|
aria-hidden="true"
|
||
|
|
/> Profile
|
||
|
|
</b-dropdown-item>
|
||
|
|
<b-dropdown-item>
|
||
|
|
<span
|
||
|
|
class="fa fa-lg fa-fw fa-wrench"
|
||
|
|
aria-hidden="true"
|
||
|
|
/> Settings
|
||
|
|
</b-dropdown-item>
|
||
|
|
<b-dropdown-divider />
|
||
|
|
<b-dropdown-item @click="logout">
|
||
|
|
<span
|
||
|
|
class="fa fa-lg fa-fw fa-sign-out"
|
||
|
|
aria-hidden="true"
|
||
|
|
/> Logout
|
||
|
|
</b-dropdown-item>
|
||
|
|
</b-dropdown>
|
||
|
|
</b-navbar-nav>
|
||
|
|
</b-collapse>
|
||
|
|
</b-navbar>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import axios from 'axios';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'TheNavbar',
|
||
|
|
props: ['user'],
|
||
|
|
computed: {
|
||
|
|
isLoggedIn() {
|
||
|
|
return !!this.user;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
logout() {
|
||
|
|
console.log('logout');
|
||
|
|
axios
|
||
|
|
.get('/logout')
|
||
|
|
.then(this.$emit('invalidate-user'));
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
</style>
|