mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
gdd send and send per link pannel style
This commit is contained in:
ogerly
parent
b1a1189a13
commit
4a349e6017
@ -1,19 +1,21 @@
|
||||
<template>
|
||||
<div class="clipboard-copy">
|
||||
<b-input-group v-if="canCopyLink" size="lg" class="mb-3" prepend="Link">
|
||||
<b-form-input :value="link" type="text" readonly></b-form-input>
|
||||
<b-input-group-append>
|
||||
<b-button size="sm" text="Button" variant="primary" @click="copyLinkWithText">
|
||||
{{ $t('gdd_per_link.copy-link-with-text') }}
|
||||
</b-button>
|
||||
<b-button size="sm" text="Button" variant="primary" @click="copyLink">
|
||||
<div v-if="canCopyLink" size="lg" class="mb-3">
|
||||
<div class="text-center h2">
|
||||
{{ link }}
|
||||
</div>
|
||||
|
||||
<div class="text-center mt-5">
|
||||
<b-button size="sm" text="Button" variant="gradido" @click="copyLink">
|
||||
{{ $t('gdd_per_link.copy-link') }}
|
||||
</b-button>
|
||||
<b-button variant="primary" class="text-light" @click="$emit('show-qr-code-button')">
|
||||
<b-img src="img/svg/qr-code.svg" width="19" class="svg"></b-img>
|
||||
<hr />
|
||||
<b-button size="sm" text="Button" variant="gradido" @click="copyLinkWithText">
|
||||
{{ $t('gdd_per_link.copy-link-with-text') }}
|
||||
</b-button>
|
||||
</b-input-group-append>
|
||||
</b-input-group>
|
||||
<hr />
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="alert-danger p-3">{{ $t('gdd_per_link.not-copied') }}</div>
|
||||
<div class="alert-muted h3 p-3">{{ link }}</div>
|
||||
|
||||
@ -1,5 +1,57 @@
|
||||
<template>
|
||||
<div class="transaction-confirm-link bg-white appBoxShadow gradido-border-radius p-3">
|
||||
<div class="transaction-confirm-link">
|
||||
<div class="bg-white appBoxShadow gradido-border-radius p-3">
|
||||
<div class="h3 mb-4">{{ $t('gdd_per_link.header') }}</div>
|
||||
<b-row class="mt-5">
|
||||
<b-col offset="2">
|
||||
<div class="mt-3 h5">{{ $t('form.memo') }}</div>
|
||||
<div>{{ memo }}</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
<div class="small">{{ $t('send_gdd') }}</div>
|
||||
<div>{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="mt-5 pr-3 text-color-gdd-yellow h3">
|
||||
<b-col cols="2" class="text-right">
|
||||
<b-icon class="text-color-gdd-yellow" icon="droplet-half"></b-icon>
|
||||
</b-col>
|
||||
<b-col>{{ $t('advanced-calculation') }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3" offset="2">
|
||||
<b-col offset="2">{{ $t('form.current_balance') }}</b-col>
|
||||
<b-col>{{ balance | GDD }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3">
|
||||
<b-col offset="2">
|
||||
<strong>{{ $t('form.your_amount') }}</strong>
|
||||
</b-col>
|
||||
<b-col class="borderbottom">
|
||||
<strong>{{ (amount * -1) | GDD }}</strong>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3">
|
||||
<b-col offset="2">{{ $t('form.new_balance') }}</b-col>
|
||||
<b-col>{{ (balance - amount) | GDD }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="mt-5 p-5">
|
||||
<b-col>
|
||||
<b-button @click="$emit('on-reset')">{{ $t('back') }}</b-button>
|
||||
</b-col>
|
||||
<b-col class="text-right">
|
||||
<b-button
|
||||
class="send-button"
|
||||
variant="gradido"
|
||||
:disabled="disabled"
|
||||
@click="$emit('send-transaction')"
|
||||
>
|
||||
{{ $t('form.generate_now') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-row class="confirm-box-link">
|
||||
<b-col class="text-right mt-4 mb-3">
|
||||
<div class="alert-heading text-left h3">{{ $t('gdd_per_link.header') }}</div>
|
||||
|
||||
@ -1,6 +1,63 @@
|
||||
<template>
|
||||
<div class="transaction-confirm-send bg-white appBoxShadow gradido-border-radius p-3">
|
||||
<b-row class="confirm-box-send">
|
||||
<div class="transaction-confirm-send">
|
||||
<div class="bg-white appBoxShadow gradido-border-radius p-3">
|
||||
<div class="h3 mb-4">{{ $t('form.send_check') }}</div>
|
||||
<b-row class="mt-5">
|
||||
<b-col cols="2">
|
||||
<b-avatar :text="avatarText" variant="success" size="4em"></b-avatar>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<div class="h4">
|
||||
{{ email }}
|
||||
</div>
|
||||
<div class="mt-3 h5">{{ $t('form.memo') }}</div>
|
||||
<div>{{ memo }}</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
<div class="small">{{ $t('send_gdd') }}</div>
|
||||
<div>{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="mt-5 pr-3 text-color-gdd-yellow h3">
|
||||
<b-col cols="2" class="text-right">
|
||||
<b-icon class="text-color-gdd-yellow" icon="droplet-half"></b-icon>
|
||||
</b-col>
|
||||
<b-col>{{ $t('advanced-calculation') }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3" offset="2">
|
||||
<b-col offset="2">{{ $t('form.current_balance') }}</b-col>
|
||||
<b-col>{{ balance | GDD }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3">
|
||||
<b-col offset="2">
|
||||
<strong>{{ $t('form.your_amount') }}</strong>
|
||||
</b-col>
|
||||
<b-col class="borderbottom">
|
||||
<strong>{{ (amount * -1) | GDD }}</strong>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3">
|
||||
<b-col offset="2">{{ $t('form.new_balance') }}</b-col>
|
||||
<b-col>{{ (balance - amount) | GDD }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="mt-5 p-5">
|
||||
<b-col>
|
||||
<b-button @click="$emit('on-reset')">{{ $t('back') }}</b-button>
|
||||
</b-col>
|
||||
<b-col class="text-right">
|
||||
<b-button
|
||||
variant="gradido"
|
||||
:disabled="disabled"
|
||||
@click="$emit('send-transaction'), (disabled = true)"
|
||||
>
|
||||
{{ $t('form.send_now') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<!-- <b-row class="confirm-box-send">
|
||||
<b-col>
|
||||
<div class="display-4 pb-4">{{ $t('form.send_check') }}</div>
|
||||
<b-list-group class="">
|
||||
@ -31,9 +88,9 @@
|
||||
</b-input-group>
|
||||
</b-list-group>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-row> -->
|
||||
|
||||
<b-container class="bv-example-row mt-5 mb-5">
|
||||
<!-- <b-container class="bv-example-row mt-5 mb-5">
|
||||
<div class="alert-heading text-left h3">{{ $t('advanced-calculation') }}</div>
|
||||
<b-row class="pr-3">
|
||||
<b-col class="text-right">{{ $t('form.current_balance') }}</b-col>
|
||||
@ -51,22 +108,7 @@
|
||||
<b-col class="text-right">{{ $t('form.new_balance') }}</b-col>
|
||||
<b-col class="text-right">{{ (balance - amount) | GDD }}</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
|
||||
<b-row class="mt-4">
|
||||
<b-col>
|
||||
<b-button @click="$emit('on-reset')">{{ $t('back') }}</b-button>
|
||||
</b-col>
|
||||
<b-col class="text-right">
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="disabled"
|
||||
@click="$emit('send-transaction'), (disabled = true)"
|
||||
>
|
||||
{{ $t('form.send_now') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -1,6 +1,23 @@
|
||||
<template>
|
||||
<div class="bg-white appBoxShadow gradido-border-radius p-4">
|
||||
<b-row>
|
||||
<div class="h3 mb-4">{{ $t('gdd_per_link.created') }}</div>
|
||||
|
||||
<clipboard-copy
|
||||
:link="link"
|
||||
:amount="amount"
|
||||
:memo="memo"
|
||||
:validUntil="validUntil"
|
||||
></clipboard-copy>
|
||||
<div class="text-center">
|
||||
<div><figure-qr-code :link="link" /></div>
|
||||
<div>
|
||||
<b-button variant="secondary" @click="$emit('on-reset')" class="mt-4">
|
||||
{{ $t('form.close') }}
|
||||
</b-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <b-row>
|
||||
<b-col>
|
||||
<div class="h3 mb-4">{{ $t('gdd_per_link.created') }}</div>
|
||||
<clipboard-copy
|
||||
@ -19,7 +36,7 @@
|
||||
</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-row> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -40,7 +57,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showQrcode: false,
|
||||
// showQrcode: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div>
|
||||
<div class="text-center">
|
||||
<b-badge class="position-absolute mt--2 ml--5 px-3" variant="success">
|
||||
{{ $t('community.community') }}
|
||||
{{ $t('member') }}
|
||||
</b-badge>
|
||||
</div>
|
||||
<div
|
||||
@ -11,7 +11,7 @@
|
||||
<b-row>
|
||||
<b-col cols="8">
|
||||
<div class="h4">{{ $t('community.communityMember') }}</div>
|
||||
<div class="small">{{ CONFIG.COMMUNITY_NAME }}</div>
|
||||
<div>{{ CONFIG.COMMUNITY_NAME }}</div>
|
||||
</b-col>
|
||||
<b-col cols="4" class="border-left border-light p-3">
|
||||
<b-icon icon="people"></b-icon>
|
||||
|
||||
@ -1,10 +1,8 @@
|
||||
{
|
||||
"100": "100%",
|
||||
"1000thanks": "1000 Dank, weil du bei uns bist!",
|
||||
"1234": "1234",
|
||||
"125": "125%",
|
||||
"85": "85%",
|
||||
"active": "aktiv",
|
||||
"advanced-calculation": "Vorausberechnung",
|
||||
"member": "Mitglied",
|
||||
"auth": {
|
||||
@ -21,7 +19,6 @@
|
||||
"back": "Zurück",
|
||||
"community": {
|
||||
"choose-another-community": "Eine andere Gemeinschaft auswählen",
|
||||
"city": "Stadt",
|
||||
"community": "Gemeinschaft",
|
||||
"communityMember": "Du bist aktives Mitglied",
|
||||
"continue-to-registration": "Weiter zur Registrierung",
|
||||
@ -200,7 +197,7 @@
|
||||
},
|
||||
"GDT": "GDT",
|
||||
"gdt": {
|
||||
"gdt":"Gradido Transform",
|
||||
"gdt": "Gradido Transform",
|
||||
"calculation": "Berechnung der Gradido Transform",
|
||||
"contribution": "Beitrag",
|
||||
"conversion": "Umrechnung",
|
||||
@ -217,7 +214,7 @@
|
||||
"raise": "Erhöhung",
|
||||
"recruited-member": "Eingeladenes Mitglied"
|
||||
},
|
||||
"inactive": "inaktiv",
|
||||
|
||||
"language": "Sprache",
|
||||
"link-load": "den letzten Link nachladen | die letzten {n} Links nachladen | weitere {n} Links nachladen",
|
||||
"login": "Anmelden",
|
||||
|
||||
@ -1,10 +1,8 @@
|
||||
{
|
||||
"100": "100%",
|
||||
"1000thanks": "1000 thanks for being with us!",
|
||||
"1234": "1234",
|
||||
"125": "125%",
|
||||
"85": "85%",
|
||||
"active": "active",
|
||||
"advanced-calculation": "Advanced calculation",
|
||||
"member": "Member",
|
||||
"auth": {
|
||||
@ -21,7 +19,6 @@
|
||||
"back": "Back",
|
||||
"community": {
|
||||
"choose-another-community": "Choose another community",
|
||||
"city": "City",
|
||||
"community": "Community",
|
||||
"communityMember": "You are an active member",
|
||||
"continue-to-registration": "Continue to registration",
|
||||
@ -200,7 +197,7 @@
|
||||
},
|
||||
"GDT": "GDT",
|
||||
"gdt": {
|
||||
"gdt":"Gradido Transform",
|
||||
"gdt": "Gradido Transform",
|
||||
"calculation": "Calculation of Gradido Transform",
|
||||
"contribution": "Contribution",
|
||||
"conversion": "Conversion",
|
||||
@ -217,7 +214,6 @@
|
||||
"raise": "Increase",
|
||||
"recruited-member": "Invited member"
|
||||
},
|
||||
"inactive": "inactive",
|
||||
"language": "Language",
|
||||
"link-load": "Load the last link | Load the last {n} links | Load more {n} links",
|
||||
"login": "Sign in",
|
||||
|
||||
@ -26,12 +26,17 @@ export const copyLinks = {
|
||||
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', {
|
||||
${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')}`,
|
||||
},
|
||||
)}
|
||||
${this.$t('gdd_per_link.link-hint')}`,
|
||||
)
|
||||
.then(() => {
|
||||
this.toastSuccess(this.$t('gdd_per_link.link-and-text-copied'))
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user