You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

277 lines
12 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>报名申请表</title>
<link rel="stylesheet" href="../component/pear/css/pear.css" />
<link rel="stylesheet" href="../admin/css/other/result.css" />
</head>
<body class="pear-container layui-form">
<!-- <h1 class="title" style="text-align: center;margin-top: 10px;" id="title"></h1> -->
<div class="layui-card"
style="width: 700px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%); ">
<h1 class="title" style="text-align: center;margin: 15px 0 10px 0;" id="title"></h1>
<div class="layui-card-body">
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 姓名:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="text" autocomplete="off" lay-verify="required" name="name" placeholder="请输入姓名"
class="layui-input" style="width: 500px;">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 性别:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="radio" name="xb" value="男" title="男" checked>
<input type="radio" name="xb" value="女" title="女">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 身份证号:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="text" autocomplete="off" lay-verify="required|identity" lay-filter="idcard" id="idcard"
name="sfzh" placeholder="请输入身份证号" class="layui-input" style="width: 500px;">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">报名学段:</label>
<div class="layui-input-block" style="margin-right: 8px;">
<button type="button" class="layui-btn layui-btn-radius" id="stageTag" style="font-weight: bold;">输入身份证号后自动识别</button>
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 家庭住址:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="text" autocomplete="off" lay-verify="required" name="address" placeholder="请输入家庭住址"
class="layui-input" style="width: 500px;">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 父亲姓名:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="text" autocomplete="off" lay-verify="required" name="father_name" placeholder="请输入父亲姓名"
class="layui-input" style="width: 500px;">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 母亲姓名:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="text" autocomplete="off" lay-verify="required" name="mother_name" placeholder="请输入母亲姓名"
class="layui-input" style="width: 500px;">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 联系电话:
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<input type="text" autocomplete="off" lay-verify="required|phone" name="tel" placeholder="请输入联系电话"
class="layui-input" style="width: 500px;">
</div>
</div>
<div style="margin: 5px 0 25px 0">
<label class="layui-form-label" style="width: 85px;">
<font color="red" style="font-weight: bold;">*</font> 户口本照片(幼儿页)
</label>
<div class="layui-input-block" style="margin-right: 8px;">
<div class="layui-upload-drag" id="uploadImg">
<i class="layui-icon"></i>
<p>点击上传,或将文件拖拽到此处</p>
<div class="layui-hide" id="uploadView">
<hr>
<img src="" alt="上传成功后渲染" style="max-width: 196px">
</div>
</div>
</div>
</div>
<div class="action">
<button type="submit" class="layui-btn" lay-submit="" lay-filter="save-apply"
style="margin-left: 20px;">立即提交</button>
</div>
</div>
</div>
<script src="../component/layui/layui.js"></script>
<script src="../component/pear/pear.js"></script>
<script>
layui.use(['upload', 'element', 'form', 'layer'], function () {
var form = layui.form
, $ = layui.jquery
, upload = layui.upload
, element = layui.element
, layer = layui.layer;
//学段
var stageId = 0;
//上传户口本照片ID
var imgId = "0";
//task_id
var taskId = 0;
//获取当前task_id
$.ajax({
type: "GET",
dataType: "json",
url: "/FengHuang/yp/getCurrentTaskInfo",
success: function (res) {
if (res.task_id > 0) {
taskId = res.task_id;
$("#title").html(res.task_name);
} else {
window.location = "./error.html";
}
}
});
//拖拽上传
upload.render({
elem: "#uploadImg"
, url: "/FengHuang/yp/uploadPic"
, done: function (res) {
layer.msg("上传成功!", {
icon: 1,
time: 1500
});
imgId = res.uuid;
layui.$('#uploadView').removeClass('layui-hide').find('img').attr('src', res.base64);
}
});
//提交
form.on('submit(save-apply)', function (data) {
if (stageId > 0) {
var fields = data.field;
if (imgId == "0") {
layer.msg("请上传户口本照片(幼儿页)", {
icon: 2,
time: 2500
});
return;
}
$.ajax({
type: "POST",
url: "/FengHuang/yp/save",
data: { "task_id": taskId, "name": fields.name, "xb": fields.xb, "sfzh": fields.sfzh, "bx_id": stageId, "address": fields.address, "father_name": fields.father_name, "mother_name": fields.mother_name, "tel": fields.tel, "uuid": imgId },
success: function (data) {
if (data.success) {
window.location = "./success.html";
} else {
layer.msg(data.message, {
icon: 2,
time: 3000
});
}
}
});
}
else {
if (stageId == -1) {
layer.msg("身份证输入有误,请重新输入!", {
icon: 2,
time: 2500
});
} else if (stageId == -2) {
layer.msg("年龄不符合本次报名范围!", {
icon: 2,
time: 2500
});
} else {
layer.msg("报名学段的名额已满!", {
icon: 2,
time: 2500
});
}
return;
}
// window.location = "./success.html";
});
$('#idcard').blur(function () {
if (stageId > 0) {
$.ajax({
type: "GET",
dataType: "json",
url: "/FengHuang/yp/evalBx?sfzh=" + $('#idcard').val() + "&task_id=" + taskId,
success: function (res) {
if (res.bx_id > 0) {
$("#stageTag").html(res.bx_name);
stageId = res.bx_id;
}
else {
stageId = res.bx_id;
if (stageId == -1) {
$("#stageTag").html("身份证输入有误,请重新输入!");
} else if (stageId == -2) {
$("#stageTag").html("年龄不符合本次报名范围!");
} else {
$("#stageTag").html("报名学段的名额已满!");
}
}
}
});
}
});
$('#idcard').bind('input propertychange', function () {
if ($(this).val().length == 18) {
$.ajax({
type: "GET",
dataType: "json",
url: "/FengHuang/yp/evalBx?sfzh=" + $(this).val() + "&task_id=" + taskId,
success: function (res) {
if (res.bx_id > 0) {
$("#stageTag").html(res.bx_name);
stageId = res.bx_id;
}
else {
stageId = res.bx_id;
if (stageId == -1) {
$("#stageTag").html("身份证输入有误,请重新输入!");
} else if (stageId == -2) {
$("#stageTag").html("年龄不符合本次报名范围!");
} else {
$("#stageTag").html("报名学段的名额已满!");
}
}
}
});
}
if ($(this).val().length == 0) {
stageId = 0;
$("#stageTag").html("输入身份证号后自动识别");
}
});
});
</script>
</body>
</html>