创作者微信小程序端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

407 lines
10 KiB

<template>
<view class="page-bg">
<view class="main-container">
<view class="withdraw-input-box">
<view class="withdraw-title">提现金额</view>
<view class="input-box">
¥ <input type="text" placeholder="输入金额" placeholder-class="pch"
class="input-value" @blur="checkAmt()" value="" v-model="amt"/>
</view>
<view class="withdraw-amount">当前余额为¥{{userInfo.amt}} </view>
<view class="withdraw-amount-tip">小贴士:提现金额不少于1元 </view>
</view>
<view class="error-message" v-if="checkFlag == true">输入金额超过当前余额</view>
<view class="withdraw-title tl-title-margin">选择提现至</view>
<view class="withdraw-account-list">
<radio-group @change="radioChange" :style="'width: 100%'">
<label v-for="(item, index) in creatorAccountList" :key="index">
<view class="withdrawBox">
<view class="withdrawBox-title">
<view class="account-icon" v-if="item.type == '0'">
<uni-icons custom-prefix="iconfont" :type="payType[0].icon" size="20" :color="payType[0].color" ></uni-icons>
</view>
<view class="account-icon" v-if="item.type == '1'">
<uni-icons custom-prefix="iconfont" :type="payType[1].icon" size="20" :color="payType[1].color" ></uni-icons>
</view>
<view class="account-icon" v-if="item.type == '2'">
<uni-icons custom-prefix="iconfont" :type="payType[2].icon" size="20" :color="payType[2].color" ></uni-icons>
</view><!-- 0->微信 1->银行卡 2->支付宝 -->
<view class="account-title" v-if="item.type == '0'">
{{payType[0].title}} {{item.accountNo}}
</view>
<view class="account-title" v-if="item.type == '1'">
{{payType[1].title}} {{item.accountNo}}
</view>
<view class="account-title" v-if="item.type == '2'">
{{payType[2].title}} {{item.accountNo}}
</view>
</view>
<view>
<radio :value="JSON.stringify(item)" color="#0b6375" :checked="item.isUse === '1'" class="radioStyle"/>
<!-- <uni-data-checkbox v-model="item" :localdata="range" @change="change"></uni-data-checkbox> -->
</view>
</view>
</label>
</radio-group>
</view>
<view class="tl-footer">
<button class="withdraw-btn" @click="$noMultipleClicks(withdraw)">提现</button>
</view>
</view>
</view>
</template>
<script>
import {
getWithdrawList,getCreatorAccount,
checkWithdraw,withdraw,
getCreatorInfo
} from '@/api/userInfo.js'
export default {
data() {
return {
amt: '',
userInfo: {},
checkFlag: false,
noClick:true, //防止重复提交
creatorAccountList:[],
accountNo: '',
type: '',
current: 0,
payType: [
{
icon: 'icon-weixin',
title: '微信',
color: '#15ba11'
},
{
icon: 'icon-yinhangka',
title: '银行卡',
color: '#0b6375'
},
{
icon: 'icon-zhifubao',
title: '支付宝',
color: '#027aff'
}
],
}
},
created() {
const userInfo = uni.getStorageSync('userInfo')
if (!userInfo) {
console.log('havent userInfo')
uni.showModal({
content: '艺术家账户过期,请重新登录!',
showCancel: false,
success() {
//没有缓存则跳转登录页面
uni.reLaunch({
url: '/pages/login/login'
});
}
});
} else {
this.userInfo = userInfo;
console.log('have userInfo')
this.getCreatorAccount();
}
},
methods: {
// 查询艺术家账户列表
async getCreatorAccount() {
let that = this;
const res = await getCreatorAccount(that.userInfo.id)
console.log('res', res)
if (res.data.code === 200) {
that.creatorAccountList.push(...res.data.data)
for (let param of res.data.data) {
if(param.isUse === '1'){
that.accountNo = param.accountNo;
that.type = param.type;
}
}
console.log('creatorAccountList', that.creatorAccountList)
} else {
uni.showModal({
content: '获取艺术家账户列表数据加载失败!',
showCancel: false
});
}
},
radioChange: function(evt) {
const param = JSON.parse(evt.detail.value);
let that = this;
that.type = param.type;
that.accountNo = param.accountNo;
},
//检查是否超出余额
checkAmt:function(){
let that = this;
if(parseFloat(that.amt) > parseFloat(that.userInfo.amt)){
that.checkFlag = true;
}else{
that.checkFlag = false;
}
},
//提现
async withdraw(){
let that = this;
console.log('点击了提现,金额为',that.type)
if(that.amt == null || that.amt == ''){
uni.showModal({
content: '请输入提现金额!',
showCancel: false
});
}
if(that.checkFlag == true){
console.log('that.checkFlag',that.checkFlag)
uni.showModal({
content: '输入金额超过可提现余额!',
showCancel: false
});
}else{
//校验服务器是否可以提现
const param = {
creatorId: that.userInfo.id,
amt: that.amt
}
const checkRes = await checkWithdraw(param);
if(checkRes.data.code === 200){
if(checkRes.data.data === true){
//可提现
const withdrawParam = {
creatorId: that.userInfo.id,
amt: that.amt,
accountNo: that.accountNo,
channel: that.type
}
const withdrawRes = await withdraw(withdrawParam);
if(withdrawRes.data.code === 200){
//更新艺术家缓存
const creatorInfo = await getCreatorInfo(that.userInfo.id);
console.log('creatorInfo',creatorInfo)
if(creatorInfo.data.code === 200){
uni.setStorage({
key: 'userInfo',
data: creatorInfo.data.data,
success() {
uni.showModal({
title: '提示',
content: '发起提现成功,请等待审核!',
showCancel: false,
success() {
uni.reLaunch({
url: '/pages-userInfo/withdraw/withdrawIndex'
});
}
});
}
})
}else{
uni.showModal({
content: '获取艺术家信息失败!',
showCancel: false
});
}
}else{
uni.showModal({
content: '发起提现申请失败!',
showCancel: false
});
}
}else{
//不可提现
uni.showModal({
content: '输入金额超过可提现余额!',
showCancel: false
});
}
}else{
uni.showModal({
content: '检查艺术家是否可提现失败!',
showCancel: false
});
}
// await checkWithdraw(param).then(res =>{
// if(res.data.code === 200){
// if(res.data.data === true){
// //可提现
// const withdrawParam = {
// creatorId: that.userInfo.id,
// amt: that.amt,
// accountNo: that.accountNo,
// channel: that.type
// }
// await withdraw(withdrawParam).then(resp =>{
// if(res.data.code === 200){
// uni.showToast({
// title: '发起提现成功,请等待审核!',
// duration: 2000,
// success() {
// uni.reLaunch({
// url: '/pages-userInfo/withdraw/withdrawIndex'
// });
// }
// });
// }else{
// uni.showModal({
// content: '发起提现申请失败!',
// showCancel: false
// });
// }
// })
// }else{
// //不可提现
// uni.showModal({
// content: '输入金额超过可提现余额!',
// showCancel: false
// });
// }
// }else{
// uni.showModal({
// content: '检查艺术家是否可提现失败!',
// showCancel: false
// });
// }
// })
}
}
}
}
</script>
<style lang="scss" scoped>
.page-bg {
.main-container {
width: 670rpx;
margin: 0 auto;
display: flex;
flex-direction: column;
margin-top: 36rpx;
}
}
.withdraw-input-box{
width: 590rpx;
padding: 40rpx;
background: $uni-bg-base-color;
border-radius: 10rpx;
}
.withdraw-title{
font-size: 28rpx;
font-weight: 400;
color: $uni-white;
}
.withdraw-amount{
font-size: 28rpx;
font-weight: 400;
color: $uni-secondary-color;
margin-top: 18rpx;
}
.withdraw-amount-tip{
font-size: 28rpx;
font-weight: 400;
color: $uni-white;
margin-top: 18rpx;
}
.input-box {
height: 100rpx;
width: 590rpx;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 60rpx;
font-weight: bold;
color: $uni-white;
opacity: 1;
border-bottom: 2rpx solid $uni-secondary-color;;
}
.input-box .input-value {
flex: 1 auto;
margin-left: 10rpx;
height: 80rpx;
}
.tl-flex-row{
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
text-align: center;
}
.withdraw-account-list{
width: 590rpx;
padding: 40rpx;
background: $uni-bg-base-color;
border-radius: 10rpx;
}
.tl-title-margin{
margin: 20rpx 0;
}
.error-message{
font-size: 26rpx;
font-weight: 400;
color: #E04646;
margin: 20rpx 0 0;
}
.tl-text{
width: 450rpx;
display: -webkit-box; /*弹性伸缩盒子模型显示*/
-webkit-box-orient: vertical; /*排列方式*/
-webkit-line-clamp: 1; /*显示文本行数(这里控制多少行隐藏)*/
overflow: hidden; /*溢出隐藏*/
}
.withdrawBox{
display: flex;
justify-content: space-between;
align-items: center;
margin: 20rpx 0;
.withdrawBox-title {
display: flex;
align-items: center;
line-height: 48rpx;
}
.account-icon {
height: 48rpx;
width: 48rpx;
text-align: center;
margin-right: 20rpx;
}
.account-title {
font-size: 26rpx;
color: $uni-white;
}
}
.tl-footer{
margin-top: 120rpx;
}
.withdraw-btn {
color: $uni-btn-text-color;
}
</style>