Selaa lähdekoodia

注册登录功能块

xuchunyang 8 vuotta sitten
vanhempi
commit
42bfcb23bc
8 muutettua tiedostoa jossa 237 lisäystä ja 171 poistoa
  1. 9 10
      app/html/fillinfo.html
  2. 4 6
      app/html/login.html
  3. 3 4
      app/html/reg.html
  4. 1 1
      app/html/setpass.html
  5. 67 0
      app/js/fillinfo.js
  6. 13 0
      app/js/login.js
  7. 50 52
      app/js/register-setpass.js
  8. 90 98
      app/js/register.js

+ 9 - 10
app/html/fillinfo.html

3
3
4
	<head>
4
	<head>
5
		<meta charset="UTF-8">
5
		<meta charset="UTF-8">
6
		<title></title>
6
		<title>完善个人信息</title>
7
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
7
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
8
		<link href="../css/mui.min.css" rel="stylesheet" />
8
		<link href="../css/mui.min.css" rel="stylesheet" />
9
		<link href="../css/app.css" rel="stylesheet" />
9
		<link href="../css/app.css" rel="stylesheet" />
28
				<div class="maincon">
28
				<div class="maincon">
29
					<ul class="basicinfo">
29
					<ul class="basicinfo">
30
						<li><label>姓名<em class="requiredcon"></em></label></li>
30
						<li><label>姓名<em class="requiredcon"></em></label></li>
31
						<li class="basicfrm"><input type="text" name="name" class="mui-input-clear frmtype"></li>
31
						<li class="basicfrm"><input type="text"  class="mui-input-clear frmtype" id="userName"></li>
32
						<li><label>所在机构(高校/科研机构/企业名称)<em class="requiredcon"></em></label></li>
32
						<li><label>所在机构(高校/科研机构/企业名称)<em class="requiredcon"></em></label></li>
33
						<li class="basicfrm"><input type="text" name="organization" class="mui-input-clear frmtype"></li>
33
						<li class="basicfrm"><input type="text"  class="mui-input-clear frmtype" id="userMechanism"></li>
34
						<li><label>所属部门(院系/科研室/部门名称)</label></li>
34
						<li><label>所属部门(院系/科研室/部门名称)</label></li>
35
						<li class="basicfrm"><input type="text" name="department" class="mui-input-clear frmtype"></li>
35
						<li class="basicfrm"><input type="text"  class="mui-input-clear frmtype" id="userDepartment"></li>
36
						<li><label>职位</label></li>
36
						<li><label>职位</label></li>
37
						<li class="basicfrm"><input type="text" name="position" class="mui-input-clear frmtype"></li>
37
						<li class="basicfrm"><input type="text"  class="mui-input-clear frmtype" id="userPosition"></li>
38
						<li><label>职称</label></li>
38
						<li><label>职称</label></li>
39
						<li class="basicfrm"><input type="text" name="title" class="mui-input-clear frmtype"></li>
39
						<li class="basicfrm"><input type="text"  class="mui-input-clear frmtype" id="userTitle"></li>
40
						
40
						
41
					</ul>
41
					</ul>
42
			        
42
			        
43
		        </div>
43
		        </div>
44
		    </div>
44
		    </div>
45
		    <div class="mui-content-padded mainbox">
45
		    <div class="mui-content-padded mainbox">
46
				<button class="mui-btn mui-btn-block frmbtn frmactive">进入科袖</button>
46
				<button class="mui-btn mui-btn-block frmbtn frmactive2" id="goIndex">进入科袖</button>
47
			</div>
47
			</div>
48
		</div>
48
		</div>
49
		<script src="../js/public/mui.min.js"></script>
49
		<script src="../js/public/mui.min.js"></script>
50
		<script type="text/javascript">
51
			mui.init()
52
		</script>
50
		<script src="../js/public/base.js"></script>
51
		<script src="../js/fillinfo.js"></script>
53
	</body>
52
	</body>
54
53
55
</html>
54
</html>

+ 4 - 6
app/html/login.html

10
	</head>
10
	</head>
11
11
12
	<body>
12
	<body>
13
		<div class="closebtn">
13
		<div class="closebtn mui-action-back">
14
			<span class="mui-icon mui-icon-closeempty closeicon"></span>
14
			<span class="mui-icon mui-icon-closeempty closeicon"></span>
15
			<!--<div class="closeicon"></div>-->
15
			<!--<div class="closeicon"></div>-->
16
		</div>
16
		</div>
51
			</div>
51
			</div>
52
			
52
			
53
		</div>
53
		</div>
54
		
55
		<script src=" ../js/public/mui.min.js"></script>
56
		<script type="text/javascript">
57
			mui.init()
58
		</script>
54
		<script src="../js/public/mui.min.js"></script>
55
		<script src="../js/public/base.js"></script>
56
		<script src="../js/login.js"></script>
59
	</body>
57
	</body>
60
58
61
</html>
59
</html>

+ 3 - 4
app/html/reg.html

10
	</head>
10
	</head>
11
11
12
	<body>
12
	<body>
13
		<div class="closebtn">
13
		<div class="closebtn mui-action-back">
14
			<span class="mui-icon mui-icon-closeempty closeicon"></span>
14
			<span class="mui-icon mui-icon-closeempty closeicon"></span>
15
			<!--<div class="closeicon"></div>-->
15
			<!--<div class="closeicon"></div>-->
16
		</div>
16
		</div>
17
		<div class="mui-content">
17
		<div class="mui-content">
18
			<div class="logobox">
18
			<div class="logobox">
19
				<a class="logolink" href="../index.html">
19
				<a class="logolink">
20
					<img class="logoimg" src="../images/logo.png" />
20
					<img class="logoimg" src="../images/logo.png" />
21
				</a>
21
				</a>
22
			</div>
22
			</div>
41
	               </label>
41
	               </label>
42
		    	</div>
42
		    	</div>
43
			
43
			
44
		    	<button id='reg' class="mui-btn mui-btn-block frmbtn frmactive" style="display:none;">注&nbsp;册</button>
45
		    	<button class="mui-btn mui-btn-block frmbtn frmactive2">注&nbsp;册</button>
44
		    	<button id='reg' class="mui-btn mui-btn-block frmbtn frmactive2" >注&nbsp;册</button>
46
				<button id='login' class="mui-btn mui-btn-block mui-btn-outlined frmbtn">返回登录</button>
45
				<button id='login' class="mui-btn mui-btn-block mui-btn-outlined frmbtn">返回登录</button>
47
				
46
				
48
			</div>
47
			</div>

+ 1 - 1
app/html/setpass.html

28
			    </form>
28
			    </form>
29
			    
29
			    
30
			    <div class="mui-content-padded frmbox">
30
			    <div class="mui-content-padded frmbox">
31
					<button class="mui-btn mui-btn-block frmbtn frmactive" id="registerok">完&nbsp;成</button>
31
					<button class="mui-btn mui-btn-block frmbtn frmactive2" id="registerok">完&nbsp;成</button>
32
				</div>
32
				</div>
33
			</div>
33
			</div>
34
		</div>
34
		</div>

+ 67 - 0
app/js/fillinfo.js

1
//注册完成个人信息
2
mui.init();
3
mui.plusReady(function(){
4
	/*定义全局变量*/
5
	//var userid = plus.storage.getItem('userid');
6
	var userName = document.getElementById("userName");
7
	var userMechanism = document.getElementById("userMechanism");
8
	var userDepartment = document.getElementById("userDepartment");
9
	var userPosition = document.getElementById("userPosition");
10
	var userTitle = document.getElementById("userTitle");
11
	var goIndex = document.getElementById("goIndex");
12
	var self=plus.webview.currentWebview();
13
	
14
	/*校验提交按钮显示状态*/
15
	mui('.basicinfo').on('keyup',"#userName,#userMechanism",function() {
16
		hideButtn();
17
	});
18
	
19
	/*提交个人信息*/
20
	goIndex.addEventListener('tap', function() {
21
		goVal();
22
	});
23
	
24
	function hideButtn(){
25
		if(userName.value==""||userMechanism.value==""){
26
			goIndex.classList.remove('frmactiveok');
27
			goIndex.disabled="disabled";
28
		}else{
29
			goIndex.classList.add('frmactiveok');
30
			goIndex.disabled="";
31
		}
32
	}
33
	
34
	function goVal(){
35
		var $data = {};
36
		$data.name = userName.value;				
37
		$data.orgName = userMechanism.value;
38
		$data.title = userTitle.value;
39
		$data.department = userDepartment.value;
40
		$data.address = userPosition.value;
41
		$data.id = self.userid;
42
		mui.ajax(baseUrl + '/ajax/professor', {
43
			data:$data,
44
			dataType: 'json', //数据格式类型
45
			type: 'POST', //http请求类型
46
			timeout: 10000, //超时设置
47
			success: function(data) {
48
				console.log(data.success);
49
				if(data.success) {
50
					mui.openWindow({
51
		      			url:'../index.html',
52
		      			id:'../index.html',
53
						show:{
54
							aniShow:"slide-in-right"
55
						}
56
		      		});	
57
				}else{
58
					plus.nativeUI.toast("提交失败,用户ID失效", toastStyle);
59
				}
60
			},
61
			error: function() {
62
				plus.nativeUI.toast("服务器链接超时", toastStyle);
63
			}
64
		})
65
	}
66
	
67
});

+ 13 - 0
app/js/login.js

1
mui.init()
2
mui.plusReady(function(){
3
	var reg = document.getElementById("reg");
4
	reg.addEventListener("tap",function(){
5
		mui.openWindow({
6
			url:"reg.html",
7
			id:"reg.html",
8
			show:{
9
            	aniShow:"slide-in-right"
10
  			}
11
		})
12
	})
13
})

+ 50 - 52
app/js/register-setpass.js

6
	var passWord = document.getElementById("password");
6
	var passWord = document.getElementById("password");
7
	var passwordOK = document.getElementById("password2");
7
	var passwordOK = document.getElementById("password2");
8
	var registerOk = document.getElementById("registerok");
8
	var registerOk = document.getElementById("registerok");
9
	var oldPass = false;
10
	var isPass = false;
11
	var self=plus.webview.currentWebview();
9
	var self=plus.webview.currentWebview();
12
	
10
	
13
	/*校验第一个密码*/
14
	passWord.addEventListener('blur', function() {
15
		valOld();
11
	/*校验提交按钮显示状态*/
12
	mui('.frmbox').on('keyup',"#password,#password2",function() {
13
		hideButtn();
16
	});
14
	});
17
	
15
	
18
	/*校验确认密码*/
19
	passwordOK.addEventListener('blur', function() {
20
		valNew();
21
	});
22
	
23
	//完成注册
16
	/*提交设置密码*/
24
	registerOk.addEventListener('tap', function() {
17
	registerOk.addEventListener('tap', function() {
25
		completeReg();
18
		valOld()
26
	});
19
	});
27
    
28
	function valOld(){
29
		if(passWord.value.length==0){
30
			plus.nativeUI.toast("密码不能为空",toastStyle);
31
			oldPass = false;
32
		}else if(passWord.value.length < 6){
33
			plus.nativeUI.toast("密码不少于6位,请输入正确的密码",toastStyle);
20
	
21
	function hideButtn(){
22
		if(passWord.value==""||passwordOK.value==""){
23
			registerOk.classList.remove('frmactiveok');
24
			registerOk.disabled="disabled";
34
		}else{
25
		}else{
35
			oldPass = true;
26
			registerOk.classList.add('frmactiveok');
27
			registerOk.disabled="";
36
		}
28
		}
37
	}
29
	}
38
	
30
	
39
	function valNew(){
40
		if(passwordOK.value.length==0){
41
			plus.nativeUI.toast("密码不能为空",toastStyle);
42
			isPass = false;
43
		}else if(passwordOK.value.length<6){
44
			plus.nativeUI.toast("密码长度过短,至少六位",toastStyle);
45
			isPass = false;
31
	function valOld(){
32
		if(passWord.value.length < 6 && passwordOK.value.length<6){
33
			plus.nativeUI.toast("密码不少于6位,请输入正确的密码",toastStyle);
34
			return;
46
		}else if(passwordOK.value != passWord.value){
35
		}else if(passwordOK.value != passWord.value){
47
			plus.nativeUI.toast("两次密码不一致",toastStyle);
36
			plus.nativeUI.toast("两次密码不一致",toastStyle);
48
			isPass = false;
37
			return;
49
		}else{
38
		}else{
50
			isPass = true;
39
			completeReg();
51
		}
40
		}
52
	}
41
	}
53
	
42
	
54
	function completeReg(){
43
	function completeReg(){
55
		if(oldPass&&isPass){
56
			mui.ajax(baseUrl+'/ajax/regmobile',{
57
				data:{state:self.state,mobilePhone:self.phoneName,validateCode:self.setCode,password:passwordOK.value},
58
				dataType: 'json', //数据格式类型
59
				type: 'post', //http请求类型
60
				async: false,
61
				timeout: 10000, //超时设置
62
				success: function(data) {
63
						console.log(data)
64
					if(data.success) {
65
						state=data.data;
66
						console.log(state)
67
						plus.nativeUI.toast("注册成功",toastStyle);
68
					}
69
				},
70
				error: function() {
71
						plus.nativeUI.toast("服务器链接超时",toastStyle);
44
		mui.ajax(baseUrl+'/ajax/regmobile',{
45
			data:{
46
				state:self.state,
47
				mobilePhone:self.phoneName,
48
				validateCode:self.setCode,
49
				password:passwordOK.value
50
			},
51
			dataType: 'json', //数据格式类型
52
			type: 'post', //http请求类型
53
			async: false,
54
			timeout: 10000, //超时设置
55
			success: function(data) {
56
				if(data.success) {
57
					userId=data.data;
58
				    plus.storage.setItem('userid',userId);
59
					plus.nativeUI.toast("已完成注册,请填写个人信息",toastStyle);
60
					mui.openWindow({
61
		      			url:'fillinfo.html',
62
		      			id:'fillinfo.html',
63
		      			extras:{
64
							userid:userId
65
						},
66
						show:{
67
							aniShow:"slide-in-right"
68
						}
69
		      		});	
72
				}
70
				}
73
			});	
74
		}else{
75
			valOld();
76
			valNew();
77
		}
71
			},
72
			error: function() {
73
					plus.nativeUI.toast("服务器链接超时",toastStyle);
74
			}
75
		});	
78
	}
76
	}
79
	
77
	
80
})
78
});

+ 90 - 98
app/js/register.js

7
	var setCode = document.getElementById("set-code");
7
	var setCode = document.getElementById("set-code");
8
	var obtainCode = document.getElementById("obtain-code");
8
	var obtainCode = document.getElementById("obtain-code");
9
	var reg = document.getElementById("reg");
9
	var reg = document.getElementById("reg");
10
	var login = document.getElementById("login");
10
	var phoneCode=false;
11
	var phoneCode=false;
11
	var codeVal2 = false;
12
	var state = 0;
12
	var state = 0;
13
		
14
	phoneName.addEventListener('blur', function() {
15
		phoneVal();
16
	});
17
	
13
	
18
	setCode.addEventListener('blur', function() {
19
		codeVal();
14
	/*点击登录页面*/
15
	login.addEventListener('tap',function(){
16
		mui.openWindow({
17
  			url:'setpass.html',
18
  			id:'setpass.html',
19
  			show:{
20
            	aniShow:"slide-in-right"
21
  			}
22
      	});	
23
	})
24
	
25
	/*校验提交按钮显示状态*/
26
	mui('.frmbox').on('keyup',"#username,#set-code",function() {
27
		hideButtn();
20
	});
28
	});
21

29
	
22
	/*点击获取验证码*/
30
	/*点击获取验证码*/
23
	obtainCode.addEventListener('tap',function(){
31
	obtainCode.addEventListener('tap',function(){
24
		//console.log(phoneCode)
25
		sendAuthentication();
32
		if(phoneCode){
33
			sendAuthentication();	
34
		}else{
35
			phoneVal();
36
		}
26
	})
37
	})
27
	
38
	
28
	/*注册按钮*/
39
	/*注册按钮*/
29
	reg.addEventListener('tap',function(){
40
	reg.addEventListener('tap',function(){
30
		if(phoneCode&&codeVal2){
31
			mui.openWindow({
32
      			url:'setpass.html',
33
      			id:'setpass.html',
34
      			extras:{
35
					phoneName:phoneName.value,
36
					setCode:setCode.value,
37
					state:state
38
				}
39
      		});	
40
		}else{
41
			phoneVal();
41
		if(phoneCode){
42
			codeVal();	
42
			codeVal();	
43
		}else{
44
			phoneVal();	
43
		}
45
		}
44
	})
46
	})
45
	
47
	
48
	/*校验按钮显示状态*/
49
	function hideButtn(){
50
		if(phoneName.value==""||setCode.value==""){
51
			reg.classList.remove('frmactiveok');
52
			reg.disabled="disabled";
53
		}else{
54
			reg.classList.add('frmactiveok');
55
			reg.disabled="";
56
		}
57
	}
58
	
46
	/*校验手机号*/
59
	/*校验手机号*/
47
	function phoneVal(){
60
	function phoneVal(){
48
		var hunPhone=/^1[3|4|5|7|8]\d{9}$/;
61
		var hunPhone=/^1[3|4|5|7|8]\d{9}$/;
49
		if(phoneName.value.length==0){
50
			plus.nativeUI.toast("手机号不能为空",toastStyle)
51
			document.querySelector('.frmactive').style.display="none";
52
			document.querySelector('.frmactive2').style.display="block";
53
			phoneCode=false;
54
      	}else{
55
			if(hunPhone.test(phoneName.value)){
56
				isReg(); 
57
			}else{
58
				plus.nativeUI.toast("请输入正确的手机号码",toastStyle);
59
				phoneCode=false;
60
			}
62
		if(hunPhone.test(phoneName.value)){
63
			isReg(); 
64
		}else{
65
			plus.nativeUI.toast("请输入正确的手机号码",toastStyle);
66
			return;
61
		}
67
		}
62
	}
68
	}
63
	
69
	
69
			timeout: 10000, //超时设置
75
			timeout: 10000, //超时设置
70
			success: function(data) {
76
			success: function(data) {
71
				if(data.data == false) {
77
				if(data.data == false) {
72
					//mui.back();
73
					phoneCode=false;
74
					//alert(phoneCode);
75
					plus.nativeUI.toast("您的手机已被注册",toastStyle);
78
					plus.nativeUI.toast("您的手机已被注册",toastStyle);
79
					return;
76
				}else{
80
				}else{
77
					//plus.nativeUI.toast(phoneCode,toastStyle);
78
					phoneCode=true;
81
					phoneCode=true;
79
					return phoneCode; 
80
				}
82
				}
81
			},
83
			},
82
			error: function() {
84
			error: function() {
83
					plus.nativeUI.toast("服务器链接超时",toastStyle);
84
					phoneCode=false;
85
					
85
				plus.nativeUI.toast("服务器链接超时",toastStyle);
86
			}
86
			}
87
		})
87
		});
88
	}
88
	}
89

89

90
	/*手机发送验证码*/
90
	/*手机发送验证码*/
91
	function sendAuthentication(){
91
	function sendAuthentication(){
92
		console.log(phoneCode)
93
		if(phoneCode){
94
			mui.ajax(baseUrl+'/ajax/regmobilephone',{
95
				data:{mobilePhone:phoneName.value},
96
				dataType: 'json', //数据格式类型
97
				type: 'GET', //http请求类型
98
				async: false,
99
				timeout: 10000, //超时设置
100
				success: function(data) {
101
					if(data.success) {
102
						state=data.data;
103
						console.log(state)
104
						doClick();
105
					}
106
				},
107
				error: function() {
108
						plus.nativeUI.toast("服务器链接超时",toastStyle);
92
		mui.ajax(baseUrl+'/ajax/regmobilephone',{
93
			data:{mobilePhone:phoneName.value},
94
			dataType: 'json', //数据格式类型
95
			type: 'GET', //http请求类型
96
			async: false,
97
			timeout: 10000, //超时设置
98
			success: function(data) {
99
				if(data.success) {
100
					state=data.data;
101
					doClick();
109
				}
102
				}
110
			})
111
		}
103
			},
104
			error: function() {
105
					plus.nativeUI.toast("服务器链接超时",toastStyle);
106
					return;
107
			}
108
		})
112
	}
109
	}
113
	
110
	
114
	/*30s后重新获取验证码*/
111
	/*30s后重新获取验证码*/
134
	
131
	
135
	/*校验验证码*/
132
	/*校验验证码*/
136
	function codeVal(){
133
	function codeVal(){
137
		//console.log(state)
138
		if(setCode.value.length==0){
139
			plus.nativeUI.toast("验证码不能为空",toastStyle);
140
			codeVal2 = false;
141
			document.querySelector('.frmactive').style.display="none";
142
			document.querySelector('.frmactive2').style.display="block";
143
      	}else{
144
      		document.querySelector('.frmactive2').style.display="none";
145
		    document.querySelector('.frmactive').style.display="block";
146
      		mui.ajax(baseUrl+'/ajax/validCode',{
147
				data:{"state":state,"vc":setCode.value},
148
				dataType: 'json', //数据格式类型
149
				async: false,
150
				type: 'POST', //http请求类型
151
				timeout: 10000, //超时设置
152
				success: function(data) {
153
					console.log(data.data);
154
					if(data.success){
155
						console.log(data.success);
156
						if(data.data){
157
							//plus.nativeUI.toast("验证码输入正确",toastStyle);
158
							codeVal2 = true;
159
						}else{
160
							plus.nativeUI.toast("验证码不正确",toastStyle);
161
							codeVal2 = false;
162
						}
134
  		mui.ajax(baseUrl+'/ajax/validCode',{
135
			data:{"state":state,"vc":setCode.value},
136
			dataType: 'json', //数据格式类型
137
			async: false,
138
			type: 'POST', //http请求类型
139
			timeout: 10000, //超时设置
140
			success: function(data) {
141
				console.log(data.success);
142
				if(data.success){
143
					if(data.data){
144
						mui.openWindow({
145
			      			url:'setpass.html',
146
			      			id:'setpass.html',
147
			      			extras:{
148
								phoneName:phoneName.value,
149
								setCode:setCode.value,
150
								state:state
151
							}
152
			      		});	
163
					}else{
153
					}else{
164
						plus.nativeUI.toast("验证超时",toastStyle);
165
						codeVal2 = false;
166
						console.log(data.msg);
154
						plus.nativeUI.toast("验证码正确",toastStyle);
155
						return;	
167
					}
156
					}
168
				},
169
				error: function() {
170
						plus.nativeUI.toast("服务器链接超时",toastStyle);
171
						codeVal2 = false;
157
				}else{
158
					plus.nativeUI.toast("验证超时,请重新获取",toastStyle);
159
					return;eturn;	
172
				}
160
				}
173
			})
174
      	}
175
	}
161
			},
162
			error: function() {
163
				plus.nativeUI.toast("服务器链接超时",toastStyle);
164
				return;
165
			}
166
		})
167
    }
176
	
168
	
177
	
169
	
178
})
170
})