创作者微信小程序端
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.
 
 
 
 

450 lines
11 KiB

<template>
<view class="page-bg">
<view class="main-container">
<view class="tl-panel">
<view class="tl-font-28-29">提现金额</view>
<view class="input-box">
¥ <input type="text" placeholder="输入金额" placeholder-class="pch"
class="input-value" @blur="checkAmt()" value="" v-model="amt"/>
</view>
<view class="tl-font-28-9b">当前余额为¥{{userInfo.amt}} </view>
<view class="tl-font-28-9b">小贴士:提现金额不少于1元 </view>
</view>
<view class="tl-red tl-title-62" v-if="checkFlag == true">输入金额超过当前余额</view>
<view class="tl-font-28-29 tl-title-60">选择提现至</view>
<view class="tl-panel-2 tl-flex-row">
<radio-group @change="radioChange">
<label v-for="(item, index) in creatorAccountList" :key="index">
<view class="withdrawBox">
<view v-if="item.type == '0'">
<image :src="payType[0].icon" class="tl-img-76"></image>
</view>
<view v-if="item.type == '1'">
<image :src="payType[1].icon" class="tl-img-76"></image>
</view>
<view v-if="item.type == '2'">
<image :src="payType[2].icon" class="tl-img-76"></image>
</view><!-- 0->微信 1->银行卡 2->支付宝 -->
<view class="tl-font-28-34 tl-name" v-if="item.type == '0'">{{payType[0].title}} {{item.accountNo}}</view>
<view class="tl-font-28-34 tl-name" v-if="item.type == '1'">{{payType[1].title}} {{item.accountNo}}</view>
<view class="tl-font-28-34 tl-name" v-if="item.type == '2'">{{payType[2].title}} {{item.accountNo}}</view>
<view>
<radio :value="JSON.stringify(item)" color="#F2C827" :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="tl-btn-686 tl-font-28-29" @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: '/static/wxPay.png',
title: '微信',
},
{
icon: '/static/wxPay.png',
title: '银行卡',
},
{
icon: '/static/aliPay.png',
title: '支付宝',
}],
}
},
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">
.page-bg {
width: 100vw;
height: 100vh;
overflow: hidden;
background-size: 750rpx auto;
background-color: #F7F7F7;
}
.main-container {
width: 686rpx;
margin: 0 auto;
display: flex;
flex-direction: column;
margin-top: 36rpx;
}
.tl-panel{
width: 686rpx;
height: 296rpx;
padding: 32rpx;
background: #FFFFFF;
border-radius: 8rpx;
}
.tl-font-28-29{
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #292929;
}
.tl-font-28-9b{
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #9B9B9B;
margin-top: 18rpx;
}
.tl-font-32-29{
font-size: 32rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #292929;
}
.input-box {
height: 100rpx;
width: 650rpx;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 60rpx;
font-family: PingFang SC;
font-weight: bold;
color: #43413C;
opacity: 1;
border-bottom: 2rpx solid #E7E9EE;;
}
.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;
}
.tl-panel-2{
width: 686rpx;
padding: 32rpx;
background: #FFFFFF;
border-radius: 8rpx;
}
.tl-title-60{
margin: 30rpx 0 20rpx 0;
}
.tl-title-62{
margin: 25rpx 0 30rpx 0;
}
.tl-panel-card{
width: 194rpx;
height: 136rpx;
line-height: 136rpx;
background: #F7F7F7;
border-radius: 8rpx;
}
.active{
background: #FEF5DD;
border-radius: 8rpx;
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #F2C827;
}
.tl-footer{
margin-top: 120rpx;
}
.tl-btn-686{
width: 686rpx;
height: 88rpx;
line-height: 88rpx;
background: #185dff;
border-radius: 8rpx;
color:white;
}
.tl-blue{
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #2793F2;
}
.tl-img-76{
width: 76rpx;
height: 76rpx;
border-radius: 38rpx;
}
.tl-red{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #E04646;
}
/*** 模态框 ***/
.tl-flex-row{
display: flex;
justify-content: space-between;
align-items: center;
}
.tl-line-down{
border-bottom: 2rpx solid #EAEAEA;
margin: 60rpx 0 20rpx 0;
padding-bottom: 30rpx;
}
.tl-line-16{
width: 748rpx;
height: 16rpx;
background: #F7F7F7;
}
.tl-font-60-02{
font-size: 60rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #020202;
}
.tl-font-24-9b{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #9B9B9B;
}
.ml-12{
margin-left: 12rpx;
}
.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: 40rpx 40rpx 20rpx 10rpx;
}
.radioStyle{
margin-left: 200rpx;
}
</style>