<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> 
 | 
      <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> 
 | 
    </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> 
 |