236 lines
4.7 KiB
Vue
236 lines
4.7 KiB
Vue
<template>
|
||
<view class="whole">
|
||
<view class="oneBox">
|
||
<view class="tit">可提现金额（元）</view>
|
||
<view class="ac"><text>¥</text>{{can_amount}}</view>
|
||
</view>
|
||
<view class="twoBox">
|
||
<view class="cont">
|
||
<view class="tit">提现金额</view>
|
||
<view class="acBox flex1">
|
||
<view class="flex">
|
||
<view class="prefix">¥</view>
|
||
<input type="text" v-model="amount" placeholder="满1.01可提现" placeholder-style="font-size: 28rpx;" class="inpt"/>
|
||
</view>
|
||
<view class="red" @click="allIn">全部提现</view>
|
||
</view>
|
||
<view class="text flex1">
|
||
<view>提现至</view>
|
||
<view class="flex">{{bank_name}}({{card_id}})</view>
|
||
</view>
|
||
<view class="tips">提现固定收取1元手续费</view>
|
||
<view class="btn flex" :class="is_can ? '' : 'dis'" @click="toTixian">{{is_can ? '申请提现' : '提现中...'}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import { reactive, toRefs } from 'vue'
|
||
import { get, post } from '@/api/request.js'
|
||
import { showToast } from '@/components/common.js'
|
||
|
||
export default {
|
||
setup() {
|
||
const data = reactive({
|
||
can_amount: '',
|
||
Color: uni.getStorageSync('theme_color'),
|
||
amount: '',
|
||
loading: false,
|
||
bank_name: '',
|
||
card_id: '',
|
||
is_can: true,
|
||
Status: {
|
||
'0': '提现中',
|
||
'1': '提现成功',
|
||
'2': '提现失败',
|
||
'3': '待发起提现'
|
||
}
|
||
})
|
||
|
||
function toTixian() {
|
||
if(data.is_can) {
|
||
if(data.can_amount * 100 == 0) {
|
||
showToast('没有可提现的金额')
|
||
return
|
||
} else if(data.amount * 100 == 0) {
|
||
showToast('提现金额不正确')
|
||
return
|
||
}
|
||
if(data.loading) {
|
||
return
|
||
}
|
||
uni.showLoading({
|
||
title: '正在提交...',
|
||
mask: true
|
||
})
|
||
data.loading = true
|
||
post(`/api/v1/sales/distributor/withdraw`, {amount: data.amount}).then((res) => {
|
||
uni.hideLoading()
|
||
showToast('申请提交成功', 'success')
|
||
data.loading = false
|
||
setTimeout(() => {
|
||
uni.navigateBack({delta: 1})
|
||
}, 500)
|
||
}).catch((err) => {
|
||
console.log(err)
|
||
showToast(JSON.stringify(err))
|
||
uni.hideLoading()
|
||
data.loading = false
|
||
})
|
||
}
|
||
}
|
||
|
||
function allIn() {
|
||
if(data.can_amount * 100 == 0) {
|
||
showToast('没有可提现的金额')
|
||
return
|
||
}
|
||
data.amount = data.can_amount
|
||
}
|
||
|
||
function getInfo() {
|
||
get(`/api/v1/sales/distributor/show`).then((res) => {
|
||
data.can_amount = res.data.amount
|
||
data.bank_name = res.data.bank_name
|
||
data.card_id = res.data.card_id.slice(-4)
|
||
data.is_can = res.data.account && res.data.account.withdraw_status != 1
|
||
})
|
||
}
|
||
|
||
return {
|
||
...toRefs(data),
|
||
toTixian,
|
||
getInfo,
|
||
allIn
|
||
}
|
||
},
|
||
async onLoad(options) {
|
||
this.getInfo()
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.flex{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.flex1{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.oneBox{
|
||
padding: 80rpx 30rpx 160rpx;
|
||
background-color: v-bind('Color');
|
||
.tit{
|
||
font-size: 28rpx;
|
||
color: rgba(255, 255, 255, 0.8);
|
||
}
|
||
.ac{
|
||
font-weight: 600;
|
||
font-size: 60rpx;
|
||
color: #fff;
|
||
margin-top: 30rpx;
|
||
line-height: 1;
|
||
text{
|
||
font-size: 30rpx;
|
||
}
|
||
}
|
||
}
|
||
.twoBox{
|
||
position: relative;
|
||
z-index: 2;
|
||
margin-top: -100rpx;
|
||
padding: 0 30rpx;
|
||
.cont{
|
||
width: 100%;
|
||
background-color: #fff;
|
||
border-radius: 10rpx;
|
||
padding: 24rpx 24rpx 50rpx;
|
||
box-sizing: border-box;
|
||
color: #333;
|
||
font-size: 28rpx;
|
||
.tit{
|
||
font-size: 30rpx;
|
||
}
|
||
.acBox{
|
||
border-bottom: 1rpx solid #e8e8e8;
|
||
margin: 40rpx 0;
|
||
padding-bottom: 10rpx;
|
||
.prefix{
|
||
font-size: 50rpx;
|
||
}
|
||
.inpt{
|
||
padding-left: 20rpx;
|
||
font-size: 50rpx;
|
||
width: 300rpx;
|
||
}
|
||
.red{
|
||
color: #F56C6C;
|
||
}
|
||
}
|
||
.tips{
|
||
color: #F56C6C;
|
||
font-size: 24rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
.btn{
|
||
margin-top: 80rpx;
|
||
width: 100%;
|
||
height: 80rpx;
|
||
border-radius: 80rpx;
|
||
font-size: 30rpx;
|
||
color: #fff;
|
||
background-color: v-bind('Color');
|
||
&.dis{
|
||
opacity: 0.7;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.threeBox{
|
||
padding: 24rpx;
|
||
.item{
|
||
border-radius: 8rpx;
|
||
background-color: #fff;
|
||
font-size: 28rpx;
|
||
margin-bottom: 24rpx;
|
||
.sn{
|
||
border-bottom: 1rpx solid #f5f5f5;
|
||
padding: 24rpx;
|
||
}
|
||
.box{
|
||
padding: 24rpx;
|
||
.ac{
|
||
font-size: 30rpx;
|
||
text{
|
||
font-weight: 600;
|
||
color: v-bind('Color');
|
||
}
|
||
}
|
||
}
|
||
.time{
|
||
font-size: 24rpx;
|
||
color: #666;
|
||
margin-top: 20rpx;
|
||
}
|
||
.text0{
|
||
color: #f90;
|
||
}
|
||
.text1{
|
||
color: #07c160;
|
||
}
|
||
.text2{
|
||
color: #f00;
|
||
}
|
||
.text3{
|
||
color: #999;
|
||
}
|
||
}
|
||
}
|
||
</style>
|