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.
451 lines
9.4 KiB
451 lines
9.4 KiB
<template>
|
|
<view class="app-container" style="background-color: #f7f7f7;">
|
|
<view class="agent-content">
|
|
<view class="ag-sign" @click="cashManager">
|
|
提现历史
|
|
</view>
|
|
<view class="agent-top">
|
|
<view class="ag-num">
|
|
<view class="au-font">
|
|
￥
|
|
</view>
|
|
<view class="au-num">
|
|
{{accountInfo.wallet_balance}}
|
|
</view>
|
|
</view>
|
|
<view class="age-font">
|
|
可提现
|
|
</view>
|
|
<view class="age-line">
|
|
<img src="../../static/page/line-style.png" style="width: 200rpx;height: 2rpx;" alt="" srcset="" />
|
|
</view>
|
|
<view class="age-wait">
|
|
总提现：￥{{accountInfo.withdraw_total}}
|
|
</view>
|
|
<view class="age-linemore">
|
|
<img src="../../static/page/divider-style.png" style="width: 690rpx;height: 2rpx;" alt="" srcset="" />
|
|
</view>
|
|
<div class="age-mnum">
|
|
<view class="mtext">
|
|
待入账：0元
|
|
</view>
|
|
<view class="mline">
|
|
|
|
</view>
|
|
<view class="mtext">
|
|
提现中：{{accountInfo.withdrawing_amount}}元
|
|
</view>
|
|
</div>
|
|
</view>
|
|
<view class="ag-paylist">
|
|
<view class="agp-item">
|
|
<view class="agp-title">
|
|
<view class="zhifubao">
|
|
支付宝账户
|
|
</view>
|
|
</view>
|
|
<view class="agp-detail" v-if="!accountInfo.alipay_account">
|
|
<view class="agp-make" @click="showInputForm(1)">
|
|
去开通
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<template v-if="isInputForm">
|
|
<view class="apt-main u-border-top u-border-bottom" v-if="isInputForm">
|
|
<view class="apm-cell">
|
|
<view class="am-title">
|
|
支付宝账号
|
|
</view>
|
|
<view class="am-value" style="width:70%;">
|
|
<u--input placeholder="绑定的手机号或邮箱" border="surround" v-model="inputAlipayAccount"></u--input>
|
|
</view>
|
|
</view>
|
|
<view class="apm-cell">
|
|
<view class="am-title">
|
|
支付宝姓名
|
|
</view>
|
|
<view class="am-value" style="width:70%;">
|
|
<u--input placeholder="账号真实姓名" border="surround" v-model="inputAlipayName"></u--input>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="apt-btn">
|
|
<view class="savebtn" @click="saveAlipayAccount">
|
|
保存
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<template v-if="accountInfo.alipay_account && !isInputForm">
|
|
<view class="apt-main u-border-top u-border-bottom">
|
|
<view class="apm-cell">
|
|
<view class="am-title">
|
|
提现账户
|
|
</view>
|
|
<view class="am-value">
|
|
<view class="mphone">
|
|
{{accountInfo.alipay_account}}
|
|
</view>
|
|
<view class="mlink" @click="showInputForm(2)">
|
|
修改
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="apm-cell">
|
|
<view class="am-title">
|
|
可提现金额
|
|
</view>
|
|
<view class="am-value">
|
|
<view class="mnum">
|
|
￥{{accountInfo.wallet_balance}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="apt-btn">
|
|
<view class="cashbtn" @click="showWithdrawForm">
|
|
提现
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
|
|
<u-modal title="确认提现金额" :show="isWithdrawForm" :showCancelButton="true" @confirm="confirmWithdraw"
|
|
@cancel="isWithdrawForm=false">
|
|
<view class="withdraw-form">
|
|
<u--input prefixIcon="￥" placeholder="提现金额" border="surround" v-model="inputAmount"></u--input>
|
|
<view class="fee-desc">
|
|
扣手续费{{calcFee}}元，实际到账{{calcReceiveAmount}}元
|
|
</view>
|
|
<view class="tips">
|
|
<view class="tips-item" v-for="(line,index) in sysConfig.withdraw_tips.split('\r\n')" :key="index">{{line}}</view>
|
|
</view>
|
|
</view>
|
|
</u-modal>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
merchantAccountInfo,
|
|
merchantFillAlipayAccount,
|
|
merchantWithdraw,
|
|
publicSysConfig
|
|
} from '../../common/api.js'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
accountInfo: {},
|
|
isInputForm: false,
|
|
inputAlipayAccount: '',
|
|
inputAlipayName: '',
|
|
isWithdrawForm: false,
|
|
inputAmount: '',
|
|
sysConfig: {}
|
|
}
|
|
},
|
|
computed: {
|
|
calcFee() {
|
|
if (!this.inputAmount || isNaN(this.inputAmount)) {
|
|
return '--';
|
|
}
|
|
if (!this.sysConfig.withdraw_fee_rate) {
|
|
return '--';
|
|
}
|
|
let fee = (this.inputAmount * this.sysConfig.withdraw_fee_rate / 100).toFixed(2);
|
|
return fee;
|
|
},
|
|
calcReceiveAmount() {
|
|
if (!this.inputAmount || isNaN(this.inputAmount)) {
|
|
return '--';
|
|
}
|
|
if (!this.sysConfig.withdraw_fee_rate) {
|
|
return '--';
|
|
}
|
|
let fee = this.calcFee;
|
|
let receiveAmount = (this.inputAmount - parseFloat(fee)).toFixed(2);
|
|
return receiveAmount;
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.getAccountInfo();
|
|
this.getSysConfig();
|
|
},
|
|
methods: {
|
|
getAccountInfo() {
|
|
merchantAccountInfo().then(data => this.accountInfo = data)
|
|
},
|
|
saveAlipayAccount() {
|
|
merchantFillAlipayAccount({
|
|
alipay_account: this.inputAlipayAccount,
|
|
alipay_name: this.inputAlipayName,
|
|
}).then(() => {
|
|
this.getAccountInfo()
|
|
this.isInputForm = false
|
|
})
|
|
},
|
|
showInputForm(flag) {
|
|
this.isInputForm = true
|
|
if (flag == 2) {
|
|
this.inputAlipayAccount = this.accountInfo.alipay_account
|
|
this.inputAlipayName = this.accountInfo.alipay_name
|
|
}
|
|
// uni.navigateTo({
|
|
// url: '/pages/account-opened/account-opened'
|
|
// });
|
|
},
|
|
showWithdrawForm() {
|
|
this.isWithdrawForm = true
|
|
this.inputAmount = this.accountInfo.wallet_balance
|
|
},
|
|
confirmWithdraw() {
|
|
merchantWithdraw({
|
|
amount: this.inputAmount
|
|
}).then(() => {
|
|
this.getAccountInfo()
|
|
this.isWithdrawForm = false
|
|
})
|
|
},
|
|
cashManager() {
|
|
uni.navigateTo({
|
|
url: '/pages/merchant-withdrawal-history/merchant-withdrawal-history'
|
|
});
|
|
},
|
|
getSysConfig() {
|
|
publicSysConfig().then(data => this.sysConfig = data)
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.uni-page-body {
|
|
background: #f7f7f7;
|
|
}
|
|
|
|
.agent-content {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 1400rpx;
|
|
|
|
background: url(../../static/page/merchant-account-opening-bg.png) no-repeat top center;
|
|
background-size: 100% 414rpx;
|
|
box-sizing: border-box;
|
|
|
|
.ag-sign {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
width: 150rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
padding-left: 40rpx;
|
|
border-top-left-radius: 30rpx;
|
|
border-bottom-left-radius: 30rpx;
|
|
color: #fff;
|
|
font-size: 12px;
|
|
background: #FCC565;
|
|
box-sizing: border-box;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.agent-top {
|
|
text-align: center;
|
|
padding-top: 40rpx;
|
|
|
|
.ag-num {
|
|
display: flex;
|
|
justify-content: center;
|
|
padding-top: 20rpx;
|
|
color: #fff;
|
|
|
|
.au-font {
|
|
margin-top: 40rpx;
|
|
font-size: 14px;
|
|
margin-right: 10rpx;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.au-num {
|
|
font-size: 30px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
.age-font {
|
|
margin-top: 10rpx;
|
|
font-size: 16px;
|
|
line-height: 1.5;
|
|
color: #fff;
|
|
}
|
|
|
|
.age-line {
|
|
margin: 20rpx auto 0;
|
|
width: 200rpx;
|
|
height: 2rpx;
|
|
|
|
img {
|
|
display: block;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
.age-wait {
|
|
margin-top: 20rpx;
|
|
color: #fff;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.age-linemore {}
|
|
|
|
.age-mnum {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: 20rpx;
|
|
|
|
.mtext {
|
|
color: #fff;
|
|
font-size: 14px;
|
|
margin: 0 20rpx;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.mline {
|
|
height: 28rpx;
|
|
width: 2rpx;
|
|
background: #F86E78;
|
|
}
|
|
}
|
|
}
|
|
|
|
.ag-paylist {
|
|
padding-left: 30rpx;
|
|
padding-right: 30rpx;
|
|
margin-top: 36rpx;
|
|
background: #fff;
|
|
|
|
.agp-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
height: 100rpx;
|
|
|
|
.agp-title {
|
|
|
|
.zhifubao {
|
|
padding-left: 55rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
color: #454545;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
background: url(../../static/page/payment-icon.png) no-repeat left center;
|
|
background-size: 40rpx 40rpx;
|
|
}
|
|
}
|
|
|
|
.agp-detail {
|
|
|
|
.agp-make {
|
|
padding-right: 30rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
color: #999;
|
|
font-size: 12px;
|
|
background: url(../../static/page/open-icon.png) no-repeat right center;
|
|
background-size: 14rpx 24rpx;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.apt-main {
|
|
padding: 10rpx 0;
|
|
|
|
.apm-cell {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.am-title {
|
|
height: 70rpx;
|
|
line-height: 70rpx;
|
|
color: 454545;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.am-value {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
height: 70rpx;
|
|
line-height: 70rpx;
|
|
|
|
.mphone {
|
|
margin-right: 20rpx;
|
|
font-size: 12px;
|
|
color: #454545;
|
|
}
|
|
|
|
.mlink {
|
|
font-size: 12px;
|
|
color: #32A2FC;
|
|
}
|
|
|
|
.mnum {
|
|
font-size: 14px;
|
|
color: 454545;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.u-border-bottom,
|
|
.u-border-top {
|
|
border-color: #eee !important;
|
|
}
|
|
|
|
.apt-btn {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
padding: 30rpx 0;
|
|
|
|
.cashbtn {
|
|
width: 110rpx;
|
|
height: 48rpx;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
color: #fff;
|
|
font-size: 12px;
|
|
background: #F52F3E;
|
|
border-radius: 100rpx;
|
|
}
|
|
|
|
.savebtn {
|
|
width: 110rpx;
|
|
height: 48rpx;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
color: #fff;
|
|
font-size: 12px;
|
|
background: #00aaff;
|
|
border-radius: 100rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.withdraw-form {
|
|
font-size: 28rpx;
|
|
.tips {
|
|
margin-top: 20rpx;
|
|
|
|
.tips-item {
|
|
margin-top: 6rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|