materio-d9/web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue

75 lines
1.4 KiB
Vue

<template lang="html">
<div id="user-tools">
<!-- <h4
> -->
<a class="mdi mdi-account" href="/user">
<span v-if="name">{{ name }}</span>
<span v-else>{{ mail }}</span>
</a>
<!-- </h4> -->
<a href="/admin/content/materials"
v-if="isAdmin"
class="mdi mdi-settings"
title="admin"
></a>
<a href="/user/logout"
@click.prevent="onLogout()"
class="mdi mdi-logout"
title="logout"
></a>
<UserFlags v-if="isAdherent"/>
</div>
</template>
<script>
import { mapState, mapActions } from 'vuex'
import UserFlags from 'vuejs/components/User/UserFlags'
export default {
watch: {
},
components: {
UserFlags
},
// data () {
// return {
// mail: "Hello User!"
// }
// },
computed: {
...mapState({
mail: state => state.User.mail,
name: state => state.User.name,
isAdmin: state => state.User.isAdmin,
isAdherent: state => state.User.isAdherent,
flags: state => state.User.flags
})
},
methods: {
...mapActions({
userLogout: 'User/userLogout'
}),
onLogout () {
console.log('UserTools onLogout')
this.userLogout()
}
}
}
</script>
<style lang="css" scoped>
#user-tools{
margin-right:0.2em;
/* padding-right:0.5em; */
/* border-right:1px solid #222; */
}
h4{
margin:0;
display:inline-block;
font-size:inherited;
vertical-align: top;
}
</style>