2021-06-07 13:16:10 +00:00
|
|
|
<template>
|
2021-06-08 11:51:42 +00:00
|
|
|
<span
|
|
|
|
class="MentionLink"
|
|
|
|
>
|
2021-06-07 13:37:12 +00:00
|
|
|
<!-- eslint-disable vue/no-v-html -->
|
|
|
|
<a
|
|
|
|
v-if="!user"
|
2021-06-22 17:16:26 +00:00
|
|
|
:href="url"
|
2021-06-07 13:37:12 +00:00
|
|
|
class="original"
|
2021-06-22 17:16:26 +00:00
|
|
|
target="_blank"
|
2021-06-07 13:37:12 +00:00
|
|
|
v-html="content"
|
2022-06-12 13:31:56 +00:00
|
|
|
/><!-- eslint-enable vue/no-v-html -->
|
|
|
|
<Popover
|
|
|
|
trigger="click"
|
|
|
|
:bound-to="{ x: 'container'}"
|
|
|
|
bound-to-selector=".column"
|
|
|
|
popover-class="popover-default mention-popover"
|
|
|
|
:disabled="!shouldShowTooltip"
|
2021-06-07 13:37:12 +00:00
|
|
|
>
|
2022-06-12 13:31:56 +00:00
|
|
|
<template v-slot:trigger>
|
2021-06-08 11:51:42 +00:00
|
|
|
<span
|
2022-06-12 13:31:56 +00:00
|
|
|
v-if="user"
|
|
|
|
class="new"
|
|
|
|
:style="style"
|
|
|
|
:class="classnames"
|
2022-01-10 07:31:26 +00:00
|
|
|
>
|
2022-06-12 13:31:56 +00:00
|
|
|
<a
|
|
|
|
class="short button-unstyled"
|
|
|
|
:class="{ '-with-tooltip': shouldShowTooltip }"
|
|
|
|
:href="url"
|
|
|
|
@click.prevent="onClick"
|
|
|
|
>
|
|
|
|
<!-- eslint-disable vue/no-v-html -->
|
|
|
|
<UserAvatar
|
|
|
|
v-if="shouldShowAvatar"
|
|
|
|
class="mention-avatar"
|
|
|
|
:user="user"
|
|
|
|
/><span
|
|
|
|
class="shortName"
|
|
|
|
><FAIcon
|
|
|
|
v-if="useAtIcon"
|
|
|
|
size="sm"
|
|
|
|
icon="at"
|
|
|
|
class="at"
|
|
|
|
/>{{ !useAtIcon ? '@' : '' }}<span
|
|
|
|
class="userName"
|
|
|
|
v-html="userName"
|
|
|
|
/><span
|
|
|
|
v-if="shouldShowFullUserName"
|
|
|
|
class="serverName"
|
|
|
|
:class="{ '-faded': shouldFadeDomain }"
|
|
|
|
v-html="'@' + serverName"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
<span
|
|
|
|
v-if="isYou && shouldShowYous"
|
|
|
|
:class="{ '-you': shouldBoldenYou }"
|
|
|
|
> {{ ' ' + $t('status.you') }}</span>
|
|
|
|
<!-- eslint-enable vue/no-v-html -->
|
|
|
|
</a><span
|
|
|
|
v-if="shouldShowTooltip"
|
|
|
|
class="full"
|
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="userNameFull"
|
|
|
|
>
|
|
|
|
<!-- eslint-disable vue/no-v-html -->
|
|
|
|
@<span
|
|
|
|
class="userName"
|
|
|
|
v-html="userName"
|
|
|
|
/><span
|
|
|
|
class="serverName"
|
|
|
|
:class="{ '-faded': shouldFadeDomain }"
|
|
|
|
v-html="'@' + serverName"
|
|
|
|
/>
|
|
|
|
<!-- eslint-enable vue/no-v-html -->
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
</span></template>
|
|
|
|
<template v-slot:content>
|
|
|
|
<UserCard
|
|
|
|
class="mention-link-popover"
|
|
|
|
:user-id="user.id"
|
|
|
|
:hide-bio="true"
|
|
|
|
:bordered="false"
|
|
|
|
:allow-zooming-avatar="true"
|
|
|
|
:rounded="true"
|
|
|
|
/>
|
|
|
|
</template>
|
|
|
|
</Popover>
|
2021-06-07 13:16:10 +00:00
|
|
|
</span>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script src="./mention_link.js"/>
|
|
|
|
|
|
|
|
<style lang="scss" src="./mention_link.scss"/>
|