mirror of
https://gitlab.com/PronounsPage/PronounsPage.git
synced 2025-08-05 12:07:22 -04:00
88 lines
2.9 KiB
Vue
88 lines
2.9 KiB
Vue
<template>
|
|
<div class="list-group list-group-flare">
|
|
<div class="list-group-item pt-3">
|
|
<h5>
|
|
<Icon v="share" />
|
|
<T>share</T>
|
|
</h5>
|
|
</div>
|
|
<div class="list-group-item small p-2">
|
|
<input v-model="link" class="form-control form-control-sm mb-2" readonly disabled>
|
|
<Share :url="url" />
|
|
</div>
|
|
<div class="list-group-item small p-3">
|
|
<h6>
|
|
<T>profile.share.customise</T>
|
|
</h6>
|
|
<div class="form-group my-1">
|
|
<div class="form-check form-switch">
|
|
<label>
|
|
<input v-model="local" class="form-check-input" type="checkbox" role="switch">
|
|
<T>profile.share.local</T>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="form-group my-1">
|
|
<div class="form-check form-switch">
|
|
<label>
|
|
<input v-model="atAlternative" class="form-check-input" type="checkbox" role="switch">
|
|
<T>profile.share.atAlternative</T>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div v-if="mainPronoun" class="form-group my-1">
|
|
<div class="form-check form-switch">
|
|
<label>
|
|
<input v-model="pronouns" class="form-check-input" type="checkbox" role="switch">
|
|
<T>profile.share.pronouns</T>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<a v-if="!showQr" href="#" class="list-group-item list-group-item-action list-group-item-hoverable" @click.prevent="showQr = true">
|
|
<Icon v="scanner" />
|
|
<T>user.qr.header</T>
|
|
</a>
|
|
<div v-else class="list-group-item small p-2 text-center">
|
|
<QrCode
|
|
v-if="showQr"
|
|
:url="url"
|
|
:text1="local ? $t('domain') : 'pronouns.page'"
|
|
:text2="`@${user.username}`"
|
|
download
|
|
border
|
|
style="max-width: 256px; margin: 0 auto"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
user: { required: true },
|
|
showQrStart: { type: Boolean },
|
|
mainPronoun: {},
|
|
},
|
|
data() {
|
|
return {
|
|
showQr: this.showQrStart,
|
|
local: true,
|
|
atAlternative: false,
|
|
pronouns: false,
|
|
};
|
|
},
|
|
computed: {
|
|
link() {
|
|
return (this.local ? this.$t('domain') : 'pronouns.page') +
|
|
(this.atAlternative ? '/u/' : '/@') +
|
|
this.user.username +
|
|
(this.pronouns && this.mainPronoun ? `#${this.mainPronoun.name()}` : '');
|
|
},
|
|
url() {
|
|
return `https://${this.link}`;
|
|
},
|
|
},
|
|
};
|
|
</script>
|