<template> 
 | 
  <ContentScrollView :paddingH="false"> 
 | 
    <div class="withdraw-result-step-wrapper"> 
 | 
      <div class="withdraw-result-step-title">余额提现</div> 
 | 
      <nut-steps 
 | 
        class="withdraw-result-step-content" 
 | 
        progress-dot 
 | 
        direction="vertical" 
 | 
        :current="2" 
 | 
      > 
 | 
        <nut-step title="发起提现" :content="dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')"> 
 | 
        </nut-step> 
 | 
        <nut-step 
 | 
          title="机构处理中" 
 | 
          :content="`预计${dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')}前到账`" 
 | 
        > 
 | 
          <template #icon> 
 | 
            <img class="withdraw-result-step-icon-wait" :src="IconWalletStepWait" alt="" /> 
 | 
          </template> 
 | 
        </nut-step> 
 | 
        <nut-step title="提现到账" :content="dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')"> 
 | 
        </nut-step> 
 | 
      </nut-steps> 
 | 
    </div> 
 | 
    <List> 
 | 
      <ListItem title="提现单号" :show-arrow="false"> 
 | 
        <template #extra> 
 | 
          <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
        </template> 
 | 
      </ListItem> 
 | 
      <ListItem title="提现金额" :show-arrow="false"> 
 | 
        <template #extra> 
 | 
          <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
        </template> 
 | 
      </ListItem> 
 | 
      <ListItem title="提现方式" :show-arrow="false"> 
 | 
        <template #extra> 
 | 
          <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
        </template> 
 | 
      </ListItem> 
 | 
      <template v-if="walletType === 'alipay'"> 
 | 
        <ListItem title="支付宝户名" :show-arrow="false"> 
 | 
          <template #extra> 
 | 
            <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
          </template> 
 | 
        </ListItem> 
 | 
        <ListItem title="支付宝账号" :show-arrow="false"> 
 | 
          <template #extra> 
 | 
            <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
          </template> 
 | 
        </ListItem> 
 | 
      </template> 
 | 
      <template v-if="walletType === 'bank'"> 
 | 
        <ListItem title="银行卡号" :show-arrow="false"> 
 | 
          <template #extra> 
 | 
            <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
          </template> 
 | 
        </ListItem> 
 | 
        <ListItem title="开户行" :show-arrow="false"> 
 | 
          <template #extra> 
 | 
            <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
          </template> 
 | 
        </ListItem> 
 | 
      </template> 
 | 
      <ListItem title="服务费" :show-arrow="false"> 
 | 
        <template #extra> 
 | 
          <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
        </template> 
 | 
      </ListItem> 
 | 
      <ListItem title="实际到账" :show-arrow="false"> 
 | 
        <template #extra> 
 | 
          <div class="income-detail-info-value">{{ '5893485943859843095843' }}</div> 
 | 
        </template> 
 | 
      </ListItem> 
 | 
    </List> 
 | 
  </ContentScrollView> 
 | 
  <PageFooter> 
 | 
    <PageFooterBtn type="primary" @click="handleConfirm">完成</PageFooterBtn> 
 | 
  </PageFooter> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
import { List, ListItem } from '@12333/components'; 
 | 
import dayjs from 'dayjs'; 
 | 
import IconWalletStepWait from '@/assets/wallet/icon-wallet-step-wait.png'; 
 | 
  
 | 
defineOptions({ 
 | 
  name: 'InnerPage', 
 | 
}); 
 | 
  
 | 
const walletType = ref('alipay'); 
 | 
  
 | 
async function handleConfirm() { 
 | 
  try { 
 | 
  } catch (error) {} 
 | 
} 
 | 
</script> 
 | 
  
 | 
<style lang="scss"> 
 | 
@import '@/styles/common.scss'; 
 | 
  
 | 
.withdrawResult-page-wrapper { 
 | 
  .withdraw-result-step-wrapper { 
 | 
    padding: 20px 60px; 
 | 
  
 | 
    .withdraw-result-step-title { 
 | 
      font-size: 32px; 
 | 
      font-weight: bold; 
 | 
      text-align: center; 
 | 
      margin-bottom: 40px; 
 | 
    } 
 | 
  
 | 
    .withdraw-result-step-content { 
 | 
      .nut-step-main { 
 | 
        margin-bottom: 20px; 
 | 
      } 
 | 
  
 | 
      .withdraw-result-step-icon-wait { 
 | 
        width: 40px; 
 | 
        height: 40px; 
 | 
      } 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</style> 
 |