xiuli.gao
/
qianduo


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta content="yes" name="apple-mobile-web-app-capable">
    	<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no">
		<title>金牛记账</title>
		<style type="text/css">
			body,html{
				font-size: 0.16rem;
			}
			body, div, button, h3, h6, span, ul, li, p, a, input{ 
				font-family: -apple-system,SF UI Text,Helvetica Neue,Helvetica,Arial,sans-serif;
				padding: 0; 
				margin: 0; 
				box-sizing: inherit; 
				font-weight: normal;
				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			}
			button{
				outline: none;
			}
			a, a:visited{
				text-decoration: none;
			}
			body{
				width: 100%;
				background:linear-gradient(180deg,rgba(255,229,0,1),rgba(255,206,17,1));
				padding-top: 0.42rem;
			}
			.banner{
				width: 3.53rem;
				height: 1.98rem;
				display: block;
				margin: auto;
			}
			.banner img{
				width: 100%;
				height: 100%;
			}
			.loginInput{
				width: 3.55rem;
				height: 0.5rem;
				display: block;
				background: #FFFFFF;
				border-radius: 0.04rem;
				margin: auto;
			}
			.cellPhoneNumber{
				width: 3.27rem;
				margin-top: 0.16rem;
			}
			input{
				padding-left: 0.28rem;
				border: none;
				outline: none;
				font-size: 0.15rem;
				color: #333333;
			}
			.loginYzm{
				display: -webkit-flex;
			    display: -webkit-box;
			    display: -moz-box;
			    display: -ms-flexbox;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-top: 0.1rem;
				margin-bottom: 0.1rem;
			}
			.yzmIpt{
				height: 0.5rem;
				width: 2.04rem;
			}
			.yzm{
				width: 1.22rem;
				line-height: 0.28rem;
				text-align: center;
				color: #DB1D1D;
				font-size: 0.15rem;
				font-weight: bold;
				background: #ffffff;
    			border: none;
    			border-left: 0.01rem solid #FFE500;
    			outline: none;
			}
			.mima{
				margin-top: 0;
			}
			.register{
				width: 2.34rem;
				height: 0.5rem;
				margin: auto;
				margin-top: 0.34rem;
				margin-bottom: 0.5rem;
				background: url(../H5/register.png) no-repeat;
				background-size: 100%;
			}
			.share{
				width: 3.25rem;
				height: 2.66rem;
				display: block;
				margin: auto;
				margin-bottom: 0.25rem;
			}
			.registerMask{
				display: none;
				width: 100%;
				height: 100%;
				position: fixed;
				top: 0;
				left: 0;
				background: rgba(0,0,0,0.5);
			}
			.registerTost{
				width: 3rem;
				background: #FFFFFF;
				position: absolute;
				top: 30%;
				left: 0;
				right: 0;
				margin: auto;
				border-radius: 0.04rem;
			}
			.registerTost p{
				padding: 0 0.18rem;
				padding-top: 0.44rem;
				padding-bottom: 0.33rem;
				text-align: center;
				color: #000000;
				font-size: 0.16rem;
			}
			.registerTost div{
				color: #16B80A;
				font-size: 0.18rem;
				line-height: 0.55rem;
				text-align: center;
				border-top: 0.01rem solid #D8D8D8;
			}
			.yzmNo{
				color: #cccccc;
			}
			.yzmMask{
				width: 100%;
				height: 100%;
				background: rgba(0,0,0,0.5);
				position: fixed;
				top: 0;
				left: 0;
				display: none;
			}
			.yzmMask .con{
				width: 2.6rem;
				background: #FFFFFF;
				border-radius: 0.04rem;
				position: absolute;
				top: 30%;
				left: 0;
				right: 0;
				margin: auto;
			}
			.yzmMask .con img{
				width: 2rem;
				display: block;
			    margin: auto;
			    margin-top: 0.2rem;
			}
			.yzmMask .con input{
			    height: 0.5rem;
			    border-radius: 0.04rem;
			    font-size: 0.15rem;
			    border: 0.01rem solid #ccc;
			    display: block;
			    margin: auto;
			    margin-top: 0.15rem;
			}
			.yesOrNo{
				display: flex;
				background: #d8d8d8;
				color: #666666;
				line-height: 0.44rem;
				text-align: center;
				border-radius: 0.04rem;
				margin-top: 0.15rem;
			}
			.yesOrNo div{
				width: 50%;
			}
			.yesOrNo div:nth-of-type(2){
				background: #FFCE11;
				color: #FFFFFF;
			}
		</style>
		<script type="text/javascript">
			document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth/375) + "px";
			window.onresize = function(){
				document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth/375) + "px";
			}
		</script>
	</head>
	<body>
		<div class="banner"></div>
		<!--<img src="" class="banner"/>-->
		<input class="cellPhoneNumber loginInput" id='teleNumber' type="tel" placeholder="请输入手机号"/>
		<div class="loginInput loginYzm">
			<input class="yzmIpt" placeholder="输入验证码"  type="tel"/>
			<button class="yzm">获取验证码</button>
		</div>
		<input class="cellPhoneNumber loginInput mima" type="password" placeholder="设置密码"/>
		<div class="register"></div>
		<img src="../H5/share.png" class="share" />
		
		<div class="registerMask">
			<div class="registerTost">
				<p>恭喜您注册成功，点击 确认 下载app 就可以开启财务自由之旅啦</p>
				<div class="yes">确认</div>
			</div>
		</div>
		
		<div class="yzmMask">
			<div class="con">
				<div class="yzmImg">
					<img src="/api/V1/imgCode"/>
				</div>
				<input type="text" placeholder="请输入验证码" class="yzmImgId"/>
				<div class="yesOrNo">
					<div class="no">取消</div>
					<div class="yes">确定</div>
				</div>
			</div>
		</div>
	</body>
</html>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript">
	var time = 0;
	var timeInterval = null;
//	var appUrl = null;
	var appName = "金牛记账";
	var share_code = null;
	var zhuceFlag = false;
	var str=location.href;  //取得整个地址栏
    var num=str.indexOf("?"); 
    str=str.substr(num+1); //str得到?之后的字符串
    var brr=str.split("&");
	for(var i = 0 ; i<brr.length; i++){
    	if(brr[i].indexOf('share_code') != -1){
    		share_code = brr[i].split('=')[1];
    		console.log(share_code)
    	}
//  	if(brr[i].indexOf('appUrl') != -1){
//  		appUrl = brr[i].split('=')[1];//appUrl
//  		appUrl = decodeURIComponent(appUrl);
//  	}
    	if(brr[i].indexOf('appName') != -1){
    		appName = brr[i].split('=')[1];//appName
    		appName = decodeURI(appName);
    	}
    }
	if(appName == "钱多记账"|| appName == "钱多记账钱多记账"){
		document.title="钱多记账"
		$(".banner").html(`<img src="../H5/loginBanner_qd.png"/>`)
	}else if (appName == "金牛记账"){
		document.title="金牛记账"
		$(".banner").html(`<img src="../H5/loginBanner.png"/>`)
	}
	//手机验证码
	$(".yzm").click(function () {
		var teleNumber = $("#teleNumber").val();
		var myreg=/^[0-9]{11}$/; 
　　		if (!myreg.test(teleNumber)) { 
			//手机号码未填写及填写不正确
			$(".registerMask").css('display','block');
			$(".registerTost").find('p').html('请正确填写手机号码');
		}else{
			$(".yzmMask").css('display','block');
			$(".yzmImg img").attr("src",'/api/V1/imgCode?mobile=' + teleNumber + '&tmp=' + Date.parse(new Date()));
			$(".yzmImgId").val("");
		}
	})

	
//	点击注册
	$(".register").click(function () {
		registerApi();
	})
	//点击确定
	$(".yes").click(function () {
		if(zhuceFlag){
			goApp();
		}
		document.documentElement.style.overflow='scroll';
		$(".registerMask").css('display','none')
	})
	//取消
	$(".no").click(function () {
		$(".yzmMask").css('display','none')
	})
	//确定   -----------
	$(".yesOrNo .yes").click(function () {
		sendCode($(".yzmImgId")[0].value,$("#teleNumber").val());
		$(".yzmMask").css('display','none')
	})
	//更换验证图片验证码
	$(".yzmImg").click(function () {
		$(".yzmImg img").attr("src",'/api/V1/imgCode?mobile=' + $("#teleNumber").val() + '&tmp=' + Date.parse(new Date()));
		$(".yzmImgId").val("")
	})
		
	function sendCode (imgCode,teleNumber) {
		$.ajax({
			type:"post",
			url:"/api/V1/h5SendCode",
			data: {
				img_code:imgCode,
				mobile:teleNumber,
				code_type:1,
				send_type:1
			},
			success: function (res) {
				if(JSON.parse(res).code == 0){
					time = JSON.parse(res).res.time_out;
					timeInterval = setInterval(timeDown,1000);
				}else{
					var msg = JSON.parse(res).message[0]
					$(".registerMask").css('display','block');
					if(msg.indexOf("img_code") != -1){
						msg = msg.replace('img_code', '图片验证码');
					}
					$(".registerTost").find('p').html(msg);
				}
			}
		});
	}
	function registerApi () {
		var psd = "";
		var msg = '';
		$.post(
			"/api/V1/register",
			{ 
				"mobile":$("#teleNumber").val(), 
				"password":$(".mima").val(), 
				"c_password":$(".mima").val(), 
				"code":$(".yzmIpt").val(), 
				"share_code":share_code 
			},
			function(data,status){ 
				if(JSON.parse(data).code == 0){
					document.documentElement.style.overflow='hidden';
					$(".registerMask").css('display','block');
					$(".registerTost").find('p').html('恭喜您注册成功，点击 确认 下载app 就可以开启财务自由之旅啦');
					zhuceFlag = true;
				}else{
					msg = JSON.parse(data).message[0];
					if(msg.match("code") != undefined){
						msg = msg.replace('code', '验证码');
					}
					if(msg.indexOf("password")[0] != -1){
						msg = msg.replace('password', '密码');
					}
					
					
					$(".registerMask").css('display','block');
					$(".registerTost").find('p').html(msg);
					
					zhuceFlag = false;
				}
			}
		);
		
	}
	
	
	function timeDown () {
		$(".loginYzm .yzm").attr('disabled','true')
		time -- ;
		if(time == 0){
			$(".loginYzm .yzm").html('获取验证码');
			$(".loginYzm .yzm").removeAttr('disabled')
			clearInterval(timeInterval);
		}else{
			$(".loginYzm .yzm").html(time);
		}
	}
	

	function goApp () {
		if(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)){
			if(appName == "金牛记账"){
				window.location.href='http://a.app.qq.com/o/simple.jsp?pkgname=com.kuxuan.jinniunote&from=singlemessage&isappinstalled=0';
			}else if(appName == "钱多记账"){
				window.location.href="https://itunes.apple.com/cn/app/%E9%92%B1%E5%A4%9A%E8%AE%B0%E8%B4%A6%E6%9C%AC-%E7%B2%BE%E8%87%B4%E7%94%9F%E6%B4%BB%E5%BF%85%E5%A4%87%E6%97%A5%E8%AE%B0%E8%B4%A6%E6%9C%AC/id1300097774?mt=8"
			}
		}
		if(navigator.userAgent.match(/android/i)){
			if(appName == "金牛记账"){
				window.location.href='http://android.myapp.com/myapp/detail.htm?apkName=com.kuxuan.jinniunote';
			}else if(appName == "钱多记账"){
				window.location.href="http://sj.qq.com/myapp/detail.htm?apkName=com.kuxuan.moneynote";
			}
		}
	}
</script>