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

<head>
	<meta charset="utf-8">
	<title id="needh5">企业注册</title>
	<link rel="stylesheet" href="/css/ele/chalk.css">
	<link rel="stylesheet" href="/css/main.css">
	<link rel="stylesheet" href="/css/fontawesome/css/font-awesome.min.css">
	<link rel="stylesheet" href="/css/autocomplete.css">
	<script src="/js/vue/vue.min.js"></script>
	<script src="/js/ele/index.js"></script>
	<style type="text/css">
		html {
			width: 100%;
			height: 100%;
		}
		#app {
			width: 100%;
			height: 100%;	
		}

		.appBack {
			background-size: 100% 100%;
			width: 100%;
			height: 100%;
		}


		.appBox {
			width: 100%;
			height: 100%;
		}

		.loginBox {
			/* position:relative; */
			width: 724px;
			height: 562px;
			position: absolute;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			margin: 4% auto;
		}

		.appBotton {
			width: 100%;
			text-align: center;
			margin-top: 50px;
		}

		.itemLaber .el-form-item__label {
			color: #666666;
			font-size: 14px;
			font-weight: bold;
		}

		.grayLine {
			background: #E8E8E8;
			width: 300px;
			height: 1px;
			float: left;
			margin: 10px 0px;

		}

		::-webkit-input-placeholder {
			/* WebKit, Blink, Edge */
			color: #c0c4cc;
			font-size: 14px;
		}

		:-moz-placeholder {
			/* Mozilla Firefox 4 to 18 */
			color: #c0c4cc;
			font-size: 14px;
		}

		::-moz-placeholder {
			/* Mozilla Firefox 19+ */
			color: #c0c4cc;
			font-size: 14px;
		}

		:-ms-input-placeholder {
			/* Internet Explorer 10-11 */
			color: #c0c4cc;
			font-size: 14px;
		}
		.back {
			color: #666666; 
			font-size: 14px;
			width: 214px;
			cursor: pointer;
		}
		.coderow {
			width:500px;
		}
		.codeinput {
			float:left;
			width:154px;
			height:40px;
		}
		.codesvg {
			width:154px;
			height:40px;
			float:left;
			margin-left: 20px;
			cursor: pointer;
		}
		.codebtn {
			color: #54C4A7;
			font-size: 14px;
			width: 154px;
			height: 40px;
			font-weight:bold;
			background-color: #E7F9F4;
			border: 1px solid #5FD7B8;
			border-radius: 3px;
			margin-left: 20px;
			cursor: pointer;		
		}
		.el-form-item__content {
			line-height: 20px;
			position: relative;
			font-size: 14px;
			font-family:MicrosoftYaHei;

		}
		.formcard {
			width: 724px;
			height: 562px;
			background-color: #FFFFFF;
			padding:10px 10px 30px 10px;
			margin-top: 20px;
			border-radius: 12px;
		}
		.tologin {
			width: 100%;
			text-align: center;
			margin-top: 20px;
		},
		.tologin span {
			color:#666666;
			font-size: 14px;
		}
		.tologin a {
			color: #5FD7B8;
			font-size: 16px;
			cursor: pointer;
		}
		.aggreement {
			text-decoration: none;
			color: #5FD7B8;
			font-size: 16px;
		}
	</style>
</head>

<body style="overflow: hidden; width: 100%; height: 100%;">
	<div id="app">
		<div class="appBack">
			<!-- <div :style="appBox"> -->
			<div class="appBox">
				<div class="loginBox">
					<el-card class="formcard">
						<div style="text-align: center;color: #333333;font-size: 24px;">
							快速注册
						</div>
						<el-form style="text-align: center;margin: 40px 0px 20px 80px;" :model="dataForm" label-position="right" label-width="140px" :rules="rules" ref="dataForm">
							<el-form-item label="手机号 " prop="mobile" class="itemLaber" >
								<el-input v-model="dataForm.mobile" style="width:328px;height:40px;"
									placeholder="请输入手机号" ></el-input>
							</el-form-item>
							<el-form-item label="验证码 " prop="captcha" class="itemLaber" >
								<div class="coderow" style="display:inline-block;">
									<el-input v-model="dataForm.captcha" class="codeinput"
										placeholder="请输入图形验证码"   ></el-input>
									<div @click="captcha" id = "captchaDiv" class="codesvg"></div>
								</div>
							</el-form-item>
							<el-form-item label="短信验证码 " prop="vcode" class="itemLaber"  >
								<div class="coderow">
									<el-input v-model="dataForm.vcode" class="codeinput"
										placeholder="请输入验证码"  ></el-input>
									<input :loading="sendCodeLoading" type="button" @click="sendCode" class="codebtn" :value="sendCodeText" ></input>
								</div>
							</el-form-item>
							<el-form-item label="登录密码 " prop="passwd" class="itemLaber"  >
								<el-input type="password" v-model="dataForm.passwd" style="width:328px;height:40px;"
									placeholder="请输入密码" ></el-input>
							</el-form-item>
							<el-form-item label="确认登录密码 " prop="passwdConfirm" class="itemLaber"  >
								<el-input type="password" v-model="dataForm.passwdConfirm" style="width:328px;height:40px;"
									placeholder="请输入密码" ></el-input>
							</el-form-item>
							<el-form-item label="" class="itemLaber"  >
								<el-checkbox v-model="isAgree" style="color:#333333" >同意并阅读</el-checkbox>
								<a class="aggreement" href="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_3524155720836221320197135242213薪必果零工协议.pdf" target="_blank">《薪必果零工协议》</a>
							</el-form-item>
							<el-button v-if="isAgree" :loading="subLoading" @click="sub" style="width:328px;height:40px;background-color: #5FD7B8;color: #FFFFFF;font-size: 18px;" >提交</el-button>
							<el-button v-if="!isAgree" style="width:328px;height:40px;font-size: 18px;color: #666666;background-color: #EEEEEE;" >提交</el-button>

							<div class="tologin">
								<span>已有帐号?</span>
								<a @click="tologin" href="javascript:;">登录</a>
							</div>
						</el-form>
					</el-card>
					<div class="appBotton">
						<span style="color:#CCCCCC;padding: 20px;font-size: 16px;">版权所有©汉唐信通（北京）科技有限公司</span>
					</div>
				</div>
				
			</div>
		</div>
	</div>
	<script src="/js/vue/jquery.min.js"></script>
	<script src="/js/vue/axios.min.js"></script>
	<script src="/js/login/regent.js"></script>
</body>


</html>