|
@@ -1,171 +1,409 @@
|
|
|
<!DOCTYPE html>
|
|
|
<html lang="en">
|
|
|
- <head>
|
|
|
- <meta charset="UTF-8">
|
|
|
- <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
|
|
|
- <meta name="misapplication-tap-highlight" content="no" />
|
|
|
- <meta name="HandheldFriendly" content="true" />
|
|
|
- <meta name="MobileOptimized" content="320" />
|
|
|
- <script typet="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
|
|
|
- </head>
|
|
|
- <body>
|
|
|
- <div class="container">
|
|
|
- <div class="loginTitle">欢迎注册鲲鹏云矿</div>
|
|
|
- <div class="loginText">请认真填写个人信息</div>
|
|
|
- <div class="login-box">
|
|
|
- <div class="username">账号</div>
|
|
|
- <input class="input-box" type="number" id="phone" name="phone" placeholder="请输入手机号" />
|
|
|
- </div>
|
|
|
- <div class="login-box">
|
|
|
- <div class="username">验证码</div>
|
|
|
- <div class="flex">
|
|
|
- <input class="input-box" id="code" type="number" name="code" placeholder="请输入验证码">
|
|
|
- <div class="code" onclick="verification()">发送验证码</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="login-box">
|
|
|
- <div class="username">登录密码</div>
|
|
|
- <input class="input-box" id="loginPass" type="password" name="loginPass" placeholder="请输入登录密码">
|
|
|
- </div>
|
|
|
- <div class="login-box">
|
|
|
- <div class="username">支付密码</div>
|
|
|
- <input class="input-box" id="payPass" type="password" name="payPass" placeholder="请输入支付密码">
|
|
|
- </div>
|
|
|
- <div class="login-box">
|
|
|
- <div class="username">邀请码</div>
|
|
|
- <input class="input-box" id="invitation" type="text" disabled="disabled" name="invitation" placeholder="请输入邀请码">
|
|
|
- </div>
|
|
|
- <div class="flex">
|
|
|
- <div class="login" onclick="fnLogin()">注册</div>
|
|
|
- <div class="login"><a href="">下载APP</a></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </body>
|
|
|
- <script type="text/javascript">
|
|
|
- var url = location.search;
|
|
|
- if (url.indexOf("?") != -1) {
|
|
|
- var str = url.substr(1);
|
|
|
- strs = str.split("=");
|
|
|
- var invitation = strs[1];
|
|
|
- document.getElementById('invitation').value=invitation;
|
|
|
- }
|
|
|
- function fnLogin() {
|
|
|
- var phone = document.getElementById("phone").value;
|
|
|
- var loginPass = document.getElementById("loginPass").value;
|
|
|
- var payPass = document.getElementById("payPass").value;
|
|
|
- var code = document.getElementById("code").value;
|
|
|
- var invitation = document.getElementById("invitation").value;
|
|
|
- if(phone ==''){
|
|
|
- window.alert("请输入手机号");
|
|
|
- return false;
|
|
|
- }
|
|
|
- if(code ==''){
|
|
|
- window.alert("请输入验证码");
|
|
|
- return false;
|
|
|
- }
|
|
|
- if(loginPass ==''){
|
|
|
- window.alert("请输入登录密码");
|
|
|
- return false;
|
|
|
- }
|
|
|
- if(payPass ==''){
|
|
|
- window.alert("请输入支付密码");
|
|
|
- return false;
|
|
|
- }
|
|
|
- if(invitation ==''){
|
|
|
- window.alert("请输入邀请码");
|
|
|
- return false;
|
|
|
- }
|
|
|
- $.ajax({
|
|
|
- type: "post",
|
|
|
- url: "http://btex.frp.liuniu946.com/api/register",
|
|
|
- data: {phone:phone,captcha:code,password:loginPass,trade_password:payPass,invite_code:invitation},
|
|
|
- dataType: "json",
|
|
|
- success: function(data){
|
|
|
- window.alert(data.msg);
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- function verification(){
|
|
|
- var phone = document.getElementById("phone").value;
|
|
|
- if(phone ==''){
|
|
|
- window.alert("请输入手机号");
|
|
|
- return false;
|
|
|
- }
|
|
|
- $.ajax({
|
|
|
- type: "post",
|
|
|
- url: "http://btex.frp.liuniu946.com/api/register/verify",
|
|
|
- data: {phone:phone,type:'register'},
|
|
|
- dataType: "json",
|
|
|
- success: function(data){
|
|
|
- window.alert(data.msg);
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- </script>
|
|
|
- <style type="text/css">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+ <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
|
|
|
+ <style>
|
|
|
+ @font-face {
|
|
|
+ font-family: 'iconfont';
|
|
|
+ src: url('//at.alicdn.com/t/font_2527830_vzcw86nywl8.woff2?t=1620264294559') format('woff2'),
|
|
|
+ url('//at.alicdn.com/t/font_2527830_vzcw86nywl8.woff?t=1620264294559') format('woff'),
|
|
|
+ url('//at.alicdn.com/t/font_2527830_vzcw86nywl8.ttf?t=1620264294559') format('truetype');
|
|
|
+ }
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ font-family: "iconfont" !important;
|
|
|
+ font-size: 16px;
|
|
|
+ font-style: normal;
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+ -webkit-text-stroke-width: 0.2px;
|
|
|
+ -moz-osx-font-smoothing: grayscale;
|
|
|
+ }
|
|
|
+
|
|
|
+ html {
|
|
|
+ background-color: black;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
* {
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ body {
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
|
- font-family: 微软雅黑;
|
|
|
- font-size: 12px;
|
|
|
- min-height: 100%;
|
|
|
+ background-color: black;
|
|
|
+ color: #fff;
|
|
|
+ /* width: 50px; */
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
|
- .container{
|
|
|
- padding: 10% 30px 0px 30px;
|
|
|
+
|
|
|
+ .hearder {
|
|
|
+ margin-bottom: 2vw;
|
|
|
}
|
|
|
- .loginTitle {
|
|
|
- font-weight: bold;
|
|
|
- color: #33333;
|
|
|
- font-size: 29px;
|
|
|
- padding-bottom: 25px;
|
|
|
- }
|
|
|
-
|
|
|
- .loginText {
|
|
|
- font-weight: 500;
|
|
|
- color: #333333;
|
|
|
- font-size: 17px;
|
|
|
- margin-bottom: 15px;
|
|
|
- }
|
|
|
- .login-box{
|
|
|
- width: 100%;
|
|
|
- font-size: 16px;
|
|
|
- padding-top: 15px;
|
|
|
+
|
|
|
+ .h-back {
|
|
|
+ font-size: 4vw;
|
|
|
+ height: 12vw;
|
|
|
+ line-height: 12vw;
|
|
|
+ padding-left: 4vw;
|
|
|
}
|
|
|
- .username{
|
|
|
- display: block;
|
|
|
- padding-bottom: 12px;
|
|
|
- font-weight: 500;
|
|
|
- color: #333333;
|
|
|
- font-size: 16px;
|
|
|
-
|
|
|
+
|
|
|
+ .h-logo {
|
|
|
+ height: 37.2vw;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .logo {
|
|
|
+ margin: 5.5vw auto 4.7vw;
|
|
|
+ width: 19vw;
|
|
|
+ height: 19vw;
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .h-logo img {
|
|
|
+ width: 19vw;
|
|
|
+ height: 19vw;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .logo-title {
|
|
|
+ margin: 0 auto;
|
|
|
+ height: 8.4vw;
|
|
|
+ line-height: 8.4vw;
|
|
|
+ font-size: 5vw;
|
|
|
+ /* font-weight: bold; */
|
|
|
+ }
|
|
|
+ .downLoad{
|
|
|
+ text-align: right;
|
|
|
+ margin-top: 1.2vw;
|
|
|
+ margin-right: 9.4vw;
|
|
|
}
|
|
|
- .input-box{
|
|
|
+ .form-item {
|
|
|
+ width: 81.2vw;
|
|
|
+ height: 14vw;
|
|
|
+ line-height: 14vw;
|
|
|
+ border-bottom: 1px #fff solid;
|
|
|
+ margin-left: 9.4vw;
|
|
|
+ margin-right: 9.4vw;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-item i {
|
|
|
+ font-size: 6.3vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-item input {
|
|
|
+ /* width: 95vw; */
|
|
|
+ background-color: #000;
|
|
|
+ color: #fff;
|
|
|
+ font-weight: 300;
|
|
|
+ outline: none;
|
|
|
border: none;
|
|
|
- padding: 10px 0px;
|
|
|
- }
|
|
|
- .code{
|
|
|
- background-color: #5771DF;
|
|
|
- color: #FFFFFF;
|
|
|
- border-radius: 5px;
|
|
|
- font-weight: 500;
|
|
|
- color: #FFFFFF;
|
|
|
- font-size: 13px;
|
|
|
- padding: 6px 8px;
|
|
|
- }
|
|
|
- .login {
|
|
|
- background-color: #5771DF;
|
|
|
- margin-top: 10px;
|
|
|
- color: #FFFFFF;
|
|
|
+ font-size: 4.3vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-item span {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ margin: auto;
|
|
|
+ display: inline-block;
|
|
|
+ height: 9.5vw;
|
|
|
+ width: 17vw;
|
|
|
+ background-color: #eeda9e;
|
|
|
+ font-size: 4.3vw;
|
|
|
+ color: black;
|
|
|
text-align: center;
|
|
|
- width: 130px;
|
|
|
- line-height: 40px;
|
|
|
- border-radius: 25px;
|
|
|
- margin-top: 30px;
|
|
|
+ line-height: 9.5vw;
|
|
|
+ border-radius: 1vw 1vw 1vw 1vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ .sub {
|
|
|
+ width: 60vw;
|
|
|
+ height: 10.7vw;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 10.7vw;
|
|
|
+ background-color: #eeda9e;
|
|
|
+ color: black;
|
|
|
+ font-size: 4vw;
|
|
|
+ font-weight: bold;
|
|
|
+ border-radius: 6vw 6vw;
|
|
|
+ margin: 9vw auto 0;
|
|
|
}
|
|
|
- .flex{
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
+
|
|
|
+ .foot {
|
|
|
+ height: 23vw;
|
|
|
+ margin-left: 9.4vw;
|
|
|
+ margin-top: 6vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ .foot div {
|
|
|
+ height: 7vw;
|
|
|
+ font-size: 4.5vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ #tip {
|
|
|
+ display: none;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ left: 0;
|
|
|
+ margin: auto;
|
|
|
+ width: 30vw;
|
|
|
+ height: 20vw;
|
|
|
+ background-color: rgba(0, 0, 0, 0.7);
|
|
|
+ z-index: 998;
|
|
|
+ }
|
|
|
+
|
|
|
+ #tip-span {
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
</style>
|
|
|
-</html>
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+<div class="hearder">
|
|
|
+ <div class="h-back">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ </div>
|
|
|
+ <div class="h-logo">
|
|
|
+ <div class="logo"><img src="/static/img/logo.png" alt="logo"></div>
|
|
|
+ <div class="logo-title">优交所</div>
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+<div class="content">
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="text" id="uphone" name="phone" placeholder="请输入手机号" onblur="checkData(0)"
|
|
|
+ oninput="value=value.replace(/[^\d]/g,'')">
|
|
|
+ </div>
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="password" id="upassword" name="password" placeholder="请输入密码" onblur="checkData(1)"
|
|
|
+ oninput="value=value.replace(/[\W]/g,'')" maxlength="12">
|
|
|
+ </div>
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="password" id="upassword_t" name="password_t" placeholder="请输入确认密码" onblur="checkData(2)"
|
|
|
+ oninput="value=value.replace(/[\W]/g,'')" maxlength="12">
|
|
|
+ </div>
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="password" id="utrade_password" name="trade_password" placeholder="请输入交易密码"
|
|
|
+ onblur="checkData(3)" oninput="value=value.replace(/\D/g,'')" maxlength="6">
|
|
|
+ </div>
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="password" id="utrade_password_t" name="trade_password_t" placeholder="请再次输入交易密码"
|
|
|
+ onblur="checkData(4)" oninput="value=value.replace(/\D/g,'')" maxlength="6">
|
|
|
+ </div>
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="text" id="invite_code" name="captcha" placeholder="请输入邀请码" disabled onblur="checkData(6)">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="form-item">
|
|
|
+ <i class="iconfont"></i>
|
|
|
+ <input type="text" id="ucaptcha" name="invite_code" placeholder="请输入验证码" disabled onblur="checkData(5)">
|
|
|
+ <span onclick="getCaptcha()" id="captcha_btn">验证码</span>
|
|
|
+ </div>
|
|
|
+ <div class="downLoad" onclick="downLoad()">
|
|
|
+ 立即下载
|
|
|
+ </div>
|
|
|
+ <div class="sub" onclick="register()">
|
|
|
+ 注册
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+
|
|
|
+<div id="tip"><span id="tip-span"></span></div>
|
|
|
+
|
|
|
+<script>
|
|
|
+ var url = location.search;
|
|
|
+ if (url.indexOf("?") != -1) {
|
|
|
+ var str = url.substr(1);
|
|
|
+ strs = str.split("=");
|
|
|
+ var invitation = strs[1];
|
|
|
+ document.getElementById('invite_code').value=invitation;
|
|
|
+ }
|
|
|
+ let $tip = $('#tip')
|
|
|
+ let $tipStr = $('#tip-span')
|
|
|
+ // 验证码
|
|
|
+ let captchaValue = ''
|
|
|
+ let baseUrl = 'http://ucoin.frp.liuniu946.com/api/'
|
|
|
+ //倒计时
|
|
|
+ let countDown = 0
|
|
|
+ //表单校验
|
|
|
+ let isPass = [false, false, false, false, false, false]
|
|
|
+
|
|
|
+ function checkData(num) {
|
|
|
+ isPass = [false, false, false, false, false, false]
|
|
|
+ if (num === 0) {
|
|
|
+ let value = $("#uphone").val()
|
|
|
+ let rexp = /^1[3456789]\d{9}/
|
|
|
+ let isOk = rexp.test(value)
|
|
|
+ if (!isOk) {
|
|
|
+ tip(true, '请输入正确的手机号码')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ isPass[0] = true
|
|
|
+ } else if (num === 1) {
|
|
|
+ let value = $('#upassword').val()
|
|
|
+ let rexp = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,12}$/
|
|
|
+ let isOk = rexp.test(value)
|
|
|
+ if (!isOk) {
|
|
|
+ tip(true, '请输入6-12位由数字和字母构成的密码')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ isPass[1] = true
|
|
|
+ } else if (num === 2) {
|
|
|
+ let value = $('#upassword').val()
|
|
|
+ let value_t = $('#upassword_t').val()
|
|
|
+ if (value != value_t) {
|
|
|
+ tip(true, '前后密码不一致')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ isPass[2] = true
|
|
|
+ } else if (num === 3) {
|
|
|
+ let value = $('#utrade_password').val()
|
|
|
+ console.log(value)
|
|
|
+ let rexp = /^\d{6}$/
|
|
|
+ let isOk = rexp.test(value)
|
|
|
+ if (!isOk) {
|
|
|
+ tip(true, '请输入由6位数字构成的交易密码')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ isPass[3] = true
|
|
|
+ } else if (num === 4) {
|
|
|
+ let value = $('#utrade_password').val()
|
|
|
+ let value_t = $('#utrade_password_t').val()
|
|
|
+ if (value != value_t) {
|
|
|
+ tip(true, '前后交易密码不一致')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ isPass[4] = true
|
|
|
+ } else {
|
|
|
+ isPass[5] = true
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //控制tip显示
|
|
|
+ function tip(isShow, str) {
|
|
|
+ if (isShow === true) {
|
|
|
+ $tip.css('display', 'inline')
|
|
|
+ console.log(12222)
|
|
|
+ $tipStr.text(str)
|
|
|
+ setTimeout(function () {
|
|
|
+ $tip.css('display', 'none')
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //获取验证码
|
|
|
+ function getCaptcha() {
|
|
|
+ //判断是否在倒计时
|
|
|
+ if (countDown === 0) {
|
|
|
+ //判断手机号码是否填充完整
|
|
|
+ checkData(0)
|
|
|
+ if (isPass[0]) {
|
|
|
+ countDown = 60
|
|
|
+ console.log('dianji')
|
|
|
+ let phone = $('#uphone').val()
|
|
|
+ let $ucaptcha = $('#ucaptcha')
|
|
|
+ let $captcha_btn = $('#captcha_btn')
|
|
|
+ $ucaptcha.attr("disabled", false)
|
|
|
+
|
|
|
+ let timer = setInterval(() => {
|
|
|
+ countDown--
|
|
|
+ $captcha_btn.text(countDown)
|
|
|
+ if (countDown < 1) {
|
|
|
+ clearInterval(timer)
|
|
|
+ $captcha_btn.text('验证码')
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+
|
|
|
+ // 发起请求获取验证码
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + 'register/verify ',
|
|
|
+ type: 'POST',
|
|
|
+ data: {
|
|
|
+ phone: phone,
|
|
|
+ type: 'register'
|
|
|
+ },
|
|
|
+ success: function (res) {
|
|
|
+ console.log(res.msg)
|
|
|
+ tip(true, res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ // 立即下载
|
|
|
+ function downLoad() {
|
|
|
+ window.open("{:url('down')}")
|
|
|
+ }
|
|
|
+ //注册
|
|
|
+ function register() {
|
|
|
+ for (let i = 0; i < 6; i++) {
|
|
|
+ checkData(i)
|
|
|
+ if (!isPass[i]) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 获取 表单数据
|
|
|
+ let phone = $('#uphone').val()
|
|
|
+ let captcha = $('#ucaptcha').val()
|
|
|
+ let password = $('#upassword').val()
|
|
|
+ let trade_password = $('#utrade_password').val()
|
|
|
+ let check_psw = $('#upassword_t').val()
|
|
|
+ let check_trade_psw = $('#utrade_password_t').val()
|
|
|
+ let invite_code = $('#invite_code').val()
|
|
|
+
|
|
|
+
|
|
|
+ let info = {
|
|
|
+ phone,
|
|
|
+ captcha,
|
|
|
+ password,
|
|
|
+ trade_password,
|
|
|
+ check_psw,
|
|
|
+ check_trade_psw,
|
|
|
+ invite_code
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log(info, 777)
|
|
|
+ //提交表单
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + 'register',
|
|
|
+ type: 'POST',
|
|
|
+ data: info,
|
|
|
+ success: function (res) {
|
|
|
+ console.log(res)
|
|
|
+ tip(true, res.msg)
|
|
|
+ // tip(true, "{:url('down')}")
|
|
|
+ // window.open("{:url('down')}")
|
|
|
+ if (res.status == 200){
|
|
|
+ setTimeout(() => {
|
|
|
+ window.open("{:url('down')}")
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (err) {
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|