hardlounge/client/components/Username.vue
2019-11-25 20:13:12 +02:00

40 lines
725 B
Vue

<template>
<span
:class="['user', nickColor, {active: active}]"
:data-name="user.nick"
role="button"
v-on="onHover ? {mouseover: hover} : {}"
@contextmenu.prevent="rightClick($event)"
>{{ user.mode }}{{ user.nick }}</span
>
</template>
<script>
import colorClass from "../js/helpers/colorClass";
export default {
name: "Username",
props: {
user: Object,
active: Boolean,
onHover: Function,
contextMenuCallback: Function,
},
computed: {
nickColor() {
return colorClass(this.user.nick);
},
},
methods: {
hover() {
return this.onHover(this.user);
},
rightClick($event) {
if (this.contextMenuCallback) {
this.contextMenuCallback($event, this.user);
}
},
},
};
</script>