shunfengche-sfd/my/wallet/Txmoney.vue

<template>
	<view class="content" v-if="shangxian =='否'">
		<view class="part_one">
			<view class="one_title">可提现金额</view>
			<view class="one_price">¥{{mayMoney}}</view>
		</view>
		<view class="part_two">
			<view class="two_title">提现金额
				<!-- <text>提现最低额度{{minMoney}}元</text> -->
			</view>
			<view class="two_box">
				¥
				<u-input v-model="money" type="number" :clearable="false" placeholder="请输入提现金额" />
			</view>

			<view class="beizhu">*注单笔限制提现最低额度{{minMoney}}元，最大提现额度为{{manMoney}}元，单笔提现手续费{{shouxufei*100}}%</view>

		</view>
		<view class="part_three">
			<view class="three_name">提现方式</view>
			<view class="btn">
				<view class="btn_right" :class="current==1?'btna':''" @click="bindToindex(1)">
					<image src="../static/zhifubao.png"></image>
					<text>支付宝</text>
				</view>
				<view v-if="isWxAway == '是'" class="btn_left" :class="current==2?'btna':''" @click="bindToindex(2)">
					<image src="../static/weixin.png"></image>
					<text>微信</text>
				</view>
			</view>
		</view>
		<view class="part_four">
			<view class="submit" @click="getOut()">立即提现</view>
			<view class="four_box">
				<view class="box_left" @click="goZhifuBao">
					提现账户
				</view>
				<view v-if="values==2 && isWxAway == '是'" class="box_right" @click="isShow">
					微信收款码
				</view>
				<view class="box_right" @click="list">
					提现记录
				</view>
			</view>
		</view>
		<!-- 微信收款码弹框 -->
		<view v-if="show" class="popup">
			<view class="padding">
				<view class="text-center text-lg text-bold flex justify-between">
					<view></view>
					<view>添加微信收款码</view>
					<view @click="show=false">X</view>
				</view>
				<!-- <view class="text-center padding-top-sm padding-bottom-lg" style="color: #999999;">请提交微信号和微信二维码
				</view> -->
				<view style="width: 80%;margin: 0 auto;">
					<view class="margin-top" @click.stop="weixin"
						style="border: 4rpx solid #010101;border-radius: 16rpx;overflow: hidden;">
						<image v-if="!wximg" src="../static/erweima.png"></image>
						<image v-else :src="wximg" mode=""></image>
					</view>
				</view>
				<!-- <view class="text-center margin-top-sm " @click="submit"
					style="border-radius: 10rpx;background-color: #7E59FF;color: #fff;height: 80rpx;line-height: 80rpx;">保存</view> -->
			</view>
		</view>
	</view>
</template>

<script>
	import configdata from '../../common/config.js';
	export default {
		data() {
			return {
				current: '1',
				value: 10,
				money: '',
				zhifubaoName: '',
				zhifubao: '',
				shouxufei: 0.01,
				minMoney: 10,
				manMoney: 200,
				mayMoney: '',
				values: '',
				show: false,
				wximg: '',
				shangxian: '是',
				wxAway: '2', //微信提现方式 1自动 2手动
				isWxAway: '是',
			}
		},
		onLoad() {
			this.shangxian = uni.getStorageSync('shangxian')
			if (this.shangxian != '否') {
				uni.setNavigationBarTitle({
					title: '隐私政策'
				});
			} else {
				uni.setNavigationBarTitle({
					title: '提现'
				});
			}
			//最低可提现金额度
			this.$Request.getT('/app/common/type/87').then(res => {
				if (res.code === 0) {
					this.minMoney = res.data.value
				}
			});
			//最高可提现金额度
			this.$Request.getT('/app/common/type/11').then(res => {
				if (res.code === 0) {
					this.manMoney = res.data.value
				}
			});
			//手续费
			this.$Request.getT('/app/common/type/114').then(res => {
				if (res.code === 0) {
					this.shouxufei = res.data.value
				}
			});
			//是否开启微信提现
			this.$Request.getT('/app/common/type/355').then(res => {
				if (res.code == 0) {
					if (res.data && res.data.value) {
						this.isWxAway = res.data.value
					}
				}
			})
			//判断微信提现方式
			this.$Request.getT('/app/common/type/280').then(res => {
				if (res.code == 0) {
					if (res.data && res.data.value) {
						this.values = res.data.value
					}
				}
			})
		},
		onShow() {
			this.getMoney()
			this.zhiFuBao = uni.getStorageSync('zhiFuBao')
			this.zhiFuBaoName = uni.getStorageSync('zhiFuBaoName')
		},
		methods: {
			isShow() {
				this.getMoney()
				this.show = true
			},
			bindToindex(e) {

				this.current = e
				console.log(e, this.current)
			},
			list() {
				uni.navigateTo({
					url: '/my/wallet/cashList'
				});
			},
			goZhifuBao() {
				uni.navigateTo({
					url: '/my/wallet/zhifubao'
				});
			},
			weixin() {
				let that = this
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (res) => {
						console.log('`````````````', res.tempFilePaths[0])
						that.$queue.showLoading("上传中...");
						for (let i = 0; i < 1; i++) {
							uni.uploadFile({ // 上传接口
								url: that.config("APIHOST") + '/alioss/upload',
								filePath: res.tempFilePaths[i],
								name: 'file',
								success: (uploadFileRes) => {
									let img = JSON.parse(uploadFileRes.data).data
									// this.img.push()
									console.log(img)
									that.show = false
									let userId = that.$queue.getData('userId');

									let data = {
										cashQrCode: img
									}
									that.$Request.postJson('/app/user/updateUser',
										data).then(
										res => {
											uni.hideLoading();
											that.$queue.showToast('上传成功，请重新操作提现')
											that.getMoney()
										});
								}
							});
						}
					}
				});
			},
			config: function(name) {
				var info = null;
				if (name) {
					var name2 = name.split("."); //字符分割
					if (name2.length > 1) {
						info = configdata[name2[0]][name2[1]] || null;
					} else {
						info = configdata[name] || null;
					}
					if (info == null) {
						let web_config = cache.get("web_config");
						if (web_config) {
							if (name2.length > 1) {
								info = web_config[name2[0]][name2[1]] || null;
							} else {
								info = web_config[name] || null;
							}
						}
					}
				}
				return info;
			},
			getMoney() {
				let that = this;
				let token = this.$queue.getData('token');
				let userId = this.$queue.getData('userId');
				if (token) {
					//this.$queue.showLoading("加载中...");
					//可以提现金额查询预估收入查询
					let userId = this.$queue.getData('userId');
					this.$Request.getT("/app/user/selectUserDetails?userId=" + userId).then(res => {
						if (res.code === 0 && res.data) {
							that.mayMoney = res.data.balance;
							that.zhifubao = res.data.zhiFuBao;
							that.zhifubaoName = res.data.zhiFuBaoName;
							that.wximg = res.data.cashQrCode
						} else if (res.code === -102) {
							this.$queue.showToast(res.msg);
							this.$queue.logout();
							// uni.navigateTo({
							// 	url: '/pages/public/login'
							// });
						} else {
							that.mayMoney = '0';
							//this.$queue.showToast(res.msg);
						}
					});
				}
			},
			getOut() {
				let that = this;
				let token = that.$queue.getData('token');
				let userId = that.$queue.getData('userId');
				if (token) {
					if (that.current == 1) {
						if (!that.zhifubao || !that.zhifubaoName) {
							uni.navigateTo({
								url: '/my/wallet/zhifubao'
							});
							return
						}
						if (!/^\d+$/.test(that.money)) {
							uni.showToast({
								icon: 'none',
								title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
							});
							return;
						}
						if (Number(that.money) < Number(that.minMoney)) {
							uni.showToast({
								icon: 'none',
								title: '提现金额不能小于' + that.minMoney + '元'
							});
							return;
						}

						if (Number(that.money) > Number(that.manMoney)) {
							uni.showToast({
								icon: 'none',
								title: '提现金额不能大于' + that.manMoney + '元'
							});
							return;
						}
						uni.showModal({
							title: '提现申请提示',
							content: '请仔细确认收款人信息\n姓名:' + that.zhifubaoName + '\n提现金额:' + that.money + '\n提现手续费:' +
								parseFloat(that.money * that.shouxufei).toFixed(2) + '元' + '\n收款账号：' + that
								.zhifubao + '',
							success: e => {
								if (e.confirm) {
									that.$queue.showLoading('提现中...');

									that.$Request.getT('/app/cash/cashMoney?userType=2&classify=' + that
										.current +
										'&money=' + that.money).then(res => {
										if (res.code === 0) {
											that.$queue.showToast('提现申请成功，预计三个工作日到账');
											that.money = ''
											that.getMoney();
											that.mayMoney = ''
										} else {
											uni.showModal({
												title: '温馨提示',
												content: res.msg,
												showCancel: false,
												cancelText: '取消',
												confirmText: '确认'
											});
										}
										uni.hideLoading();
									});
								}
							}
						});

					} else {
						if (!/^\d+$/.test(that.money)) {
							uni.showToast({
								icon: 'none',
								title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
							});
							return;
						}
						if (Number(that.money) < Number(that.minMoney)) {
							uni.showToast({
								icon: 'none',
								title: '提现金额不能小于' + that.minMoney + '元'
							});
							return;
						}

						if (Number(that.money) > Number(that.manMoney)) {
							uni.showToast({
								icon: 'none',
								title: '提现金额不能大于' + that.manMoney + '元'
							});
							return;
						}
						if (this.values == 2) { //如果是微信手动提现才判断微信收款码
							if (!that.wximg) {
								uni.showModal({
									title: '提现提示',
									content: '请上传微信收款码',
									showCancel: true,
									cancelText: '取消',
									confirmText: '上传',
									success: res => {
										if (res.confirm) {
											that.show = true;
										}
									},
									fail: () => {},
									complete: () => {}
								});
								return;
							}
						}
						uni.showModal({
							title: '提现申请提示',
							content: '请仔细确认收款信息\n金额:' + that.money + '元' + '\n提现手续费:' + parseFloat(that.money *
								that.shouxufei).toFixed(2) + '元',
							success: e => {
								if (e.confirm) {
									that.$queue.showLoading('提现中...');
									that.$Request.getT('/app/cash/cashMoney?classify=' + that.current +
										'&money=' + that.money).then(res => {
										if (res.code === 0) {
											that.$queue.showToast('提现申请成功，预计三个工作日到账');
											that.money = ''
											that.getMoney();
											that.mayMoney = ''
										} else {
											uni.showModal({
												title: '温馨提示',
												content: res.msg,
												showCancel: false,
												cancelText: '取消',
												confirmText: '确认'
											});
										}
										uni.hideLoading();
									});
								}
							}
						});
					}
				} else {
					uni.showToast({
						title: '提现失败',
						icon: 'none'
					})
				}
			},
		}
	}
</script>

<style>
	body {
		background: #F5F5F5;
	}

	.popup {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		top: 0;
		margin: auto;
		z-index: 9999;
		background-color: #FFFFFF;
		width: 80%;
		height: 730rpx;
		border-radius: 10rpx;
		box-shadow: 0rpx 0rpx 20rpx #eee;
	}

	.content {
		width: 100%;
	}


	.part_one {
		width: 90%;
		margin: 0 auto;
		background: #FFFFFF;
		margin-top: 20rpx;
		border-radius: 20rpx;
		height: 170rpx;
	}

	.one_title {
		width: 90%;
		margin: 0 auto;
		font-size: 32rpx;
		letter-spacing: 1rpx;
		padding-top: 30rpx;
	}

	.one_price {
		width: 90%;
		margin: 0 auto;
		margin-top: 20rpx;
		font-size: 47rpx;
		font-weight: bold;
	}

	.part_two {
		width: 90%;
		margin: 0 auto;
		background: #FFFFFF;
		margin-top: 20rpx;
		border-radius: 20rpx;
	}

	.two_title {
		width: 90%;
		margin: 0 auto;
		line-height: 95rpx;
		font-size: 34rpx;
	}

	.two_title text {
		font-size: 27rpx;
		margin-left: 34rpx;
	}

	.two_box {
		width: 90%;
		margin: 0 auto;
		display: flex;
		align-items: center;
		font-size: 32rpx;
		font-weight: bold;
	}

	.u-input__input {
		font-size: 50rpx !important;
		color: #747474 !important;
		border-bottom: 1rpx solid #cccccc;

	}

	.tit {
		width: 90%;
		margin: 0 auto;
		font-size: 31rpx;
		margin-top: 10rpx;
		color: black;
	}

	.beizhu {
		width: 90%;
		margin: 0 auto;
		line-height: 55rpx;
		color: red;
		letter-spacing: 1rpx;
	}

	.part_three {
		width: 90%;
		margin: 0 auto;
		background: #FFFFFF;
		margin-top: 20rpx;
		border-radius: 20rpx;
	}

	.three_name {
		width: 90%;
		margin: 0 auto;
		font-size: 33rpx;
		color: black;
		line-height: 80rpx;
	}

	.btn {
		width: 96%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		padding-bottom: 30rpx;
	}

	.btn_left {
		flex: 1;
		/* width: 240rpx; */
		height: 90rpx;
		border: 1rpx solid #ccc;
		border-radius: 20rpx;
		margin-right: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-right: 20rpx;
	}

	.btn_right {
		flex: 1;
		/* width: 240rpx; */
		height: 90rpx;
		border: 1rpx solid #ccc;
		border-radius: 20rpx;
		margin-left: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-right: 20rpx;
	}



	.btna {
		border: 1rpx solid #2474FF !important;
	}


	.btn_left image {
		width: 50rpx;
		height: 50rpx;
		margin-right: 12rpx;
	}

	.btn_right image {
		width: 50rpx;
		height: 50rpx;
		margin-right: 12rpx;
	}

	.part_four {
		width: 90%;
		margin: 0 auto;
		/* background: #FFFFFF; */
		margin-top: 20rpx;
		border-radius: 20rpx;
	}

	.submit {
		width: 100%;
		height: 90rpx;
		background: #2474FF;
		color: #F8EBD2;
		text-align: center;
		line-height: 90rpx;
		font-size: 37rpx;
		border-radius: 12rpx;
	}

	.four_box {
		width: 90%;
		margin: 0 auto;
		height: 125rpx;
		display: flex;
		color: #838383;
	}

	.box_left {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.box_right {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>