<template>
|
<div class="addPay pb-10">
|
<fx-header>
|
<template #title>{{ $t('add') }} {{ $t(`${data.name}`) }}</template>
|
</fx-header>
|
<van-form @failed="onFailed">
|
<van-cell-group inset>
|
<p class="pt-6 pb-2 ash">{{ $t('BankAccount') }}</p>
|
<van-field class="select-item" v-model="data.name" disabled name="pattern"
|
:placeholder="$t('enterBankAccount')">
|
|
</van-field>
|
</van-cell-group>
|
<van-cell-group inset>
|
<p class="pt-6 pb-2 ash">{{ $t('realName') }}</p>
|
<van-field class="select-item" v-model="name" :maxlength="10" name="pattern"
|
:placeholder="$t('entryRealName')">
|
</van-field>
|
</van-cell-group>
|
<van-cell-group inset>
|
<p class="pt-6 pb-2 ash">{{ $t('Bankcardnumber') }}</p>
|
<van-field class="select-item" v-model="bankCard" :maxlength="25" name="bankCard" clearable
|
:placeholder="$t('enterBankcardnumber')">
|
</van-field>
|
</van-cell-group>
|
<van-cell-group inset>
|
<p class="pt-6 pb-2 ash">{{ $t('Remarksoptional') }}</p>
|
<van-field class="select-item-textarea" v-model="note" :maxlength="100" type="textarea" name="picker"
|
clearable :placeholder="$t('Remarks')">
|
</van-field>
|
</van-cell-group>
|
</van-form>
|
<div class="tips mx-4 mt-8 px-4 pt-4 pb-4">
|
<div class="flex tip-title">
|
<img class="mr-2" src="@/assets/image/Record/icon4.png" />
|
{{ $t('specialReminder') }}
|
</div>
|
<div class="pl-4 ash mt-2 font-13">{{ $t('tips1') }}</div>
|
</div>
|
<div class="font-13 mt-20 ash px-4">{{ $t('tips12') }}</div>
|
<div class="px-4 pt-6 mt-3">
|
<van-button class="w-full" round color="#f7b600" type="primary" @click="debounceSubmit">{{ $t('submit')
|
}}</van-button>
|
</div>
|
</div>
|
</template>
|
|
<script setup>
|
import { onMounted, ref } from 'vue';
|
import { useRoute, useRouter } from 'vue-router';
|
import { _getAddPaymentMethod, _getUpdatePaymentMethod } from "@/service/trade.api.js";
|
import { useUserStore } from "@/store/user.js";
|
import { showToast } from "vant";
|
import { useI18n } from "vue-i18n";
|
import { debounce } from '@/utils/index'
|
|
const { t } = useI18n()
|
const useStore = useUserStore();
|
const route = useRoute()
|
const router = useRouter()
|
let name = ref('')
|
let bankCard = ref()
|
let note = ref('')
|
let id = ref('')
|
let type = ref('')
|
const onFailed = (errorInfo) => {
|
console.log('failed', errorInfo);
|
};
|
const data = ref({})
|
|
onMounted(async () => {
|
data.value = JSON.parse(sessionStorage.getItem("editAdd")) || {}
|
name.value = data.value.realName || ''
|
bankCard.value = data.value.paramValue1 || ''
|
id.value = data.value.id || ''
|
type.value = data.value.type || ''
|
note.value = data.value.remark || ''
|
})
|
|
const submit = () => {
|
let params = {}
|
if (!name.value) {
|
showToast(t('entryName'))
|
return
|
}
|
if (!bankCard.value) {
|
showToast(t('enterBankcardnumber'))
|
return
|
}
|
if (type.value === 'add') {
|
params = {
|
token: useStore.userInfo.token,
|
method_config_id: id.value,
|
real_name: name.value,
|
param_value1: bankCard.value,
|
qrcode: '',
|
remark: note.value
|
}
|
//添加支付方式
|
_getAddPaymentMethod(params).then(res => {
|
router.push('/payMentMethod/list')
|
})
|
} else {
|
params = {
|
token: useStore.userInfo.token,
|
id: id.value,
|
method_config_id: id.value,
|
real_name: name.value,
|
param_value1: bankCard.value,
|
qrcode: '',
|
remark: note.value
|
}
|
_getUpdatePaymentMethod(params).then(res => {
|
router.push('/payMentMethod/list')
|
})
|
}
|
|
}
|
|
const debounceSubmit = debounce(function () {
|
submit()
|
}, 500)
|
|
</script>
|
<style lang="scss" scoped>
|
.addPay {
|
font-size: 14px;
|
|
.select-item {
|
padding: 0 15px;
|
align-items: center;
|
height: 50px;
|
border-radius: 3px;
|
}
|
|
.select-item-textarea {
|
// background: $tab_background;
|
background: $inp-b;
|
padding: 0 15px;
|
align-items: center;
|
height: 120px;
|
border-radius: 3px;
|
color: $text_color;
|
}
|
|
.ash {
|
color: $text_color1;
|
}
|
|
.tips {
|
// background: $tab_background;
|
background: $inp-b;
|
border-radius: 3px;
|
|
.tip-title {
|
font-weight: bold;
|
align-items: center;
|
color: $log-c;
|
|
img {
|
width: 20px;
|
height: 20px;
|
|
}
|
}
|
}
|
}
|
|
:deep(.van-cell-group) {
|
background: transparent;
|
}
|
|
:deep(.van-cell) {
|
// background: $tab_background;
|
background: $inp-b;
|
color: $text_color;
|
|
input {
|
color: $log-c;
|
}
|
}
|
|
:deep(.van-field__control) {
|
// color: $text_color;
|
color: $log-c;
|
}
|
</style>
|
