frontend-app/pages/rwa_package/rwa_withdrawal/rwa_withdrawal.vue

<template>
	<view class="rwa_withdrawal">
		<Header leftTitle="提现" left-path-type="navigateTo" left-path="/pages/rwa_package/rwa/rwa" rightTitle="记录"
			rightPath="/pages/rwa_package/rwa_withdrawal_log/rwa_withdrawal_log?back=withdrawal" rightPathType="navigateTo" />
		<view class="rwa_withdrawal_content">
			<view class="_content">
				<view class="_content_usdt">
					<view>{{ categotyObj.name || 'USDT' }}</view>
					<view>{{ categotyObj.curAmount || 0 }}</view>
				</view>
				<view class="_content_item">
					<view class="_content_item_title">提现金额</view>
					<up-input placeholder="请输入提现金额" border="surround" v-model="form.amount" :customStyle="inputCss"></up-input>
					<view class="_content_item_msg">当前可提现余额 {{ categotyObj.curAmount || 0 }} {{ categotyObj.name || 'USDT' }}
					</view>
				</view>
				<view class="_content_item" @click="accountShowCheck(true)">
					<view class="_content_item_title">提现账户</view>
					<view class="_content_item_account">
						<view v-if="accountName">{{ accountName }}</view>
						<view v-else style="color: #30313363;">请选择提现账户</view>
						<up-image src="/static/common/right.png" width="20" height="20" bgColor="#f1f6ff00" />
					</view>
				</view>
				<view class="_content_item">
					<view class="_content_item_title">交易密码<text class="_content_item_setting_pwd"
							@click="jumpSettingPwd">(前往设置交易密码)</text></view>
					<up-input placeholder="请输入交易密码" border="surround" v-model="form.password" :customStyle="inputCss"></up-input>
				</view>
				<view class="_content_item">
					<view class="_content_item_title">备注</view>
					<up-input placeholder="请输入备注(可选)" border="surround" v-model="form.remark" :customStyle="inputCss"></up-input>
				</view>
			</view>
			<view class="add_but_css" @click="addWithdrawal">
				提交
			</view>
		</view>
		<up-picker :show="accountShow" :columns="accountOption" keyName="account" itemHeight="34" @confirm="accountConfirm"
			:loading="accountLoading" @close="accountShowCheck(false)" @cancel="accountShowCheck(false)"></up-picker>
		<up-toast ref="uToastRef"></up-toast>
	</view>
</template>

<script>
import Header from '@/components/header.vue';
import { getSupportBank } from '@/api/common.js';
import { getAcctBalance, exchTransfer, getExchUsers } from '@/api/finance.js';

export default {
	components: { Header },
	data() {
		return {
			categotyObj: {},// 可提现金额
			inputCss: {
				"height": '80rpx',
				"background": "#F5F5F5",
				"border-radius": "20rpx",
				"border": "0rpx",
				"padding-left": "16px",
			},
			form: {
				category: "vcoin",
				amount: '',
				password: '',
				acctId: '',
				remark: '',
			},
			accountName: null,
			accountShow: false,
			accountOption: [],
			accountLoading: false,
		};
	},
	onShow() {
		this.getAcctBalance();
	},
	methods: {
		// 查询余额
		async getAcctBalance() {
			const resp = await getAcctBalance();
			let data = {};
			if (resp && resp.bizcode === 100) {
				if (resp.data) {
					resp.data.map(item => {
						// 交易币
						if (item.categoty === "vcoin") {
							data = item;
						}
					})
				}
			}
			this.categotyObj = data;
		},
		async addWithdrawal() {
			const params = this.form;
			if (!params.amount) {
				this.$refs.uToastRef.show({
					type: 'error',
					message: "请输入提现金额",
				});
				return;
			}
			if (!params.acctId) {
				this.$refs.uToastRef.show({
					type: 'error',
					message: "请选择提现账户",
				});
				return;
			}
			if (!params.password) {
				this.$refs.uToastRef.show({
					type: 'error',
					message: "请输入交易密码",
				});
				return;
			}
			console.log("params", params);
			const resp = await exchTransfer(params);
			if (resp && resp.bizcode === 100) {
				this.$refs.uToastRef.show({
					type: 'success',
					message: "提交成功",
				});
				setTimeout(() => {
					uni.navigateTo({
						url: '/pages/rwa_package/rwa/rwa',
					})
				}, 2000)
			}
		},
		// 选择账户的弹框
		async accountShowCheck(status) {
			if (status) {
				this.accountLoading = true;
				const params = {
					page: 1,
					pageSize: 99,
				}
				const resp = await getExchUsers(params);
				if (resp && resp.bizcode === 100) {
					this.accountOption = [resp.data.entitys] || [];
				}
				this.accountLoading = false;
			} else {
				this.accountOption = [[]];
			}
			this.accountShow = status;
		},
		// 提交
		accountConfirm(e) {
			const {
				columnIndex,
				value,
				values,
				index,
			} = e;
			if (!value || value.length === 0) {
				this.$refs.uToastRef.show({
					type: 'error',
					message: "请先选择账户",
				});
				return;
			}
			const data = value[0];
			this.form.acctId = data.id;
			this.accountName = data.account;
			this.accountShowCheck(false);
		},
		// 设置交易密码
		jumpSettingPwd() {
			uni.navigateTo({
				url: '/pages/mine_package/mine_transaction_password/mine_transaction_password',
			})
		}
	}
}
</script>

<style lang="scss">
.rwa_withdrawal {
	background: #F5F5F5;

	.rwa_withdrawal_content {
		padding: 20rpx;
		height: calc(100vh - 198rpx);

		._content {
			padding: 30rpx;
			background: #FFFFFF;
			border-radius: 24rpx;
			margin-bottom: 60rpx;

			._content_usdt {
				display: flex;
				justify-content: space-between;
				font-weight: bold;
				font-size: 30rpx;
				color: #333333;
				border-bottom: 2rpx solid #EEEEEE;
				padding: 0 0 20rpx;
			}

			._content_item {
				margin-top: 30rpx;

				._content_item_title {
					margin-bottom: 20rpx;
					font-weight: bold;
					font-size: 30rpx;
					color: #333333;
				}

				._content_item_setting_pwd {
					color: $app-zt-color;
					cursor: pointer;
					text-decoration: underline;
					font-size: 26rpx;
					margin-left: 10rpx;
				}

				._content_item_msg {
					font-weight: 500;
					font-size: 24rpx;
					color: #808080;
					margin-top: 16rpx;
				}

				._content_item_account {
					display: flex;
					justify-content: space-between;
					align-items: center;
					background: #F8F8F8;
					border-radius: 20rpx;
					padding: 30rpx 20rpx;
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
				}
			}
		}
	}
}
</style>