首頁 探索 說明
註冊 登入
bulomakaka
/
ekexiu.app
關註 2
讚好 1
派生 0
代碼 問題管理 0 合併請求 0 提交歷史 537 版本發佈 0 Wiki
瀏覽代碼

登录注册改版

xuchunyang 8 年之前
父節點
ecedade99d
當前提交
917d73569e
共有 6 個文件被更改，包括 267 次插入 和 150 次删除
分割檢視 顯示文件統計
  1. 19 30
      app/html/login.html
  2. 8 84
      app/html/loginTelNew.html
  3. 36 31
      app/js/login.js
  4. 199 0
      app/js/loginTelNew.js
  5. 3 3
      app/js/public/base.js
  6. 2 2
      app/js/register.js

+ 19 - 30
app/html/login.html
查看文件 

@ -10,42 +10,36 @@
10 10 
	</head>
11 11
12 12 
	<body>
13
14 
		<div class="closebtn mui-action-back">
15 
			<span class="mui-icon mui-icon-closeempty closeicon"></span>
16 
			<!--<div class="closeicon"></div>-->
17 
		</div>
13 
		<header class="mui-bar mui-bar-nav toptitbox">
14 
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
15 
		    <h1 class="mui-title toptit">登录</h1>
16 
		    <span class="mui-pull-right topsave" id='reg'>注册</span>
17 
		</header>
18 18 
		<div class="mui-content">
19 
			<div class="logobox">
20 
				<a class="logolink" href="javascript:;">
21 
					<img class="logoimg" src="../images/logo.png" />
22 
				</a>
23 
			</div>
24 
		    <form class="mui-input-group frmbox">
19 
		    <form class="mui-input-group frmboxNew">
25 20 
		        <div class="mui-input-row frm-input">
26 
		            <input type="text" class="mui-input-clear frmtype" placeholder="请输入账号" id="username">
21 
		            <input type="tel" class="mui-input-clear frmtype" placeholder="请输入账号" id="username">
27 22 
		        </div>
28 23 
		        <div class="mui-input-row frm-input">
29 24 
					<input id='password' type="password" class="frmtype" placeholder="请输入密码">
30 
					<span id='forgetPassword' class="forgetword forgetword2">忘记密码<em class="mui-icon mui-icon-help"></em></span>
31 25 
				</div>
32 26 
		    </form>
33 27
34 
		    <div class="mui-content-padded frmbox">
35 
				<button id='login' class="mui-btn mui-btn-block frmbtn frmactive2">登&nbsp;录</button>
36 
				<button id='reg' class="mui-btn mui-btn-block mui-btn-outlined frmbtn">注&nbsp;册</button>
28 
		    <div class="mui-content-padded frmboxNew">
29 
				<button id='login' class="mui-btn mui-btn-block frmbtn frmactive2" disabled="">登&nbsp;录</button>
30 
				<p class="otherWordNew">
31 
					<span class="mui-pull-left" id="smsLogin">短信登录</span>
32 
					<span id='forgetPassword' class="mui-pull-right">忘记密码?</span>
33 
				</p>
37 34 
			</div>
38 35
39 
			<div class="quickbox" style="display: none;">
40
41 
				<span class="borderword">直接登录</span>
42 
				<div class="quickway">
43 
					<span class="mui-icon mui-icon-weixin quickicon weixinicon" id="weixin"></span>
44 
					<span class="mui-icon mui-icon-weibo quickicon weiboicon"></span>
45 
					<span class="mui-icon mui-icon-qq quickicon qqicon"></span>
46 
				</div>
36 
			<div class="quickbox">
37 
				<span class="borderword" >直接登录</span>
38 
				<div class="quickway">
39 
					<span class="mui-icon mui-icon-weixin quickicon weixinicon" id="weixin"></span>
40 
					<span class="mui-icon mui-icon-qq quickicon qqicon"></span>
41 
				</div>
47 42 
			</div>
48
49 43 
		</div>
50 44 
		<script src="../js/public/mui.min.js"></script>
51 45 
		<script src="../js/public/base.js"></script>
 
@ -60,11 +54,6 @@
60 54 
	            });
61 55 
	        })
62 56
63 
	        document.getElementById('weixin').addEventListener('tap',function() {
64 
	            console.log("微信");
65 
	            authLogin('weixin');
66 
	        });
67
68 57 
	        function authLogin(type) {
69 58 
	            var s;
70 59 
	            for (var i = 0; i < auths.length; i++) {

+ 8 - 84
app/html/loginTelNew.html
查看文件 

@ -18,106 +18,30 @@
18 18 
		<div class="mui-content">
19 19 
		    <form class="mui-input-group frmboxNew">
20 20 
		        <div class="mui-input-row frm-input">
21 
		            <input type="tel" class="mui-input-clear frmtype" placeholder="请输入手机号码">
21 
		            <input type="tel" id="username" class="mui-input-clear frmtype" placeholder="请输入手机号码">
22 22 
		        </div>
23 23 
		        <div class="mui-input-row mui-row frm-input">
24 24 
		        	<div class="mui-col-xs-8">
25 
		        		<input id='password' type="password" class="frmtype" placeholder="请输入验证码">
25 
		        		<input id='setCode' type="tel" class="frmtype" placeholder="请输入验证码">
26 26 
		        	</div>
27 27 
					<div class="mui-col-xs-4">
28 
						<input type="button" class="frmtype getCode" value="获取验证码">
28 
						<input type="button" class="frmtype getCode" value="获取验证码" id="obtain-code">
29 
						<input type="button" class="frmtype getCode" value="" style="display: none;" id="getcodeoff">
29 30 
					</div>
30 31 
				</div>
31 32 
		    </form>
32 33
33 34 
		    <div class="mui-content-padded frmboxNew">
34 
				<button id='login' class="mui-btn mui-btn-block frmbtn frmactive" disabled>登&nbsp;录</button>
35 
				<button id='login' class="mui-btn mui-btn-block frmbtn frmactive2" disabled="">登&nbsp;录</button>
35 36 
				<p class="otherWordNew">
36 
					<span class="mui-pull-left">帐号登录</span>
37 
					<span class="mui-pull-left" id="accountLogin">帐号登录</span>
37 38 
					<span id='forgetPassword' class="mui-pull-right">忘记密码?</span>
38 39 
				</p>
39 40 
			</div>
40 
			<!--第三方登录-->
41 
			<div class="quickbox">
42 
				<div class="quicktit"><span class="borderword">其他登录方式</span></div>
43 
				<ul class="quickway">
44 
					<li id="weixin"><img src="../images/me_icon_weixin_nor@3x.png" /><p>微信</p></li>
45 
				</ul>
46 
			</div>
41
47 42 
		</div>
48 43 
		<script src="../js/public/mui.min.js"></script>
49 44 
		<script src="../js/public/base.js"></script>
50 
		<script src="../js/login.js"></script>
51 
		<script type="text/javascript">
52 
			var auths;
53 
			mui.plusReady(function() {
54 
	            plus.oauth.getServices(function(services) {
55 
	                auths = services;
56 
	            }, function(e) {
57 
	                alert("获取登录服务列表失败：" + e.message + " - " + e.code);
58 
	            });
59 
	        })
60
61 
	        function authLogin(type) {
62 
	            var s;
63 
	            for (var i = 0; i < auths.length; i++) {
64 
	                if (auths[i].id == type) {
65 
	                    s = auths[i];
66 
	                    break;
67 
	                }
68 
	            }
69 
	            if (!s.authResult) {
70 
	                s.login(function(e) {
71 
	                    mui.toast("登录认证成功！");
72 
	                    authUserInfo(type);
73 
	                }, function(e) {
74 
	                    mui.toast("登录认证失败！");
75 
	                });
76 
	            } else {
77 
	                mui.toast("已经登录认证！");
78 
	            }
79 
	        }
80
81 
			// 微信登录认证信息
82 
	        function authUserInfo(type) {
83 
	            var s;
84 
	            for (var i = 0; i < auths.length; i++) {
85 
	                if (auths[i].id == type) {
86 
	                    s = auths[i];
87 
	                    break;
88 
	                }
89 
	            }
90 
	            if (!s.authResult) {
91 
	                mui.toast("未授权登录！");
92 
	            } else {
93 
	                s.getUserInfo(function(e) {
94 
	                    var josnStr = JSON.stringify(s.userInfo);
95 
	                    var jsonObj = s.userInfo;
96 
	                    console.log("获取用户信息成功：" + josnStr);
97 
	                    //showData(type,jsonObj);
98 
	                    authLogout();
99 
	                }, function(e) {
100 
	                    alert("获取用户信息失败：" + e.message + " - " + e.code);
101 
	                });
102 
	            }
103 
	        }
104
105
106 
		 //注销
107 
        function authLogout() {
108 
            for (var i in auths) {
109 
                var s = auths[i];
110 
                if (s.authResult) {
111 
                    s.logout(function(e) {
112 
                        console.log("注销登录认证成功！");
113 
                    }, function(e) {
114 
                        console.log("注销登录认证失败！");
115 
                    });
116 
                }
117 
            }
118 
        }
119
120 
		</script>
45 
		<script src="../js/loginTelNew.js"></script>
121 46 
	</body>
122
123 47 
</html>

+ 36 - 31
app/js/login.js
查看文件 

@ -7,6 +7,7 @@ mui.ready(function() {
7 7 
	var userName = document.getElementById("username");
8 8 
	var userPassword = document.getElementById("password");
9 9 
	var forgetPassword = document.getElementById("forgetPassword");
10 
	var smsLogin = document.getElementById("smsLogin");
10 11
11 12 
	mui.plusReady(function() {
12 13 
		
@ -15,6 +16,17 @@ mui.ready(function() {
15 16 
			goRegFun();
16 17 
		})
17 18
19 
		/*点击短信登录*/
20 
		smsLogin.addEventListener("tap", function() {
21 
			mui.openWindow({
22 
				url: '../html/loginTelNew.html',
23 
				id: 'html/loginTelNew.html',
24 
				show: {
25 
					aniShow: "slide-in-right"
26 
				}
27 
			});
28 
		})
29
18 30 
		/*点击忘记密码按钮*/
19 31 
		forgetPassword.addEventListener("tap", function() {
20 32 
			mui.openWindow({
 
@ -27,7 +39,7 @@ mui.ready(function() {
27 39 
		})
28 40
29 41 
		/*校验登录按钮显示状态*/
30 
		mui('.frmbox').on('keyup', "#username,#password", function() {
42 
		mui('.frmboxNew').on('keyup', "#username,#password", function() {
31 43 
			hideButtn(userName,userPassword,login,"frmactiveok");
32 44 
		});
33 45 
		
@ -40,8 +52,7 @@ mui.ready(function() {
40 52
41 53 
		/*校验用户账号*/
42 54 
		function userVal() {
43 
			//var gunf = /^\w+@\w+\.((cn)|(com)|(com\.cn))$/;
44 
			var gunf= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
55 
			var gunf = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
45 56 
			var hunPhone = /^1[3|4|5|7|8]\d{9}$/;
46 57 
			if(hunPhone.test(userName.value)) {
47 58 
				userRegisterOk();
 
@ -111,14 +122,8 @@ mui.ready(function() {
111 122 
						mui.fire(consultPage, 'logined', {
112 123 
							id: userId
113 124 
						});
114 
						/*var consultPage = plus.webview.getWebviewById('html/consultlist.html');
115 
						console.log("目前id=="+plus.storage.getItem('userid'))
116 
						console.log(userId)
117 
						mui.fire(consultPage, 'relogin', {
118 
							id: plus.storage.getItem('userid')
119 
						});*/
120 125 
					} else {
121 
						plus.nativeUI.toast("登录账号和密码不匹配!", toastStyle);
126 
						plus.nativeUI.toast("帐号和密码不匹配，请检查后重试", toastStyle);
122 127 
						return;
123 128 
					}
124 129 
				},
 
@ -132,33 +137,33 @@ mui.ready(function() {
132 137 
		/*判断用户第一次登录，是否填写了个人信息*/
133 138 
		function firstLogin() {
134 139 
			var professorId = plus.storage.getItem('userid');
135 
			//console.log(userId);
136 140 
			mui.ajax(baseUrl + "/ajax/professor/" + professorId, {
137 141 
				dataType: 'json', //数据格式类型
138 142 
				type: 'GET', //http请求类型
139 143 
				async: false,
140 144 
				timeout: 10000, //超时设置
141 145 
				success: function(data) {
142 
					console.log(data.data)
143 
					if(data.data != null) {
144 
						//mui.currentWebview.close();
145 
			        	mui.back();
146 
				        var myaccountPage = plus.webview.getWebviewById('html/myaccount.html');
147 
						mui.fire(myaccountPage, 'closeUser', {
148 
							id: professorId
149 
						});
150 
					} else {
151 
						var productView = mui.preload({
152 
							url: '../html/fillinfo.html',
153 
							id: '../html/fillinfo.html',
154 
							show: {
155 
								aniShow: "slide-in-right"
156 
							},
157 
							extras: {
158 
								userid: professorId
159 
							}
160 
						});
161 
						productView.show();
146 
					console.log(JSON.stringify(data))
147 
					if(data.success) {
148 
						if(data.data.authentication < 0){
149 
							var productView = mui.preload({
150 
								url: '../html/fillinfo.html',
151 
								id: '../html/fillinfo.html',
152 
								show: {
153 
									aniShow: "slide-in-right"
154 
								},
155 
								extras: {
156 
									userid: professorId
157 
								}
158 
							});
159 
							productView.show();
160 
						}else{
161 
							mui.back();
162 
					        var myaccountPage = plus.webview.getWebviewById('html/myaccount.html');
163 
							mui.fire(myaccountPage, 'closeUser', {
164 
								id: professorId
165 
							});
166 
						}
162 167 
					}
163 168 
				},
164 169 
				error: function() {

+ 199 - 0
app/js/loginTelNew.js
查看文件 

@ -0,0 +1,199 @@
1 
//登录
2 
mui.ready(function() {
3
4 
	/*定义全局变量*/
5 
	var reg = document.getElementById("reg");
6 
	var login = document.getElementById("login");
7 
	var userName = document.getElementById("username");
8 
	var setCode = document.getElementById("setCode");
9 
	var forgetPassword = document.getElementById("forgetPassword");
10 
    var accountLogin = document.getElementById("accountLogin");
11 
    var obtainCode = document.getElementById("obtain-code");
12 
    var state;
13 
	mui.plusReady(function() {
14
15 
        /*点击注册按钮*/
16 
		reg.addEventListener("tap", function() {
17 
			goRegFun();
18 
		})
19
20 
		/*点击账号登录*/
21 
		accountLogin.addEventListener("tap", function() {
22 
			mui.back();
23 
		})
24
25 
		/*点击忘记密码按钮*/
26 
		forgetPassword.addEventListener("tap", function() {
27 
			mui.openWindow({
28 
				url: '../html/findpwd-phone.html',
29 
				id: '../html/findpwd-phone.html',
30 
				show: {
31 
					aniShow: "slide-in-right"
32 
				}
33 
			});
34 
		})
35
36 
		/*校验登录按钮显示状态*/
37 
		mui('.frmboxNew').on('keyup', "#username,#setCode", function() {
38 
			hideButtn(userName,setCode,login,"frmactiveok");
39 
		});
40
41 
		/*登录按钮*/
42 
		login.addEventListener('tap', function() {
43 
			loginBut();
44 
		})
45
46 
		/*点击获取验证码*/
47 
		obtainCode.addEventListener('tap', function() {
48 
			phoneVal();
49 
		})
50
51 
		/*校验手机号*/
52 
		function phoneVal() {
53 
			var hunPhone = /^1[3|4|5|7|8]\d{9}$/;
54 
			if(hunPhone.test(userName.value)) {
55 
				sendAuthentication();
56 
			} else {
57 
				plus.nativeUI.toast("请输入正确的手机号码", toastStyle);
58 
				return;
59 
			}
60 
		}
61
62 
		/*手机发送验证码*/
63 
		function sendAuthentication() {
64 
			mui.ajax(baseUrl + '/ajax/sendMobileForLogin', {
65 
				data: {
66 
					mobilePhone: userName.value
67 
				},
68 
				dataType: 'json', //数据格式类型
69 
				type: 'GET', //http请求类型
70 
				async: false,
71 
				timeout: 10000, //超时设置
72 
				success: function(data) {
73 
					console.log(JSON.stringify(data))
74 
					if(data.success) {
75 
						if(data.data!=null){
76 
							state = data.data;
77 
							doClick();
78 
						}else{
79 
							plus.nativeUI.toast("该账号不存在，请检查后重试", toastStyle);
80 
						}
81 
					}
82 
				},
83 
				error: function() {
84 
					plus.nativeUI.toast("服务器链接超时", toastStyle);
85 
					return;
86 
				}
87 
			})
88 
		}
89
90 
		/*60s后重新获取验证码*/
91 
		function doClick() {
92 
			var getCodeOff = document.getElementById("getcodeoff");
93 
			obtainCode.style.display = "none";
94 
			getCodeOff.style.display = "block";
95 
			getCodeOff.value = "60s后重新获取";
96 
			var clickTime = new Date().getTime();
97 
			var Timer = setInterval(function() {
98 
				var nowTime = new Date().getTime();
99 
				var second = Math.ceil(60 - (nowTime - clickTime) / 1000);
100 
				if(second > 0) {
101 
					getCodeOff.value = second + "s后重新获取";
102 
				} else {
103 
					clearInterval(Timer);
104 
					obtainCode.style.display = "block";
105 
					getCodeOff.style.display = "none";
106 
					obtainCode.value = "获取验证码";
107 
				}
108 
			}, 1000);
109 
		}
110
111 
		/*提交登录*/
112 
		function loginBut() {
113 
			mui.ajax(baseUrl + '/ajax/mobileLogin', {
114 
				data: {
115 
					"state": state,
116 
					"mobilePhone": userName.value,
117 
					"validateCode": setCode.value
118 
				},
119 
				dataType: 'json', //数据格式类型
120 
				type: 'POST', //http请求类型
121 
				timeout: 10000, //超时设置
122 
				success: function(data) {
123 
					console.log(JSON.stringify(data))
124 
					if(data.success){
125 
						var userId = data.data.id;
126 
						plus.storage.setItem('userid', userId);
127 
						var article = plus.webview.currentWebview();
128 
						if(article.flag==1){
129 
							var proAiticle =plus.webview.getWebviewById('professorArticle.html')
130 
							mui.fire(proAiticle, "newId");
131 
						}
132 
						var consultPage = plus.webview.getWebviewById('consultlist.html');
133 
						mui.fire(consultPage, 'logined', {id: userId});
134
135 
						firstLogin();
136
137 
					}else{
138 
						if(data.code==-1){
139 
							plus.nativeUI.toast("验证码已过期，请重新获取", toastStyle);
140 
						}else if(data.code==-2){
141 
							plus.nativeUI.toast("手机号与验证码不匹配", toastStyle);
142 
						}else if(data.code==-3){
143 
							plus.nativeUI.toast("验证码错误，请检查后重试", toastStyle);
144 
						}else if(data.code==-4){
145 
							plus.nativeUI.toast("该账号不存在，请检查后重试", toastStyle);
146 
						}
147 
					}
148 
				},
149 
				error: function() {
150 
					plus.nativeUI.toast("服务器链接超时", toastStyle);
151 
					return;
152 
				}
153 
			});
154 
		}
155
156 
		/*判断用户第一次登录，是否填写了个人信息*/
157 
		function firstLogin() {
158 
			var professorId = plus.storage.getItem('userid');
159 
			mui.ajax(baseUrl + "/ajax/professor/" + professorId, {
160 
				dataType: 'json', //数据格式类型
161 
				type: 'GET', //http请求类型
162 
				async: false,
163 
				timeout: 10000, //超时设置
164 
				success: function(data) {
165 
					if(data.success) {
166 
						if(data.data.authentication < 0){
167 
							var productView = mui.preload({
168 
								url: '../html/fillinfo.html',
169 
								id: '../html/fillinfo.html',
170 
								show: {
171 
									aniShow: "slide-in-right"
172 
								},
173 
								extras: {
174 
									userid: professorId
175 
								}
176 
							});
177 
							productView.show();
178 
						}else{
179 
					        var clogin = plus.webview.getWebviewById('../html/login.html');
180 
					        plus.webview.close(clogin);
181 
					        mui.back();
182 
					        var myaccountPage = plus.webview.getWebviewById('html/myaccount.html');
183 
							mui.fire(myaccountPage, 'closeUser', {
184 
								id: professorId
185 
							});
186 
						}
187 
					}
188 
				},
189 
				error: function() {
190 
					plus.nativeUI.toast("服务器链接超时", toastStyle);
191 
					return;
192 
				}
193 
			});
194 
		}
195
196
197 
	});
198
199 
});

+ 3 - 3
app/js/public/base.js
查看文件 

@ -2,7 +2,7 @@
2 2 
mui.init();
3 3 
//var baseUrl = "http://www.ekexiu.com",
4 4 
var baseUrl = "http://192.168.3.233:81",
5 
//var baseUrl = "http:192.168.3.8:80",
5 
//var baseUrl = "http:192.168.3.85:80",
6 6 
	toastStyle = {
7 7 
		'verticalAlign': 'top',
8 8 
	}

@ -22,7 +22,7 @@ function goLoginFun() {
22 22 
		url: '../html/login.html',
23 23 
		id: '../html/login.html',
24 24 
		show: {
25 
			aniShow: "slide-in-bottom"
25 
			aniShow: "slide-in-right"
26 26 
		}
27 27 
	});
28 28 
}

@ -33,7 +33,7 @@ function goRegFun() {
33 33 
		url: '../html/reg.html',
34 34 
		id: '../html/reg.html',
35 35 
		show: {
36 
			aniShow: "slide-in-bottom"
36 
			aniShow: "slide-in-right"
37 37 
		}
38 38 
	});
39 39 
}

+ 2 - 2
app/js/register.js
查看文件 

@ -125,11 +125,11 @@ mui.ready(function() {
125 125 
			var getCodeOff = document.getElementById("getcodeoff");
126 126 
			obtainCode.style.display = "none";
127 127 
			getCodeOff.style.display = "block";
128 
			getCodeOff.value = "30s后重新获取";
128 
			getCodeOff.value = "60s后重新获取";
129 129 
			var clickTime = new Date().getTime();
130 130 
			var Timer = setInterval(function() {
131 131 
				var nowTime = new Date().getTime();
132 
				var second = Math.ceil(30 - (nowTime - clickTime) / 1000);
132 
				var second = Math.ceil(60 - (nowTime - clickTime) / 1000);
133 133 
				if(second > 0) {
134 134 
					getCodeOff.value = second + "s后重新获取";
135 135 
				} else {