tangdehang
/
android-cloud-H5


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437
							<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<title>免费换机</title>
	<link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
	<link rel="stylesheet" href="../static/js/vender/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="../static/css/replacementActivities.css">
	<link rel="stylesheet" href="../static/css/verify.css">
	<link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
	<script>
		(function () {
			if (!window.Promise) {
				document.writeln('<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.min.js"><' + '/' + 'script>');
			}
		})();
	</script>
	<script src="../static/js/vender/jquery-3.4.1.min.js"></script>
	<script src="../static/js/vender/toastr/toastr.min.js"></script>
	<script src="../static/js/vender/config.js"></script>
	<script src="../static/js/vender/crypto-js.js"></script>
	<script src="../static/js/vender/ase.js"></script>
	<script src="../static/js/vender/verify.js"></script>
</head>

<body>
	<div class="container">
		<div class="share-node">
			<img class="qq" onclick="urlToQQ()" src="../static/img/replacementActivities/qq.png" alt="">
			<div class="line"></div>
			<a href="qq://mqqwpa://im/chat?chat_type=wpa&uin=800183764&version=1&src_type=web&web_src=oicqzone.com"><img class="cs" src="../static/img/replacementActivities/cs.png" alt=""></a>
		</div>
		<div class="date">2022.1.4-2022.2.8</div>
		<div class="header">
			<div class="login-container">
				<div class="login-bar">仅限2000份</div>
				<div class="ipt"></div>
				<div class="input-container">
					<div class="login-row-select">
						<div class="login-row-title">选择</div>
						<input class="login-row-ipt" id="select" placeholder="请选择平台" disabled="true" />
						<img class="icon-down-img" src="../static/img/replacementActivities/arrow.png" />
					</div>
					<div class="options">
						<div class="icon-down-second">红手指</div>
						<div class="icon-down-first">多多云</div>
						<div class="icon-down-third">爱云兔</div>
					</div>
					<div class="login-row-account">
						<div class="login-row-title">账户</div>
						<input class="login-row-ipt" id="account" placeholder="请输入11位手机号码" />
					</div>
					<div class="tip-text1"></div>
					<div class="login-row-password">
						<div class="login-row-title">密码</div>
						<input class="login-row-ipt" type="password" id="password" placeholder="请输入密码" />
					</div>
					<div class="tip-text2"></div>
					<div class="form-btn" id="form-btn"></div>
					<div id="mpanel2"></div>
				</div>
			</div>
		</div>
		<div class="mt55">
			<img class="w666h874" src="../static/img/replacementActivities/activityReward.png" alt="">
		</div>
		<div class="mt50">
			<img class="w670h476" src="../static/img/replacementActivities/inviteeReward.png" alt="">
		</div>
		<div class="mt50">
			<img class="w666h864" src="../static/img/replacementActivities/mattersNeedAttention.png" alt="">
		</div>
		<div class="mask1">
			<div class="dialog1">
				<img class="dialog-bg" src="../static/img/replacementActivities/dialog.png" />
				<div class="title1">已经注册过双子星</div>
				<img class="register-btn" src="../static/img/replacementActivities/register-btn.png" />
				<div class="register-text">您已是注册用户，可分享活动邀请有奖</div>
				<img class="close" onclick="registerHandle()" src="../static/img/replacementActivities/close.png" alt="">
			</div>
			<div class="tip">
				<img class="dialog2-bg" src="../static/img/replacementActivities/dialog2.png" />
				<div class="title1" style="left: 1.77rem;">已提交兑换申请</div>
				<div class="register-text">审核通过者，将在3个工作日内收到短<br />信通知并发放奖励，请留意短信消息。</div>
				<img class="close" onclick="handleClose('tip')" src="../static/img/replacementActivities/close.png" alt="">
			</div>
			<div class="tip1">
				<img class="dialog3-bg" src="../static/img/replacementActivities/dialog3.png" />
				<div class="title1" style="left: 1.75rem;text-align: center;">该账号已经申请<br />请等待审核</div>
				<img class="close" onclick="handleClose('tip1')" src="../static/img/replacementActivities/close.png" alt="">
			</div>
		</div>
	</div>
	<script>
		toastr.options.positionClass = 'toast-center-center';
		toastr.options.timeOut = '1500';
	</script>
	<script type="text/javascript">
		Date.prototype.Format = function (fmt) { // author: meizz
			var o = {
				"M+": this.getMonth() + 1, // 月份
				"d+": this.getDate(), // 日
				"h+": this.getHours(), // 小时
				"m+": this.getMinutes(), // 分
				"s+": this.getSeconds(), // 秒
				"q+": Math.floor((this.getMonth() + 3) / 3), // 季度
				"S": this.getMilliseconds() // 毫秒
			};
			if (/(y+)/.test(fmt))
				fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
			for (var k in o)
				if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
			return fmt;
		}
		let timer, flag = true;
		let entryPageTime = new Date().Format("yyyy-MM-dd hh:mm:ss");
		let fromType = 0,
			account = '',
			password = '';
		var url = window.location.href;
		url = url.split('/')

		var loc = window.location.search,
			n1 = loc.length,//地址的总长度
			n2 = loc.indexOf("="),//取得=号的位置
			id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
			u = navigator.userAgent,
			ua = navigator.userAgent.toLowerCase(),
			isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
			isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
		//埋点
		operate('dt_yhs_活动页面浏览');
		function operate(pointName, type, captchaVerification) {
			$.ajax({
				url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
				type: 'post',
				data: JSON.stringify({
					pointName: pointName
				}),
				contentType: "application/json",
				dataType: 'json',
				cache: false,
				success: function (res) {
					if (type === 'click') {
						changePhone(captchaVerification);
					}
				},
			})
		}
		// 跳转至QQ群
		function urlToQQ() {
			window.location.href = 'qq://https://jq.qq.com/?_wv=1027&k=dU5VFcNx'
		}
		//点击分享
		$('.register-btn')[0].addEventListener('click', () => {
			if (!id) {
				copyUrl();
			} else if (isiOS) {
				$.ajax({
					url: baseUrl + '/api/user/v1/promote',
					type: 'get',
					headers: {
						'Authorization': id  //id
					},
					contentType: "application/json",
					dataType: 'json',
					cache: false,
					success: function (res) {
						var jsonStr = JSON.stringify(res.data)
						var jsonObj = JSON.parse(jsonStr)
						// WKWebView使用
						// 使用下方方法,会报错,为使界面执行逻辑通畅,因此使用try-catch
						try {
							getMessage(jsonObj);
						} catch (error) {
							console.log(error)
						}
						try {
							window.webkit.messageHandlers.getMessage.postMessage(jsonObj)
						} catch (error) {
							copyUrl();
						}
					}
				})
			} else if (isAndroid) {
				if (window.native) {
					window.native.onClikWebView()
				} else {
					copyUrl();
				}
			} else {
				copyUrl();
			}
		}, false);
		//复制
		function copyUrl() {
			stopManyClick(() => {
				var oInput = document.createElement('input'); //创建一个input
				oInput.setAttribute("readonly", "readonly");//设置只读，否则移动端使用复制功能时可能会造成软件盘弹出
				oInput.value = window.location.href || 'https://client.androidscloud.com/h5/microserviceUserH5/vcloud/invite.html';
				$('.ipt')[0].appendChild(oInput);//将input插入到body
				// oInput.select(); // 选择对象 ios不支持
				selectText(oInput, 0, oInput.value.length);
				document.execCommand("Copy"); // 执行浏览器复制命令
				toastr.error('复制当前网址成功！');
				oInput.style.display = 'none'; // 将input隐藏
				oInput.blur();
				oInput.remove(); // 将input销毁
			})
		}
		// input自带的select()方法在苹果端无法进行选择，所以需要自己去写一个类似的方法
		// 选择文本。createTextRange(setSelectionRange)是input方法
		function selectText(textbox, startIndex, stopIndex) {
			if (textbox.createTextRange) {//ie
				const range = textbox.createTextRange();
				range.collapse(true);
				range.moveStart('character', startIndex);//起始光标
				range.moveEnd('character', stopIndex - startIndex);//结束光标
				range.select();//不兼容苹果
			} else {//firefox/chrome
				textbox.setSelectionRange(startIndex, stopIndex);
				textbox.focus();
			}
		}
		// 默认选中红手指
		function handleClick() {
			$('.options')[0].className = 'options';
			$('#select').val('红手指');
			fromType = 2;
		};
		handleClick();
		//点击选择框
		$('.login-row-select')[0].addEventListener('click', () => {
			$('.options')[0].className = 'options show';
		}, false);
		//点击多多云
		$('.icon-down-first')[0].addEventListener('click', () => {
			$('.options')[0].className = 'options';
			$('#select').val('多多云');
			fromType = 1;
		}, false);
		//点击红手指
		$('.icon-down-second')[0].addEventListener('click', handleClick, false);
		//点击爱云兔
		$('.icon-down-third')[0].addEventListener('click', () => {
			$('.options')[0].className = 'options';
			$('#select').val('爱云兔');
			fromType = 3;
		}, false);
		//点击弹窗关闭按钮
		function handleClose(str) {
			$('.' + str).animate({ top: '-6.96rem' }, "fast");
			$('.mask1').hide();
			document.documentElement.style.overflow = 'auto';
		}
		//点击关闭
		function registerHandle() {
			$('.dialog1').animate({ top: '-6.96rem' }, "fast");
			$('.mask1').hide();
			document.documentElement.style.overflow = 'auto';
		}
		var html = document.documentElement;
		var imgWidth = html.getBoundingClientRect().width / 750 * 400 + 'px';
		var imgHeight = html.getBoundingClientRect().width / 750 * 200 + 'px';
		var barHeight = html.getBoundingClientRect().width / 750 * 70 + 'px';
		$('#mpanel2').slideVerify({
			baseUrl: baseUrl + '/api/user',  //服务器请求地址, 默认地址为安吉服务器;
			mode: 'pop',     //展示模式
			containerId: 'form-btn', //pop模式 必填 被点击之后出现行为验证码的元素id
			imgSize: { //图片的大小对象,有默认值{ width: '310px',height: '155px'},可省略
				width: imgWidth,
				height: imgHeight
			},
			barSize: {//下方滑块的大小对象,有默认值{ width: '310px',height: '50px'},可省略
				width: imgWidth,
				height: barHeight
			},
			beforeCheck: function () {
				account = $('#account').val();
				account = account.replace(/\s+/g, "");
				password = $('#password').val();
				password = password.replace(/\s+/g, "");
				if (!account) {
					$('.tip-text1').text('账号格式不正确，请重新输入！');
					$('#account').addClass('br');
					return false
				} else {
					$('.tip-text1').text('');
					$('#account').removeClass('br')
				}
				if (!/^1[3|4|5|6|7|8|9][0-9]\d{8}$/.test(account)) {
					$('.tip-text1').text('账号格式不正确，请重新输入！');
					$('#account').addClass('br');
					return false
				} else {
					$('.tip-text1').text('');
					$('#account').removeClass('br')
				}
				if (!password) {
					$('.tip-text2').text('密码为空，请重新输入！');
					$('#password').addClass('br');
					return false
				} else {
					$('.tip-text2').text('');
					$('#password').removeClass('br');
					return true
				}
			},
			ready: function () {},  //加载完毕的回调
			success: function (params) { //成功的回调
				operate('dt_yhs_点击免费换机按钮', 'click', params.captchaVerification);
			},
			error: function () {
				console.log('error');
			}        //失败的回调
		});
		//调用免费换机接口
		function changePhone(captchaVerification) {
			let data = {
				inviteTime: entryPageTime,
				type: fromType,
				account: account,
				password: password,
				captchaVerification: captchaVerification
			}
			if (!id) {
				delete data.inviteTime
			}
			let ajaxObj = {
				url: baseUrl + '/api/public/v1/activity/change/phone',
				type: 'post',
				headers: {
					'Authorization': id  //id
				},
				data: JSON.stringify(data),
				contentType: "application/json",
				dataType: 'json',
				cache: false,
				success: function (res) {
					if (res.status === 0) {
						$('.tip1').animate({ top: '46vh' }, "fast");
						$('.mask1').show();
						$('.dialog1').animate({ top: '-6.96rem' }, "fast");
						$('.tip').animate({ top: '-6.96rem' }, "fast");
						document.documentElement.style.overflow = 'hidden';
					} else if (res.status === 1) {
						$('.tip').animate({ top: '48vh' }, "fast");
						$('.mask1').show();
						$('.dialog1').animate({ top: '-6.96rem' }, "fast");
						$('.tip1').animate({ top: '-6.96rem' }, "fast");
						document.documentElement.style.overflow = 'hidden';
					} else if (res.status === 2) {
						$('.dialog1').animate({ top: '48vh' }, "fast");
						$('.mask1').show();
						$('.tip').animate({ top: '-6.96rem' }, "fast");
						$('.tip1').animate({ top: '-6.96rem' }, "fast");
						document.documentElement.style.overflow = 'hidden';
					}
				}
			}
			if (!id) {
				delete ajaxObj.headers
			}
			$.ajax(ajaxObj)
		}
		//防止提示一秒内重复显示
		function stopManyClick(fn) {
			if (flag) {
				fn();
			}
			flag = false;
			if (timer) { clearTimeout(timer); }
			timer = setTimeout(() => { flag = true }, 1500);
		}
	</script>
</body>
<style>
	#toast-container>.toast-error {
		background-image: none !important;
	}

	.toast-error {
		background-color: rgba(0, 0, 0, 0.8);
	}

	#toast-container>div {
		font-size: 14px;
		min-width: 80px !important;
		padding: 12px !important;
		box-shadow: none;
	}

	@media (max-width: 480px) and (min-width: 241px) {
		#toast-container>div {
			min-width: 80px !important;
			width: auto;
		}
	}

	@media only screen and (min-width: 640px) {
		.toast-center-center {
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
	}

	@media only screen and (max-width: 640px) {
		.toast-center-center {
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
	}

	input::-webkit-input-placeholder {
		color: #BBBBBB;
	}

	input::-moz-placeholder {
		/* Mozilla Firefox 19+ */
		color: #BBBBBB;
	}

	input:-moz-placeholder {
		/* Mozilla Firefox 4 to 18 */
		color: #BBBBBB;
	}

	input:-ms-input-placeholder {
		/* Internet Explorer 10-11 */
		color: #BBBBBB;
	}
</style>
</html>