486 lines
12 KiB
Vue
486 lines
12 KiB
Vue
|
<style lang="scss" scoped>
|
|||
|
|
@import "@/static/scss/global.scss";
|
|||
|
|
|
|||
|
|
.balance_wrapper {
|
|||
|
|
// color: #fff;
|
|||
|
|
|
|||
|
|
.balance_wrapper_bg {
|
|||
|
|
// padding: 40rpx 20rpx;
|
|||
|
|
padding-bottom: 100rpx;
|
|||
|
|
flex-direction: column;
|
|||
|
|
background-color: #3c96f3;
|
|||
|
|
font-size: 36 rpx;
|
|||
|
|
|
|||
|
|
.balance_text {
|
|||
|
|
font-size: 50 rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
|
|||
|
|
text {
|
|||
|
|
font-size: 32 rpx;
|
|||
|
|
font-weight: normal;
|
|||
|
|
margin-right: 10 rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.count_wrapper {
|
|||
|
|
border-radius: 20 rpx;
|
|||
|
|
padding: 0rpx 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.padding-20 {
|
|||
|
|
padding: 0 20 rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mask {
|
|||
|
|
position: fixed;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
top: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.picker_box {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: -100%;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
height: 700 rpx;
|
|||
|
|
transition: all 0.3s;
|
|||
|
|
border-radius: 20rpx 20rpx 0 0;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
padding: 20rpx 30rpx;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.button {
|
|||
|
|
color: rgb(60, 150, 243);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.scroll_view {
|
|||
|
|
height: 600 rpx;
|
|||
|
|
padding: 0 20 rpx;
|
|||
|
|
width: auto;
|
|||
|
|
|
|||
|
|
.item {
|
|||
|
|
padding: 20rpx 30rpx;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
border-bottom: 1 rpx solid #e6e6e6;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.picker_box_active {
|
|||
|
|
bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.balance_wrapper {
|
|||
|
|
padding: 20rpx 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/deep/.card-type .u-radio__text {
|
|||
|
|
margin-left: 80rpx;
|
|||
|
|
color: #000 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/deep/.with-draw .u-radio__text {
|
|||
|
|
margin-left: 200rpx;
|
|||
|
|
color: #000 !important;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<template>
|
|||
|
|
<view class="asset_container">
|
|||
|
|
<!-- todo 将购买券 和土地兑付 水平排放-->
|
|||
|
|
<view class="flex flex-align-center balance_wrapper flex-between bg-w">
|
|||
|
|
<view class="action-item">
|
|||
|
|
<text class="text"> 槟榔券: </text>
|
|||
|
|
<text class="text">{{ this.blMoney }}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="action-item">
|
|||
|
|
<text class="text"> 槟榔兑付: </text>
|
|||
|
|
<text class="text">{{ this.bldfMoney }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<u-gap height="20rpx"></u-gap>
|
|||
|
|
<view class="count_wrapper bg-w">
|
|||
|
|
<text>提现金额</text>
|
|||
|
|
<u-gap height="20rpx"></u-gap>
|
|||
|
|
<view>
|
|||
|
|
<u-input
|
|||
|
|
border="none"
|
|||
|
|
fontSize="36rpx"
|
|||
|
|
type="number"
|
|||
|
|
v-model="formData.money"
|
|||
|
|
placeholder="输入提现金额"
|
|||
|
|
>
|
|||
|
|
<u-text
|
|||
|
|
text="¥"
|
|||
|
|
slot="prefix"
|
|||
|
|
margin="0 3px 0 0"
|
|||
|
|
type="tips"
|
|||
|
|
></u-text>
|
|||
|
|
</u-input>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<u-gap height="20rpx"></u-gap>
|
|||
|
|
<view class="flex flex-align-center balance_wrapper flex-between bg-w">
|
|||
|
|
<view class="action-item">
|
|||
|
|
<text class="text"> 到账金额: </text>
|
|||
|
|
<text class="text font34">¥{{Number(formData.money * 0.94).toFixed(4)}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<u-gap height="20rpx"></u-gap>
|
|||
|
|
<view class="count_wrapper bg-w">
|
|||
|
|
<view>
|
|||
|
|
<u--form labelPosition="left" ref="form1" labelWidth="100">
|
|||
|
|
<u-form-item label="提现类型" @click="asstypeShow = true">
|
|||
|
|
<u--input
|
|||
|
|
v-model="asstTypeSellectItem.assetTypeName"
|
|||
|
|
border="none"
|
|||
|
|
disabled
|
|||
|
|
disabledColor="#ffffff"
|
|||
|
|
placeholder="请选择提现类型"
|
|||
|
|
></u--input>
|
|||
|
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
|||
|
|
</u-form-item>
|
|||
|
|
</u--form>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- <view class="mask" v-if=""></view> -->
|
|||
|
|
<u-gap height="20rpx"></u-gap>
|
|||
|
|
<view class="count_wrapper bg-w">
|
|||
|
|
<view>
|
|||
|
|
<u--form labelPosition="left" ref="form1" labelWidth="100">
|
|||
|
|
<u-form-item label="银行卡号" @click="show = true">
|
|||
|
|
<u--input
|
|||
|
|
v-model="selectItem.bankCardNumber"
|
|||
|
|
border="none"
|
|||
|
|
type="number"
|
|||
|
|
disabled
|
|||
|
|
disabledColor="#ffffff"
|
|||
|
|
placeholder="请选择银行卡号"
|
|||
|
|
></u--input>
|
|||
|
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
|||
|
|
</u-form-item>
|
|||
|
|
</u--form>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<u-gap height="140rpx"></u-gap>
|
|||
|
|
<view class="padding-20">
|
|||
|
|
<u-button @click="handlerDraw" type="primary" text="确认提现" color="#4BB22E"></u-button>
|
|||
|
|
</view>
|
|||
|
|
<view class="mask" v-if="show || asstypeShow" @click="handlerClose"> </view>
|
|||
|
|
<!-- // 底部弹出列表-银行卡-->
|
|||
|
|
<view class="picker_box bg-w" :class="show ? 'picker_box_active' : ''">
|
|||
|
|
<view class="title flex2">
|
|||
|
|
<text @click="handlerClose(1)">取消</text>
|
|||
|
|
<view>选择银行卡</view>
|
|||
|
|
<text @click="handlerConfirm(1)" class="button">确定</text>
|
|||
|
|
</view>
|
|||
|
|
<scroll-view class="scroll_view card-type" scroll-y="true">
|
|||
|
|
<u-radio-group
|
|||
|
|
:value="value"
|
|||
|
|
@change="handlerChange"
|
|||
|
|
placement="column"
|
|||
|
|
>
|
|||
|
|
<view
|
|||
|
|
@click="handlerItem(item, index)"
|
|||
|
|
class="item flex2 flex-align-center"
|
|||
|
|
v-for="(item, index) in bankList"
|
|||
|
|
:key="index"
|
|||
|
|
>
|
|||
|
|
<u-radio :name="index" :label="item.number"></u-radio>
|
|||
|
|
<!-- <view class="flex-1 font28">
|
|||
|
|
{{ item.number }}
|
|||
|
|
</view> -->
|
|||
|
|
<view class="font28">持卡人：{{ item.cardholderName }}</view>
|
|||
|
|
</view>
|
|||
|
|
</u-radio-group>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- // 底部弹出列表-资产类型-->
|
|||
|
|
<view
|
|||
|
|
class="picker_box bg-w"
|
|||
|
|
:class="asstypeShow ? 'picker_box_active' : ''"
|
|||
|
|
>
|
|||
|
|
<view class="title flex2">
|
|||
|
|
<text @click="handlerClose(2)">取消</text>
|
|||
|
|
<view>选择提现类型</view>
|
|||
|
|
<text @click="handlerConfirm(2)" class="button">确定</text>
|
|||
|
|
</view>
|
|||
|
|
<scroll-view class="scroll_view with-draw" scroll-y="true">
|
|||
|
|
<u-radio-group
|
|||
|
|
:value="assetTypeValue"
|
|||
|
|
@change="assetTypehandlerChange"
|
|||
|
|
placement="column"
|
|||
|
|
>
|
|||
|
|
<view
|
|||
|
|
@click="assetTypehandlerItem(item, index)"
|
|||
|
|
class="item flex2"
|
|||
|
|
v-for="(item, index) in assetTypeList"
|
|||
|
|
:key="index"
|
|||
|
|
>
|
|||
|
|
<u-radio
|
|||
|
|
:name="index"
|
|||
|
|
:label="' 提现类型名称:' + item.assetTypeName"
|
|||
|
|
></u-radio>
|
|||
|
|
<!-- {{ item.assetType }} -->
|
|||
|
|
<!-- <view>提现类型名称：{{ item.assetTypeName }}</view> -->
|
|||
|
|
</view>
|
|||
|
|
</u-radio-group>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
getBankList,
|
|||
|
|
widthDraw,
|
|||
|
|
getUserBalance,
|
|||
|
|
tudicheckapi,
|
|||
|
|
} from "@/api/system/user.js";
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
formData: {
|
|||
|
|
money: "",
|
|||
|
|
bankCardId: "",
|
|||
|
|
assetType: "",
|
|||
|
|
},
|
|||
|
|
bankList: [],
|
|||
|
|
assetTypeList: [],
|
|||
|
|
page: {
|
|||
|
|
page: 1,
|
|||
|
|
size: 10,
|
|||
|
|
},
|
|||
|
|
show: false,
|
|||
|
|
asstypeShow: false,
|
|||
|
|
value: null,
|
|||
|
|
assetTypeValue: null,
|
|||
|
|
showlab: null,
|
|||
|
|
selectItem: {},
|
|||
|
|
asstTypeSellectItem: {},
|
|||
|
|
blMoney: 0,
|
|||
|
|
bldfMoney: 0,
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
this.getBankList();
|
|||
|
|
this.getAssetTypeList();
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
this.getUserBalance();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
handlerClose(closeType) {
|
|||
|
|
// if (closeType == 1) {
|
|||
|
|
this.show = false;
|
|||
|
|
// } else if (closeType == 2) {
|
|||
|
|
this.asstypeShow = false;
|
|||
|
|
// }
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handlerNavigate(item) {
|
|||
|
|
console.log(item);
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: item.path,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
async handlerDraw() {
|
|||
|
|
uni.showLoading({ title: "数据提交中" });
|
|||
|
|
let { formData } = this.$data;
|
|||
|
|
// if (formData.money <= 0 || formData.tudiduihuan <= 0) return this.$toast('请输入正确的提现金额');
|
|||
|
|
if (!formData.bankCardId) return this.$toast("请输入选择银行卡");
|
|||
|
|
if (!formData.assetType) return this.$toast("请选择提现类型");
|
|||
|
|
if (formData.assetType === 5) {
|
|||
|
|
if (this.blMoney < this.formData.money)
|
|||
|
|
return this.$toast("槟榔券不足");
|
|||
|
|
} else if(formData.assetType === 6) {
|
|||
|
|
if (this.bldfMoney < this.formData.money)
|
|||
|
|
return this.$toast("槟榔兑付不足");
|
|||
|
|
}
|
|||
|
|
if (this.formData.assetType == 4) {
|
|||
|
|
let check_ = await this.checkApi(formData);
|
|||
|
|
formData = { ...formData, ...check_.data };
|
|||
|
|
}
|
|||
|
|
let res = await widthDraw(formData);
|
|||
|
|
let { code } = res;
|
|||
|
|
if (code == 200)
|
|||
|
|
this.$toast("提现成功", () => {
|
|||
|
|
uni.hideLoading();
|
|||
|
|
uni.navigateBack();
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//如果是土地兑付,走一次打赏再走widthDraw
|
|||
|
|
checkApi(formData) {
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
tudicheckapi(formData)
|
|||
|
|
.then((res) => {
|
|||
|
|
resolve(res);
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
uni.hideLoading();
|
|||
|
|
uni.showToast({
|
|||
|
|
title: err.msg || "当前错误",
|
|||
|
|
icon: "none",
|
|||
|
|
});
|
|||
|
|
reject();
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
handlerSelect() {
|
|||
|
|
// uni.navigateTo({
|
|||
|
|
// url: '/pages/mine/account/bankList?isSelect=1'
|
|||
|
|
// })
|
|||
|
|
},
|
|||
|
|
handlerItem(item, index) {
|
|||
|
|
this.value = index;
|
|||
|
|
},
|
|||
|
|
assetTypehandlerItem(item, index) {
|
|||
|
|
this.assetTypeVale = index;
|
|||
|
|
},
|
|||
|
|
//选项框中的确认 将银行卡选择和提现类型选项通过参数分开 showType 1表示 银行卡 2 提现类型
|
|||
|
|
handlerConfirm(showType) {
|
|||
|
|
console.log(this.value);
|
|||
|
|
if (showType == 1) {
|
|||
|
|
if (this.value == null) return this.$toast("请选择银行卡");
|
|||
|
|
if (!this.bankList.length) return this.$toast("请先绑定银行卡");
|
|||
|
|
|
|||
|
|
this.selectItem = this.bankList[this.value];
|
|||
|
|
this.formData.bankCardId = this.selectItem.id;
|
|||
|
|
this.show = false;
|
|||
|
|
} else if (showType == 2) {
|
|||
|
|
if (this.assetTypeValue == null) return this.$toast("请选择提现类型");
|
|||
|
|
if (!this.assetTypeList.length)
|
|||
|
|
return this.$toast("没有获取到提现类型");
|
|||
|
|
|
|||
|
|
this.asstTypeSellectItem = this.assetTypeList[this.assetTypeValue];
|
|||
|
|
this.formData.assetType = this.asstTypeSellectItem.assetType;
|
|||
|
|
|
|||
|
|
this.asstypeShow = false;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
handlerChange(e) {
|
|||
|
|
console.log(e);
|
|||
|
|
this.value = e;
|
|||
|
|
},
|
|||
|
|
assetTypehandlerChange(e) {
|
|||
|
|
console.log("更换按钮");
|
|||
|
|
console.log(e);
|
|||
|
|
this.assetTypeValue = e;
|
|||
|
|
console.log("此时");
|
|||
|
|
console.log(this.assetTypeValue);
|
|||
|
|
console.log("----");
|
|||
|
|
},
|
|||
|
|
async getUserBalance() {
|
|||
|
|
let res = await getUserBalance();
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
this.blMoney = res.data.bl_money;
|
|||
|
|
this.bldfMoney = res.data.bl_df_money;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
console.log("res", res);
|
|||
|
|
},
|
|||
|
|
async getBankList() {
|
|||
|
|
let res = await getBankList(this.page);
|
|||
|
|
let { code, rows } = res;
|
|||
|
|
|
|||
|
|
if (code == 200) {
|
|||
|
|
if (rows === 0) {
|
|||
|
|
uni.showModal({
|
|||
|
|
title: "提示",
|
|||
|
|
content: "暂未绑定银行卡",
|
|||
|
|
cancelColor: "取消",
|
|||
|
|
confirmText: "去绑定",
|
|||
|
|
success: (res) => {
|
|||
|
|
if (res.confirm) {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/pages/licai/mine/account/bindBank",
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
//todo 弹出对话框"暂未绑定银行卡" "去绑定" "取消" 选择"去绑定" 则跳转绑定银行卡 绑定结束后跳回这个页面 取消 关闭窗口
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
rows.forEach((item) => {
|
|||
|
|
item.number = item.bankCardNumber
|
|||
|
|
.replace(/\s/g, "")
|
|||
|
|
.replace(/(\d{4})(?=\d)/g, "$1 ");
|
|||
|
|
});
|
|||
|
|
this.bankList = [...this.bankList, ...rows];
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 提现类型加载
|
|||
|
|
getAssetTypeList() {
|
|||
|
|
this.assetTypeList = [
|
|||
|
|
{ assetType: 5, assetTypeName: "槟榔券" },
|
|||
|
|
{ assetType: 6, assetTypeName: "槟榔兑付" },
|
|||
|
|
];
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
props: {
|
|||
|
|
// 是否显示加载
|
|||
|
|
// show:{
|
|||
|
|
// type:Boolean,
|
|||
|
|
// default(){
|
|||
|
|
// return true
|
|||
|
|
// }
|
|||
|
|
// },
|
|||
|
|
// 显示的图标类型
|
|||
|
|
type: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return "round";
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
// 加载动画的文字
|
|||
|
|
loadTxt: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return "加载中";
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
// 加载遮罩的背景,可选值为white
|
|||
|
|
shadowBg: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return "black";
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
// 显示图标颜色，type值为rect或round才可改背景颜色
|
|||
|
|
iconBg: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return "#167BEF";
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
// 加载文字颜色
|
|||
|
|
color: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return "#434343";
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
// 是否开启加载文字闪烁
|
|||
|
|
animateTxt: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default() {
|
|||
|
|
return true;
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|