jp-51parking/pagesFinance/user/withdraw.vue

<template>
	<view>
		<u-navbar title="提现"></u-navbar>
		<view class="withdraw">
			<view class="withdraw-head">
				<b>提现至</b><span>{{code}}</span>
			</view>
			<view class="withdraw-head">
				<b>上次提现时间</b><span>{{info.startTime}}</span>
			</view>
			<view class="withdraw-head">
				<b>本次提现时间</b><span>{{info.endTime}}</span>
			</view>
			<view class="withdraw-head">
				<b>此期间累计产生订单数</b><span>{{info.total}}笔</span>
			</view>
			<view class="withdraw-head">
				<b>此期间总分润金额</b><span>{{info.amount?info.amount:0}}元</span>
			</view>
			
			<view class="withdraw-main" v-if="false">
				<p>申请提现金额(元)</p>
				<view class="withdraw-input">
					<span>￥</span>
					<u-input v-model="value" :type="type" placeholder-style="font-size:28px;height:40px;line-height:40px;color:#ccc;" />
				</view>
			</view>
			<view class="withdraw-foot"  v-if="false">
				<p>可提现余额 ¥{{home.accountBalance}}</p>
				<span @click="value=home.accountBalance">全部提现</span>
			</view>
		</view>
		<view class="applyBtn">
			<u-button :class="{
				'applyBtn-btn':!info.amount
			}" @click="submit()" type="primary">申请提现，7日内到账</u-button>
		</view>
		<view class="withdraw-tips">
			<h4>提现说明：</h4>
			<p>由于银行清算，提现申请将于次日内到账。如遇高峰期，可能延时到账，请耐心等待。</p>
		</view>
	</view>
</template>

<script>
	import * as API from '@/apis/finance.js'
	import {
		parseUnixTime,
		substrMb
	} from '@/utils'
	export default {
		data() {
			return {
				info:{},
				code:"",
				value: '',
				type: 'number',
				nowTime:"",
					home:{
						accountBalance:0
					},
			}
		},
		onReady() {
		
			//this.getHomePage()
		},
		onShow(){
				this.nowTime=parseUnixTime(new Date())
			this.getHomePage()
		},
		methods: {
			submit(){
				//this.value=this.info.amount
				if(!this.info.amount){
						uni.showToast({
							title: "可提现金额为0"
						})

					return
				}
				
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				API.applyWithdraw(this.info).then((res) => {
					
						uni.redirectTo({
							url:"/pagesFinance/user/applyResult?value="+this.value
						})
					
				}).catch(error => {
					uni.showToast({
						title: error
					})
				})
			},
			queryWithdrawInfo(){
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				API.queryWithdrawInfo().then((res) => {
					this.info=res.data;
					
					uni.hideLoading()
					
				}).catch(error => {
					uni.showToast({
						title: error
					})
				})
			},
			getHomePage(){
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				API.homePage().then((res) => {
					this.home = res.data
					var bankCard="";
					if(this.home.bankCard){
						bankCard=substrMb(this.home.bankCard,0,4)+"****"+substrMb(this.home.bankCard,8,4)
					}
					this.code=this.home.bank+":"+bankCard;
					if(this.home.bank==null&&this.home.bankCard==null){
						this.code="未绑定"
					}
					
					uni.hideLoading()
					this.queryWithdrawInfo()
				}).catch(error => {
					uni.showToast({
						title: error
					})
				})
			}
		}
	}
</script>
<style>
	page{
		background-color: #F7F7F7;
	}
</style>
<style lang="scss" scoped>
	.withdraw-tips{
		margin:24px 16px;
		p{
			color:#999;
			margin-top: 4px;
		}
	}
	.withdraw{
		margin: 16px;
		background-color: #fff;
		padding: 16px;
		.withdraw-head{
			// margin: 16px 0;
			padding: 16px 0;
		
			border-bottom: 1px solid #f7f7f7;
			
			align-items: center;
			b{
				color:#999;
			}
			span{
				margin-left: 12px;
				float: right;
			}
		}
		.withdraw-main{
			border-top: 1px solid #f7f7f7;
		border-bottom: 1px solid #f7f7f7;
		
			margin: 16px 0;
			padding: 16px 0;
			.withdraw-input{
				margin-top: 32px;
				display: flex;
				align-items: center;
				font-size: 28px;
				/deep/.uni-input-input{
					font-size: 28px;
				}
			}
		}
		.withdraw-foot{
			display: flex;
			align-items: center;
			p{
				color:#999
			}
			span{
				color:#2979FF;
				margin-left: 16px;
			
			}
		}
	}
	.applyBtn{
		margin: 16px;
	}
	.applyBtn-btn{
		background-color: #185AC6;
		opacity: 0.5;
		border-color:#185AC6 ;
		border-radius: 8px;
	}
</style>