negue
fe6c21800c
* fix: first batch of layout issues for private messages + auto sizing textarea * username second line - open profile on face-avatar/conversation name - fix textarea height * refresh on sync * new "you dont have any messages" style + changed min textarea height * new conversationItem style / layout * reset message unread on reload * fix styles / textarea height * list optOut / chatRevoked informations for each conversation + show why its disabled * Block / Unblock - correct disabled states - $gray-200 instead of 300/400 * canReceive not checking chatRevoked * fix: faceAvatar / userLink open the selected conversation user * check if the target user is blocking the logged-in user * check if blocks is undefined * max-height instead of height * fix "no messages" state + canReceive on a new conversation * fixed conversations width (280px on max 768 width page) * call autosize after message is sent * only color the placeholder * only load the current user avatar/settings/flags * show only the current avatar on private messages
122 lines
2.7 KiB
Vue
122 lines
2.7 KiB
Vue
<template>
|
|
<router-link
|
|
v-if="displayName"
|
|
v-b-tooltip.hover.top="tierTitle"
|
|
class="leader user-link"
|
|
:to="{'name': 'userProfile', 'params': {'userId': id}}"
|
|
:class="levelStyle()"
|
|
>
|
|
{{ displayName }}
|
|
<div
|
|
class="svg-icon"
|
|
v-html="tierIcon()"
|
|
></div>
|
|
</router-link>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
@import '~@/assets/scss/colors.scss';
|
|
|
|
a.no-tier {
|
|
color: $gray-50;
|
|
}
|
|
|
|
a.leader { // this is the user name
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: bold;
|
|
margin-bottom: 0;
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
font-size: 16px;
|
|
|
|
.svg-icon {
|
|
width: 10px;
|
|
display: inline-block;
|
|
margin-left: .5em;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
|
|
import styleHelper from '@/mixins/styleHelper';
|
|
|
|
import achievementsLib from '@/../../common/script/libs/achievements';
|
|
|
|
import tier1 from '@/assets/svg/tier-1.svg';
|
|
import tier2 from '@/assets/svg/tier-2.svg';
|
|
import tier3 from '@/assets/svg/tier-3.svg';
|
|
import tier4 from '@/assets/svg/tier-4.svg';
|
|
import tier5 from '@/assets/svg/tier-5.svg';
|
|
import tier6 from '@/assets/svg/tier-6.svg';
|
|
import tier7 from '@/assets/svg/tier-7.svg';
|
|
import tier8 from '@/assets/svg/tier-mod.svg';
|
|
import tier9 from '@/assets/svg/tier-staff.svg';
|
|
import tierNPC from '@/assets/svg/tier-npc.svg';
|
|
|
|
export default {
|
|
mixins: [styleHelper],
|
|
props: ['user', 'userId', 'name', 'backer', 'contributor', 'hideTooltip'],
|
|
data () {
|
|
return {
|
|
icons: Object.freeze({
|
|
tier1,
|
|
tier2,
|
|
tier3,
|
|
tier4,
|
|
tier5,
|
|
tier6,
|
|
tier7,
|
|
tier8,
|
|
tier9,
|
|
tierNPC,
|
|
}),
|
|
};
|
|
},
|
|
computed: {
|
|
displayName () {
|
|
if (this.name) {
|
|
return this.name;
|
|
} if (this.user && this.user.profile) {
|
|
return this.user.profile.name;
|
|
}
|
|
return null;
|
|
},
|
|
level () {
|
|
if (this.contributor) {
|
|
return this.contributor.level;
|
|
} if (this.user && this.user.contributor) {
|
|
return this.user.contributor.level;
|
|
}
|
|
return 0;
|
|
},
|
|
isNPC () {
|
|
if (this.backer) {
|
|
return this.backer.tier === 800;
|
|
} if (this.user && this.user.backer) {
|
|
return this.user.backer.tier === 800;
|
|
}
|
|
|
|
return false;
|
|
},
|
|
id () {
|
|
return this.userId || this.user._id;
|
|
},
|
|
},
|
|
methods: {
|
|
tierIcon () {
|
|
if (this.isNPC) {
|
|
return this.icons.tierNPC;
|
|
}
|
|
return this.icons[`tier${this.level}`];
|
|
},
|
|
tierTitle () {
|
|
return this.hideTooltip ? '' : achievementsLib.getContribText(this.contributor, this.isNPC) || '';
|
|
},
|
|
levelStyle () {
|
|
return this.userLevelStyleFromLevel(this.level, this.isNPC);
|
|
},
|
|
},
|
|
};
|
|
</script>
|