<!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: url('https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_11021553049639917201920104039917bpohhr_login_bg.png');
			background-size: 100% 100%;
			width: 100%;
			height: 100%;
		}

		.appbody {
			margin: 0 auto;
			width: 1200px;
			height: 59px;
			text-align: left;
		}

		.appTop {
			/* margin: 16px 1454px 17px 373px; */
			width: 93px;
			height: 26px;
			margin-top: 14px;
		}

		.appBox {
			/* padding: 174px 360px 267px 360px; */
			/* padding-top: 100px; */
			/* padding-top: calc(25% - 292px); */
			/* width: 1200px; */
			/* height: 580px; */
			/* margin: 0 auto; */
			width: 100%;
			height: 100%;

		}

		.loginBox {
			/* position:relative; */
			width: 1200px;
			height: 580px;
			position: absolute;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			margin: auto;
		}

		.identifybox {
			display: flex;
			justify-content: space-between;
			margin-top: 7px;
		}

		.appBotton {
			margin-top: 10px;
			margin-left: 445px;
		}

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

		.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;
		}
		.subbtn {
			
		}
		.quickreg {
			float: left;
			color: #5FD7B8;
			text-decoration: none;
			font-size: 13px;
		}
		.forgetpwd {
			float: right;
			color: #999999;
			text-decoration: none;
			font-size: 13px;
		}
	</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">
					<img
						src="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_42731556107828871201924201028871xbg_bg.png" />
					<div
						style="position:absolute;top: 120px;left: 800px;background-color:white;width: 340px;height: 380px;">
						<el-form style="margin:20px 20px;" :model="loginForm" :rules="rules" ref="loginForm"
							label="right" class="demo-ruleForm">
							<span style="color: #666666; font-size: 16px;width: 214px;">您好，欢迎登录薪必果企业后台</span>
							<label class="grayLine"></label>

							<el-form-item label="手机号：" prop="userName" class="itemLaber">
								<el-input v-model="loginForm.userName" style="width:300px;height:40px;"
									placeholder="请输入帐号"  @keyup.enter.native="login" ></el-input>
							</el-form-item>

							<el-form-item label="登录密码：" prop="password" class="itemLaber" >
								<el-input type="password" style="width:300px;height:40px;" v-model="loginForm.password"
									placeholder="请输入密码"  @keyup.enter.native="login" ></el-input>
							</el-form-item>
							<div>
								<a @click="toreg" class="quickreg" href="javascript:;">快速注册&gt;</a>
								<a @click="toforget" class="forgetpwd" href="javascript:;">忘记密码？</a>
							</div>
							<el-button @click="login" style="margin-top:20px;width:300px;height:40px;background-color: #5FD7B8;color: #FFFFFF; font-size: 18px;	" >登录</el-button>
						</el-form>
					</div>
					<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/loginbpoent.js"></script>
</body>


</html>