531 lines
14 KiB
Vue
531 lines
14 KiB
Vue
<template>
|
|
<view class="content">
|
|
<custom-navbar
|
|
title="提现"
|
|
:showBack="true"
|
|
titleColor="#333"
|
|
></custom-navbar>
|
|
<view class="cash-card flex-space">
|
|
<view class="cash-card-title">选择提现方式</view>
|
|
<uv-radio-group
|
|
v-model="radiovalue"
|
|
placement="row"
|
|
class="uvRadio"
|
|
@change="changeRadio"
|
|
>
|
|
<uv-radio
|
|
:name="item.value"
|
|
:label="item.name"
|
|
activeColor="rgba(232, 16, 30, 1)"
|
|
v-for="(item, index) in radioList"
|
|
:key="index"
|
|
>
|
|
<template #icon>
|
|
<image src="/static/images/shop/pintuan/yes.png" class="radioYes">
|
|
</image>
|
|
</template>
|
|
</uv-radio>
|
|
</uv-radio-group>
|
|
</view>
|
|
<view class="cash-card flex-space" v-if="!isBinDing">
|
|
<view class="cash-card-title">{{
|
|
radiovalue == 1 ? `请绑定支付宝账号` : `请绑定银行卡号`
|
|
}}</view>
|
|
<view class="cash-card-text1" @click="goBinding">去绑定</view>
|
|
</view>
|
|
<view class="cash-card" v-else>
|
|
<view v-if="radiovalue == 1" @click="goAlipayAccount">
|
|
<view class="pop-border-bottom" style="padding-top: 0rpx">
|
|
<view class="cash-card-title2">支付宝账号</view>
|
|
<view class="cash-card-text2"
|
|
>{{ accountObj.card_no
|
|
}}<image
|
|
src="/static/images/wallet/right.png"
|
|
class="cash-card-text2-img"
|
|
/></view>
|
|
</view>
|
|
<view class="pop-border-bottom">
|
|
<view class="cash-card-title2">姓名</view>
|
|
<view class="cash-card-text2">{{ accountObj.name }}</view>
|
|
</view>
|
|
<view style="padding-top: 24rpx; display: flex">
|
|
<view class="cash-card-title2">手机号</view>
|
|
<view class="cash-card-text2">{{ accountObj.phone }}</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="radiovalue == 3" @click="goAlipayAccount">
|
|
<view class="pop-border-bottom" style="padding-top: 0rpx">
|
|
<view class="cash-card-title2">银行卡号</view>
|
|
<view class="cash-card-text2"
|
|
>{{ accountObj.card_no
|
|
}}<image
|
|
src="/static/images/wallet/right.png"
|
|
class="cash-card-text2-img"
|
|
/></view>
|
|
</view>
|
|
<view class="pop-border-bottom">
|
|
<view class="cash-card-title2">所属银行</view>
|
|
<view class="cash-card-text2">{{ accountObj.bank }}</view>
|
|
</view>
|
|
<view class="pop-border-bottom">
|
|
<view class="cash-card-title2">姓名</view>
|
|
<view class="cash-card-text2">{{ accountObj.name }}</view>
|
|
</view>
|
|
<view class="pop-border-bottom">
|
|
<view class="cash-card-title2">手机号</view>
|
|
<view class="cash-card-text2">{{ accountObj.phone }}</view>
|
|
</view>
|
|
<view style="padding-top: 24rpx; display: flex">
|
|
<view class="cash-card-title2">开户行</view>
|
|
<view class="cash-card-text2">{{ accountObj.bank_name }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="cash-card">
|
|
<view class="cash-card-title">提现金额</view>
|
|
<view class="cash-card-input">
|
|
<uv-input
|
|
type="digit"
|
|
placeholder=""
|
|
border="bottom"
|
|
fontSize="64rpx"
|
|
@input="onCashMoneyInput"
|
|
v-model="queryData.cash_money"
|
|
>
|
|
<template v-slot:prefix>
|
|
<text>¥</text>
|
|
</template>
|
|
</uv-input>
|
|
</view>
|
|
<view class="cash-card-text3"
|
|
>可提现金额{{ formatPriceNumber(userInfo.usable_money) }}元</view
|
|
>
|
|
</view>
|
|
<view class="cash-card">
|
|
<view class="cash-card-title" style="margin-bottom: 30rpx">提现规则</view>
|
|
<rich-text :nodes="textData.text"></rich-text>
|
|
</view>
|
|
|
|
<view class="agree_box">
|
|
<view class="agree">
|
|
<uv-checkbox-group
|
|
v-model="isAgree"
|
|
placement="row"
|
|
shape="circle"
|
|
class="uvRadio"
|
|
>
|
|
<uv-checkbox name="1" activeColor="rgba(232, 16, 30, 1)">
|
|
<template #icon>
|
|
<image src="/static/images/shop/pintuan/yes.png" class="radioYes">
|
|
</image>
|
|
</template>
|
|
</uv-checkbox>
|
|
</uv-checkbox-group>
|
|
<text class="agree-text">已阅读并同意</text>
|
|
<text class="agreement" @click="goAgreement(5)">《提现协议》</text>
|
|
</view>
|
|
|
|
<view class="sure-btn" @click="withdrawCash">提现</view>
|
|
</view>
|
|
|
|
<addPop
|
|
v-model="popShow"
|
|
:title="popTitle"
|
|
:btnText="btnText"
|
|
@goAdd="goAdd"
|
|
></addPop>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import request from "@/utils/request";
|
|
import addPop from "./components/addPop.vue";
|
|
export default {
|
|
components: {
|
|
addPop,
|
|
},
|
|
data() {
|
|
return {
|
|
isWithdrawCash: false, //是否开始提交提现
|
|
isAgree: [],
|
|
isBinDing: false, //是否绑定
|
|
accountObj: {}, //账号信息
|
|
popTitle: "",
|
|
btnText: "",
|
|
radiovalue: 1, //1支付宝 2微信 3银行卡
|
|
radioList: [
|
|
{
|
|
name: "支付宝",
|
|
value: 1,
|
|
btnText: "+ 添加支付宝账号",
|
|
popTitle: "支付宝账号管理",
|
|
},
|
|
{
|
|
name: "银行卡",
|
|
value: 3,
|
|
btnText: "+ 添加银行卡号",
|
|
popTitle: "银行卡管理",
|
|
},
|
|
],
|
|
userInfo: {},
|
|
textData: {},
|
|
popShow: false,
|
|
queryData: {
|
|
cash_money: null,
|
|
cash_type: getApp().globalData.artisanType,
|
|
},
|
|
};
|
|
},
|
|
async onLoad() {
|
|
const systemInfo = uni.getSystemInfoSync();
|
|
this.statusBarHeight = systemInfo.statusBarHeight;
|
|
if (this.queryData.cash_type) {
|
|
await this.getUserInfo();
|
|
this.getAccount();
|
|
}
|
|
this.getXieyi(10);
|
|
},
|
|
computed: {
|
|
|
|
},
|
|
methods: {
|
|
onCashMoneyInput(val) {
|
|
if (!val) {
|
|
this.$nextTick(() => {
|
|
this.queryData.cash_money = "";
|
|
});
|
|
return;
|
|
}
|
|
if (val<0) {
|
|
this.$nextTick(() => {
|
|
this.queryData.cash_money = "";
|
|
});
|
|
uni.showToast({
|
|
title: `提现金额不能为负`,
|
|
icon: "none",
|
|
duration: 1000,
|
|
});
|
|
return;
|
|
}
|
|
|
|
let legalVal = val.toString();
|
|
|
|
const maxMoney = Number(this.userInfo.usable_money) || 0;
|
|
const currentMoney = Number(legalVal) || 0;
|
|
|
|
if (currentMoney > maxMoney && maxMoney > 0) {
|
|
legalVal = maxMoney.toFixed(2);
|
|
uni.showToast({
|
|
title: `最多可提${maxMoney}元`,
|
|
icon: "none",
|
|
duration: 1000,
|
|
});
|
|
}
|
|
|
|
if (currentMoney > 0 && currentMoney < 0.01) {
|
|
setTimeout(() => {
|
|
legalVal = "0.01";
|
|
}, 100);
|
|
uni.showToast({
|
|
title: "最小提现0.01元",
|
|
icon: "none",
|
|
duration: 1000,
|
|
});
|
|
}
|
|
if (legalVal.includes(".")) {
|
|
const decimalIndex = legalVal.indexOf(".");
|
|
legalVal = legalVal.slice(0, decimalIndex + 3);
|
|
}
|
|
console.log(legalVal, "======");
|
|
this.$nextTick(() => {
|
|
this.queryData.cash_money = legalVal;
|
|
});
|
|
},
|
|
|
|
//
|
|
changeRadio(e) {
|
|
this.getAccount();
|
|
},
|
|
//获取默认卡号
|
|
getAccount(item) {
|
|
if (item) {
|
|
this.accountObj = item;
|
|
return;
|
|
}
|
|
let obj = {
|
|
user_type: this.queryData.cash_type,
|
|
type: this.radiovalue,
|
|
page: 1,
|
|
limit: 1,
|
|
};
|
|
request.post("/user/userCard/list", obj).then((res) => {
|
|
console.log(res, "======");
|
|
if (res.code == 200) {
|
|
if (res.data.list[0]) {
|
|
this.accountObj = res.data.list[0];
|
|
this.isBinDing = true;
|
|
} else {
|
|
this.accountObj = {};
|
|
this.isBinDing = false;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
goAlipayAccount() {
|
|
uni.navigateTo({
|
|
url: `/pages/wallet/alipayAccount?type=${this.radiovalue}`,
|
|
});
|
|
},
|
|
goAdd() {
|
|
this.popShow = false;
|
|
uni.navigateTo({
|
|
url: `/pages/wallet/alipay?type=${this.radiovalue}`,
|
|
});
|
|
},
|
|
goBack() {
|
|
setTimeout(() => {
|
|
const pages = getCurrentPages();
|
|
const prevPage = pages[pages.length - 2];
|
|
if (prevPage) {
|
|
if (prevPage.$vm && typeof prevPage.$vm.getUserInfo === "function") {
|
|
prevPage.$vm.getUserInfo(); // 存在则调用
|
|
}
|
|
if (prevPage.$vm && typeof prevPage.$vm.search === "function") {
|
|
prevPage.$vm.search(); // 存在则调用
|
|
}
|
|
}
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
});
|
|
}, 1500);
|
|
},
|
|
// 去绑定
|
|
goBinding() {
|
|
this.popTitle = this.radioList.find(
|
|
(item) => item.value == this.radiovalue
|
|
).popTitle;
|
|
this.btnText = this.radioList.find(
|
|
(item) => item.value == this.radiovalue
|
|
).btnText;
|
|
this.popShow = true;
|
|
},
|
|
async getUserInfo() {
|
|
const type =
|
|
this.queryData.cash_type == 1
|
|
? 2
|
|
: this.queryData.cash_type == 2
|
|
? 3
|
|
: "";
|
|
const result = await request.post("/sj/user/getuser", { type });
|
|
this.userInfo = result.data;
|
|
},
|
|
getXieyi(type) {
|
|
request.post("/user/getsystemtext", { type }).then((res) => {
|
|
console.log(res, "======");
|
|
this.textData = res.data;
|
|
});
|
|
},
|
|
goAgreement(type) {
|
|
uni.navigateTo({
|
|
url: "/pages/agreement/agreement?type=" + type,
|
|
});
|
|
},
|
|
withdrawCash() {
|
|
if (!this.isAgree[0]) {
|
|
uni.showToast({
|
|
title: "请先阅读并同意《提现协议》",
|
|
icon: "none",
|
|
});
|
|
return;
|
|
}
|
|
if (!this.queryData.cash_money) {
|
|
uni.showToast({
|
|
title: "请填写提取金额",
|
|
icon: "none",
|
|
});
|
|
return;
|
|
}
|
|
// 最小金额校验
|
|
let cash_money = Number(this.queryData.cash_money)
|
|
let usable_money = Number(this.userInfo.usable_money)
|
|
if (cash_money < 0.01) {
|
|
uni.showToast({ title: "最小提现0.01元", icon: "none" });
|
|
return;
|
|
}
|
|
if (cash_money > usable_money) {
|
|
uni.showToast({
|
|
title: "可提现金额不足",
|
|
icon: "none",
|
|
});
|
|
return;
|
|
}
|
|
if (!this.accountObj.id) {
|
|
uni.showToast({
|
|
title: "选择提取账户",
|
|
icon: "none",
|
|
});
|
|
return;
|
|
}
|
|
this.queryData.cash_money = cash_money;
|
|
this.queryData.cash_user_id = this.userInfo.id;
|
|
this.queryData.cash_card_id = this.accountObj.id;
|
|
this.queryData.cash_kind = this.radiovalue;
|
|
if (this.isWithdrawCash) {
|
|
return;
|
|
}
|
|
this.isWithdrawCash = true;
|
|
request
|
|
.post("/user/applyCashOut", this.queryData)
|
|
.then((res) => {
|
|
console.log(res, "======");
|
|
if (res.code == 200) {
|
|
uni.showToast({
|
|
title: "提交申请成功",
|
|
icon: "none",
|
|
});
|
|
// this.getUserInfo();
|
|
this.goBack();
|
|
}
|
|
})
|
|
.finally(() => {
|
|
this.isWithdrawCash = false;
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="less">
|
|
.agree_box {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
background: #fff;
|
|
padding: 20rpx 0 20rpx 0;
|
|
}
|
|
.content {
|
|
padding-bottom: 180rpx;
|
|
.cash-card {
|
|
padding: 30rpx 20rpx;
|
|
margin: 20rpx;
|
|
background: #ffffff;
|
|
border-radius: 20rpx;
|
|
.cash-card-title {
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
line-height: 42rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
.cash-card-title2 {
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
line-height: 42rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
width: 200rpx;
|
|
}
|
|
.cash-card-text1 {
|
|
font-weight: 400;
|
|
font-size: 30rpx;
|
|
color: #e8101e;
|
|
line-height: 42rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
margin-left: 35rpx;
|
|
}
|
|
.cash-card-text2 {
|
|
font-weight: 400;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
line-height: 42rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
word-break: break-all;
|
|
flex: 1;
|
|
.cash-card-text2-img {
|
|
width: 8rpx;
|
|
height: 18rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
.cash-card-text3 {
|
|
margin-top: 20rpx;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
line-height: 33rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
.pop-border-bottom {
|
|
border-bottom: 2rpx solid #e8e8e8;
|
|
padding: 24rpx 0;
|
|
display: flex;
|
|
}
|
|
.cash-card-input {
|
|
font-weight: 500;
|
|
font-size: 42rpx;
|
|
color: #333333;
|
|
line-height: 59rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
display: flex;
|
|
.uv-input {
|
|
padding: 0 !important;
|
|
}
|
|
}
|
|
.uvRadio {
|
|
margin-left: 96rpx;
|
|
display: flex;
|
|
gap: 60rpx;
|
|
}
|
|
}
|
|
.flex-space {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.agree {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
.uv-checkbox-group {
|
|
flex: none;
|
|
}
|
|
.agreement {
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #848484;
|
|
line-height: 33rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
color: rgba(46, 131, 214, 1);
|
|
}
|
|
}
|
|
.sure-btn {
|
|
margin: 20rpx 20rpx 0 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 710rpx;
|
|
height: 108rpx;
|
|
background: linear-gradient(180deg, #f52540 0%, #e8101e 100%);
|
|
border-radius: 55rpx;
|
|
font-weight: 400;
|
|
font-size: 42rpx;
|
|
color: #ffffff;
|
|
line-height: 59rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
|
|
.radioYes {
|
|
width: 24rpx;
|
|
height: 16rpx;
|
|
}
|
|
</style>
|