<template>
|
<ContentScrollView :paddingH="false">
|
<nut-form :model-value="form" ref="formRef" :rules="rules">
|
<nut-form-item label="提现金额:" class="bole-form-item" prop="name">
|
<nut-input v-model.trim="form.name" placeholder="请输入提现金额" />
|
</nut-form-item>
|
<div class="withdraw-divider">
|
<div class="withdraw-divider-text">{{ `当前账户余额${'188.88'}元，` }}</div>
|
<div class="withdraw-divider-btn">全部提现</div>
|
</div>
|
<nut-form-item label-width="0" class="bole-form-item">
|
<nut-radio-group class="withdraw-form-wrapper" v-model="form.alipay">
|
<div class="withdraw-form-item">
|
<nut-radio label="alipay"> {{ '提现到支付宝' }} </nut-radio>
|
<img :src="IconWalletAlipay" class="withdraw-icon" />
|
</div>
|
<div class="withdraw-form-item">
|
<nut-radio label="wechat"> {{ '提现到微信' }} </nut-radio>
|
<img :src="IconWalletWechat" class="withdraw-icon" />
|
</div>
|
<div class="withdraw-form-item">
|
<nut-radio label="bank"> {{ '提现到银行卡' }} </nut-radio>
|
<img :src="IconWalletBank" class="withdraw-icon" />
|
</div>
|
</nut-radio-group>
|
</nut-form-item>
|
<template v-if="form.alipay === 'alipay'">
|
<nut-form-item label="支付宝户名:" class="bole-form-item" prop="name">
|
<nut-input readonly v-model.trim="form.name" placeholder="请输入支付宝户名" />
|
</nut-form-item>
|
<!-- <nut-form-item label="身份证号:" class="bole-form-item" prop="name">
|
<nut-input readonly v-model.trim="form.name" placeholder="请输入身份证号" />
|
</nut-form-item> -->
|
<nut-form-item label="支付宝账号:" class="bole-form-item" prop="phoneNumber">
|
<nut-input v-model.trim="form.name" placeholder="请输入支付宝账号/手机号" />
|
</nut-form-item>
|
</template>
|
</nut-form>
|
</ContentScrollView>
|
<PageFooter>
|
<PageFooterBtn type="plain" @click="goBack">取消</PageFooterBtn>
|
<PageFooterBtn type="primary" @click="handleConfirm">确认提现</PageFooterBtn>
|
</PageFooter>
|
</template>
|
|
<script setup lang="ts">
|
import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types';
|
import IconWalletAlipay from '@/assets/wallet/icon-wallet-alipay.png';
|
import IconWalletWechat from '@/assets/wallet/icon-wallet-wechat.png';
|
import IconWalletBank from '@/assets/wallet/icon-wallet-bank.png';
|
import { goBack } from '@/utils';
|
import Taro from '@tarojs/taro';
|
|
defineOptions({
|
name: 'InnerPage',
|
});
|
|
const form = reactive({
|
name: '',
|
alipay: 'alipay',
|
});
|
|
const rules = reactive<FormRules>({
|
name: [{ required: true, message: '请输入' }],
|
});
|
|
const formRef = ref<any>(null);
|
function handleConfirm() {
|
Taro.navigateTo({
|
url: `${RouterPath.withdrawResult}`,
|
});
|
// if (!formRef.value) return;
|
// formRef.value.validate().then(({ valid, errors }: any) => {
|
// if (valid) {
|
// confirm();
|
// }
|
// });
|
}
|
|
async function confirm() {
|
try {
|
} catch (error) {}
|
}
|
</script>
|
|
<style lang="scss">
|
@import '@/styles/common.scss';
|
|
.withdraw-page-wrapper {
|
.withdraw-divider {
|
display: flex;
|
align-items: center;
|
font-size: 28px;
|
color: boleGetCssVar('text-color', 'secondary');
|
padding: 20px 40px;
|
|
.withdraw-divider-btn {
|
color: boleGetCssVar('color', 'primary');
|
}
|
}
|
|
.withdraw-form-wrapper {
|
width: 100%;
|
|
.withdraw-form-item {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding-right: 40px;
|
margin-bottom: 12px;
|
|
&:last-child {
|
margin-bottom: 0;
|
}
|
|
.withdraw-icon {
|
width: 36px;
|
height: 36px;
|
display: inline-block;
|
}
|
}
|
}
|
}
|
</style>
|
