czl-web/pages/real/personRosterList.html

183 lines
7.3 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>人员花名册列表</title>
<link rel="stylesheet" href="../../layui-v2.8.18/layui/css/layui.css" media="all"/>
</head>
<style>
.layui-table th{
font-weight: bold;
text-align: center
}
.layui-table td{
text-align: center
}
.layui-btn-sm {
height: 35px;
line-height: 35px;
padding: 0px 10px;
font-size: 16px;
}
</style>
<body style="margin-left: 15px">
<form class="layui-form" action="" onsubmit="return false">
<div class="layui-form-item" style="margin-bottom: 0px;">
<div class="layui-inline" style="margin-top: 10px;">
<div class="layui-input-inline">
<input type="text" id="keyWord" placeholder="请输入关键字" autocomplete="off" class="layui-input">
</div>
<div class="layui-input-inline" style="width: 150px;margin-left: 18px;">
<select id="orgId" class="layui-select" lay-search=""></select>
</div>
<div class="layui-input-inline" style="width: 150px;margin-left: 18px;">
<input type="text" id="proName" placeholder="请输入工程名称" autocomplete="off" class="layui-input">
</div>
<div class="layui-input-inline" style="width: 150px;margin-left: 18px;">
<input type="text" id="sunUnit" placeholder="请输入分包单位" autocomplete="off" class="layui-input">
</div>
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
<button id="searchBt" class="layui-btn layui-btn-sm">查询</button>
</div>
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
<button id="resetBt" class="layui-btn layui-btn-sm">重置</button>
</div>
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
<button id="exportBt" class="layui-btn layui-btn-sm">导出</button>
</div>
</div>
</div>
</form>
<table id="demo" lay-filter="test"></table>
</body>
</html>
<script src="../../js/jquery/jquery-3.6.0.js"></script>
<script src="../../layui-v2.8.18/layui/layui.js"></script>
<script type="text/javascript" src="../../js/jq.js"></script>
<script src="../../js/common_methon.js"></script>
<script src="../../js/aes.js"></script>
<script type="text/javascript" src="../../js/publicJs.js"></script>
<script type="text/javascript" src="../../js/select.js"></script>
<script type="text/javascript" src="../../js/my/permission.js"></script>
<script>
let form;
var tree;
var table;
var notice;
var layNotify;
const token = localStorage.getItem("token");
$("#resetBt").click(function(){
table.reload('menuTable', {
url: ctxPath + '/realData/getPersonRosterList'
, method: 'post' //方式默认是get
, page: true
, where: {
keyWord: "",
orgId: "",
proName: "",
sunUnit: "",
} //设定异步数据接口的额外参数
});
$("#keyWord").val("");
$("#orgId").val("");
$("#sunUnit").val("");
$("#proName").val("");
getOrgName(form,null);
})
$("#searchBt").click(function(){
table.reload('menuTable', {
url: ctxPath + '/realData/getPersonRosterList'
, method: 'post' //方式默认是get
, page: true
, where: {
keyWord: $("#keyWord").val(),
orgId: $("#orgId").val(),
sunUnit: $("#sunUnit").val(),
proName: $("#proName").val(),
} //设定异步数据接口的额外参数
});
})
$("#exportBt").click(function(){
keyWord = $("#keyWord").val();
orgId = $("#orgId").val();
sunUnit = $("#sunUnit").val();
proName = $("#proName").val();
window.location.href = ctxPath + "/realData/exportPhysicalCheckResult?"
+"keyWord=" + keyWord
+ "&sunUnit=" + sunUnit
+ "&orgId=" + orgId
+ "&proName=" + proName
+ "&type=" + '1'
+ "&token=" + token; //下载文件
})
layui.use(['table', 'form'], function () {
table = layui.table;
form = layui.form;
//渲染表格
table.render({
elem: '#demo'
, url: ctxPath + '/realData/getPersonRosterList' //数据接口
, method: 'post' //方式默认是get
, toolbar: 'default' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
, where: {} //post请求必须加where post请求需要的参数
, cellMinWidth: 80
, cols: [[ //表头
{
field: 'number', width:80,title: '序号', align: 'center', type: 'numbers'
}
, {field: 'realOrgName', align: 'center', title: '分公司'}
, {field: 'realProName', align: 'center', title: '所在工程'}
, {field: 'personName', align: 'center', title: '姓名'}
, {field: 'sex', align: 'center', title: '性别'}
, {field: 'nation', align: 'center', title: '民族'}
, {field: 'age', align: 'center', title: '年龄'}
, {field: 'phone', align: 'center', title: '联系方式'}
, {field: 'idCard', align: 'center', title: '身份证',templet:d=>{
if(d.idCard){
if(d.idCard.length>18){
return decrypt(d.idCard)
}
}
return d.idCard;
}}
, {field: 'sunUnit', align: 'center', title: '分包单位'}
, {field: 'teamName', align: 'center', title: '所在班组'}
, {field: 'workType', align: 'center', title: '工种'}
, {field: 'inTime', align: 'center', title: '进场日期'}
, {field: 'outTime', align: 'center', title: '出场日期'}
]]
, id: 'menuTable'
, page: true //开启分页
, loading: true //数据加载中。。。
, limits: [5, 10, 20] //一页选择显示3,5或10条数据
, limit: 10 //一页显示5条数据
, response: {
statusCode: 200 //规定成功的状态码默认0
}, parseData: function (res) { //将原始数据解析成 table 组件所规定的数据res为从url中get到的数据
let result;
if (res.data !== '' && res.data != null && res.data !== "null") {
if (this.page.curr) {
result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
} else {
result = res.data.slice(0, this.limit);
}
}
return {
"code": res.code, //解析接口状态
"msg": res.msg, //解析提示文本
"count": res.count, //解析数据长度
"data": result, //解析数据列表
};
},
toolbar: "#toolbar"
});
getOrgName(form,null);
});
</script>