43 lines
1.2 KiB
Vue
43 lines
1.2 KiB
Vue
<template>
|
|
<div class="flex-between flex-middle py-1 px-2 topbar">
|
|
<router-link v-if="authUser" :to="'/profile'" class="flex-middle avatar-box">
|
|
<Avatar :avatar="authUser.data.attributes.avatar" size="small" :alt="authUser.data.attributes.name" class="mr-1"/>
|
|
{{ authUser.data.attributes.name }}
|
|
</router-link>
|
|
<form v-if="authUser && search" class="search-box">
|
|
<input type="search" name="search" placeholder="Search">
|
|
<button type="submit" value="S">
|
|
<svg-vue icon="search" />
|
|
</button>
|
|
</form>
|
|
<router-link to="/dashboard" v-if="authUser" class="mr-1">
|
|
<svg-vue icon="params" />
|
|
</router-link>
|
|
<router-link v-else to="/login">
|
|
Se connecter
|
|
</router-link>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from 'vuex'
|
|
import Avatar from "./Avatar";
|
|
|
|
export default {
|
|
name: "TopBar",
|
|
components: {
|
|
Avatar
|
|
},
|
|
data: function () {
|
|
return {
|
|
search: false,
|
|
}
|
|
},
|
|
computed: {
|
|
...mapGetters({
|
|
authUser: 'authUser',
|
|
})
|
|
}
|
|
}
|
|
</script>
|