<template>
|
<van-popup round :value="props.showPopup" @input="val => this.$emit('input', val)" :close-on-click-overlay="false"
|
position="bottom">
|
<div class="relative px-15 pt-23 px-4 pb-10">
|
<div class="flex justify-end py-4 items-center">
|
<img @click="onClose" class="z-20 w-8 h-8" src="./close.png" alt="" />
|
</div>
|
<h4 class="font-20 font-500 text-black title">{{ $t('confirmOrder') }}</h4>
|
<div class="flex flex-col justify-center pay-info">
|
<p class="text-center mt-4">{{ $t('Actual') }}</p>
|
<h2 class="font-bold text-base text-center mt-2 mb-2">{{ bankType == 'recharge' ? pay.coin_amount :
|
volume_last }} USD</h2>
|
<!-- <section>
|
<ul class="mt-2 mb-4 border-b-1">
|
<li class="flex justify-between pt-1 pb-1">
|
<span class="ash">{{ $t('bankName') }}</span>
|
<span>{{ $t('BankAmerica') }}</span>
|
</li>
|
<li class="flex justify-between pt-1 pb-1">
|
<span class="ash">{{ $t('payAccount') }}</span>
|
<span>{{ $t('foreignAccount') }}</span>
|
</li>
|
</ul>
|
</section> -->
|
<section>
|
<ul class="mt-2 mb-4 border-b-1">
|
<li class="flex justify-between pt-1 pb-1">
|
<span class="ash">{{ $t('currencyOne') }}</span>
|
<span>{{ bankType == 'recharge' ? pay.currency : 'USD' }}</span>
|
</li>
|
<li class="flex justify-between pt-1 pb-1">
|
<span class="ash">{{ $t('amount') }}</span>
|
<span>{{ pay.fa_amount }}</span>
|
</li>
|
<li class="flex justify-between pt-1 pb-1">
|
<span class="ash">{{ $t('free') }}</span>
|
<span>{{ pay.fee || '--' }}</span>
|
</li>
|
</ul>
|
</section>
|
<van-button type="primary" @click="onConfirm">{{ $t('confirmOrder') }}</van-button>
|
</div>
|
</div>
|
</van-popup>
|
</template>
|
|
<script setup>
|
import { useRouter } from "vue-router";
|
import { ref, watch, onBeforeMount } from 'vue';
|
import { useI18n } from "vue-i18n";
|
import { c2cOrder } from "@/service/recharge.api";
|
const { t } = useI18n()
|
const router = useRouter()
|
const props = defineProps({
|
showPopup: {
|
type: Boolean,
|
default: false
|
},
|
bankId: {
|
type: String,
|
default: ''
|
},
|
payInfo: {
|
type: Object,
|
default: {}
|
},
|
bankType: {
|
type: String,
|
default: 'Withdraw'
|
},
|
fee: {
|
default: ''
|
},
|
volume_last: {
|
default: 0
|
}
|
})
|
let pay = ref({})
|
|
const emits = defineEmits(['close'])
|
|
const onClose = () => {
|
emits('close')
|
}
|
|
const onConfirm = () => {
|
const { direction } = props.payInfo
|
onClose()
|
// 银行卡充值无需输入密码，直接走接口
|
if (direction === 'recharge') {
|
const params = { ...props.payInfo, safeword: '' }
|
c2cOrder(params).then((res) => {
|
if (props.bankType == 'recharge') {
|
router.push('/order/submit?orderNo=' + res.order_no)
|
} else {
|
router.push('/order/apply-success?currentType=withdraw&type=bank')
|
}
|
})
|
} else {
|
router.push('/exchange/fund-password-verify?type=bank&payInfo=' + JSON.stringify(props.payInfo) + '&bankType=' + props.bankType)
|
}
|
}
|
onBeforeMount(() => {
|
pay.value = props.payInfo
|
console.log(props.payInfo, 'props.payInfo')
|
})
|
</script>
|
<style lang="scss" scoped>
|
.pay-info {
|
color: $black;
|
font-size: 14px;
|
}
|
|
.title {
|
text-align: center;
|
color: #1F2025;
|
font-weight: bold;
|
font-size: 20px;
|
}
|
|
.ash {
|
color: $text_color1;
|
}
|
|
.money-title {
|
font-size: 24px;
|
font-weight: bold
|
}
|
</style>
|
