304 lines
6.2 KiB
Vue
304 lines
6.2 KiB
Vue
<script setup>
|
|
// 提现
|
|
|
|
import {
|
|
reactive,
|
|
ref
|
|
} from 'vue';
|
|
import {
|
|
onLoad,
|
|
onReady,
|
|
onUnload,
|
|
} from '@dcloudio/uni-app'
|
|
// 工具库
|
|
import util from '@/common/js/util';
|
|
// 接口
|
|
import api from '@/api/index.js';
|
|
|
|
// 表单
|
|
const form = reactive({
|
|
withdrawAmount: '',
|
|
})
|
|
// 提现方式列表
|
|
const typeList = reactive([{
|
|
key: 'alipay',
|
|
name: '支付宝',
|
|
confirm: (event) => getToAlipay(event)
|
|
}, {
|
|
key: 'wechat',
|
|
name: '微信',
|
|
confirm: (event) => getToWechat(event)
|
|
}, {
|
|
key: 'bank',
|
|
name: '银行卡',
|
|
confirm: (event) => getToBank(event)
|
|
}, ])
|
|
// 支付方式下标
|
|
const typeIndex = ref(0)
|
|
// 支付宝账号
|
|
const alipayAccount = ref('未绑定')
|
|
// 微信账号
|
|
const wechatAccount = ref('未绑定')
|
|
// 提现配置
|
|
const config = reactive({})
|
|
|
|
onLoad(() => {
|
|
// 获取已绑定的账号
|
|
getBindAccount()
|
|
// 获取提现配置
|
|
getPayConfig()
|
|
})
|
|
|
|
onUnload(() => {
|
|
// 移除监听
|
|
removeListener()
|
|
})
|
|
|
|
// 开启监听
|
|
function addListener() {
|
|
uni.$on('updateBindingAccount', () => {
|
|
// 获取已绑定的账号
|
|
getBindAccount()
|
|
})
|
|
}
|
|
|
|
// 移除监听
|
|
function removeListener() {
|
|
uni.$off('updateBindingAccount')
|
|
}
|
|
|
|
// 获取提现配置
|
|
function getPayConfig() {
|
|
api.mine.getPayConfig({}).then(rs => {
|
|
if (rs.code == 200) {
|
|
Object.assign(config, {}, rs.data)
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
})
|
|
}
|
|
|
|
// 获取已绑定的账号
|
|
function getBindAccount() {
|
|
api.mine.getBindAccount().then(rs => {
|
|
if (rs.code == 200) {
|
|
const result = rs.data
|
|
if (result.alipayId) alipayAccount.value = result.alipayId
|
|
if (result.wechatId) wechatAccount.value = result.wechatId
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
})
|
|
}
|
|
|
|
/**
|
|
* 切换下标
|
|
* @param {Object} ev 选择提现金额
|
|
*/
|
|
function handleTypeIndex(ev) {
|
|
const index = ev.detail.value
|
|
if (typeIndex.value === index) return
|
|
typeIndex.value = index
|
|
}
|
|
|
|
// 快速选择收款信息
|
|
function handleFast() {
|
|
// 银行取银行卡 微信 支付宝去我的绑定页面
|
|
}
|
|
|
|
/**
|
|
* 跳转
|
|
* @param {Object} url 跳转
|
|
*/
|
|
function link(url) {
|
|
uni.navigateTo({
|
|
url,
|
|
})
|
|
}
|
|
|
|
// 点击提现
|
|
function handleSubmit() {
|
|
if (!form.withdrawAmount) {
|
|
util.alert('提现金额不能为空')
|
|
return
|
|
}
|
|
if (form.withdrawAmount < config.minWithdrawalAmount) {
|
|
util.alert(`提现金额不能小于${config.minWithdrawalAmount}`)
|
|
return
|
|
}
|
|
//
|
|
typeList[typeIndex.value].confirm()
|
|
}
|
|
|
|
// 提现到支付宝
|
|
function getToAlipay() {
|
|
api.mine.getToAlipay({
|
|
query: {
|
|
account: alipayAccount.value,
|
|
withdrawAmount: form.withdrawAmount,
|
|
}
|
|
}).then(rs => {
|
|
if (rs.code == 200) {
|
|
// 提现回调
|
|
getToWalletCallback()
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
})
|
|
}
|
|
|
|
// 提现到微信
|
|
function getToWechat() {
|
|
util.alert('微信暂未开通，请联系管理员')
|
|
}
|
|
|
|
// 提现到银行卡
|
|
function getToBank() {
|
|
api.mine.getToBank({}).then(rs => {
|
|
if (rs.code == 200) {
|
|
// 提现回调
|
|
getToWalletCallback()
|
|
|
|
util.alert({
|
|
content: '已发起提现申请，请等待后台审核',
|
|
showCancel: false,
|
|
})
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
})
|
|
}
|
|
|
|
// 提现回调
|
|
function getToWalletCallback() {
|
|
// 获取钱包
|
|
util.getPurse()
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<view class="appbw">
|
|
<view class="form mtb30 mlr30 f32">
|
|
|
|
<view class="line">
|
|
<view class="key">提现金额</view>
|
|
<view class="value inputBox df aic">
|
|
<view class="c333 f40 b">￥</view>
|
|
<input type="text" v-model="form.withdrawAmount" placeholder="输入金额" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="line">
|
|
<view class="key rows">
|
|
<view>选择提现方式</view>
|
|
<view class="c999 f26" @click="handleFast" v-if="typeList[typeIndex].key === 'bank'">快速选择</view>
|
|
</view>
|
|
<picker :range="typeList" range-key="name" @change="handleTypeIndex">
|
|
<view class="value inputBox rows">
|
|
<view class="">{{typeList[typeIndex].name}}</view>
|
|
<uni-icons type="bottom" />
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
|
|
<!-- 银行卡 -->
|
|
<template v-if="typeList[typeIndex].key === 'bank'">
|
|
<view class="line">
|
|
<view class="key">银行名称</view>
|
|
<view class="value inputBox">
|
|
<input v-model="form.bank" placeholder="输入金额" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="line">
|
|
<view class="key">银行卡号</view>
|
|
<view class="value inputBox">
|
|
<input v-model="form.account" placeholder="输入金额" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<!-- 微信 -->
|
|
<template v-if="typeList[typeIndex].key === 'wechat'">
|
|
<view class="line">
|
|
<view class="key">微信号</view>
|
|
<view class="value inputBox">
|
|
<input v-model="form.wecaht" placeholder="输入金额" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<!-- 支付宝 -->
|
|
<template v-if="typeList[typeIndex].key === 'alipay'">
|
|
<view class="line">
|
|
<view class="key f1">支付宝账号</view>
|
|
|
|
<view class="value df aic inputBox" @click="link('/pages/mine/setting/binding')">
|
|
{{alipayAccount}}
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<!-- 温馨提示 -->
|
|
<view class="line notice ptb20 plr30 br20">
|
|
<view class="key">温馨提示</view>
|
|
<view class="content mt15 c333 f28">
|
|
<view>为保证账户资金安全，请仔细核对好填写信息，再申请提现</view>
|
|
<view>每次最低提现金额 {{config.minWithdrawalAmount}}</view>
|
|
<view>每次提现手续费 {{config.feeRate * 100}}%</view>
|
|
<view>每日最多提现次数 {{config.dailyWithdrawalLimit}}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="line">
|
|
<view class="btn pro black" @click="handleSubmit">提现</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- -->
|
|
<view class="fill"></view>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
// 表单
|
|
.form {
|
|
|
|
.line {
|
|
overflow: hidden;
|
|
margin: 40rpx 0;
|
|
|
|
.key {
|
|
font-size: 32rpx;
|
|
}
|
|
|
|
.value {
|
|
box-sizing: border-box;
|
|
margin-top: 15rpx;
|
|
padding: 10rpx 20rpx;
|
|
min-height: 80rpx;
|
|
}
|
|
}
|
|
|
|
//
|
|
.notice {
|
|
background-color: #ff888844;
|
|
|
|
.content {
|
|
color: #aa3333;
|
|
}
|
|
}
|
|
}
|
|
</style> |