moxuan_takeaway_shanghu/my/other/cashDetail.vue

<template>
	<view class="cash">
		<view
			style="background-image: url('../../static/images/my/qanbaobg.png');background-size: 100%;height: 400upx;">
			<view style="font-size: 32upx;padding-top: 100upx;">可提现总额</view>
			<view style="font-size: 40upx;padding-top: 20upx;">¥ {{money}}</view>

			<view
				style="width: 90%;height: max-content;margin-left: 40upx;background-color: #FFFFFF;box-shadow: rgba(183, 183, 183, 0.3) 0px 1px 10px;margin-top: 50upx;border-radius: 20upx;">
				<view style="display: flex;flex-direction: row;padding: 20upx;">
					<view style="font-size: 32upx;color: #333333;">提现金额 <text style="font-size: 28upx;color: #FF2638;"
							v-if="shouxufei">（注：提现手续费为{{shouxufei * 100}}%）</text>
					</view>
				</view>
				<view style="display: flex;flex-direction: row;padding: 20upx;">
					<view style="font-size: 40upx;color: #333333;">¥</view>
					<input type="text" v-model="moneys" placeholder="请输入金额"
						style="font-size: 40upx;color: #333333;text-align: left;margin-left: 10upx;width: 100%;" />
				</view>
				<view style="background: #E6E6E6;width: 100%;height: 1upx;"></view>

				<view style="display: flex;flex-direction: row;flex-wrap: wrap;">
					<view style="display: flex;flex-direction: row;" v-for="(item, index) in moneyList" :key="index">
						<view>
							<view style="padding: 20upx;" @click="getOut(item.money)">
								<view
									style="padding-top: 40upx;width: 180upx; height: 120upx;background-color: #FFFFFF;border:1px solid #FFCC00;border-radius: 10upx;">
									{{ item.money }}
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>

			<view style="margin-top:59upx" class="padding-lr margin-lr-sm">
				<view class="yinghang">提现银行卡信息</view>
				<view style="color:#333333;text-align: left;">
					银行卡号：<text class="yinghang2">{{yingNo}}</text>
				</view>
				<view style="color:#333333;text-align: left;">
					开户行：<text class="yinghang2">{{yingName}}</text>
				</view>
				<view style="color:#333333;text-align: left;">
					开户人姓名：<text class="yinghang2">{{yingPeople}}</text>
				</view>
				<!-- <view class="flex justify-between margin-bottom-xl" v-for="(item,index) in openLists" :key="index">
					<view class="flex align-center">
						<image :src="item.image" style="width:23px;height:20px"></image>
						<text class="text-lg margin-left-sm" style="color:#333333;font-weight:700;">{{item.text}}</text>
					</view>
					<view>
						<radio-group name="openWay" style="margin-left: 20upx;" @tap='selectWay(item)'>
							<label class="tui-radio">
								<radio color="#FF7F00" :checked="openWay === item.id ? true : false" />
							</label>
						</radio-group>
					</view>
				</view> -->
			</view>

			<view @click="getOut()"
				style="margin: 32upx;font-size: 18px;background: #FFCC00;border-radius: 10px;height: 40px;line-height: 40px">
				提现
			</view>

			<view style="display: flex;width: 100%;justify-content: center;">
				<!-- <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="goZhifuBao">提现账号
				</view> -->
				<view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="goqianbao">钱包明细
				</view>
				<!-- <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="isShow">微信收款码
				</view> -->
				<view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="gojilu">提现记录
				</view>
			</view>
		</view>
		<!-- 微信收款码弹框 -->
		<u-popup v-model="show" mode="center">
			<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/images/my/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>
		</u-popup>
		<!-- 	<view v-if="show" class="popup">
			
		</view> -->
	</view>

</template>

<script>
	export default {
		data() {
			return {
				show: false,
				money: '',
				moneys: '',
				zhifubao: '',
				mayMoney: '0',
				zhifubaoName: '',
				shouxufei: '',
				moneyList: [{
						money: '10'
					},
					{
						money: '500'
					},
					{
						money: '1000'
					},
					{
						money: '3000'
					},
					{
						money: '5000'
					},
					{
						money: '10000'
					}
				],
				value: 0,
				min: '',
				zhifubao: '',
				zhifubaoName: '',
				openLists: [],
				openWay: 1,
				values: '',
				wximg: '',
				yingName:'',
				yingNo:'',
				yingPeople:'',
				
			};
		},
		onLoad() {
			this.getUserInfo()
			this.getyinghanglist()
			this.$Request.getT('/common/type/290').then(res => { //判断微信提现方式
				if (res.code == 0) {
					if (res.data && res.data.value) {
						this.values = res.data.value
					}
				}
			})

			//提现手续费
			this.$Request.getT('/common/type/115').then(res => {
				if (res.code === 0) {
					this.shouxufei = res.data.value;
				}
			});

			this.openLists = [{
				image: '../../static/images/img/icon_weixin.png',
				text: '微信',
				id: 1
			}, {
				image: '../../static/images/img/zhifubao.png',
				text: '支付宝',
				id: 2
			}];
			this.openWay = 1;

		},
		onShow: function(e) {
			this.getwalletMoney();
			this.getUserInfo()
			this.getyinghanglist()


		},
		onNavigationBarButtonTap() {
			this.list();
		},
		methods: {
			//获取商户银行信息
			getyinghanglist(){
				let data = {
					userId: this.$queue.getData('userId')
				}
				this.$Request.getA('/admin/shop/bank/get-by-user',
					data).then(
					res => {
						if (res.msg == 'success') {
							this.yingName=res.data.openBank
							this.yingNo=res.data.cardNo
							this.yingPeople=res.data.realName
						}else if(res.msg=='shopId对应的银行卡记录不存在'){
							uni.showToast({
								icon: 'none',
								title: '银行信息不完整无法提现'
							});
						}
					});
			},
			//用户收款码弹框
			isShow() {
				this.getUserInfo()
				this.show = true
			},

			//微信 支付宝提现选择
			selectWay: function(item) {
				this.openWay = item.id;
			},
			//获取用户信息获取用户是否上传收款码
			getUserInfo() {
				this.$Request.getA("/sys/user/info").then(res => {
					if (res.code == 0) {
						this.zhifubao = res.user.userEntity.zhiFuBao
						this.zhifubaoName = res.user.userEntity.zhiFuBaoName
						this.wximg = res.user.userEntity.cashQrCode;
						// console.log(this.zhifubao, this.zhifubaoName, '-')
					}
				});
			},
			//获取账户余额
			getwalletMoney() {
				this.$Request.getT('/shop/shopmoney/selectShopMoney').then(res => {
					if (res.code == 0) {
						this.money = res.data.money;
					}
					uni.hideLoading();
				});
			},
			gojilu() {
				uni.navigateTo({
					url: '/my/other/moneydetail'
				});
			},
			goqianbao() {
				uni.navigateTo({
					url: '/my/other/cashList'
				});
			},

			goZhifuBao() {
				uni.navigateTo({
					url: '/my/other/zhifubao'
				});
			},
			weixin() {
				let that = this
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (res) => {
						console.log('`````````````', res)
						that.$queue.showLoading("上传中...");
						for (let i = 0; i < 1; i++) {
							uni.uploadFile({ // 上传接口
								url: 'https://mxys.chuanghai-tech.com/sqx_fast/alioss/upload', //真实的接口地址
								filePath: res.tempFilePaths[i],
								name: 'file',
								success: (uploadFileRes) => {
									let img = JSON.parse(uploadFileRes.data).data
									// let userId = that.$queue.getData('userId');
									let data = {
										cashQrCode: img
									}
									that.$Request.getA('/shop/shopmoney/shopBindingQrCode',
										data).then(
										res => {
											if (res.code == 0) {
												that.getUserInfo()
												setTimeout(function() {
													that.$queue.showToast('上传成功')
												}, 1000)
											}
										});
									uni.hideLoading();

									

									// that.show = false
								}
							});
						}

					}
				});

			},
			//校验用户输入金额
			checkMobile(money) {
				return RegExp(/^1[34578]\d{9}$/).test(money);
			},
			getOut(money) {
				let that = this
				if (money) {
					that.moneys = money
				}

				if (!/^\d+$/.test(that.moneys)) {
					uni.showToast({
						icon: 'none',
						title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
					});
					return;
				}
				if (that.openWay == 2) { //支付宝提现
					if (that.zhifubao != null && that.zhifubaoName != null) {
						uni.showModal({
							title: "提现申请提示",
							content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n收款人账号：' + that.zhifubao +
								'\n\n提现金额:' + that.moneys + '元\t\t手续费:' + (that.moneys * that.shouxufei).toFixed(
									1),
							success: (e) => {
								if (e.confirm) {
									that.$queue.showLoading("提现中...");
									let data = {
										money: that.moneys,
										// classify: '1'
									}
									that.$Request.getT('/shop/shopmoney/shopCashMoney', data).then(
										res => {
											if (res.status === 0 && res.data) {
												setTimeout(function() {
													that.$queue.showToast("提现申请成功，预计三个工作日到账");
												}, 3000)

												that.getwalletMoney();
											} else {
												that.$queue.showToast(res.msg);
												that.getwalletMoney();
											}
											uni.hideLoading();
										});
								}
							}
						});
					} else {
						uni.navigateTo({
							url: '/my/other/zhifubao'
						});
					}
				} else if (that.openWay == 1) { //微信提现
					if (that.values == 2) {
						that.$Request.getA('/sys/user/info').then(res => {
							if (res.code === 0) {
								let wxImg = res.user.userEntity.cashQrCode;
								if (!wxImg) {
									uni.showModal({
										title: '提现提示',
										content: '请上传微信收款码',
										showCancel: true,
										cancelText: '取消',
										confirmText: '上传',
										success: res => {
											if (res.confirm) {
												that.show = true
											}
										},
										fail: () => {},
										complete: () => {}
									});
									return;
								}
								if (!/^\d+$/.test(that.moneys)) {
									uni.showToast({
										icon: 'none',
										title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
									});
									return;
								}

								if (that.moneys * 1 >= that.value * 1) {
									uni.showModal({
										title: '提现申请提示',
										content: '金额:' + that.moneys + '元'+','+'手续费:' + (that.moneys *that.shouxufei).toFixed(1),
										success: e => {
											if (e.confirm) {
												that.$queue.showLoading('提现中...');
												let data = {
													money: that.moneys,
													// classify: 2
												}
												that.$Request.getT('/shop/shopmoney/shopCashMoney',
													data).then(
													res => {
														if (res.code === 0) {
															setTimeout(function() {
																that.$queue.showToast(
																	'提现申请成功，预计三个工作日到账');
															}, 1000)
															that.getwalletMoney();
														} else {
															uni.showModal({
																title: '温馨提示',
																content: res.msg,
																showCancel: false,
																cancelText: '取消',
																confirmText: '确认'
															});

														}
														uni.hideLoading();
													});
											}
										}
									});
								} else {
									setTimeout(function() {
										that.$queue.showToast('提现金额必须大于或等于' + that.value + '元才可提现');
									}, 1000)

								}
							} else {
								that.$queue.showToast('网络状态不好，请刷新后重试！');
							}
						});


					} else {
						if (!/^\d+$/.test(that.moneys)) {
							uni.showToast({
								icon: 'none',
								title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
							});
							return;
						}
						if (parseFloat(that.moneys).toFixed(1) >= that.value) {
							uni.showModal({
								title: '提现申请提示',
								content: '金额:' + that.moneys +  '元'+','+'手续费:' + parseFloat(that.moneys *
									that.shouxufei).toFixed(1),
								success: e => {
									if (e.confirm) {
										that.$queue.showLoading('提现中...');
										let data = {
											money: that.moneys,
											// classify: 2
										}
										that.$Request.getT('/shop/shopmoney/shopCashMoney', data).then(
											res => {
												if (res.code === 0) {
													setTimeout(function() {
														that.$queue.showToast('提现申请成功，预计三个工作日到账');
													}, 1000)
													that.getwalletMoney();
												} else {
													uni.showModal({
														title: '温馨提示',
														content: res.msg,
														showCancel: false,
														cancelText: '取消',
														confirmText: '确认'
													});
													that.getwalletMoney();
												}
												uni.hideLoading();
											});
									}
								}
							});
						} else {
							that.$queue.showToast('提现金额必须大于或等于' + that.value + '元才可提现');
						}

					}
				}
			},
		}
	};
</script>

<style lang="less">
	// @import '../../static/css/index.css';

	.view2-view-text {
		font-size: 14px;
		color: #000000;
		margin-left: 20upx;
		width: 80%;
	}

	.view2-view-image-right {
		width: 18upx;
		height: 30upx;
		margin-left: 50upx;
	}

	.cash {
		text-align: center;
		background: white;
		height: 100%;
		position: absolute;
		width: 100%;

		.cash-top {
			padding: 32upx 32upx 50upx 32upx;
			/* border-bottom: 1px solid gainsboro; */
			background: #FF2638;
		}

		.leiji {
			font-size: 14px;
			color: #ffffff;
			margin-bottom: 10px;
		}
		// 提现银行卡信息
		.yinghang{
			height: 80rpx;
			line-height: 80rpx;
			font-size: 36rpx;
			font-weight: 700;
			text-align: left;
		}
		.yinghang2{
			height: 80rpx;
			line-height: 80rpx;
			font-size: 36rpx;
			font-weight: 700;
		}
	}
</style>