添加:佣金添加账号管理

This commit is contained in:
wuhui_zzw 2024-04-07 18:42:56 +08:00
parent 0ad9861875
commit ebbb475be6
5 changed files with 930 additions and 477 deletions

View File

@ -739,3 +739,25 @@ export function inviteCodePayment(data) {
export function inviteCodeConfirmUse(data) { export function inviteCodeConfirmUse(data) {
return request.get("sVip/inviteUse", data); return request.get("sVip/inviteUse", data);
} }
// 提现账号管理 - 获取列表
export function withdrawalAccountList() {
return request.get("withdrawalAccount/list");
}
// 提现账号管理 - 提交编辑
export function withdrawalAccountEdit(data) {
return request.post("withdrawalAccount/edit", data);
}
// 提现账号管理 - 删除
export function withdrawalAccountDel(id) {
return request.post(`withdrawalAccount/del/${id}`);
}

View File

@ -2,7 +2,7 @@
<view :style="viewColor"> <view :style="viewColor">
<view class="payment" :class="pay_close ? 'on' : ''"> <view class="payment" :class="pay_close ? 'on' : ''">
<view class="title acea-row row-center-wrapper"> <view class="title acea-row row-center-wrapper">
选择提现方式<text class="iconfont icon-guanbi" @click='close'></text> 选择账号类型<text class="iconfont icon-guanbi" @click='close'></text>
</view> </view>
<radio-group @change="radioChange"> <radio-group @change="radioChange">
<label class="item acea-row row-between-wrapper" v-for="(item,index) in payMode" :key="index"> <label class="item acea-row row-between-wrapper" v-for="(item,index) in payMode" :key="index">
@ -109,7 +109,7 @@
height: 130rpx; height: 130rpx;
margin-left: 30rpx; margin-left: 30rpx;
padding-right: 30rpx; padding-right: 30rpx;
} }
.payment .item .acea-row-left{ .payment .item .acea-row-left{
.icon-left{ .icon-left{
display: inline-block; display: inline-block;

View File

@ -272,6 +272,12 @@
"navigationBarTitleText": "提现" "navigationBarTitleText": "提现"
} }
}, },
{
"path": "user_cash/account_list",
"style": {
"navigationBarTitleText": "账号管理"
}
},
{ {
"path": "user_address_list/index", "path": "user_address_list/index",
"style": { "style": {

View File

@ -0,0 +1,698 @@
<template>
<view class="page-content">
<!-- 账号列表 -->
<uni-popup ref="accountList" type="bottom" :maskClick="false" :isMaskClick="false">
<view class="account-list">
<!--列表-->
<scroll-view class="_list" :scroll-y="true">
<view class="_list-item" v-for="(item,index) in list" :key="index">
<view class="item-info">
<view class="top">{{ item.extract_type | extractTypeText }}</view>
<view class="tag-list">
<view class="tag-list-item" v-if="Number(item.extract_type) === 1">{{ item.wechat }}</view>
<view class="tag-list-item" v-if="Number(item.extract_type) === 2">{{ item.alipay_code }}</view>
<view class="tag-list-item" v-if="Number(item.extract_type) === 0">{{ item.bank_code }}</view>
</view>
</view>
<view class="item-btn-group">
<view class='item-btn del-btn' @click="delAccount(item.id)">删除</view>
<view class='item-btn edit-btn' @click="editAccount(item)">编辑</view>
<view class='item-btn use-btn' @click="useAccount(item)">使用</view>
</view>
</view>
</scroll-view>
<!--底部按钮-->
<view class="btn-group">
<view class='button-btn close-btn' @click="accountStatusChange('close')">取消</view>
<view class='button-btn add-btn' @click="addAccountStatusChange()">添加</view>
</view>
</view>
</uni-popup>
<!--添加账号弹框-->
<uni-popup ref="addAccount" type="bottom" :maskClick="false" :isMaskClick="false">
<view class="add-account">
<!-- 表单 -->
<view class="_from">
<view class="_from-item">
<view class="item-label">账号类型</view>
<view class="item-content">
<view class="item-account-type" @click="accountTypeStatusChange()">
<view class="item-account-type-info">
<view class="type-icon" :style="[{backgroundColor: navList[currentTab]['bg_color']}]">
<view class="iconfont bankicon" :class="navList[currentTab]['icon']"></view>
</view>
<text class="type-name">{{ navList[currentTab]["name"] }}</text>
</view>
<view class='right-icon iconfont icon-jiantou'></view>
</view>
</view>
</view>
<!--银行卡-->
<template v-if="Number(currentTab) === 0">
<view class="_from-item">
<view class="item-label">账户类型</view>
<view class="item-content">
<picker class="picker-content" @change="bankTypeChange" :value="bank_type_index" :range="bank_type_list" range-key="title">
<text class='Bank'>{{ bank_type_list[bank_type_index] ? bank_type_list[bank_type_index].title : '请选择账户类型' }}</text>
<text class='iconfont icon-qiepian38'></text>
</picker>
</view>
</view>
<!-- 个人账户 -->
<template v-if="Number(current_account.bank_type) === 0 && current_account.bank_type !== ''">
<view class="_from-item">
<view class="item-label">持卡人</view>
<view class="item-content">
<input placeholder='请输入持卡人姓名' v-model="current_account.real_name" />
</view>
</view>
<view class="_from-item">
<view class="item-label">账号</view>
<view class="item-content">
<input placeholder='请输入银行账号' v-model="current_account.bank_code" />
</view>
</view>
<view class="_from-item" v-if="Object.values(bank_list).length > 0">
<view class="item-label">收款银行</view>
<view class="item-content">
<picker class="picker-content" @change="bankChange" :value="bank_index" :range="bank_list" range-key="name">
<text class='Bank'>{{ current_account.bank_name || '请选择收款银行' }}</text>
<text class='iconfont icon-qiepian38'></text>
</picker>
</view>
</view>
<view class="_from-item">
<view class="item-label">开户行</view>
<view class="item-content">
<input placeholder='请输入开户行地址' v-model="current_account.bank_address" />
</view>
</view>
</template>
<!-- 企业账户 -->
<template v-if="Number(current_account.bank_type) === 1 && current_account.bank_type !== ''">
<view class="_from-item">
<view class="item-label">开户名称</view>
<view class="item-content">
<input placeholder='请输入开户名称' v-model="current_account.real_name" />
</view>
</view>
<view class="_from-item">
<view class="item-label">账号</view>
<view class="item-content">
<input placeholder='请输入银行账号' v-model="current_account.bank_code" />
</view>
</view>
<view class="_from-item">
<view class="item-label">开户行</view>
<view class="item-content">
<input placeholder='请输入开户行地址' v-model="current_account.bank_address" />
</view>
</view>
</template>
</template>
<!--微信-->
<template v-if="Number(currentTab) === 1">
<template v-if="!sys_extension_type">
<view class="_from-item">
<view class="item-label">账号</view>
<view class="item-content">
<input placeholder='请填写您的微信账号' v-model="current_account.wechat" />
</view>
</view>
<view class="_from-item">
<view class="item-label">收款码</view>
<view class="item-content">
<view class='input upload acea-row row-middle'>
<view class='picture' v-if="current_account.extract_pic">
<image :src='current_account.extract_pic'></image>
<text class='iconfont icon-guanbi1' @click='delPaymentCode'></text>
</view>
<view class='picture acea-row row-center-wrapper row-column' @click='uploadPaymentCode' v-else>
<text class='iconfont icon-icon25201'></text>
<view>上传图片</view>
</view>
</view>
</view>
</view>
</template>
<view v-else class="tips">微信提现到零钱为自动到账无需填写账号信息!</view>
</template>
<!--支付宝-->
<template v-if="Number(currentTab) === 2">
<view class="_from-item">
<view class="item-label">账号</view>
<view class="item-content">
<input placeholder='请填写您的支付宝账号' v-model="current_account.alipay_code" />
</view>
</view>
<view class="_from-item">
<view class="item-label">收款码</view>
<view class="item-content">
<view class='input upload acea-row row-middle'>
<view class='picture' v-if="current_account.extract_pic">
<image :src='current_account.extract_pic'></image>
<text class='iconfont icon-guanbi1' @click='delPaymentCode'></text>
</view>
<view class='picture acea-row row-center-wrapper row-column' @click='uploadPaymentCode' v-else>
<text class='iconfont icon-icon25201'></text>
<view>上传图片</view>
</view>
</view>
</view>
</view>
</template>
</view>
<!-- 底部按钮 -->
<view class="btn-group">
<view class='button-btn close-btn' @click="addAccountStatusChange('close')">取消</view>
<view class='button-btn add-btn' @click="submitAccountEdit">提交</view>
</view>
</view>
</uni-popup>
<!--提现方式选择-->
<uni-popup ref="accountType" type="bottom" :maskClick="false" :isMaskClick="false">
<view class="account-type">
<cash :payMode='account_type' :pay_close="true" @payClose="accountTypeStatusChange('close')" @onChangeFun="onChangeFun" :order_id="currentTab"></cash>
</view>
</uni-popup>
</view>
</template>
<script>
import {mapGetters} from "vuex";
import { configMap } from '@/utils';
import cash from '@/components/cash';
import { extractBank, withdrawalAccountList, withdrawalAccountEdit, withdrawalAccountDel } from '@/api/user.js';
export default {
name: 'account_list',
components: {
cash
},
computed: {
...mapGetters(['isLogin', 'uid', 'userInfo', 'viewColor']),
... configMap(['sys_extension_type', 'withdraw_type'])
},
data() {
return {
//
account_type: [],
pay_close: false,
currentTab: '0',
navList: [
{
'id': '0',
'ids': 1,
'name': '银行卡',
'icon': 'icon-yinhangqia',
'bg_color': '#FE960F'
},
{
'id': '1',
'ids': 2,
'name': '微信',
'icon': 'icon-weixin2',
'bg_color': '#41B035'
},
{
'id': '2',
'ids': 3,
'name': '支付宝',
'icon': 'icon-icon34',
'bg_color': '#00A9F2'
}
],
//
bank_type_index: '',
bank_type_list: [
{ val:0,title: '个人账户' },
{ val:1,title: '企业账户' },
],
//
list: {},
current_account: {
real_name: '',// /
extract_type: '',// 0=,1=,2=,3=
bank_code: '',//
bank_address: '',//
alipay_code: '',//
wechat: '',//
extract_pic: '',//
bank_name: '',//
bank_type: '',// 0=1=
},
bank_list: [],// - -
bank_index: 0,
}
},
watch: {
withdraw_type: {
handler(){
let accountType = [];
let withdrawType = Object.assign({}, this.withdraw_type);
let navList = Object.assign({}, this.navList);
if (Object.values(withdrawType).length > 0) {
Object.values(navList).map((value, index) => {
Object.values(withdrawType).map(val => {
if (value.ids == val) accountType.push(value)
})
})
}
//
this.$set(this, 'account_type', accountType);
this.$set(this, 'currentTab', accountType[0] ? accountType[0].id : '');
this.$forceUpdate();
},
immediate: true
}
},
filters: {
extractTypeText: function(value) {
let typeText = {
0: '银行卡',
1: '微信',
2: '支付宝',
3: '微信零钱',
}
return typeText[value] || '';
},
},
mounted(options) {
this.getUserExtractBank();
this.getList();
},
methods: {
//
getUserExtractBank() {
let _this = this;
extractBank().then(res => {
_this.$set(_this, 'bank_list', res.data || {});
});
},
//
getList(){
let _this = this;
withdrawalAccountList().then(res => {
if (res.status == 200) {
_this.$set(_this, 'list', res.data || {})
}
}).catch(err => {
_this.$util.Tips({title: err});
});
},
//
accountStatusChange(type = 'open'){
if(type === 'open') this.$refs.accountList.open('bottom');
else this.$refs.accountList.close();
},
//
addAccountStatusChange(type = 'open'){
if(type === 'open') this.$refs.addAccount.open('bottom');
else this.$refs.addAccount.close();
},
// -
accountTypeStatusChange(type = 'open') {
if(type === 'open') this.$refs.accountType.open('bottom');
else this.$refs.accountType.close();
},
// -
onChangeFun(e) {
this.accountTypeStatusChange('close');
this.$set(this, 'currentTab', e.type);
this.$set(this.current_account, 'extract_type', e.type);
this.$forceUpdate();
},
// -
bankTypeChange(e){
this.bank_type_index = e.detail.value || e.target.value;
let bankTypeInfo = this.bank_type_list[this.bank_type_index];
this.$set(this.current_account, 'bank_type', bankTypeInfo['val']);
},
// -
bankChange(e){
this.bank_index = e.detail.value || e.target.value;
let bankInfo = this.bank_list[this.bank_index];
this.$set(this.current_account, 'bank_name', bankInfo['name'] || '');
},
// -
uploadPaymentCode() {
let _this = this;
_this.$util.uploadImageOne('upload/image', function(res) {
_this.$set(_this.current_account, 'extract_pic', res.data.path || '');
});
},
// -
delPaymentCode () {
_this.$set(_this.current_account, 'extract_pic', '');
},
//
submitAccountEdit(){
let _this = this;
let params = Object.assign({}, _this.current_account);
//
if(_this.sys_extension_type && Number(params.extract_type) === 1) params.extract_type = 3;
//
withdrawalAccountEdit(params).then(res => {
if (res.status == 200) {
_this.$util.Tips({title: '编辑成功'});
_this.addAccountStatusChange('close');
_this.current_account = Object.assign({}, _this.$options.data().current_account);
_this.getList();
}
}).catch(err => {
_this.$util.Tips({title: err});
});
},
// - 使
useAccount(item){
this.accountStatusChange('close');
this.$emit('use', item);
},
// -
editAccount(oldItem){
let item = Object.assign({}, oldItem);
//
if(Number(item.extract_type) === 3) item.extract_type = 1;
this.$set(this, 'currentTab', item.extract_type);
this.$set(this, 'current_account', item);
this.addAccountStatusChange();
},
// -
delAccount(id){
let _this = this;
uni.showModal({
title: '提示',
content: '确定删除该账号吗?',
success: function (res) {
if (res.confirm) {
withdrawalAccountDel(id).then(res => {
if (res.status == 200) {
_this.$util.Tips({title: '删除成功'});
_this.getList();
}
}).catch(err => {
_this.$util.Tips({title: err});
});
}
}
});
},
}
}
</script>
<style scoped lang="scss">
.page-content{
width: 100vw;
background-color: orange;
//
.account-list{
--list-padding-: 25rpx;
background: #f6f6f6;
width: 100vw;
height: 100vh;
padding: var(--list-padding-);
position: relative;
._list{
height: calc(100% - (var(--list-padding-) * 3) - 70rpx);
width: calc(100% - (var(--list-padding-) * 2));
position: fixed;
top: var(--list-padding-);
left: var(--list-padding-);
overflow-y: auto;
._list-item{
width: 100%;
background: #FFFFFF;
border-radius: 15rpx;
padding: 20rpx;
.item-info{
width: 100%;
border-bottom: 2rpx solid #eeeeee;
padding-bottom: 20rpx;
.top{
width: 100%;
height: 50rpx;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
font-size: 30rpx;
font-weight: bold;
}
.tag-list{
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
.tag-list-item{
background-color: #f3e6e8;
color: #926c6b;
height: 35rpx;
line-height: 35rpx;
font-size: 24rpx;
padding: 0 10rpx;
border-radius: 5rpx;
font-weight: normal;
margin-right: 15rpx;
max-width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
.item-btn-group{
padding-top: 20rpx;
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-end;
.item-btn{
height: 45rpx;
line-height: 45rpx;
margin-left: 15rpx;
color: #ffffff;
border-radius: 120rpx;
width: 110rpx;
text-align: center;
font-size: 28rpx;
}
.del-btn{
background-color: #ff4949;
border-color: #ff4949;
}
.edit-btn{
background-color: #ffba00;
border-color: #ffba00;
}
.use-btn{
background-color: #13ce66;
border-color: #13ce66
}
}
}
._list-item:not(:last-child){
margin-bottom: var(--list-padding-);
}
}
.btn-group{
position: fixed;
width: calc(100% - (var(--list-padding-) * 2));
height: 70rpx;
bottom: var(--list-padding-);
left: var(--list-padding-);
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
.button-btn{
height: 70rpx;
line-height: 70rpx;
width: calc((100% - var(--list-padding-)) / 2);
text-align: center;
font-size: 30rpx;
border-radius: 150rpx;
color: #fff;
}
.close-btn{
margin-right: var(--list-padding-);
background-color: #f56c6c;
border-color: #f56c6c;
}
.add-btn{
background-color: #13ce66;
border-color: #13ce66;
}
}
}
//
.add-account{
--list-padding-: 25rpx;
background: #f6f6f6;
width: 100vw;
height: 80vh;
padding: var(--list-padding-);
position: relative;
._from{
height: calc(100% - (var(--list-padding-) * 3) - 70rpx);
width: calc(100% - (var(--list-padding-) * 2));
position: fixed;
top: var(--list-padding-);
left: var(--list-padding-);
overflow-y: auto;
._from-item{
width: 100%;
background-color: #f6f6f6;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
.item-label{
height: 90rpx;
line-height: 90rpx;
width: 180rpx;
font-size: 28rpx;
text-align: right;
}
.item-content{
width: calc(100% - 200rpx);
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
.item-account-type{
width: 100%;
height: 90rpx;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
.item-account-type-info{
width: calc(100% - 50rpx);
height: 90rpx;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
.type-icon{
width: 60rpx;
height: 60rpx;
text-align: center;
line-height: 60rpx;
margin-right: 20rpx;
border-radius: 50%;
.iconfont{
color: #ffffff;
font-size: 36rpx!important;
}
}
.type-name{}
}
.right-icon{
width: 50rpx;
text-align: right;
}
}
.picker-content{
width: 100%;
}
input{
width: 100%;
height: 70rpx;
line-height: 70rpx;
}
}
}
._from-item:not(:last-child){
border-bottom: 2rpx solid #eeeeee;
}
}
.tips {
font-size: 28rpx;
color: #aaaaaa;
font-weight: 800;
margin-bottom: 14rpx;
margin-top: 20rpx;
text-align: center;
}
.btn-group{
position: fixed;
width: calc(100% - (var(--list-padding-) * 2));
height: 70rpx;
bottom: var(--list-padding-);
left: var(--list-padding-);
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
.button-btn{
height: 70rpx;
line-height: 70rpx;
width: calc((100% - var(--list-padding-)) / 2);
text-align: center;
font-size: 30rpx;
border-radius: 150rpx;
color: #fff;
}
.close-btn{
margin-right: var(--list-padding-);
background-color: #f56c6c;
border-color: #f56c6c;
}
.add-btn{
background-color: #13ce66;
border-color: #13ce66;
}
}
}
}
.picture {
width: 70px;
height: 70px;
margin: 0 0 17px 0;
position: relative;
font-size: 11px;
color: #bbb;
border: 0.5px solid #ddd;
box-sizing: border-box;
margin-top: 40rpx;
uni-image, image {
width: 100%;
height: 100%;
border-radius: 1px;
}
.icon-guanbi1 {
font-size: 22px;
position: absolute;
top: -10px;
right: -10px;
color: #fc4141;
}
}
</style>

View File

@ -1,15 +1,39 @@
<template> <template>
<view :style="viewColor"> <view :style="viewColor">
<view class='cash-withdrawal' :hidden='!loading'> <view class='cash-withdrawal'>
<!--顶部账号选择-->
<view class='nav acea-row row-between-wrapper'> <view class='nav acea-row row-between-wrapper'>
<view class='name'>提现至</view> <view class='name'>提现至</view>
<view class='input'> <view class='input'>
<view class="more-content" @click="goPay(currentTab)"> <view class="more-content" @click="selectAccount()">
<view class="more-content-left"> <view class="more-content-left">
<view class="type-icon" :style="[{backgroundColor: handlePayColor()}]"> <template v-if="use_account.extract_type == 0">
<view class="iconfont bankicon" :class="navList[currentTab]['icon']"></view> <view class="type-icon" :style="[{backgroundColor: '#FE960F'}]">
</view> <view class="iconfont bankicon icon-yinhangqia"></view>
<text>{{navList[currentTab]["name"]}}</text> </view>
<text>银行卡</text>
</template>
<template v-else-if="use_account.extract_type == 1">
<view class="type-icon" :style="[{backgroundColor: '#41B035'}]">
<view class="iconfont bankicon icon-weixin2"></view>
</view>
<text>微信</text>
</template>
<template v-else-if="use_account.extract_type == 2">
<view class="type-icon" :style="[{backgroundColor: '#00A9F2'}]">
<view class="iconfont bankicon icon-icon34"></view>
</view>
<text>支付宝</text>
</template>
<template v-else-if="use_account.extract_type == 3">
<view class="type-icon" :style="[{backgroundColor: '#41B035'}]">
<view class="iconfont bankicon icon-weixin2"></view>
</view>
<text>微信零钱</text>
</template>
<template v-else="use_account.extract_type == 3">
<text>请选择提现账号</text>
</template>
</view> </view>
<view class="moreicon"> <view class="moreicon">
<view class='iconfont icon-jiantou'></view> <view class='iconfont icon-jiantou'></view>
@ -17,94 +41,79 @@
</view> </view>
</view> </view>
</view> </view>
<view class='wrapper'> <!--账号信息 提现金额-->
<!--<view :hidden='currentTab != 0' class='list'> <view class='wrapper' v-if="use_account">
<view class='list bank-list'>
<form @submit="subCash" report-submit='true'> <form @submit="subCash" report-submit='true'>
<view class='item acea-row row-between-wrapper'> <!-- 提现账号信息 -->
<view class='name'>持卡人</view> <template v-if="use_account.extract_type == 0">
<view class='input'><input placeholder='请输入持卡人姓名' placeholder-class='placeholder' name="real_name" v-model="real_name"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>卡号</view>
<view class='input'><input type='number' placeholder='请填写卡号' placeholder-class='placeholder' name="bank_code" v-model="bank_code"></input></view>
</view>
<view class='item acea-row row-between-wrapper' v-if="array.length>0">
<view class='name'>银行</view>
<view class='input'>
<picker @change="bindPickerChange" :value="index" :range="array" range-key="name">
<text class='Bank'>{{array[index]["name"]}}</text>
<text class='iconfont icon-qiepian38'></text>
</picker>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>支行信息</view>
<view class='input'><input placeholder='请输入支行信息' placeholder-class='placeholder' name="bank_address" v-model="bank_address"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view>
<view class='input'><input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="extract_price"
type='digit' v-model="extract_price"></input></view>
</view>
<view class='tip mt25'>
当前可提现金额: <text class="price">{{userInfo.brokerage_price}},</text>冻结佣金{{userInfo.lock_brokerage}}
</view>
<view class='tip'>
说明: 每笔佣金的冻结期为{{userInfo.broken_day}}到期后可提现
</view>
<view class="btn-submit">
<button formType="submit" :disabled="load" class='bnt b-color' :class="load ? 'disabled' : ''" >提现</button>
</view>
</form>
</view>-->
<view :hidden='currentTab != 0' class='list bank-list'>
<!--选项卡-->
<view class="bank-tabs">
<view :class="['bank-tab',{'bank-tab-active': bank_type == 0}]" @click="changeTab(0)">个人账户</view>
<view :class="['bank-tab',{'bank-tab-active': bank_type == 1}]" @click="changeTab(1)">企业账户</view>
</view>
<!--表单-->
<form @submit="subCash" report-submit='true'>
<template v-if="bank_type == 0">
<view class='item acea-row row-between-wrapper'> <view class='item acea-row row-between-wrapper'>
<view class='name'>持卡人</view> <view class='name'>账户类型</view>
<view class='input'><input placeholder='请输入持卡人姓名' placeholder-class='placeholder' name="real_name" v-model="real_name"></input></view> <view class='input'>{{ use_account.bank_type == 1 ? '企业账户' : '个人账户'}}</view>
</view> </view>
<view class='item acea-row row-between-wrapper'> <template v-if="use_account.bank_type == 0">
<view class='name'>卡号</view> <view class='item acea-row row-between-wrapper'>
<view class='input'><input type='number' placeholder='请填写卡号' placeholder-class='placeholder' name="bank_code" v-model="bank_code"></input></view> <view class='name'>持卡人</view>
</view> <view class='input'>{{ use_account.real_name }}</view>
<view class='item acea-row row-between-wrapper' v-if="array.length>0"> </view>
<view class='name'>银行</view> <view class='item acea-row row-between-wrapper'>
<view class='input'> <view class='name'>卡号</view>
<picker @change="bindPickerChange" :value="index" :range="array" range-key="name"> <view class='input'>{{ use_account.bank_code }}</view>
<text class='Bank'>{{array[index]["name"]}}</text> </view>
<text class='iconfont icon-qiepian38'></text> <view class='item acea-row row-between-wrapper' v-if="use_account.bank_name">
</picker> <view class='name'>银行</view>
<view class='input'>{{ use_account.bank_name }}</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>支行信息</view>
<view class='input'>{{ use_account.bank_address }}</view>
</view>
</template>
<template v-if="use_account.bank_type == 1">
<view class='item acea-row row-between-wrapper'>
<view class='name'>开户名称</view>
<view class='input'>{{ use_account.real_name }}</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>开户行</view>
<view class='input'>{{ use_account.bank_address }}</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view>
<view class='input'>{{ use_account.bank_code }}</view>
</view>
</template>
</template>
<template v-if="use_account.extract_type == 1">
<view v-if="!sys_extension_type" class="">
<view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view>
<view class='input'>{{ use_account.wechat }}</view>
</view>
<view class='item acea-row row-between-wrapper uploadItem'>
<view class='name'>收款码</view>
<view class='input upload acea-row row-middle'>
<view class='picture' v-if="use_account.extract_pic">
<image :src='use_account.extract_pic'></image>
</view>
</view>
</view> </view>
</view> </view>
<view class='item acea-row row-between-wrapper'> <view v-else class="auto_arrival">
<view class='name'>支行信息</view> <!--微信零钱-->
<view class='input'><input placeholder='请输入支行信息' placeholder-class='placeholder' name="bank_address" v-model="bank_address"></input></view>
</view> </view>
</template> </template>
<template v-if="bank_type == 1"> <template v-if="use_account.extract_type == 2">
<view class='item acea-row row-between-wrapper'>
<view class='name'>开户名称</view>
<view class='input'>
<input placeholder='请输入开户名称' placeholder-class='placeholder' name="real_name" v-model="real_name" />
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>开户行</view>
<view class='input'>
<input placeholder='请输入开户行信息' placeholder-class='placeholder' name="bank_address" v-model="bank_address" />
</view>
</view>
<view class='item acea-row row-between-wrapper'> <view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view> <view class='name'>账号</view>
<view class='input'> <view class='input'>{{ use_account.alipay_code }}</view>
<input type='number' placeholder='请填账号' placeholder-class='placeholder' name="bank_code" v-model="bank_code" /> </view>
<view class='item acea-row row-between-wrapper uploadItem'>
<view class='name'>收款码</view>
<view class='input upload acea-row row-middle'>
<view class='picture' v-if="use_account.extract_pic">
<image :src='use_account.extract_pic'></image>
</view>
</view> </view>
</view> </view>
</template> </template>
@ -112,13 +121,14 @@
<view class='item acea-row row-between-wrapper'> <view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view> <view class='name'>提现</view>
<view class='input'> <view class='input'>
<input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="extract_price" type='digit' v-model="extract_price" /> <input :placeholder='"最低提现金额"+minPrice' name="extract_price" type='digit' v-model="extract_price" :max="userInfo.brokerage_price" />
</view> </view>
</view> </view>
<view class='tip mt25'> <view class='tip mt25'>
当前可提现金额: <text class="price">{{userInfo.brokerage_price}},</text>冻结佣金{{userInfo.lock_brokerage}} 当前可提现金额:<text class="price">{{userInfo.brokerage_price}},</text>
<text v-if="Number(userInfo.lock_brokerage)">冻结佣金{{userInfo.lock_brokerage}}</text>
</view> </view>
<view class='tip'> <view class='tip' v-if="Number(userInfo.broken_day) > 0">
说明: 每笔佣金的冻结期为{{userInfo.broken_day}}到期后可提现 说明: 每笔佣金的冻结期为{{userInfo.broken_day}}到期后可提现
</view> </view>
<view class='tip mt25' v-if="Number(withdraw_commission) > 0"> <view class='tip mt25' v-if="Number(withdraw_commission) > 0">
@ -128,431 +138,151 @@
实际到账<text class="price">{{ (extract_price - (extract_price * withdraw_commission / 100)).toFixed(2) }}</text> 实际到账<text class="price">{{ (extract_price - (extract_price * withdraw_commission / 100)).toFixed(2) }}</text>
手续费: <text class="price">{{ (extract_price * withdraw_commission / 100).toFixed(2) }}</text> 手续费: <text class="price">{{ (extract_price * withdraw_commission / 100).toFixed(2) }}</text>
</view> </view>
<!-- 提现提交按钮 -->
<view class="btn-submit"> <view class="btn-submit">
<button formType="submit" :disabled="load" class='bnt b-color' :class="load ? 'disabled' : ''" >提现</button> <button formType="submit" :disabled="load" class='bnt b-color' :class="load ? 'disabled' : ''" >提现</button>
</view> </view>
</form> </form>
</view> </view>
<view :hidden='currentTab != 1' class='list'>
<form @submit="subCash" report-submit='true'>
<view v-if="!sys_extension_type" class="">
<view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view>
<view class='input'><input placeholder='请填写您的微信账号' placeholder-class='placeholder' name="wechat"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view>
<view class='input'><input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="extract_price"
type='digit' v-model="extract_price"></input></view>
</view>
<view class='item acea-row row-between-wrapper uploadItem'>
<view class='name'>收款码</view>
<view class='input upload acea-row row-middle'>
<view class='picture' v-for="(item,index) in pics" :key="index">
<image :src='item'></image>
<text class='iconfont icon-guanbi1' @click='DelPic(index)'></text>
</view>
<view class='picture acea-row row-center-wrapper row-column' @click='uploadpic' v-if="pics.length < 1">
<text class='iconfont icon-icon25201'></text>
<view>上传图片</view>
</view>
</view>
</view>
<view class='tip mt25'>
当前可提现金额: <text class="price">{{userInfo.brokerage_price}},</text>冻结佣金{{userInfo.lock_brokerage}}
</view>
<view class='tip'>
说明: 每笔佣金的冻结期为{{userInfo.broken_day}}到期后可提现
</view>
<button formType="submit" :disabled="load" class='bnt b-color' :class="load ? 'disabled' : ''" >提现</button>
</view>
<view v-else class="auto_arrival">
<view class='tip'>当前可提现金额: <text class="price">{{userInfo.brokerage_price}}</text>
</view>
<view class='input'><input placeholder-class='placeholder1' name="extract_price"
type='digit' :placeholder="placeholderValue" @focus="placeholderValue = ''" v-model="extract_price"></input>
</view>
<view class='tip mt25' v-if="Number(withdraw_commission) > 0">
提现手续费为: <text class="price">{{ withdraw_commission.toFixed(2) }}%</text>
</view>
<view class='tip mt25' v-if="Number(extract_price) > 0">
实际到账<text class="price">{{ (extract_price - (extract_price * withdraw_commission / 100)).toFixed(2) }}</text>
手续费: <text class="price">{{ (extract_price * withdraw_commission / 100).toFixed(2) }}</text>
</view>
<view class="btn-submit">
<button formType="submit" :disabled="load" class='bnt b-color' :class="load ? 'disabled' : ''" >提现</button>
</view>
</view>
</form>
</view>
<view :hidden='currentTab != 2' class='list'>
<form @submit="subCash" report-submit='true'>
<view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view>
<view class='input'><input placeholder='请填写您的支付宝账号' placeholder-class='placeholder' name="alipay_code"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view>
<view class='input'><input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="extract_price"
type='digit' v-model="extract_price"></input></view>
</view>
<view class='item acea-row row-between-wrapper uploadItem'>
<view class='name'>收款码</view>
<view class='input upload acea-row row-middle'>
<view class='picture' v-for="(item,index) in pics" :key="index">
<image :src='item'></image>
<text class='iconfont icon-guanbi1' @click='DelPic(index)'></text>
</view>
<view class='picture acea-row row-center-wrapper row-column' @click='uploadpic' v-if="pics.length < 1">
<text class='iconfont icon-icon25201'></text>
<view>上传图片</view>
</view>
</view>
</view>
<view class='tip mb25'>
当前可提现金额: <text class="price">{{userInfo.brokerage_price}},</text>冻结佣金{{userInfo.lock_brokerage}}
</view>
<view class='tip' v-if="userInfo.broken_day>0">
说明: 每笔佣金的冻结期为{{userInfo.broken_day}}到期后可提现
</view>
<view class='tip mt25' v-if="Number(withdraw_commission) > 0">
提现手续费为: <text class="price">{{ withdraw_commission.toFixed(2) }}%</text>
</view>
<view class='tip mt25' v-if="Number(extract_price) > 0">
实际到账<text class="price">{{ (extract_price - (extract_price * withdraw_commission / 100)).toFixed(2) }}</text>
手续费: <text class="price">{{ (extract_price * withdraw_commission / 100).toFixed(2) }}</text>
</view>
<view class="btn-submit">
<button formType="submit" :disabled="load" class='bnt b-color' :class="load ? 'disabled' : ''" >提现</button>
</view>
</form>
</view>
</view> </view>
</view> </view>
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authClose"></authorize>
<cash :payMode='pay_type' :pay_close="pay_close" @payClose="payClose" @onChangeFun="onChangeFun" :order_id="currentTab"></cash> <!--提现账号列表-->
<account-list ref="accountList" @use="useAccount"></account-list>
</view> </view>
</template> </template>
<script> <script>
import {extractCash, spreadInfo } from '@/api/user.js';
import {extractCash, extractBank, spreadInfo, getBankInfo} from '@/api/user.js';
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import authorize from '@/components/Authorize'; import authorize from '@/components/Authorize';
import cash from '@/components/cash';
import { configMap } from '@/utils'; import { configMap } from '@/utils';
import spread from "../../../libs/spread"; import accountList from './account_list';
export default { export default {
components: { components: {
cash, authorize,
authorize accountList
}, },
data() { data() {
return { return {
navList: [{ use_account: {},// 使
'id': '0', userInfo: [],
'ids': 1, isAuto: false, //
'name': '银行卡', isShowAuth: false, //
'icon': 'icon-yinhangqia',
'bg_color': '#FE960F'
},
{
'id': '1',
'ids': 2,
'name': '微信',
'icon': 'icon-weixin2',
'bg_color': '#41B035'
},
{
'id': '2',
'ids': 3,
'name': '支付宝',
'icon': 'icon-icon34',
'bg_color': '#00A9F2'
}
],
currentTab: '0',
extract_price: '', extract_price: '',
index: 0,
array: [], //
minPrice: 0.00, // minPrice: 0.00, //
userInfo: [],
isClone: false,
isAuto: false, //
isShowAuth: false, //
loading: true,
load: false, load: false,
pics: [], //
extract_pic: '',
placeholderValue: '0.00',
payColor: '',
pay_close: false,
real_name: '',
bank_address: '',
bank_code: '',
pay_type: [],
withdraw_commission: 0,// withdraw_commission: 0,//
//
bank_type: 0,
historyBankInfo: {},
}; };
}, },
computed: { computed: {
...mapGetters(['isLogin','uid','viewColor']), ...mapGetters(['isLogin','uid','viewColor']),
... configMap(['sys_extension_type', 'withdraw_type']) ... configMap(['sys_extension_type', 'withdraw_type'])
}, },
watch: {
withdraw_type: {
handler(){
this.loadType()
},
immediate: true
}
},
onLoad(options) { onLoad(options) {
if (this.isLogin) { //
this.getUserInfo(); if (!this.isLogin) {
this.getUserExtractBank(); //
this.getBankInfo(); this.isAuto = true;
} else { this.isShowAuth = true
this.isAuto = true; }else{
this.isShowAuth = true //
} this.init();
}
//
if(options.spread) spread(options.spread, this.isLogin)
}, },
methods: { methods: {
loadType(){ //
this.pay_type = [] onLoadFun() {
let withdrawType = this.withdraw_type if(this.isLogin){
if (withdrawType.length > 0) { this.isShowAuth = false;
this.navList.map((value, index) => { this.init();
withdrawType.map(val => {
if (value.ids == val) {
this.pay_type.push(value)
}
})
})
}
this.currentTab = this.pay_type[0].id
},
onLoadFun: function() {
this.isShowAuth = false;
this.getUserInfo();
// this.getUserExtractBank();
},
//
authColse: function(e) {
this.isShowAuth = e
},
/*获取之前提交过的银行卡信息*/
getBankInfo(){
let that = this;
getBankInfo().then(res => {
that.historyBankInfo = res.data || {};
that.historyBankChange();
});
},
getUserExtractBank: function() {
let that = this;
extractBank().then(res => {
let array = res.data;
that.$set(that, 'array', array);
});
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
spreadInfo().then(res => {
that.userInfo = res.data;
that.withdraw_commission = res.data.withdraw_commission || 0;
that.minPrice = res.data.user_extract_min;
});
},
swichNav: function(current) {
this.currentTab = current;
this.load = false;
},
bindPickerChange: function(e) {
this.index = e.detail.value;
},
handlePayColor: function() {
let str = ''
if (this.currentTab == 1) {
str = '#41B035'
} else if (this.currentTab == 2) {
str = '#00A9F2'
} else {
str = '#FE960F '
}
return str
},
uploadpic: function() {
let that = this;
console.log('地方');
that.$util.uploadImageOne('upload/image', function(res) {
console.log(res);
that.pics.push(res.data.path);
that.$set(that, 'pics', that.pics);
that.$set(that, 'extract_pic', that.pics[0])
});
},
/**
* 删除图片
*
*/
DelPic: function(index) {
let that = this,
pic = this.pics[index];
that.pics.splice(index, 1);
that.$set(that, 'pics', that.pics);
},
subCash: function(e) {
let that = this,
value = e.detail.value;
if(that.load) return;
if (that.currentTab == 0) { //
if (value.real_name.length == 0) return this.$util.Tips({
title: '请填写持卡人姓名'
});
if (value.bank_code.length == 0) return this.$util.Tips({
title: '请填写卡号'
});
// if (that.index == 0) return this.$util.Tips({
// title: ""
// });
value.extract_type = 'bank';
value.bank_name = (that.array && that.array.length) ? that.array[that.index].name : '';
value.bank_type = that.bank_type || 0;
} else if (that.currentTab == 1) { //
value.extract_type = 'weixin';
if(!this.sys_extension_type){
value.extract_pic = that.extract_pic
if (value.wechat.length == 0) return this.$util.Tips({
title: '请填写微信号'
});
if (value.extract_pic.length == 0) return this.$util.Tips({
title: '请上传收款码'
});
}
} else if (that.currentTab == 2) { //
value.extract_type = 'alipay';
value.extract_pic = that.extract_pic
if (value.alipay_code.length == 0) return this.$util.Tips({
title: '请填写账号'
});
if (value.extract_pic.length == 0) return this.$util.Tips({
title: '请上传收款码'
});
}
if (value.extract_price.length == 0) return this.$util.Tips({
title: '请填写提现金额'
});
if (Number(value.extract_price) < that.minPrice) return this.$util.Tips({
title: '提现金额不能低于' + that.minPrice
});
value.extract_type = this.currentTab
console.log(value, 'value')
that.load = true;
if(that.sys_extension_type && that.currentTab == 1)
value = {
extract_price: e.detail.value.extract_price,
extract_type: 3
} }
extractCash(value).then(res => { },
//
authClose(e) {
this.isShowAuth = e
},
//
init () {
this.getUserInfo();
},
//
getUserInfo() {
let that = this;
spreadInfo().then(res => {
that.userInfo = res.data;
that.withdraw_commission = res.data.withdraw_commission || 0;
that.minPrice = res.data.user_extract_min;
});
},
//
selectAccount() {
this.$refs.accountList.accountStatusChange();
},
// 使
useAccount(item){
this.$set(this, 'use_account', item);
},
//
subCash(e) {
let that = this, value = e.detail.value, account = Object.assign({}, this.use_account);
//
if(Object.values(account).length <= 0){
that.$util.Tips({title: '请选择账号'});
return false;
}
//
account.extract_price = value.extract_price || 0;
if(that.load) return;
if (account.extract_type == 0) {
//
if (account.real_name.length == 0) return this.$util.Tips({title: '请填写持卡人姓名'});
if (account.bank_code.length == 0) return this.$util.Tips({title: '请填写卡号'});
}
else if (account.extract_type == 1) {
//
if(!this.sys_extension_type){
if (account.wechat.length == 0) return this.$util.Tips({title: '请填写微信号'});
if (account.extract_pic.length == 0) return this.$util.Tips({title: '请上传收款码'});
}
}
else if (account.extract_type == 2) {
//
if (account.alipay_code.length == 0) return this.$util.Tips({title: '请填写账号'});
if (account.extract_pic.length == 0) return this.$util.Tips({title: '请上传收款码'});
}
if (account.extract_price.length == 0) return this.$util.Tips({title: '请填写提现金额'});
if (Number(account.extract_price) < that.minPrice) return this.$util.Tips({title: '提现金额不能低于' + that.minPrice});
that.load = true;
if(that.sys_extension_type && account.extract_type == 1){
account = {
extract_price: value.extract_price,
extract_type: 3
}
}
//
extractCash(account).then(res => {
that.getUserInfo(); that.getUserInfo();
that.load = false; that.load = false;
that.$util.Tips({ uni.showModal({
title: res.message, title: '提示',
icon: 'success' content: res.message,
}); success: function (res) {
setTimeout(function(){ uni.navigateTo({
// uni.navigateBack({ url: '/pages/users/user_spread_user/index'
// delta: 1, });
// }) }
uni.navigateTo({ });
url: '/pages/users/user_spread_user/index'
});
},1000)
}).catch(err => { }).catch(err => {
that.load = false; that.load = false;
return that.$util.Tips({ return that.$util.Tips({title: err});
title: err
});
}); });
}, },
/**
* 打开支付组件
*
*/
goPay: function(pay_price) {
this.$set(this, 'pay_close', true);
// this.$set(this, 'pay_order_id', );
},
/**
* 关闭支付组件
*
*/
payClose: function() {
this.pay_close = false;
},
onChangeFun: function(e) {
let opt = e;
let action = opt.action || null;
let value = opt.value != undefined ? opt.value : null;
(action && this[action]) && this[action](value);
this.currentTab = opt.type
},
//
changeTab(tabIndex){
this.bank_type = tabIndex || 0;
this.historyBankChange();
},
//
historyBankChange(){
let info = this.historyBankInfo[this.bank_type] || {};
this.real_name = info.real_name || '';
this.bank_name = info.bank_name || '';
this.bank_code = info.bank_code || '';
this.bank_address = info.bank_address || '';
}
}, },
// #ifdef MP
//
onShareAppMessage () {
let pages = getCurrentPages();
let page = pages[pages.length - 1]
let shareData = {
title: '提现',
path: page.$page.fullPath || '/' + page.route,
};
//
if (this.isLogin) shareData.path = shareData.path + '?spread=' + this.uid;
//
return shareData
},
//
onShareTimeline() {
let shareData = {
title: '提现',
query: {},
};
//
if (this.isLogin) shareData.query.spread = this.uid;
//
return shareData
},
// #endif
} }
</script> </script>
@ -596,9 +326,6 @@
} }
page { page {
background-color: #F5F5F5 !important; background-color: #F5F5F5 !important;
} }