video_app/me/invite/cashDetail.vue

532 lines
16 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="cash">
<view
style="background-color: #ff7581;height: 400upx;border-bottom-right-radius: 40upx;border-bottom-left-radius: 40upx;">
<view style="font-size: 32upx;color: #FFFFFF;padding-top: 100upx;">可提现总额</view>
<view style="font-size: 40upx;color: #FFFFFF;padding-top: 20upx;">¥ {{ mayMoney }}</view>
<view
style="width: 90%;height: max-content;margin-left: 40upx;background-color: #FFFFFF;box-shadow: rgba(183, 183, 183, 0.3) 0px 1px 10px;margin-top: 50upx;border-radius: 20upx;">
<view style="display: flex;flex-direction: row;padding: 20upx;">
<view style="font-size: 32upx;color: #333333;">提现金额
<!-- <text style="font-size: 28upx;color: #ff7581;"
v-if="shouxufei">(注:提现手续费为{{shouxufei * 100}}%</text> -->
</view>
</view>
<view
style="display: flex;flex-direction: row;padding: 20upx;justify-content: space-between;align-items: center;">
<view style="display: flex;align-items: center;">
<view style="font-size: 40upx;color: #333333;">¥</view>
<input type="number" v-model="money" placeholder="请输入金额" @input="moneyInput" @blur="moneyBlur"
style="font-size: 40upx;color: #333333;text-align: left;margin-left: 10upx;width: 80%;"/>
</view>
<view @click="setAllMoney"
style="font-size: 30rpx;color: #333333;background: #ff7581;color: white;border-radius: 10rpx;padding: 7rpx 15rpx;flex-shrink: 0;">
全部
</view>
</view>
<view style="background: #E6E6E6;width: 100%;height: 1upx;"></view>
<!-- <view style="display: flex;flex-direction: row;flex-wrap: wrap;">
<view style="display: flex;flex-direction: row;" v-for="(item, index) in moneyList" :key="index">
<view>
<view style="padding: 20upx;" @click="getOut1(item.money)">
<view
style="padding-top: 40upx;width: 180upx; height: 120upx;background-color: #FFFFFF;border:1px solid #ff7581;border-radius: 10upx;">
{{ item.money }}
</view>
</view>
</view>
</view>
</view> -->
</view>
<view @click="getOut"
style="margin: 32upx;font-size: 18px;background: #ff7581;color: white;border-radius: 10px;height: 40px;line-height: 40px;">
提现
</view>
<view style="display: flex;width: 100%;justify-content: center;">
<view class="u-flex-1" style="color: grey;padding-bottom: 30px;padding-top: 20upx;" @click="goZhifuBao">
提现账号
</view>
<view class="u-flex-1" style="color: grey;padding-bottom: 30px;padding-top: 20upx;" @click="goqianbao">
红包明细
</view>
<!-- <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;width: 33%;" @click="gojilu">提现记录
</view> -->
</view>
<view style="text-align: left" class="moneyList u-p-b-30">
<view v-if="list.length" v-for="(item, index) in list" :key="index" class="item">
<view>
<view style="margin-bottom: 8upx;text-align: right;">
<text style="margin-bottom: 8upx;color: green" v-if="item.state===1"> 提现成功</text>
<text style="margin-bottom: 8upx;color: green" v-if="item.state===0"> 提现中</text>
<text style="margin-bottom: 8upx;color: #FD6416" v-if="item.state===-1||item.state===2">
提现失败
</text>
</view>
<view style="color: #999999;font-size: 28upx;">
<view style="margin-bottom: 8upx"> 收款人账号:{{ item.zhifubao }}</view>
<view style="margin-bottom: 8upx"> 收款人姓名:{{ item.zhifubaoName }}</view>
<view style="margin-bottom: 8upx"> 发起时间:{{ item.createAt }}</view>
<view style="margin-bottom: 8upx" v-if="item.state===1">成功时间 {{ item.outAt }}</view>
<view style="margin-bottom: 8upx;color: #FD6416" v-if="item.state===-1||item.state===2">
失败原因:{{ item.refund }}
</view>
<view style="margin-bottom: 8upx;text-align: right;">
<!-- 提现金额: -->
<text style="color: #FD6416;font-size: 32upx;font-weight: 600"> ¥{{ item.money }}</text>
</view>
</view>
</view>
</view>
<view class="page-box" v-if="!list.length">
<view class="centre">
<image src="../../static/images/learn/none.png" mode=""></image>
<view class="tips">
暂无记录
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
money: '',
mayMoney: '0',
shouxufei: '',
moneyList: [{
money: '10'
},
{
money: '20'
},
{
money: '50'
},
{
money: '100'
},
{
money: '200'
},
{
money: '500'
}
],
value: 0,
min: '',
token: '',
userId: '',
zhifubao: '',
zhifubaoName: '',
list: [],
page: 1,
limit: 10,
totalCount: 0,
};
},
onLoad() {
this.getExtractFei();
this.getMoneyDetail();
},
onShow() {
this.token = uni.getStorageSync('token')
this.userId = uni.getStorageSync('userId')
this.zhifubao = uni.getStorageSync('zhiFuBao')
this.zhifubaoName = uni.getStorageSync('zhiFuBaoName')
this.getcashMoney()
},
onReachBottom: function () {
if (this.page * this.limit < this.totalCount) {
this.page = this.page + 1;
this.getMoneyDetail();
}
},
onPullDownRefresh: function () {
this.page = 1;
// that.list = []
this.getMoneyDetail();
},
onNavigationBarButtonTap() {
// this.list();
},
methods: {
moneyInput(e) {
let num = e.detail.value.match(/^\d*(\.?\d{0,2})/g)[0] || null;
this.$nextTick(() => {
this.money = num;
});
},
moneyBlur(e) {
let num = e.detail.value.match(/^\d*(\.?\d{0,2})/g)[0] || null;
this.$nextTick(() => {
this.money = num;
});
},
setAllMoney() {
this.money = Math.floor(this.mayMoney * 100) / 100
},
getMoneyDetail() {
let that = this;
let token = uni.getStorageSync('token')
console.log(1);
if (token) {
//可以提现金额查询预估收入查询
let data = {
page: this.page,
limit: this.limit
}
this.$Request.getT('app/cash/selectPayDetails', data).then(res => {
this.totalCount = res.data.totalCount;
if (res.data.list.length > 0) {
this.list = [...this.list, ...res.data.list];
}
})
}
},
//获取收取费
getExtractFei() {
this.$u.get('app/common/type/152').then(res => {
if (res.code === 0) {
if (res.data && res.data.value) {
this.shouxufei = res.data.value;
}
}
});
this.$u.get('app/common/type/112').then(res => {
if (res.code === 0) {
if (res.data && res.data.value) {
this.cashMoney = res.data.value;
}
}
});
},
// 可提现金额
getcashMoney() {
let data = {
page: this.page,
limit: this.limit
}
// this.$u.api.myPurseDet(data).then(res => {
// if (res.code == 0) {
// this.mayMoney = res.data.inviteMoney.money
// } else {
// uni.showToast({
// title: res.msg,
// duration: 1000,
// icon: 'none'
// });
// }
// })
this.$Request.getT('app/moneyDetails/selectUserMoney').then(res => {
if (res.code == 0) {
this.mayMoney = res.data.amount || 0
}
})
},
// 提现记录
gojilu() {
uni.navigateTo({
url: '/me/invite/cashList'
});
},
//钱包明细
goqianbao() {
uni.navigateTo({
url: '/me/invite/moneyList?moneyType=1&viewType=2'
});
},
goZhifuBao() {
uni.navigateTo({
url: '/me/invite/zhifubao'
});
},
getMoney() {
let that = this;
let token = that.token
let userId = that.userId
if (token) {
//this.$queue.showLoading("加载中...");
//可以提现金额查询预估收入查询
let data = {
amount: that.money
}
uni.showLoading({
title: '提现中'
});
this.$u.api.withdraw(data).then(res => {
if (res.code == 0) {
uni.showToast({
title: res.msg,
icon: 'none'
})
that.money = ''
setTimeout(function () {
that.getcashMoney()
}, 1500)
} else {
uni.showToast({
title: res.msg,
icon: 'none'
})
}
})
}
},
//校验用户输入金额
checkMobile(money) {
return RegExp(/^1[34578]\d{9}$/).test(money);
},
getOut() {
let that = this;
let token = that.token
let userId = that.userId
let cashMoney = that.cashMoney;
if (token) {
if (that.zhifubao && that.zhifubaoName) {
if (!/^\d+(\.\d{1,2})?$/.test(that.money)) {
uni.showToast({
icon: 'none',
title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
});
return;
}
let shouxufei = parseFloat(that.money * that.shouxufei).toFixed(2);
console.log(parseFloat(that.mayMoney))
console.log(parseFloat(that.money))
if (parseFloat(that.mayMoney).toFixed(2) >= parseFloat(that.money)) {
// if (parseFloat(that.mayMoney).toFixed(1) >= parseFloat(that.money) + shouxufei * 1) {
if (parseFloat(that.money).toFixed(2) >= parseFloat(cashMoney)) {
if (that.shouxufei > 0) {
uni.showModal({
title: "提现申请提示",
content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n提现金额:' + that
.money + '元\n\n收款人账号' + that.zhifubao + '',
// content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n提现金额:' + that
// .money + '元\n\n提现手续费' + shouxufei +
// '\n\n收款人账号' + that.zhifubao + '',
success: (e) => {
if (e.confirm) {
// that.money = money
that.getMoney();
that.getMoneyDetail();
}
}
});
} else {
uni.showModal({
title: "提现申请提示",
content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n提现金额:' + that
.money + '元\n\n收款人账号' + that.zhifubao +
'',
success: (e) => {
if (e.confirm) {
// that.money = money
that.getMoney();
that.getMoneyDetail();
}
}
});
}
} else {
uni.showToast({
icon: 'none',
title: "提现金额必须大于或等于" + cashMoney + "元才可提现"
});
}
} else {
uni.showToast({
icon: 'none',
title: "您的余额不足"
});
}
} else {
uni.navigateTo({
url: "/me/invite/zhifubao"
})
}
} else {
uni.navigateTo({
url: '/pages/ghtwwlkXYG/wVghNzmqkQ'
});
}
},
getOut1(money) {
let that = this;
let token = that.token
let userId = that.userId
if (token) {
if (that.zhifubao && that.zhifubaoName) {
if (parseFloat(this.mayMoney).toFixed(1) >= parseFloat(money)) {
if (parseFloat(money).toFixed(1) >= 10) {
if (this.shouxufei > 0) {
let shouxufei = parseFloat(money * this.shouxufei).toFixed(2);
uni.showModal({
title: '提现申请提示',
content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n提现金额:' + money +
'元\n\n收款人账号' + that.zhifubao + '',
// content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n提现金额:' + money +
// '元\n\n提现手续费' + shouxufei +
// '\n\n收款人账号' + that.zhifubao + '',
confirmColor: '#ff7581',
success: e => {
if (e.confirm) {
this.money = money
that.getMoney();
// uni.showToast({
// icon: 'none',
// title: '提现成功'
// })
}
}
});
} else {
uni.showModal({
title: '提现申请提示',
content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n提现金额:' + money +
'元\n\n收款人账号' + that.zhifubao +
'',
success: e => {
if (e.confirm) {
this.money = money
that.getMoney();
// uni.showToast({
// icon: 'none',
// title: '提现成功'
// })
}
}
});
}
} else {
uni.showToast({
icon: 'none',
title: '提现金额必须大于或等于10元才可提现'
});
}
} else {
uni.showToast({
icon: 'none',
title: '您的余额不足'
});
}
} else {
uni.navigateTo({
url: '/me/invite/zhifubao'
});
}
} else {
uni.navigateTo({
url: '/pages/ghtwwlkXYG/wVghNzmqkQ'
});
}
}
}
};
</script>
<style lang="less">
// @import '../../static/css/index.css';
.view2-view-text {
font-size: 14px;
color: #000000;
margin-left: 20upx;
width: 80%;
}
.view2-view-image-right {
width: 18upx;
height: 30upx;
margin-left: 50upx;
}
.cash {
text-align: center;
background: white;
height: 100%;
position: absolute;
width: 100%;
.cash-top {
padding: 32upx 32upx 50upx 32upx;
/* border-bottom: 1px solid gainsboro; */
background: #5074FF;
}
.leiji {
font-size: 14px;
color: #ffffff;
margin-bottom: 10px;
}
}
.moneyList {
.item {
background: white;
padding: 32rpx;
margin: 32rpx;
font-size: 28rpx;
box-shadow: 7px 9px 34px rgba(0, 0, 0, 0.1);
border-radius: 16upx;
}
.item:first-child {
margin-top: 0;
}
}
.centre {
text-align: center;
padding: 200rpx 0;
font-size: 32rpx;
box-sizing: border-box;
image {
width: 360rpx;
height: 360rpx;
// margin-bottom: 20rpx;
margin: 0 auto 20rpx;
// border: 1px dotted #000000;
}
.tips {
font-size: 34rpx;
color: #999999;
margin-top: 20rpx;
}
.btn {
margin: 80rpx auto;
width: 600rpx;
border-radius: 32rpx;
line-height: 90rpx;
color: #ffffff;
font-size: 34rpx;
background: #ff7581;
}
}
</style>