clsd/app/pages/user/money/cash_out.vue

<template>
	<view class="main">
		<view class="mcard">
			<view class="money">{{ money }}</view>
			<view class="desc">可提现余额（元）</view>
		</view>
		<view class="mcard mt10 pd0">
			<view class="form_group">
				<view class="lable re">提现金额</view>
				<view class="bgm">
					<input type="digit" v-model="item.money" placeholder="请输入提现金额" class="input" />
					<view class="msg" @click="all()">提现全部</view>
				</view>
			</view>
			<view class="form_group">
				<view class="lable re">提现方式</view>
				<view class="item">
					<view class="lit" @click="item.way = 0">
						<text class="icon tb" style="color: #ff9800">&#xe635;</text>
						<view class="title">
							<text>提现到银行卡</text>
							<text class="desc" @click="go()">{{ bankName ? '查看' : '(未填)' }}</text>
						</view>
						<text class="icon check" v-if="item.way == 0">&#xe612;</text>
					</view>
					<view class="lit" @click="item.way = 1">
						<text class="icon tb" style="color: #4caf50">&#xe620;</text>
						<view class="title">提现到微信</view>
						<text class="icon check" v-if="item.way == 1">&#xe612;</text>
					</view>
				</view>
			</view>
		</view>
		<view class="bz" v-if="platform.cashOutMoney > 0">最少提现金额：¥{{ platform.cashOutMoney }}起</view>
		<button class="btn" @click="save()">确认</button>
		<u-popup :show="show" round="15" mode="center" :closeable="true" :closeOnClickOverlay="false" :customStyle="{ width: '85%' }" @close="show = false">
			<view class="popup">
				<view class="mtt">提现</view>
				<view class="money">¥{{ item.money }}</view>
				<view>
					<view class="item">
						<text class="tt">服务费</text>
						<text class="la">¥{{ item.serviceMoney }}</text>
					</view>
					<view class="item">
						<text class="tt">费率</text>
						<text class="la">{{ platform.cashOutService || 0 }}%</text>
					</view>
					<view class="item">
						<text class="tt">实际到账</text>
						<text class="la">¥{{ item.realMoney }}</text>
					</view>
				</view>
				<button class="btn" @click="ok()">确定</button>
			</view>
		</u-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
			money: 0, //提现金额
			bankName: '', //是否填写银行卡
			item: { way: 0, money: '' },
			show: false,
			platform: { cashOutMoney: 0 }
		};
	},
	onShow() {
		this.money = uni.getStorageSync('money');
		this.bankName = uni.getStorageSync('bankName');
	},
	onLoad() {
		this.getPlatform();
	},
	methods: {
		//平台服务费信息
		getPlatform() {
			this.http.request({
				url: '/app/pay/getPlatform',
				success: (res) => {
					this.platform = res.data.data;
				}
			});
		},
		all() {
			this.item.money = this.money;
		},
		go() {
			uni.navigateTo({ url: '/pages/statement/user/info' });
		},
		save() {
			let rule = [{ name: 'money', checkType: 'notnull', errorMsg: '请输入提现金额' }];
			if (!this.verify.check(this.item, rule)) {
				uni.showModal({ content: this.verify.error, showCancel: false });
				return false;
			}
			if (this.item.way == 0 && !this.bankName) {
				uni.showModal({
					title: '提示',
					content: '请先填写银行卡信息',
					showCancel: false,
					success: (res) => {
						this.go();
					}
				});
				return;
			}
			this.item.serviceMoney = (this.item.money * (this.platform.cashOutService / 100)).toFixed(2);
			this.item.realMoney = (this.item.money - this.item.serviceMoney).toFixed(2);
			this.show = true;
		},
		ok() {
			this.http.request({
				url: '/app/pay/cashOut',
				data: this.item,
				method: 'POST',
				success: (res) => {
					//通知模板订阅消息
					uni.requestSubscribeMessage({
						tmplIds: ['PtdKbqfzmpvGsJPx_YekDX4-cljbhOXcvoUB3XJaVLg', 'NIqSQq0j765o9Iz9gMiSelnuxMgPIPeCnk3lvEnWJlo'],
						complete: (c) => {
							uni.showModal({
								title: '提示',
								content: '提现申请成功,等待平台审核打款',
								showCancel: false,
								success: (res) => {
									uni.$emit('payMoney');
									uni.navigateBack();
								}
							});
						}
					});
				}
			});
		}
	}
};
</script>

<style lang="scss">
.bgm {
	.input {
		width: 50%;
	}
}
.lit {
	padding: 15px 0px 15px 0px;
	border-bottom: 1px solid $line;
	.tb {
		padding-right: 6px;
		font-size: 25px;
		float: left;
		margin-top: -3px;
	}
	.desc {
		font-size: 13px;
		padding-left: 5px;
		color: #a8a8a8;
	}
	.check {
		float: right;
		color: $main-color;
		margin-top: -22px;
		font-size: 20px;
	}
	&:last-child {
		border: 0px;
		padding-bottom: 5px;
	}
}
</style>