zkx
/
jp-employment-kfq-large


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319
							<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>湖北荆鹏软件集团有限公司</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/app.css">
<!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
<!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
<!--[if lt IE 9]>
  <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="app">
	<div class="head">
		<div class="head-left">
			<img class="data-company-logo" src="./img/logo.png" alt="">
			
			<div class="head-text">
				<h1 class="data-company-name"></h1>
				<div class="head-label">
					<span class="data-scale" ></span>
					<span class="data-industry"  ></span>
				</div>
			</div>
		</div>
		<div class="head-right">
			<h1>席位号<span class="data-seatNumber">A01</span></h1>
		</div>
	</div>
	<div class="main">
		<div class="main-left">
			<div class="main-title">
				<img src="./img/Frame%2095.png" alt="">
				<span>企业介绍</span>
			</div>
			<div class="main-content">
				<div class="main-about data-introduction">
					
				</div>
				<video width="500" height="300" 
				
				 autoplay loop muted
				class="main-video"
				
				  >
 
				</video>
				
				
			</div>
		</div>
		<script type="text/text/x-jquery-tmpl" id="tabpanel-temp">
		<div role="tabpanel" class="tab-pane " id="${id}">
								  <div class="work-row">
									  <p >招聘人数:${positionNumber}</p><p>学历要求:${educationName}</p>
								  </div>
								  <div class="work-row">
								  	<p>性别要求:${positionSexN}</p><p>工作经验:${workYearName}</p>
								  </div>
									<div class="work-main">
										<div class="title"> 职责描述:</div>
										<div class="content">
											${positionMessage}
										</div>
										<div class="title"> 任职要求:</div>
										<div class="content">
										${requirements}
										 </div>
									</div>
		</div> 
		</script>
		<div class="main-middle">
			<div class="main-title">
				<img src="./img/Frame%2096.png" alt="">
				<span class="data-recruitmentList-length">招聘职位（）</span>
			</div>
			<div class="main-content">
				<ul class="main-nav-tabs" role="tablist">
				   
				 </ul>
				<div class="main-tab">
					
					<div class="tab-content">
					 
					</div> 
					<div class="tab-code">
						<div class="tab-code-img">
 							<div id="qrcode"></div>

							<p>扫描二维码投递简历</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="main-right">
			<div class="main-title">
				<img src="./img/Frame%2094.png" alt="">
				<span class="data-jobRecruitmentList-length">简历投递记录（）</span>
			</div>
			<div class="main-content">
				<script type="text/text/x-jquery-tmpl" id="deliver-temp">
					<div class="deliver-item">
						<img src="./img/sex${sex}.png" alt="">
						<div class="deliver-text">
							<div class="deliver-title">
								<h2>${name}</h2>
								<span>${time}</span>
							</div>
							<p>投递了${job}</p>
						</div>
					</div>
				</script>
				<div class="deliver">
					
				 
				</div>
			</div>
		</div>
	</div>
</div>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="js/jquery.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="js/bootstrap.min.js"></script>
<script src="js/qrcode.js"></script>
<script src="js/jquery.loadTemplate.js"></script>
<script src="./linkjs/index.js" ></script>

</body>
<style>
	.work-row{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 15px;
	}
	.main-tab{
		display:flex;
		min-height: 600px;
	}
	.work-main{
		margin-top: 30px;
	}
	.work-main .title{
		margin-bottom: 10px;
		margin-top: 10px;
	}
	.tab-content{
		flex: 1;
		padding-top: 40px;
	}
	.content p{
		color:#adb4c0;
		line-height: 40px;
	}
	.tab-code{
		width: 170px;
		position: relative;
	}
	.tab-code-img{
		text-align: center;
		position: absolute;
		bottom:0px;
		left: 30px;
	}
	.tab-code-img img{
		width: 150px;
		height: 150px;
		border: 2px solid #fff;
	}
	.tab-code-img p{
		font-size: 16px;
		margin-top: 10px;
	}
	.main-nav-tabs{
		flex-wrap: wrap;
		display: flex;
		align-items: center;
	}
	.main-nav-tabs li a{
		color:#fff;
		font-size: 18px;
		margin-right: 10px;
		padding-bottom: 5px;
	}
	.main-nav-tabs li.active a{
		border-bottom: 2px solid #ffb819;
	}
	body{
		background:url(./img/bg.png) no-repeat;
		background-size: 100% 100%;
		height: 100vh;
	}
	.app{
		padding: 40px;
		height: 100vh;
		overflow: hidden;
	}
	.head{
		display: flex;
		justify-content: space-between;
		border-bottom:1px solid  #434383;
		padding-bottom: 40px;
	}
	.head-left{
		display: flex;
	}
	.head-left img{
		height: 100px;
		width: 100px;
		border-radius: 10px;
	}
	.head-text{
		margin-left: 15px;
	}
	.head-text h1{
		font-size: 72px;	
	}
	.head-label{
		display: flex;
		margin-top: 15px;
	}
	.head-label span{
		border-radius:50px;
		border: 2px solid #fff;
		padding: 5px 15px;
		font-size: 24px;
		margin-right: 15px;
	}
	.head-right h1{
		font-size: 72px;
	}
	.head-right h1 span{
		color:#FF6E18;
	}
	.main{
		display: flex;
		padding: 50px;
	}
	.main-left{
		width: 30%;
		padding-right: 40px;
		border-right: 1px solid #434383;
	}
	.main-middle{
		width: 40%;
		border-right: 1px solid #434383;
		padding: 0 40px;
	}
	.main-right{
		width: 30%;
		padding-left: 40px;
	}
	.main .main-title{
		display: flex;
		align-items: center;
	}
	.main .main-title img{
		height: 40px;
		width: 40px;
	}
	.main .main-title span{
		margin-left: 10px;
		font-size: 32px;
		font-weight: bold;
	}
	.main-content{
		margin-top: 20px;
	}
	.main-about p{
		font-size: 20px;
		line-height: 40px;
		text-indent: 40px;
	}
	.main-video{
		margin-top: 15px;
	}
	.deliver-item{
		background: rgba(255,255,255,0.3);
		border: 2px solid #fff;
		border-radius: 10px;
		display: flex;
		align-items: center;
		padding: 20px;
		margin-bottom: 20px;
	}
	.deliver-item img{
		width: 53px;
		height: 60px;
	}
	.deliver-text{
		flex: 1;
		margin-left: 10px;
	}
	.deliver-title{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.deliver-title h2{
		font-size: 24px;
	}
	.deliver-title span{
		font-size: 16px;
	}
	.deliver-text p{
		font-size: 16px;
		margin-top: 10px;
	}
</style>
</html>