mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
go back in the form
This commit is contained in:
parent
ddc1558ada
commit
b64db8158a
@ -1,112 +1,114 @@
|
|||||||
<template>
|
<template>
|
||||||
<b-row class="transaction-form">
|
<div class="transaction-form">
|
||||||
<b-col cols="12">
|
<b-row>
|
||||||
<b-card class="appBoxShadow gradido-border-radius" body-class="p-3">
|
<b-col cols="12">
|
||||||
<validation-observer v-slot="{ handleSubmit }" ref="formValidator">
|
<b-card class="appBoxShadow gradido-border-radius" body-class="p-3">
|
||||||
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
|
<validation-observer v-slot="{ handleSubmit }" ref="formValidator">
|
||||||
<b-form-radio-group v-model="radioSelected" class="container">
|
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
|
||||||
<b-row class="mb-4">
|
<b-form-radio-group v-model="radioSelected" class="container">
|
||||||
<b-col cols="12" lg="6">
|
<b-row class="mb-4">
|
||||||
<b-row class="bg-248 gradido-border-radius pt-lg-2 mr-lg-2">
|
<b-col cols="12" lg="6">
|
||||||
<b-col cols="10" @click="radioSelected = sendTypes.send" class="pointer">
|
<b-row class="bg-248 gradido-border-radius pt-lg-2 mr-lg-2">
|
||||||
{{ $t('send_gdd') }}
|
<b-col cols="10" @click="radioSelected = sendTypes.send" class="pointer">
|
||||||
</b-col>
|
{{ $t('send_gdd') }}
|
||||||
<b-col cols="2">
|
</b-col>
|
||||||
<b-form-radio
|
<b-col cols="2">
|
||||||
name="shipping"
|
<b-form-radio
|
||||||
size="lg"
|
name="shipping"
|
||||||
:value="sendTypes.send"
|
size="lg"
|
||||||
stacked
|
:value="sendTypes.send"
|
||||||
class="custom-radio-button pointer"
|
stacked
|
||||||
></b-form-radio>
|
class="custom-radio-button pointer"
|
||||||
</b-col>
|
></b-form-radio>
|
||||||
</b-row>
|
</b-col>
|
||||||
</b-col>
|
</b-row>
|
||||||
|
</b-col>
|
||||||
|
<b-col>
|
||||||
|
<b-row class="bg-248 gradido-border-radius pt-lg-2 ml-lg-2 mt-2 mt-lg-0">
|
||||||
|
<b-col cols="10" @click="radioSelected = sendTypes.link" class="pointer">
|
||||||
|
{{ $t('send_per_link') }}
|
||||||
|
</b-col>
|
||||||
|
<b-col cols="2" class="pointer">
|
||||||
|
<b-form-radio
|
||||||
|
name="shipping"
|
||||||
|
:value="sendTypes.link"
|
||||||
|
size="lg"
|
||||||
|
class="custom-radio-button"
|
||||||
|
></b-form-radio>
|
||||||
|
</b-col>
|
||||||
|
</b-row>
|
||||||
|
</b-col>
|
||||||
|
</b-row>
|
||||||
|
|
||||||
|
<div class="mt-4 mb-4" v-if="radioSelected === sendTypes.link">
|
||||||
|
<h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
|
||||||
|
<div>
|
||||||
|
{{ $t('gdd_per_link.choose-amount') }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</b-form-radio-group>
|
||||||
|
<b-row>
|
||||||
<b-col>
|
<b-col>
|
||||||
<b-row class="bg-248 gradido-border-radius pt-lg-2 ml-lg-2 mt-2 mt-lg-0">
|
<b-row>
|
||||||
<b-col cols="10" @click="radioSelected = sendTypes.link" class="pointer">
|
<b-col cols="12">
|
||||||
{{ $t('send_per_link') }}
|
<div v-if="radioSelected === sendTypes.send">
|
||||||
|
<input-email
|
||||||
|
:name="$t('form.recipient')"
|
||||||
|
:label="$t('form.recipient')"
|
||||||
|
:placeholder="$t('form.email')"
|
||||||
|
v-model="form.email"
|
||||||
|
:disabled="isBalanceDisabled"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col cols="2" class="pointer">
|
<b-col cols="12" lg="6">
|
||||||
<b-form-radio
|
<input-amount
|
||||||
name="shipping"
|
v-model="form.amount"
|
||||||
:value="sendTypes.link"
|
:name="$t('form.amount')"
|
||||||
size="lg"
|
:label="$t('form.amount')"
|
||||||
class="custom-radio-button"
|
:placeholder="'0.01'"
|
||||||
></b-form-radio>
|
:rules="{ required: true, gddSendAmount: [0.01, balance] }"
|
||||||
|
typ="TransactionForm"
|
||||||
|
:disabled="isBalanceDisabled"
|
||||||
|
></input-amount>
|
||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
|
|
||||||
<div class="mt-4 mb-4" v-if="radioSelected === sendTypes.link">
|
<b-row>
|
||||||
<h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
|
<b-col>
|
||||||
<div>
|
<input-textarea
|
||||||
{{ $t('gdd_per_link.choose-amount') }}
|
v-model="form.memo"
|
||||||
</div>
|
:name="$t('form.message')"
|
||||||
|
:label="$t('form.message')"
|
||||||
|
:placeholder="$t('form.message')"
|
||||||
|
:rules="{ required: true, min: 5, max: 255 }"
|
||||||
|
:disabled="isBalanceDisabled"
|
||||||
|
/>
|
||||||
|
</b-col>
|
||||||
|
</b-row>
|
||||||
|
<div v-if="!!isBalanceDisabled" class="text-danger mt-5">
|
||||||
|
{{ $t('form.no_gdd_available') }}
|
||||||
</div>
|
</div>
|
||||||
</b-form-radio-group>
|
<b-row v-else class="test-buttons mt-5">
|
||||||
<b-row>
|
<b-col>
|
||||||
<b-col>
|
<b-button type="reset" variant="secondary" @click="onReset">
|
||||||
<b-row>
|
{{ $t('form.reset') }}
|
||||||
<b-col cols="12">
|
</b-button>
|
||||||
<div v-if="radioSelected === sendTypes.send">
|
</b-col>
|
||||||
<input-email
|
<b-col class="text-right">
|
||||||
:name="$t('form.recipient')"
|
<b-button type="submit" variant="gradido">
|
||||||
:label="$t('form.recipient')"
|
{{ $t('form.check_now') }}
|
||||||
:placeholder="$t('form.email')"
|
</b-button>
|
||||||
v-model="form.email"
|
</b-col>
|
||||||
:disabled="isBalanceDisabled"
|
</b-row>
|
||||||
/>
|
</b-form>
|
||||||
</div>
|
</validation-observer>
|
||||||
</b-col>
|
</b-card>
|
||||||
<b-col cols="12" lg="6">
|
</b-col>
|
||||||
<input-amount
|
</b-row>
|
||||||
v-model="form.amount"
|
</div>
|
||||||
:name="$t('form.amount')"
|
|
||||||
:label="$t('form.amount')"
|
|
||||||
:placeholder="'0.01'"
|
|
||||||
:rules="{ required: true, gddSendAmount: [0.01, balance] }"
|
|
||||||
typ="TransactionForm"
|
|
||||||
:disabled="isBalanceDisabled"
|
|
||||||
></input-amount>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<input-textarea
|
|
||||||
v-model="form.memo"
|
|
||||||
:name="$t('form.message')"
|
|
||||||
:label="$t('form.message')"
|
|
||||||
:placeholder="$t('form.message')"
|
|
||||||
:rules="{ required: true, min: 5, max: 255 }"
|
|
||||||
:disabled="isBalanceDisabled"
|
|
||||||
/>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<div v-if="!!isBalanceDisabled" class="text-danger mt-5">
|
|
||||||
{{ $t('form.no_gdd_available') }}
|
|
||||||
</div>
|
|
||||||
<b-row v-else class="test-buttons mt-5">
|
|
||||||
<b-col>
|
|
||||||
<b-button type="reset" variant="secondary" @click="onReset">
|
|
||||||
{{ $t('form.reset') }}
|
|
||||||
</b-button>
|
|
||||||
</b-col>
|
|
||||||
<b-col class="text-right">
|
|
||||||
<b-button type="submit" variant="gradido">
|
|
||||||
{{ $t('form.check_now') }}
|
|
||||||
</b-button>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
</b-card>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { SEND_TYPES } from '@/pages/Send.vue'
|
import { SEND_TYPES } from '@/pages/Send.vue'
|
||||||
|
|||||||
@ -19,7 +19,7 @@
|
|||||||
<div v-else>{{ errorResult }}</div>
|
<div v-else>{{ errorResult }}</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-center mt-5">
|
<p class="text-center mt-5">
|
||||||
<b-button variant="secondary" @click="$emit('on-reset')">
|
<b-button variant="secondary" @click="$emit('on-back')">
|
||||||
{{ $t('form.close') }}
|
{{ $t('form.close') }}
|
||||||
</b-button>
|
</b-button>
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@ -22,6 +22,7 @@
|
|||||||
@focus="amountFocused = true"
|
@focus="amountFocused = true"
|
||||||
@blur="normalizeAmount(true)"
|
@blur="normalizeAmount(true)"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
autocomplete="off"
|
||||||
></b-form-input>
|
></b-form-input>
|
||||||
|
|
||||||
<b-form-invalid-feedback v-bind="ariaMsg">
|
<b-form-invalid-feedback v-bind="ariaMsg">
|
||||||
@ -63,7 +64,7 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
currentValue: '',
|
currentValue: this.value,
|
||||||
amountValue: 0.0,
|
amountValue: 0.0,
|
||||||
amountFocused: false,
|
amountFocused: false,
|
||||||
}
|
}
|
||||||
|
|||||||
@ -21,6 +21,7 @@
|
|||||||
@focus="emailFocused = true"
|
@focus="emailFocused = true"
|
||||||
@blur="normalizeEmail()"
|
@blur="normalizeEmail()"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
autocomplete="off"
|
||||||
></b-form-input>
|
></b-form-input>
|
||||||
<b-form-invalid-feedback v-bind="ariaMsg">
|
<b-form-invalid-feedback v-bind="ariaMsg">
|
||||||
{{ errors[0] }}
|
{{ errors[0] }}
|
||||||
|
|||||||
@ -41,7 +41,7 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
currentValue: '',
|
currentValue: this.value,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|||||||
@ -171,7 +171,6 @@ export default {
|
|||||||
},
|
},
|
||||||
onBack() {
|
onBack() {
|
||||||
this.currentTransactionStep = TRANSACTION_STEPS.transactionForm
|
this.currentTransactionStep = TRANSACTION_STEPS.transactionForm
|
||||||
this.$mount()
|
|
||||||
},
|
},
|
||||||
updateTransactions(pagination) {
|
updateTransactions(pagination) {
|
||||||
this.$emit('update-transactions', pagination)
|
this.$emit('update-transactions', pagination)
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user