wxThird/pages/referral/extract.vue

<template>
	<view class="box">
		<view class="tixiancs">
			<view class="tixiancsLeft">本月已提现{{detail.count}}次</view>
			<view class="tixiancsRight" @click="goRouter('extractList')">提现明细</view>
		</view>
		<view class="header">
			<view class="title">提现金额</view>
			<view class="moneyView">
				<text class="icon">￥</text>
				<input type="digit" class="moneyInput" placeholder-style="color:#999999; font-size:30rpx"
					placeholder="请输入提现金额" v-model="money" @input="inputValue" />
				<view class="allBtn" @click="allBtn">全部提现</view>
			</view>
			<view class="zongMoney">可提现金额: <span style="color: #FF0000;">￥{{detail.canMoney}}</span>  (冻结金额:{{detail.freezeMoney}}) </view>

			
		</view>

		<view class="tishi" style="padding: 20rpx 44rpx;">
			<view class="tishiLine">
				<view class="tishiY"></view>
				<view class="tishiTxt">提现冻结天数：{{detail.explain&&detail.explain.freezeDay}}天</view>
			</view>
			<view class="tishiLine">
				<view class="tishiY"></view>
				<view class="tishiTxt">最小提现金额：{{detail.explain&&detail.explain.singleLow}}元</view>
			</view>
			<view class="tishiLine">
				<view class="tishiY"></view>
				<view class="tishiTxt">每月可提现次数：{{detail.explain&&detail.explain.monthlyMost}}次</view>
			</view>
		</view>

		<view class="sureBtn" @click="sure">申请提现</view>

		

	</view>
</template>

<script>
	export default {
		data() {
			return {
				okMoney: '',
				money: '',
				name: '',
				account: '',
				detail: {},
				couContent: '', //提现规则
			}
		},
		onLoad() {
			this.getDetailData()
		},
		methods: {
			goRouter(url){
				uni.navigateTo({
					url:url
				})
			},
			getDetailData() {
				uni.showLoading({
					title: '加载中'
				})
				
				this.$http('openMCustomer/getWithdrawalInfo', {}, 'GET').then(res => {
					uni.hideLoading();
					this.detail = res.data;
					this.okMoney=this.detail.canMoney

				})
			},
			inputValue(event) {
				if (event.detail.value < 0) {
					setTimeout(() => {
						this.money = 0; // 解决
					}, 0)
				} else {
					this.money = event.detail.value;
				}
			},

			allBtn() {

				setTimeout(() => {
					this.money = this.okMoney; // 解决
				}, 0)


				console.log('money,allmoney', this.money, this.okMoney);
			},
			sure() {
				 if (this.money > this.okMoney) {
				 	uni.showToast({
				 		title: '提现金额不能大于可提现金额',
				 		icon: 'none',
						duration: 3000,
				 	});
				 	return;
				 }
				 if (this.money <= 0) {
				 	uni.showToast({
				 		title: '提现金额不能为空',
				 		icon: 'none',
						duration: 3000,
				 	});
				 	return;
				 }
				

				this.postData();
			},
			postData() {
				uni.showLoading({
					title: '提现中'
				})
				let url = 'openMCustomer/applyWithdrawal',
					params = {
						money: this.money,
						
					}
				this.$http(url, params, 'POST').then(res => {
					uni.hideLoading();
					if(res.code==0){
						uni.showModal({
							title: '提交成功',
							content: '请耐心等待平台审核',
							showCancel:false,
							confirmText:'知道了',
							success: function(res) {
						
								uni.navigateBack({
						
								})
							}
						});
					}else{
						// uni.showToast({
						//  		title: '提现金额不能为空',
						//  		icon: 'none',
						//  		duration: 3000,
						//  	});
					}
					



				})
			},
		}
	}
</script>

<style>
	.box {
		min-height: 100vh;
		background: #F4F5F7;
		padding-top: 20rpx;
	}
	.tishiLine{
		display: flex;
	}
	.tishiY{
		width: 10rpx;
		height: 10rpx;
		background: #DDDDDD;
		margin-top: 16rpx;
	}
	.tishiTxt{
		padding-left: 18rpx;
	}
.tixiancs{
	display: flex;
	justify-content: space-between;
	font-size: 24rpx;
	padding-left: 24rpx;
	padding-right: 24rpx;
	padding-bottom: 20rpx;
}
.tixiancsLeft{
	color: #999999;
}
.tixiancsRight{
	color: #1677FF;
}
	.header {
		background-color: #FFFFFF;
		margin: 0 24rpx;
		border-radius: 10rpx;
		padding: 30rpx 20rpx;
		
	}

	.title {
		font-size: 28rpx;
		color: #3C3C3C;
		font-weight: bold;
	}

	.moneyView {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 15rpx 0;
	}

	.icon {
		font-size: 50rpx;
		color: #222222;
		font-weight: bold;
	}

	.moneyInput {
		font-size: 70rpx;
		color: #222222;
		font-weight: bold;
		/* flex-grow: 1; */
		height: 98rpx;
		width: 100%;
	}

	.allBtn {
		font-size: 26rpx;
		color: #FF0000;
		width: 200rpx;
		height: 50rpx;
		line-height: 50rpx;
		margin-left: 10rpx;
		text-align: right;
	}

	.zongMoney {
		font-size: 26rpx;
		color: #999999;
		
	}

	.line {

		background-color: #EEEEEE;
		height: 1rpx;
	}

	.name {
		display: flex;
		justify-content: flex-start;
		padding: 28rpx 0;
	}

	.leftTitle {
		font-size: 30rpx;
		color: #3C3C3C;
		margin-right: 90rpx;
	}

	.Input {
		font-size: 30rpx;
		color: #333333;

	}

	.tishi {
		padding: 0 44rpx;
		font-size: 26rpx;
		color: #999999;
		line-height: 1.5;
	}

	.sureBtn {
		width: 690rpx;
		margin: 20rpx 30rpx;
		border-radius: 37rpx;
		height: 74rpx;
        background: #D53533;
		color: #FFFFFF;
		font-size: 30rpx;
		text-align: center;
		line-height: 74rpx;
	}
</style>