bandhuBuy-uniapp/src/pages/wallet/withdraw.vue

<route lang="json5" type="page">
{
  layout: 'default',
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '%wallet.withdraw.title%',
  },
}
</route>

<script lang="ts" setup>
import { withdrawAdd } from '@/api/wallet'
import { t } from '@/locale'
import { formatNumber } from '@/utils'
import { getPageParams, goBack, toPage } from '@/utils/page'
import { toast } from '@/utils/toast'

defineOptions({
  name: 'Withdraw', // 提现
})
const userInfo = computed(() => {
  return getUserInfoHook()
})
const queryParams = ref<any>({})
// 表单数据
const formData = ref({
  amount: '',
  bank: userInfo.value.bank,
  bankAccountName: userInfo.value.bankAccountName,
  bankAccount: userInfo.value.bankAccount,
  channel: 1,
  currency: 1,
})
async function submit() {
  if (!formData.value.bank) {
    toast.info(t('wallet.withdraw.error.bankName'))
    return
  }
  if (!formData.value.bankAccountName) {
    toast.info(t('wallet.withdraw.error.bankAccountName'))
    return
  }
  if (!formData.value.bankAccount) {
    toast.info(t('wallet.withdraw.error.bankAccountNo'))
    return
  }
  if (!formData.value.amount) {
    toast.info(t('wallet.withdraw.error.amount'))
    return
  }
  const res = await withdrawAdd({ ...formData.value, accountType: queryParams.value.type })
  console.log(res)
}
onLoad((options) => {
  queryParams.value = getPageParams(options)
})
</script>

<template>
  <view class="min-h-100vh flex flex-col bg-#FEE750">
    <wd-navbar
      custom-class="bg-#FEE750!"
      :bordered="false"
      safe-area-inset-top placeholder fixed
      :title="t('wallet.withdraw.title')"
    >
      <template #left>
        <wd-icon name="thin-arrow-left" size="32rpx" @click="goBack" />
      </template>
      <template #right>
        <text class="text-28rpx" @click="toPage('/pages/wallet/withdrawRecord', { type: queryParams.type })">
          {{ $t('wallet.withdraw.record') }}
        </text>
      </template>
    </wd-navbar>
    <view class="px-28rpx pb-28rpx pt-40rpx">
      <view class="text-28rpx">
        {{ $t('wallet.withdraw.balance') }}
      </view>
      <view>
        <text class="text-28rpx">
          ৳
        </text>
        <text class="text-48rpx font-bold">
          {{ formatNumber(queryParams.balance) }}
        </text>
      </view>
    </view>
    <view class="flex-1 rounded-t-24rpx bg-white p-24rpx">
      <view class="mb-28rpx text-32rpx">
        {{ $t('wallet.withdraw.info') }}
      </view>
      <wd-form ref="form" :model="formData" custom-class="mb-28rpx">
        <view class="mb-40rpx space-y-32rpx">
          <wd-input
            v-model="formData.bank"
            :placeholder="t('wallet.withdraw.form.bankName')"
            no-border
            custom-class="bandhu-auth-input-field"
            :readonly="userInfo.bank"
          />
          <wd-input
            v-model="formData.bankAccountName"
            :placeholder="t('wallet.withdraw.form.bankAccountName')"
            no-border
            custom-class="bandhu-auth-input-field"
            :readonly="userInfo.bankAccountName"
          />
          <wd-input
            v-model="formData.bankAccount"
            :placeholder="t('wallet.withdraw.form.bankAccountNo')"
            no-border
            custom-class="bandhu-auth-input-field"
            :readonly="userInfo.bankAccountName"
          />
          <view class="flex items-center gap-20rpx">
            <wd-input
              v-model="formData.amount"
              :placeholder="t('wallet.withdraw.form.amount')"
              no-border
              custom-class="flex-1 bandhu-auth-input-field"
            />
            <wd-button
              type="error"
              plain
              custom-class="bandhu-auth-secondary-btn"
              @click="formData.amount = queryParams.balance"
            >
              {{ $t('wallet.withdraw.form.allAmount') }}
            </wd-button>
          </view>
        </view>
        <wd-button plain block custom-class="h-80rpx!" @click="submit">
          {{ $t('wallet.withdraw.form.submit') }}
        </wd-button>
      </wd-form>
      <view class="text-24rpx text-#5A5A5A line-height-48rpx">
        {{ $t('wallet.withdraw.notes.title') }}
        <br>
        {{ $t('wallet.withdraw.notes.1') }}
        <br>
        {{ $t('wallet.withdraw.notes.2') }}
        <br>
        {{ $t('wallet.withdraw.notes.3') }}
        <br>
        {{ $t('wallet.withdraw.notes.4') }}
        <br>
        {{ $t('wallet.withdraw.notes.5') }}
      </view>
    </view>
  </view>
</template>

<style lang="scss" scoped>
//
</style>