168 lines
5.1 KiB
Vue
168 lines
5.1 KiB
Vue
|
<template>
|
||
|
|
<view class="bankCardWrapper">
|
||
|
|
<!-- <view class="decoration">-->
|
||
|
|
<!-- <view class="left"></view>-->
|
||
|
|
<!-- <view class="right"></view>-->
|
||
|
|
<!-- </view>-->
|
||
|
|
<view class="bankCardContent">
|
||
|
|
<view class="cardTitle">
|
||
|
|
<!-- <view class="bankName">{{ values.bank_name }}</view>-->
|
||
|
|
<view class="bankStatusWrapper">
|
||
|
|
<view>
|
||
|
|
<image v-if="values.bank_standby_1 == 'B1'" src="/static/user/yhzh.svg" mode="aspectFit" style="width: 36px; height: 36px"></image>
|
||
|
|
<image v-else src="/static/user/szhb.svg" mode="aspectFit" style="width: 36px; height: 36px"></image>
|
||
|
|
</view>
|
||
|
|
<text v-if="values.bank_standby_1 == 'B1'" class="bankType">{{ $t('form.bankAccount.label') }}</text>
|
||
|
|
<text v-else class="bankType">{{ $t('form.personalData.financialInformation.digitalCurrency.label') }}</text>
|
||
|
|
<view
|
||
|
|
class="bankStatus"
|
||
|
|
:style="{
|
||
|
|
color: applyStatusMap[getStatus()]?.color,
|
||
|
|
backgroundColor: applyStatusMap[getStatus()]?.bgc
|
||
|
|
}"
|
||
|
|
>
|
||
|
|
{{ applyStatusMap[getStatus()]?.text ?? '-' }}
|
||
|
|
</view>
|
||
|
|
<!-- <view-->
|
||
|
|
<!-- v-if="values.bank_standby_1 !== 'B1' && Number(values.apply_status) === 0"-->
|
||
|
|
<!-- class="toVerifyBtn"-->
|
||
|
|
<!-- @click.stop="() => toVerify(values)"-->
|
||
|
|
<!-- >-->
|
||
|
|
<!-- {{ this.$t('form.personalData.financialInformation.bankStatus.toVerify') }}-->
|
||
|
|
<!-- </view>-->
|
||
|
|
</view>
|
||
|
|
<view class="controls">
|
||
|
|
<view class="controlsIcon" @click="onClick" ><image src="/static/user/edit.svg" mode="aspectFit" style="width: 14px; height: 14px"></image></view>
|
||
|
|
<view v-show="values.apply_status == 2" class="controlsIcon" @click="handleDeleteBank"><image src="/static/user/del.svg" mode="aspectFit" style="width: 12px; height: 12px"></image></view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="divider"></view>
|
||
|
|
<view class="bankCardDetails">
|
||
|
|
<view class="detailItem">
|
||
|
|
<view class="point"></view>
|
||
|
|
<text>{{ values.bank_no }}</text>
|
||
|
|
</view>
|
||
|
|
<view class="detailItem">
|
||
|
|
<view class="point"></view>
|
||
|
|
<text>{{ values.bank_currency }}</text>
|
||
|
|
</view>
|
||
|
|
<view class="detailItem">
|
||
|
|
<view class="point"></view>
|
||
|
|
<text>{{ values.bank_cards }}</text>
|
||
|
|
</view>
|
||
|
|
<view class="detailItem" v-if="values.bank_standby_1 === 'B1'">
|
||
|
|
<view class="point"></view>
|
||
|
|
<text>{{ values.bank_sub_name }}</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { sendBankMail } from '@/services/user/completeInfo.ts';
|
||
|
|
import UploadImage from "../../../../../uni_modules/uni-file-picker/components/uni-file-picker/upload-image.vue";
|
||
|
|
export default {
|
||
|
|
name: 'BankCard',
|
||
|
|
components: {UploadImage},
|
||
|
|
props: {
|
||
|
|
values: {
|
||
|
|
type: Object,
|
||
|
|
required: true,
|
||
|
|
default: () => ({})
|
||
|
|
},
|
||
|
|
onClick: {
|
||
|
|
type: Function,
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
handleDeleteBank: {
|
||
|
|
type: Function,
|
||
|
|
required: true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
current: 0,
|
||
|
|
items: ['全部账户', this.$t('form.bankAccount.label'), this.$t('form.personalData.financialInformation.digitalCurrency.label')],
|
||
|
|
applyStatusMap: {
|
||
|
|
approved: {
|
||
|
|
color: 'rgba(67, 207, 124, 1)',
|
||
|
|
bgc: 'rgba(67, 207, 124, 0.2)',
|
||
|
|
text: this.$t('form.personalData.financialInformation.bankStatus.approved')
|
||
|
|
},
|
||
|
|
verified: {
|
||
|
|
color: 'rgba(67, 207, 124, 1)',
|
||
|
|
bgc: 'rgba(67, 207, 124, 0.2)',
|
||
|
|
text: this.$t('form.personalData.financialInformation.bankStatus.verified')
|
||
|
|
},
|
||
|
|
pending: {
|
||
|
|
color: 'rgba(255, 195, 0, 1)',
|
||
|
|
bgc: 'rgba(255, 195, 0, 0.2)',
|
||
|
|
text: this.$t('form.personalData.financialInformation.bankStatus.pending')
|
||
|
|
},
|
||
|
|
unverified: {
|
||
|
|
color: 'rgba(255, 195, 0, 1)',
|
||
|
|
bgc: 'rgba(255, 195, 0, 0.2)',
|
||
|
|
text: this.$t('form.personalData.financialInformation.bankStatus.unverified')
|
||
|
|
},
|
||
|
|
rejected: {
|
||
|
|
color: 'rgba(255, 87, 51, 1)',
|
||
|
|
bgc: 'rgba(255, 87, 51, 0.2)',
|
||
|
|
text: this.$t('form.personalData.financialInformation.bankStatus.rejected')
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
},
|
||
|
|
inject: ["showDialog"],
|
||
|
|
methods: {
|
||
|
|
showDialog(bank = {}) {
|
||
|
|
this.showDialog(bank);
|
||
|
|
},
|
||
|
|
getStatus() {
|
||
|
|
if (this.values.bank_standby_1 === 'B1') {
|
||
|
|
switch (Number(this.values.apply_status)) {
|
||
|
|
case 0:
|
||
|
|
return 'approved';
|
||
|
|
break;
|
||
|
|
case 1:
|
||
|
|
return 'pending';
|
||
|
|
break;
|
||
|
|
case 2:
|
||
|
|
return 'rejected';
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
switch (true) {
|
||
|
|
case Number(this.values.apply_status) === 0 && Number(this.values.verify_email) === 1:
|
||
|
|
return 'verified';
|
||
|
|
break;
|
||
|
|
case Number(this.values.apply_status) === 0 && Number(this.values.verify_email) === 0:
|
||
|
|
return 'unverified';
|
||
|
|
break;
|
||
|
|
case Number(this.values.apply_status) === 1:
|
||
|
|
return 'pending';
|
||
|
|
break;
|
||
|
|
case Number(this.values.apply_status) === 2:
|
||
|
|
return 'rejected';
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
async toVerify(bank) {
|
||
|
|
const res = await sendBankMail({ id: bank.id });
|
||
|
|
if (res && res.code === 0) {
|
||
|
|
this.$cusModal.showModal({
|
||
|
|
type: 'message',
|
||
|
|
status: 'success',
|
||
|
|
contentText: this.$t('form.personalData.financialInformation.saveBankStatus.B1_1')
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
@import './index.scss';
|
||
|
|
</style>
|