sr-publicServicePlatform/component/login-register/register.js

(function() {
	Vue.component('register-form', {
		template: `<div><div class="container-fluid c-border-b">
				<div class="container" id="head">
					<div class="ptb30 top-banner">
						<img src="../../../images/LOGO.png"/>
						<span class="qr-container">
							<img src="../../../images/qr_code.png" class="qr_code" />
							<p class="c-f12 text-center c-909090" style="padding-top:5px">下载APP</p>
						</span>
						<span class="backlogin" @click="gologin()">返回登录页</span>
					</div>
				</div>
			</div>
		<div class="container">
			<div class="ptb80">
				<div id="registerForm" class="main">
					<div class="ptb10 c-border-b c-f20">注册</div>
					<form id="form" class="m-t" role="form" onsubmit="return false;" style="width:310px;">
						<div class="form-group">
							<input class="form-control" type="text" maxlength="18" placeholder="请输入身份证号" v-model="IDCard" id="IDCard">
						</div>
						<div class="form-group">
							<input class="form-control" placeholder="请输入手机号码" v-model="phone" type="text" length="11">
						</div>
						<div class="form-group">
							<input class="form-control" placeholder="请确认验证码" v-model="captcha">
						</div>
						<div class="form-group">
							<input class="form-control" placeholder="请确认登录密码" v-model="Password" min-length="6" max-length="16">
						</div>
						<p class="c-909090" style="margin-top:-10px;">密码格式为6-16位，不允许有空格</p>
						<div class="checkbox">
							<label><input type="checkbox"
  v-model="toggle"> 阅读并接受<a href="#" target="_blank">《健康之路用户协议》</a>及<a href="#" target="_blank">《健康之路隐私保护声明》</a></label>
						</div>
						<button type="submit" class="btn btn-theme block full-width m-b" @click="register">完成注册并登录</button>
					</form>
				</div>
			</div>
		</div>
		</div>`,
		props: [],
		data: function() {
			return {
				IDCard: "",
				phone: "",
				Password: "",
				captcha: "",
				toggle: false,
			}
		},
		methods: {
			register: function() {
				var vm = this
				if(!isCardNo(vm.IDCard, vm.phone)) {
					return
				}
				if(!vm.Password) {
					alert("登录密码不能为空！");
					return false;
				}
				if(!vm.captcha) {
					alert("验证码不能为空！");
					return false;
				}
				if(!vm.toggle) {
					alert("未确认是否阅读并接受条款");
					return false;
				}
				//				location.href = "../login/login.html"
				//连接注册后台接口
				var data = {
					demographicId: vm.IDCard,
					codeType: vm.codeType,
					telephone: vm.tel,
					password: vm.password,
				}
				var params = {
					userJsonData: JSON.stringify(data),
					appId: httpRequest.client_id
				}
				loginAPI.registe(params).then(function(res) {
					if(res.successFlg) {
						alert("注册成功");
						vm.login();
					} else {
						alert(res.errorMsg);
					}

				}).catch(function(err) {
					alert(err.errorMsg);
				})
			},
			gologin: function() {
				location.href = "../../login/html/login.html"
			}
		},
		watch: {
			Password: function(newVal, oldVal) {
				var val = newVal.toString();
				var reg = /\s+/g; //去除空格
				if(reg.test(val)) {
					this.Password = oldVal;
				}
			},
		}
	});

	function isCardNo(card, phone) {
		// 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X
		var iscard = false,
			isphone = false
		var reg1 = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
		if(reg1.test(card) === false) {
			alert("身份证号输入不合法");
		} else {
			iscard = true
		}
		var reg2 = /0?(13|14|15|18|17)[0-9]{9}/;
		if(reg2.test(phone) === false) {
			alert("手机号码输入不合法");
		} else {
			isphone = true
		}
		return iscard && isphone
	}

})()