refctor link result

This commit is contained in:
ogerly 2023-01-19 07:57:11 +01:00
parent 75b435456e
commit f7b74d8e63
3 changed files with 36 additions and 20 deletions

View File

@ -1,22 +1,32 @@
<template>
<div class="clipboard-copy">
<div v-if="canCopyLink" size="lg" class="mb-5">
<div class="d-flex">
<div>
<label>{{ $t('gdd_per_link.copy-link') }}</label>
<div class="pointer text-center bg-secondary gradido-border-radius p-4" @click="copyLink">
{{ link }}
</div>
</div>
<div class="ml-5">
<label>{{ $t('gdd_per_link.copy-link-with-text') }}</label>
<div v-if="canCopyLink" class="mb-5">
<div>
<label>{{ $t('gdd_per_link.copy-link') }}</label>
<div class="pointer text-center bg-secondary gradido-border-radius p-3" @click="copyLink">
{{ link }}
<div>
<b-button @click="copyLinkWithText" class="p-4">
<b-button class="p-4">
<b-icon icon="link45deg"></b-icon>
</b-button>
</div>
</div>
</div>
<div class="mt-5">
<label>{{ $t('gdd_per_link.copy-link-with-text') }}</label>
<div
class="pointer text-center bg-secondary gradido-border-radius p-3"
@click="copyLinkWithText"
>
{{ text }}
<div>
<b-button class="p-4">
<b-icon icon="link45deg"></b-icon>
</b-button>
</div>
</div>
<div></div>
</div>
</div>
<div v-else>
<div class="alert-danger p-3">{{ $t('gdd_per_link.not-copied') }}</div>

View File

@ -6,7 +6,9 @@
:amount="amount"
:memo="memo"
:validUntil="validUntil"
:text="text"
></clipboard-copy>
<label>{{ $t('qrCode') }}</label>
<div class="text-center">
<div><figure-qr-code :link="link" /></div>
<div>
@ -33,5 +35,16 @@ export default {
memo: { type: String, required: true },
validUntil: { type: String, required: true },
},
data() {
return {
text: `${this.link}
${this.$store.state.firstName} ${this.$t('transaction-link.send_you')} ${this.amount} Gradido.
"${this.memo}"
${this.$t('gdd_per_link.credit-your-gradido')} ${this.$t('gdd_per_link.validUntilDate', {
date: this.$d(new Date(this.validUntil), 'short'),
})}
${this.$t('gdd_per_link.link-hint')}`,
}
},
}
</script>

View File

@ -4,6 +4,7 @@ export const copyLinks = {
amount: { type: String, required: true },
memo: { type: String, required: true },
validUntil: { type: String, required: true },
text: { type: String, required: true },
},
data() {
return {
@ -24,15 +25,7 @@ export const copyLinks = {
},
copyLinkWithText() {
navigator.clipboard
.writeText(
`${this.link}
${this.$store.state.firstName} ${this.$t('transaction-link.send_you')} ${this.amount} Gradido.
"${this.memo}"
${this.$t('gdd_per_link.credit-your-gradido')} ${this.$t('gdd_per_link.validUntilDate', {
date: this.$d(new Date(this.validUntil), 'short'),
})}
${this.$t('gdd_per_link.link-hint')}`,
)
.writeText(this.text)
.then(() => {
this.toastSuccess(this.$t('gdd_per_link.link-and-text-copied'))
})