1hjz-h5/src/view/put-money.vue

<template>
	<div class="put-money">
		<div style="height: 0.9rem;"></div> 
		<div class="page-top">
			<a @click="goBack()"><img src="../assets/images/my-money/left.png" /></a>
			<span>提现申请</span>
		</div>
		<div class="page-content">
			<div class="content-box">
				<div class="account">
					<div>
						<span>到账账号：</span>
						<img src="../assets/images/put-money/money-icon.png" alt="">
						<span>微信钱包零钱</span>
					</div>
					<p>1-3个工作日到账</p>
				</div>
				<div class="cash">
					<div class="cash-cue">提现现金 <span v-bind:class="{ active: isActive }">{{inputCue}}</span></div>
					<label for="" class="money">
                        <span>￥</span>
                        <input type="text" placeholder="输入现金金额" v-model="inputVal" >
                    </label>
					<p>可提现余额：<span>{{currentAmount}}</span></p>
					<button v-bind:class="{ ative: isActive }" @click="submit()">提交申请</button>
				</div>
			</div>
		</div>

		<!--弹出框-->
		<!--提现上限-->
		<div id="upper-limit" style="display:none">
			<img src="../assets/images/put-money/cue.png" alt="">
			<p>已达本月提现5次上限</p>
		</div>

		<!--授权弹框2-->
		<div id="authorization2" class="popup-box"  v-show="isWenxin">
		    <div class="popup-authorization2 popup-centent">
		        <span class="closeBtn" @click="closePupup()" ><img src="../assets/images/put-money/close.png"/></span>
		        <p class="cue-title">提示</p>
		        <p>请进入微信公众号“一号家政服务号”进行提现操作</p>
		        <button  @click="closePupup()">确定</button>
		    </div>
		</div>

	</div>

</template>

<style>

.popup-authorization2 {
    width:89%;
    height: 3.5rem;   
    border-radius: 5px;
}
.popup-authorization2 span.closeBtn img {
	display:block;
}
.popup-authorization2 p {
    text-align: center;
    font-size: .3rem;
    color:rgba(102,102,102,1);
    padding: 0 .3rem;
    margin-bottom: .4rem;
}
.popup-authorization2 .cue-title {
    font-size: .36rem;
    color:rgba(0,0,0,1);
    margin-top: .4rem;
    margin-bottom: .4rem;
}
.popup-authorization2 button {
    width: 100%;
    height: 1rem;
    background:rgba(255,255,255,1);
    position: absolute;
    bottom: 0;
    border: none;
    font-size: .36rem;
    color:rgba(0,186,134,1);
    border-radius: 5px; 
    border-top: 1px solid #D2D3D5;
}
</style>

<script>
	import putMoney from "../models/put-money-model.js";
	import { Alert, Toast } from "vux";
	import configs from "../configs";
	var locationUrl = configs.locationUrl;
	export default {
		data() {
			return {
				//提现金额验证提示
				inputCue: "(请输入整数金额)",
				//默认一开始输入款的值不符合验证规则
				isActive: false,
				inputVal: null,
				//余额
				currentAmount: 0,
				//是否在微信环境下
				isWenxin: false,
			};
		},
		components: {
			Toast
		},
		watch: {
			//验证输入框的值
			inputVal: function(val) {
				var rule = /^[1-9]\d*$/;
				if(!rule.test(val)) {
					this.inputCue = "( 请输入正整数金额！)";
					this.inputVal = "";
					this.isActive = false;
					return;
				} else {
					this.isActive = true;
					this.inputCue = "";
				}
            },
            
		},
		methods: {
			//提交申请
			submit() {
				if(this.isActive) {
					
					//判断是否在微信环境下操作
					var ua = window.navigator.userAgent.toLowerCase();
				 	//通过正则表达式匹配ua中是否含有MicroMessenger字符串
				 	if(ua.match(/MicroMessenger/i) != 'micromessenger'){
				 		this.isWenxin = true
				 		return;
					}
					putMoney.putMoney({
						amount: this.inputVal * 100
					}).then(res => {
						if(res.code == 0) {
							this.$router.push({
								name: "提现成功",
								params: {
									num: this.inputVal
								}
							});
						} else if(res.code == 666) {
							this.$vux.toast.text(res.msg, "middle");
							setTimeout(function() {
								window.location.href =
									locationUrl +
									"/mall/web/user/login?callback=" +
									encodeURIComponent(window.location.href);
							}, 1000);
						} else {
							this.$vux.toast.text(res.msg, "middle");
						}
						// this.$vux.toast.text(res)
					});
				}
			},
			//返回上一页
			goBack() {
				history.go(-1);
			},
			//获取链接参数
			getParam(name) {
				var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
				var url = window.location.href;
				url = window.location.href.substring(url.indexOf("?") + 1, url.length);
				var r = url.match(reg);
				if(r != null) return unescape(r[2]);
				return null;
			},
			//关掉弹出层
			closePupup() {
				this.isWenxin = false
			}
		},
		mounted() {
			//获取余额值
			this.currentAmount = (this.getParam("currentAmount") / 100).toFixed(2);
            //this.$vux.toast.text(this.currentAmount,'middle')
            this.wxShare({
                merchantNo: '',
                source: 0,
                url: encodeURIComponent(location.href),
                shareUrl: encodeURIComponent(
                    "http://" + location.host + "/v2/home"
                )
            });
		}
	};
</script>