2 Commits
be4e0dbd2b
...
bacab84ece
| Author | SHA1 | Message | Date |
|---|---|---|---|
mike
|
bacab84ece |
Merge branch 'master' of ssh://106.55.174.214:222/weixiari-124/agent-app
|
2 years ago |
|
mike
|
85b30b4ecc |
添加商户支付宝相关页面
|
2 years ago |
5 changed files with 637 additions and 0 deletions
-
3agentApp/common/api.js
-
16agentApp/pages.json
-
20agentApp/pages/merchant-index/index.vue
-
147agentApp/pages/merchant-withdrawal-history/merchant-withdrawal-history.vue
-
451agentApp/pages/merchant-withdrawal-management/merchant-withdrawal-management.vue
@ -0,0 +1,147 @@ |
|||||
|
<template> |
||||
|
<view class="app-container"> |
||||
|
<u-gap height="10rpx" bgColor="#F7F7F7"></u-gap> |
||||
|
<view class="his-content"> |
||||
|
<view class="his-item u-border-bottom" v-if="!withdrawList.length">暂无数据</view> |
||||
|
<view class="his-item u-border-bottom" v-for="(item,index) in withdrawList" :key="item.id"> |
||||
|
<view class="hit-left"> |
||||
|
<view class="his-name"> |
||||
|
流水号: {{item.out_biz_no}} |
||||
|
</view> |
||||
|
<view class="his-state" v-if="item.status==0"> |
||||
|
审核状态：审核中 |
||||
|
</view> |
||||
|
<view class="his-state" v-if="item.status==1"> |
||||
|
审核状态：<text style="color:green">提现成功</text> |
||||
|
</view> |
||||
|
<view class="his-state" v-if="item.status==2"> |
||||
|
审核状态：<text style="color:red">审核不通过（原因：{{item.review_remark}})</text> |
||||
|
</view> |
||||
|
<view class="his-state"> |
||||
|
提现金额：￥{{item.amount}} |
||||
|
</view> |
||||
|
<view class="his-state"> |
||||
|
扣手续费：￥{{item.fee}} |
||||
|
</view> |
||||
|
<view class="his-state"> |
||||
|
实际到账：￥{{item.receive_amount}} |
||||
|
</view> |
||||
|
<view class="his-state"> |
||||
|
提现账户：{{item.alipay_account}} |
||||
|
</view> |
||||
|
<view class="his-time"> |
||||
|
申请时间：{{item.created_at}} |
||||
|
</view> |
||||
|
<view class="his-time"> |
||||
|
审核时间：{{item.reviewed_at}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- <view class="hit-right"> |
||||
|
<view class="amount">提现金额：￥{{item.amount}}</view> |
||||
|
<view class="fee">手续费：￥{{item.fee}}</view> |
||||
|
<view class="receive-amount">实到账：￥{{item.receive_amount}}</view> |
||||
|
</view> --> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="load-more" @click="getWithdrawList">{{ hasMore ? '加载更多数据...' : '已加载完毕' }}</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { |
||||
|
merchantWithdrawList |
||||
|
} from '../../common/api.js' |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
withdrawList: [], |
||||
|
hasMore: true, |
||||
|
page: 0, |
||||
|
}; |
||||
|
}, |
||||
|
onLoad() { |
||||
|
this.getWithdrawList() |
||||
|
}, |
||||
|
onReachBottom() { |
||||
|
this.getWithdrawList() |
||||
|
}, |
||||
|
methods: { |
||||
|
getWithdrawList() { |
||||
|
if (!this.hasMore) { |
||||
|
return |
||||
|
} |
||||
|
this.page++ |
||||
|
merchantWithdrawList({ |
||||
|
page: this.page, |
||||
|
page_size: 15, |
||||
|
}).then(data => { |
||||
|
this.withdrawList = [...this.withdrawList, ...data.list] |
||||
|
this.hasMore = data.has_more |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.his-content { |
||||
|
padding: 0 30rpx; |
||||
|
|
||||
|
.his-item { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
padding: 30rpx 0 30rpx; |
||||
|
|
||||
|
.hit-left { |
||||
|
|
||||
|
.his-name { |
||||
|
color: #454545; |
||||
|
font-size: 12px; |
||||
|
line-height: 1.8; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
.his-state { |
||||
|
color: #666; |
||||
|
font-size: 12px; |
||||
|
line-height: 1.8; |
||||
|
} |
||||
|
|
||||
|
.his-time { |
||||
|
color: #999; |
||||
|
font-size: 12px; |
||||
|
line-height: 1.8; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.hit-right { |
||||
|
font-size: 14px; |
||||
|
color: #454545; |
||||
|
font-weight: bold; |
||||
|
|
||||
|
.amount { |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.fee { |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.receive_amount { |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.u-border-bottom, |
||||
|
.u-border-top { |
||||
|
border-color: #eee !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.load-more { |
||||
|
text-align: center; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,451 @@ |
|||||
|
<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> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue