505 lines
24 KiB
HTML
505 lines
24 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title></title>
|
||
<link href="./component/pear/css/pear.css" rel="stylesheet" />
|
||
|
||
<style>
|
||
.lay-step {
|
||
font-size: 0;
|
||
margin: 0 auto;
|
||
max-width: 100%;
|
||
width: 60%;
|
||
padding-left: 13%;
|
||
}
|
||
|
||
td {
|
||
text-align: center;
|
||
height: 35px;
|
||
|
||
}
|
||
|
||
.td_title {
|
||
font-size: 16px !important;
|
||
font-weight: bolder;
|
||
}
|
||
|
||
.td_content {
|
||
text-align: left;
|
||
font-size: 16px !important;
|
||
}
|
||
|
||
th {
|
||
text-align: center;
|
||
}
|
||
|
||
.layui-elem-field legend {
|
||
margin-left: 20px;
|
||
padding: 0 10px;
|
||
font-size: 12px;
|
||
color: #05B5F8;
|
||
}
|
||
|
||
.layui-carousel {
|
||
position: relative;
|
||
left: 0;
|
||
top: 0;
|
||
background-color: #f8f8f8;
|
||
height: 600px !important;
|
||
}
|
||
</style>
|
||
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<body>
|
||
<div style="margin: 0 auto;">
|
||
<div class="layui-carousel" id="stepForm" lay-filter="stepForm"
|
||
style="height: 600px !important; margin: 40px auto;">
|
||
<div carousel-item>
|
||
<!-- 确认考生信息 -->
|
||
<div>
|
||
<form class="layui-form" action="javascript:void(0);"
|
||
style="margin: 0 auto;max-width: 600px;padding-top: 10px;">
|
||
<fieldset class="layui-elem-field layui-field-title">
|
||
<legend>确认考生信息</legend>
|
||
</fieldset>
|
||
<table class="layui-table">
|
||
<colgroup>
|
||
<col width="1300">
|
||
<col width="1300">
|
||
<col width="1300">
|
||
<col width="1300">
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th colspan="4" style="text-align: center;font-size: 18px;height: 35px;">考生信息
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td class="td_title">姓名</td>
|
||
<td class="td_content" id="xm"></td>
|
||
<td class="td_title">性别</td>
|
||
<td class="td_content" id="xb"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">所属学校</td>
|
||
<td class="td_content" colspan="3" id="ssxx"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">身份证号</td>
|
||
<td class="td_content" colspan="3" id="sfzh"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">考籍号</td>
|
||
<td class="td_content" colspan="3" id="kjh"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">国家学籍号</td>
|
||
<td class="td_content" colspan="3" id="gjxjh"></td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div class="layui-form-item" style="margin-top: 20px;">
|
||
<div style="text-align: center;">
|
||
<button class="pear-btn pear-btn-primary" lay-submit lay-filter="formStep">
|
||
下一步
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<!-- 选择科目卷面文字 -->
|
||
<div>
|
||
<form class="layui-form" action="javascript:void(0);"
|
||
style="margin: 0 auto;max-width: 600px;padding-top: 10px;">
|
||
<fieldset class="layui-elem-field layui-field-title">
|
||
<legend>选择科目卷面文字</legend>
|
||
</fieldset>
|
||
<div class="layui-form-item" style="margin: 30px 0;">
|
||
<label class="layui-form-label" style="width: 100px;">科目卷面文字:</label>
|
||
<div class="layui-input-block" id="jmwzView">
|
||
<script id="jmwzScript" type="text/html">
|
||
{{# layui.each(d, function(index, item){ }}
|
||
<input type="radio" name="jmwz" value="{{item.wz_id}}" title="{{item.wz_name}}">
|
||
{{# }); }}
|
||
</script>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<div style="text-align: center;">
|
||
<button type="button" class="pear-btn pear-btn-primary pre">上一步</button>
|
||
|
||
<button class="pear-btn pear-btn-primary" lay-submit lay-filter="formStep2">
|
||
下一步
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<!-- 选择考试科目 -->
|
||
<div>
|
||
<form class="layui-form" action="javascript:void(0);"
|
||
style="margin: 0 auto;max-width: 600px;padding-top: 10px;">
|
||
<fieldset class="layui-elem-field layui-field-title">
|
||
<legend>选择考试科目</legend>
|
||
</fieldset>
|
||
<div class="layui-form-item" style="margin-top: 20px;">
|
||
|
||
<div style="margin-left: 10px;" id="subjectView">
|
||
<script id="subjectScript" type="text/html">
|
||
{{# layui.each(d.subject, function(index1, item){ }}
|
||
{{# if(item.children.length==0){ }}
|
||
{{# if(d.ywj_id==1){ }}
|
||
<input type="checkbox" id="chk_{{item.group_name}}" value="{{item.id}}" name="{{item.subject_code}}" title="{{item.name}}" checked disabled><br>
|
||
{{# } else { }}
|
||
<input type="checkbox" id="chk_{{item.group_name}}" value="{{item.id}}" name="{{item.subject_code}}" title="{{item.name}}"><br>
|
||
{{# } }}
|
||
{{# } else { }}
|
||
{{# if(d.ywj_id==1){ }}
|
||
<input type="checkbox" id="chk_{{item.subject_code}}" title="{{item.name}}" lay-filter="childChk" checked disabled><br>
|
||
{{# } else { }}
|
||
<input type="checkbox" id="chk_{{item.subject_code}}" title="{{item.name}}" lay-filter="childChk"><br>
|
||
{{# } }}
|
||
{{# layui.each(item.children, function(index2, clildItem){ }}
|
||
{{# if(d.ywj_id==1){ }}
|
||
{{# if(index2==0){ }}
|
||
  <input type="radio" id="rdo_{{item.subject_code}}" name="{{item.subject_code}}" value="{{clildItem.id}}" title="{{clildItem.name}}" lay-filter="childRdo" checked>
|
||
{{# } else { }}
|
||
  <input type="radio" id="rdo_{{item.subject_code}}" name="{{item.subject_code}}" value="{{clildItem.id}}" title="{{clildItem.name}}" lay-filter="childRdo">
|
||
{{# } }}
|
||
|
||
{{# } else { }}
|
||
  <input type="radio" id="rdo_{{item.subject_code}}" name="{{item.subject_code}}" value="{{clildItem.id}}" title="{{clildItem.name}}" lay-filter="childRdo">
|
||
{{# } }}
|
||
|
||
{{# }); }}
|
||
<br>
|
||
{{# } }}
|
||
{{# }); }}
|
||
</script>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item" style="margin-top: 20px;">
|
||
<div style="text-align: center;">
|
||
<button type="button" class="pear-btn pear-btn-primary pre">上一步</button>
|
||
|
||
<button class="pear-btn pear-btn-primary" lay-submit lay-filter="formStep3">
|
||
下一步
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<!-- 确认报名信息 -->
|
||
<div>
|
||
<form class="layui-form" action="javascript:void(0);"
|
||
style="margin: 0 auto;max-width: 600px;padding-top: 10px;">
|
||
<fieldset class="layui-elem-field layui-field-title">
|
||
<legend>确认报名信息</legend>
|
||
</fieldset>
|
||
<table class="layui-table">
|
||
<colgroup>
|
||
<col width="1300">
|
||
<col width="1300">
|
||
<col width="1300">
|
||
<col width="1300">
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th colspan="4" style="text-align: center;font-size: 18px;height: 35px;">报名信息
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td class="td_title">姓名</td>
|
||
<td class="td_content" id="xmV"></td>
|
||
<td class="td_title">性别</td>
|
||
<td class="td_content" id="xbV"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">所属学校</td>
|
||
<td class="td_content" colspan="3" id="ssxxV"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">身份证号</td>
|
||
<td class="td_content" colspan="3" id="sfzhV"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">考籍号</td>
|
||
<td class="td_content" colspan="3" id="kjhV"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">国家学籍号</td>
|
||
<td class="td_content" colspan="3" id="gjxjhV"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">科目卷面文字</td>
|
||
<td class="td_content" colspan="3" id="kmjmwzV"></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="td_title">考试科目</td>
|
||
<td class="td_content" colspan="3" id="kskmV"></td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div class="layui-form-item" style="margin-top: 20px;">
|
||
<div style="text-align: center;">
|
||
<button type="button" class="pear-btn pear-btn-primary pre">上一步</button>
|
||
<button class="pear-btn pear-btn-primary" lay-submit lay-filter="formStep4">
|
||
确认报名
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<script src="./component/layui/layui.js"></script>
|
||
<script src="./component/pear/pear.js"></script>
|
||
<script>
|
||
layui.use(['form', 'step', 'laytpl', 'jquery'], function () {
|
||
let form = layui.form;
|
||
let $ = layui.jquery;
|
||
let step = layui.step;
|
||
let laytpl = layui.laytpl
|
||
|
||
var lsData = localStorage.getItem('studentInfo');
|
||
if (lsData == null) {
|
||
window.parent.location.href = "./login.html";
|
||
}
|
||
var studentInfo = JSON.parse(lsData);
|
||
|
||
var jmwz;
|
||
var jmwzid;
|
||
var jmwzObj = {};
|
||
var selectSubjectTxt = [];
|
||
var selectSubjectObj = [];
|
||
|
||
|
||
step.render({
|
||
elem: '#stepForm',
|
||
filter: 'stepForm',
|
||
width: '100%',
|
||
stepWidth: '600px',
|
||
height: '500px',
|
||
stepItems: [{
|
||
title: '确认考生信息'
|
||
}, {
|
||
title: '选择科目卷面文字'
|
||
}, {
|
||
title: '选择考试科目'
|
||
}, {
|
||
title: '确认报名信息'
|
||
}]
|
||
});
|
||
|
||
// 渲染学生信息
|
||
$("#xm").html(studentInfo.student_name);
|
||
$("#xb").html(studentInfo.xb);
|
||
$("#ssxx").html(studentInfo.school_name);
|
||
$("#sfzh").html(studentInfo.sfzh);
|
||
$("#kjh").html(studentInfo.kjh);
|
||
$("#gjxjh").html(studentInfo.xjh);
|
||
|
||
// 渲染卷面文字
|
||
var jmwzArr = JSON.parse(studentInfo.jmwz_id);
|
||
var jmwzTpl = jmwzScript.innerHTML;
|
||
var jmwzView = document.getElementById('jmwzView');
|
||
laytpl(jmwzTpl).render(jmwzArr, function (html) {
|
||
jmwzView.innerHTML = html;
|
||
});
|
||
|
||
// 渲染选择考试科目
|
||
var subjectObj = {};
|
||
var _obj = JSON.parse(studentInfo.km_json);
|
||
subjectObj["subject"] = _obj;
|
||
//ywj_id 1:应届 2:往届
|
||
subjectObj["ywj_id"] = studentInfo.ywj_id;
|
||
var subjectTpl = subjectScript.innerHTML;
|
||
var subjectView = document.getElementById('subjectView');
|
||
laytpl(subjectTpl).render(subjectObj, function (html) {
|
||
subjectView.innerHTML = html;
|
||
});
|
||
|
||
form.render();
|
||
|
||
|
||
form.on('submit(formStep)', function (data) {
|
||
layer.confirm('是否确认考生信息正确?', {
|
||
shade: 0.1,
|
||
icon: 3,
|
||
title: '提示'
|
||
}, function (index) {
|
||
layer.close(index);
|
||
step.next('#stepForm');
|
||
return false;
|
||
});
|
||
|
||
});
|
||
form.on('submit(formStep2)', function (data) {
|
||
if ($('input[name="jmwz"]:checked').length > 0) {
|
||
var selectedTitle = $('input[name="jmwz"]:checked').attr('title');
|
||
var selectedValue = $('input[name="jmwz"]:checked').val();
|
||
jmwz = selectedTitle;
|
||
jmwzid = selectedValue;
|
||
jmwzObj["id"] = jmwzid;
|
||
jmwzObj["name"] = jmwz;
|
||
step.next('#stepForm');
|
||
return false;
|
||
} else {
|
||
layer.msg("请选择科目卷面文字 !", {
|
||
icon: 2,
|
||
time: 1500
|
||
});
|
||
}
|
||
});
|
||
form.on('submit(formStep3)', function (data) {
|
||
var checkedInputs = $('#subjectView input[type="checkbox"]:checked, #subjectView input[type="radio"]:checked');
|
||
|
||
if (checkedInputs.length > 0) {
|
||
for (var key in data.field) {
|
||
var ssObj = {};
|
||
var name = findName(JSON.parse(studentInfo.km_json), data.field[key]);
|
||
ssObj["id"] = data.field[key];
|
||
ssObj["name"] = name;
|
||
selectSubjectObj.push(ssObj);
|
||
selectSubjectTxt.push(name);
|
||
}
|
||
// 渲染报名信息
|
||
$("#xmV").html(studentInfo.student_name);
|
||
$("#xbV").html(studentInfo.xb);
|
||
$("#ssxxV").html(studentInfo.school_name);
|
||
$("#sfzhV").html(studentInfo.sfzh);
|
||
$("#kjhV").html(studentInfo.kjh);
|
||
$("#gjxjhV").html(studentInfo.xjh);
|
||
$("#kmjmwzV").html(jmwz);
|
||
$("#kskmV").html(selectSubjectTxt.join("、"));
|
||
step.next('#stepForm');
|
||
return false;
|
||
|
||
} else {
|
||
layer.msg("必须要选择一个科目 !", {
|
||
icon: 2,
|
||
time: 1500
|
||
});
|
||
}
|
||
});
|
||
|
||
form.on('submit(formStep4)', function (data) {
|
||
layer.confirm('是否确认报名信息正确?', {
|
||
shade: 0.1,
|
||
icon: 3,
|
||
title: '提示'
|
||
}, function (index) {
|
||
layer.close(index);
|
||
let loading = layer.load();
|
||
var postData = {};
|
||
postData["jmwz"] = jmwzObj;
|
||
postData["km"] = selectSubjectObj;
|
||
|
||
$.ajax({
|
||
url: '/dsBase/hk/setStudentInfo',
|
||
async: false,
|
||
data: { res_json: JSON.stringify(postData) },
|
||
type: 'post',
|
||
success: function (result) {
|
||
if (result.success) {
|
||
$.ajax({
|
||
url: "/dsBase/hk/getStudentInfo",
|
||
async: false,
|
||
type: 'GET',
|
||
success: function (res) {
|
||
localStorage.setItem('studentInfo', JSON.stringify(res));
|
||
layer.close(loading);
|
||
layer.msg("报名成功!", {
|
||
icon: 1,
|
||
time: 1300
|
||
}, function () {
|
||
window.location.href = "./info.html";
|
||
});
|
||
}, error: function (xhr, status, error) {
|
||
layer.msg("获取学生信息异常!", {
|
||
icon: 2,
|
||
time: 1000
|
||
});
|
||
}
|
||
});
|
||
|
||
} else {
|
||
layer.msg(result.message, {
|
||
icon: 2,
|
||
time: 2000
|
||
});
|
||
}
|
||
}
|
||
});
|
||
|
||
return false;
|
||
});
|
||
});
|
||
|
||
|
||
$('.pre').click(function () {
|
||
step.pre('#stepForm');
|
||
return false;
|
||
});
|
||
|
||
$('.next').click(function () {
|
||
step.next('#stepForm');
|
||
return false;
|
||
});
|
||
|
||
form.on('checkbox(childChk)', function (data) {
|
||
var elemId = data.elem.id.replace("chk_", "");
|
||
if (data.elem.checked) {
|
||
$("input[name='" + elemId + "']:first").prop("checked", "checked");
|
||
} else {
|
||
$("input[name='" + elemId + "']:checked").prop("checked", false);
|
||
}
|
||
form.render();
|
||
});
|
||
|
||
form.on('radio(childRdo)', function (data) {
|
||
var elemId = data.elem.id.replace("rdo_", "");
|
||
$("#chk_" + elemId).prop('checked', true)
|
||
form.render();
|
||
});
|
||
|
||
function findName(arr, code) {
|
||
for (let i = 0; i < arr.length; i++) {
|
||
if (arr[i].id == code) {
|
||
return arr[i].name;
|
||
}
|
||
else if (arr[i].children) {
|
||
let found = findName(arr[i].children, code);
|
||
if (found) return found;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
});
|
||
</script>
|
||
<script>
|
||
</script>
|
||
</body>
|
||
|
||
</html> |