purchase-let/pageQuota/Balance/index1.vue

227 lines
5.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content">
<view class="total">
<view class="">
账户总余额()
</view>
<view style="font-size: 36rpx;">
{{balance||0.00}}
</view>
</view>
<view class="action">
<view class="">
提现至
</view>
<view style="font-weight: bold;" @click="showPop1=true">
{{target_bank.is_own?'对公账户':"个人账户"}}
</view>
<view style="display: flex;align-items: center;color: #20B128;"
@click="navgo('/pageQuota/Balance/bindAccout')">
<text>更换账户</text> <up-icon color="#20B128" name="arrow-right"></up-icon>
</view>
</view>
<view class="form" v-if='target_bank.bank_name'>
<up-form labelPosition="left" borderBottom :label-style="{fontSize:'30rpx'}" ref="form1" labelWidth='70'>
<up-form-item label="银行卡" prop="userInfo.name" borderBottom ref="item1">
<up-input style="border: none;" v-model="target_bank.bank_name" />
</up-form-item>
<up-form-item label="持卡人" prop="userInfo.name" borderBottom ref="item1">
<up-input style="border: none;" v-model="target_bank.name" />
</up-form-item>
<up-form-item label="银行账户" prop="userInfo.name" borderBottom ref="item1">
<up-input style="border: none;" v-model="target_bank.bank_code" />
</up-form-item>
<up-form-item label="开户网点" prop="userInfo.name" borderBottom ref="item1">
<up-input style="border: none;" v-model="target_bank.bank_branch" />
</up-form-item>
<up-form-item label="提现金额" prop="userInfo.name" borderBottom ref="item1">
<up-input style="border: none;" v-model="form.money" placeholder="请输入提现金额" />
</up-form-item>
<text style="color: #999999;font-size: 24rpx;">
说明:用户下单后该订单金额存放在暂存金额中用户确认收货后次日18:00才可提现该笔订单金额
提货付款订单在完成后次日18:00才可提现
</text>
</up-form>
</view>
<up-empty mode="data" v-else :text='emptyText'
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/attach/89e93202405131146497294.png" />
<view class="detail" @click="navgo('/pageQuota/Balance/detail')">
明细
</view>
<view class="submit-btn">
<up-button text="提现" @click="submit" shape="circle" color="#50C758"></up-button>
</view>
<up-popup :show="showPop1" :round="10" mode="bottom" @close="showPop1=false" @open="showPop1=true">
<view class="popContent">
<view style="text-align: center;font-weight: bold;">请选择提现账户</view>
<up-icon name="close" color="#303133" size="24" @click="showPop1=false"
style="position: absolute;top: 20rpx;right: 20rpx;"></up-icon>
<view class="bank-list">
<view class="bank-li" @click="choseAccount(0)">
<text>个人账户</text>
</view>
<view class="bank-li" @click="choseAccount(1)">
<text>对公账户</text>
</view>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {
bankListApi,
amountAccountApi,
UserWithdrawApi
} from "@/api/balance.js"
import {
ref,
reactive
} from 'vue';
import {
onPullDownRefresh
} from "@dcloudio/uni-app"
const emptyText = '您尚未绑定提现账户,\n点击右上角"添加账户"'
const showPop1 = ref(false)
const choseAccount = (type) => {
target_bank.value = bank_list.value[type] || {}
console.log(target_bank.value)
showPop1.value = false
}
const showPop = ref(false)
const navgo = (url) => {
uni.navigateTo({
url
})
}
const bankList = ref([])
const getBankList = async () => {
let res = await bankListApi()
bankList.value = res.data.lists
}
const choseBank = (item) => {
form.bank_name = item.name
form.bank_id = item.id
showPop.value = false
}
const form = reactive({
money: ""
})
const bank_list = ref([])
const balance = ref(0.00)
const target_bank = ref([])
const getBanlance = (isAsync) => {
amountAccountApi().then(res => {
balance.value = res.data.balance
bank_list.value = res.data.bank_list
target_bank.value = res.data.bank_list[0] || {}
if (isAsync) {
uni.stopPullDownRefresh();
}
})
}
getBanlance()
const submit = async () => {
await UserWithdrawApi({
"merchant_bank_id": target_bank.value.id,
"amount": form.money
})
uni.showToast({
title: '提交成功',
duration: 1500
})
uni.$u.sleep(1500).then(res => {
uni.navigateTo({
url: '/pageQuota/Balance/detail'
})
})
}
getBankList()
onPullDownRefresh(() => {
getBanlance(true)
})
</script>
<style lang="scss">
.content {
padding: 20rpx;
.total {
background-color: #50C758;
border-radius: 16rpx 16rpx 16rpx 16rpx;
color: white;
display: flex;
justify-content: space-between;
padding: 42rpx 30rpx;
font-size: 30rpx;
margin-bottom: 30rpx;
}
.action {
background-color: white;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 30rpx;
display: flex;
justify-content: space-between;
margin-bottom: 30rpx;
}
.form {
padding: 28rpx 30rpx;
background-color: white;
border-radius: 20rpx;
}
}
.popContent {
padding: 20rpx;
.bank-list {
overflow-y: auto;
position: relative;
max-height: 40vh;
.bank-li {
display: flex;
align-items: center;
justify-content: center;
padding: 20rpx;
border-bottom: 1px solid #F8F9FA;
}
}
}
.detail {
width: 88rpx;
height: 88rpx;
border-radius: 88rpx;
text-align: center;
line-height: 88rpx;
background-color: #50C758;
color: white;
position: absolute;
bottom: 300rpx;
right: 20rpx;
}
.submit-btn {
position: fixed;
bottom: 146rpx;
width: 710rpx;
}
</style>