feat: 初始化
This commit is contained in:
262
pages/capital/deposit/remittanceInfo/index.vue
Normal file
262
pages/capital/deposit/remittanceInfo/index.vue
Normal file
@ -0,0 +1,262 @@
|
||||
<template>
|
||||
<view>
|
||||
<NavBar />
|
||||
<view class="container">
|
||||
<view class="title">
|
||||
<PageTitle :title="$t('deposit.remittanceInfo.title')" />
|
||||
</view>
|
||||
<view class="infoCard" v-show="cardType === 1">
|
||||
<view class="title">{{ $t('form.personalData.financialInformation.accountHolder.label') }}</view>
|
||||
<view class="infoCardContent">
|
||||
<view class="labelColumn">
|
||||
<view v-if="depositData?.account_holder">{{ $t('deposit.name') }}</view>
|
||||
<view v-if="depositData?.bank_account">{{ $t('deposit.bankAccount') }}</view>
|
||||
<view v-if="depositData?.bank_name">{{ $t('deposit.bank') }}</view>
|
||||
<view v-if="depositData?.sub_branch">{{ $t('deposit.subBranch') }}</view>
|
||||
<view v-if="depositData?.field1">SWIFT</view>
|
||||
<view v-if="depositData?.field2">{{ $t('form.walletType.label') }}</view>
|
||||
<view v-if="depositData?.field3">{{ $t('form.walletAddress.label') }}</view>
|
||||
<view v-if="depositData?.field4">{{ $t('form.bankAddress.label') }}</view>
|
||||
<view v-if="depositData?.phone">{{ $t('deposit.phone') }}</view>
|
||||
</view>
|
||||
<view class="valueColumn">
|
||||
<view class="value" v-if="depositData?.account_holder">{{ depositData?.account_holder }}</view>
|
||||
<view class="value" v-if="depositData?.bank_account">{{ depositData?.bank_account }}</view>
|
||||
<view class="value" v-if="depositData?.bank_name">{{ depositData?.bank_name }}</view>
|
||||
<view class="value" v-if="depositData?.sub_branch">{{ depositData?.sub_branch }}</view>
|
||||
<view class="value" v-if="depositData?.field1">{{ depositData?.field1 }}</view>
|
||||
<view class="value" v-if="depositData?.field2">{{ depositData?.field2 }}</view>
|
||||
<view class="value" v-if="depositData?.field3">{{ depositData?.field3 }}</view>
|
||||
<view class="value" v-if="depositData?.field4">{{ depositData?.field4 }}</view>
|
||||
<view class="value" v-if="depositData?.phone">{{ depositData?.phone }}</view>
|
||||
</view>
|
||||
<view class="copyIconColumn">
|
||||
<view v-if="depositData?.account_holder"><CopyIcon :value="depositData?.account_holder" /></view>
|
||||
<view v-if="depositData?.bank_account"><CopyIcon :value="depositData?.bank_account" /></view>
|
||||
<view v-if="depositData?.bank_name"><CopyIcon :value="depositData?.bank_name" /></view>
|
||||
<view v-if="depositData?.sub_branch"><CopyIcon :value="depositData?.sub_branch" /></view>
|
||||
<view v-if="depositData?.field1"><CopyIcon :value="depositData?.field1" /></view>
|
||||
<view v-if="depositData?.field2"><CopyIcon :value="depositData?.field2" /></view>
|
||||
<view v-if="depositData?.field3"><CopyIcon :value="depositData?.field3" /></view>
|
||||
<view v-if="depositData?.field4"><CopyIcon :value="depositData?.field4" /></view>
|
||||
<view v-if="depositData?.phone"><CopyIcon :value="depositData?.phone" /></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoCard" v-show="cardType === 2">
|
||||
<view class="title">{{ $t('deposit.wallet') }}</view>
|
||||
<view class="infoCardContent">
|
||||
<view class="labelColumn">
|
||||
<view>{{ $t('form.walletType.label') }}</view>
|
||||
<view>{{ $t('form.currencyType.label') }}</view>
|
||||
<view>{{ $t('form.walletAddress.label') }}</view>
|
||||
</view>
|
||||
<view class="valueColumn">
|
||||
<view class="value">{{ depositData?.field2 }}</view>
|
||||
<view class="value">{{ depositData?.currency_type }}</view>
|
||||
<view class="value"></view>
|
||||
</view>
|
||||
<view class="copyIconColumn">
|
||||
<view><CopyIcon :value="depositData?.field2" /></view>
|
||||
<view><CopyIcon :value="depositData?.currency_type" /></view>
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="walletAddress">
|
||||
<view class="value">{{ depositData?.field3 }}</view>
|
||||
<CopyIcon :value="depositData?.field3" />
|
||||
</view>
|
||||
<view class="scanCode">
|
||||
<text>{{ $t('deposit.scanCode') }}</text>
|
||||
<view class="codeWrapper">
|
||||
<view class="code">
|
||||
<l-qrcode :value="depositData?.field3" :size="80" bgColor="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoContent">
|
||||
<view class="remittanceAmount">
|
||||
<view>{{ $t('deposit.remittanceAmount') }}</view>
|
||||
<view class="value">{{ depositData?.currency_amount }}</view>
|
||||
</view>
|
||||
<view class="currencyType">
|
||||
<view>{{ $t('form.currencyType.label') }}</view>
|
||||
<view class="value">{{ depositData?.currency_type }}</view>
|
||||
</view>
|
||||
<view v-show="needDepositForm">
|
||||
<uni-forms ref="depositForm" :modelValue="depositFormData" :rules="depositFormRules">
|
||||
<uni-forms-item name="pay_ordid">
|
||||
<text class="uni-subtitle">{{ $t('form.receipt.label') }}</text>
|
||||
<uni-easyinput trim="all" primaryColor="#29BBE4" v-model="depositFormData.pay_ordid"></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
<view class="imgUploadWrapper">
|
||||
<uni-forms-item name="remittance_img">
|
||||
<text class="uni-subtitle">{{ $t('form.receiptImg.label') }}</text>
|
||||
<uni-file-picker
|
||||
ref="remittance_img"
|
||||
v-model="remittanceImg"
|
||||
file-mediatype="image"
|
||||
mode="grid"
|
||||
:limit="1"
|
||||
@select="(e) => select(e, 'remittance_img')"
|
||||
/>
|
||||
<view style="max-width: 140px">
|
||||
<Progress :progress="remittance_img_progress" :error="remittance_img_error" />
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
</view>
|
||||
<view class="countdown">
|
||||
<image src="/static/smallWarning.png" mode="aspectFit" style="width: 13px; height: 13px; margin-right: 4px"></image>
|
||||
<text>{{ $t('deposit.please') }}</text>
|
||||
<uni-countdown :show-day="false" :hour="hour" :minute="minute" :second="second" color="#FF5733" />
|
||||
<text>{{ $t('deposit.completeRemittance') }}</text>
|
||||
</view>
|
||||
<view>
|
||||
<button class="primaryButton" type="button" :disabled="btnLoading" @click="handleSaveDeposit">
|
||||
<image v-show="btnLoading" src="/static/loadingCircle.svg" mode="aspectFit" style="width: 16px; height: 16px"></image>
|
||||
{{ $t('form.submitAudit') }}
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDepositDataById, saveDepositData } from '@/services/capital/deposit.ts';
|
||||
import { imgUpload } from '@/services/common.ts';
|
||||
export default {
|
||||
name: '',
|
||||
data() {
|
||||
return {
|
||||
actId: undefined,
|
||||
pageParams: null,
|
||||
depositData: null,
|
||||
needDepositFormChannel: ['remittance2', 'remittance'],
|
||||
needDepositForm: false,
|
||||
cardType2Channel: ['remittance2'],
|
||||
cardType: 1,
|
||||
remittanceImg: undefined,
|
||||
remittance_img_progress: 100,
|
||||
remittance_img_error: false,
|
||||
pageTitleMap: {
|
||||
LDAgency: this.$t('deposit.depositType.localDepositor'),
|
||||
remittance: this.$t('deposit.depositType.swift'),
|
||||
remittance2: 'USDT'
|
||||
},
|
||||
depositFormData: {},
|
||||
depositFormRules: {
|
||||
pay_ordid: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
errorMessage: this.$t('form.receipt.required')
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
hour: 0,
|
||||
minute: 0,
|
||||
second: 0,
|
||||
btnLoading: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async getDepositData(id) {
|
||||
const res = await getDepositDataById(id);
|
||||
if (res && res.code === 0) {
|
||||
this.depositData = res.data;
|
||||
}
|
||||
},
|
||||
async select(e, field) {
|
||||
this[`${field}_progress`] = 0;
|
||||
this[`${field}_error`] = false;
|
||||
let step = 1;
|
||||
const timer = setInterval(() => {
|
||||
if (this[`${field}_progress`] > 85) {
|
||||
step = 0.1;
|
||||
} else if (this[`${field}_progress`] > 35) {
|
||||
step = 0.8;
|
||||
} else if (this[`${field}_progress`] > 15) {
|
||||
step = 0.4;
|
||||
}
|
||||
if (this[`${field}_progress`] + step > 98) {
|
||||
clearInterval(timer);
|
||||
return;
|
||||
}
|
||||
this[`${field}_progress`] += step;
|
||||
}, 34);
|
||||
this.$refs[field].files[0].progress = 100;
|
||||
const res = await imgUpload(e);
|
||||
if (res && res.code === 0) {
|
||||
this[`${field}_progress`] = 100;
|
||||
this.depositFormData[field] = res.data?.imgNameList?.[0];
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: this.$t('common.success.uploadSuccess')
|
||||
});
|
||||
} else {
|
||||
this[`${field}_error`] = true;
|
||||
this.$cusModal.showModal({
|
||||
type: 'message',
|
||||
status: 'warning',
|
||||
contentText: res.msg ?? this.$t('common.error.uploadError')
|
||||
});
|
||||
}
|
||||
},
|
||||
async handleSaveDeposit() {
|
||||
if (this.needDepositForm) {
|
||||
this.$refs.depositForm.validate().then(async (fields) => {
|
||||
this.btnLoading = true;
|
||||
const res = await saveDepositData({ ...fields, id: this.pageParams?.obj?.goldInId, status: 0 });
|
||||
this.btnLoading = false;
|
||||
if (res && res.code === 0) {
|
||||
uni.redirectTo({
|
||||
url: `/pages/capital/deposit/success/index?pageTitle=${this.pageTitleMap[this.pageParams.pay_code]}`
|
||||
});
|
||||
} else {
|
||||
this.$cusModal.showModal({
|
||||
type: 'message',
|
||||
status: 'warning',
|
||||
contentText: res.msg ?? this.$t('common.error.sysError')
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.btnLoading = true;
|
||||
const res = await saveDepositData({ id: this.pageParams?.obj?.goldInId, status: 0 });
|
||||
this.btnLoading = false;
|
||||
if (res && res.code === 0) {
|
||||
uni.redirectTo({
|
||||
url: `/pages/capital/deposit/success/index?pageTitle=${this.pageTitleMap[this.pageParams.pay_code]}`
|
||||
});
|
||||
} else {
|
||||
this.$cusModal.showModal({
|
||||
type: 'message',
|
||||
status: 'warning',
|
||||
contentText: res.msg ?? this.$t('common.error.sysError')
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad(params) {
|
||||
this.pageParams = JSON.parse(params?.depositData);
|
||||
this.hour = Math.floor(this.pageParams.pay_time / 3600000);
|
||||
this.minute = Math.floor((this.pageParams.pay_time % 3600000) / 60000);
|
||||
this.second = (this.pageParams.pay_time % 60000) / 1000;
|
||||
this.needDepositForm = this.needDepositFormChannel.includes(this.pageParams.pay_code);
|
||||
this.cardType = this.cardType2Channel.includes(this.pageParams.pay_code) ? 2 : 1;
|
||||
if (this.pageParams?.obj?.goldInId) {
|
||||
this.getDepositData(this.pageParams.obj.goldInId);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './index.scss';
|
||||
</style>
|
Reference in New Issue
Block a user