czl-web/pages/companypro/FreeInQuiryForm.html

148 lines
5.8 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-form-label {
position: relative;
float: left;
display: block;
padding: 9px 15px;
width: 100%;
font-weight: 400;
line-height: 20px;
text-align: right;
}
</style>
<body>
<form class="layui-form" action="" onsubmit="return false">
<table id="demo" lay-filter="test" style="padding: 10px"></table>
</form>
</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 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 type="text/javascript">
layui.config({
base: '../../js/layuiModules/', // 第三方模块所在目录
version: 'v1.6.4' // 插件版本号
}).extend({
soulTable: 'notice,layNotify', // 模块
});
var form;
var table;
var newData;
var notice;
var layNotify;
var id = localStorage.getItem("id");
var voltageLevelId = localStorage.getItem("voltageLevelId");
var teamTypeId = localStorage.getItem("teamTypeId");
var teamName = localStorage.getItem("teamName");
var finalData;
var type = "1";
layui.use(['table', 'form','notice', 'layNotify'], function () {
table = layui.table;
form = layui.form;
notice = layui.notice;
layNotify = layui.layNotify;
showTable();
// 验证成功后才会执行下面的操作
form.on('submit(formDemo)', function (data) {
});
});
function showTable(){
$.ajax({
type: 'post',
url: ctxPath + '/owmTeamQuery/getowmTeamQueryTeamsFormList',//数据接口
dataType: 'json', // 服务器返回数据类型
async: false,
data: {
voltageLevelId: voltageLevelId,
teamTypeId: teamTypeId,
id: id,
},
success: function (data) {
table.render({
elem: '#demo'
, toolbar: 'default'
, cellMinWidth: 80
, cols: [[ //表头
{field: 'postName', title: '岗位', align: 'center'},
{field: 'name', title: '姓名', align: 'center'},
{field: 'sex', title: '性别', align: 'center'},
{field: 'nation', title: '民族', align: 'center'},
{field: 'idNumber', title: '身份证', align: 'center'},
{field: 'implementation', title: '执证情况', align: 'center'},
{field: 'vocationalSkillLevel', title: '职业/技能等级', align: 'center'},
]],
data: data,
done: function (res, curr, count) {
merge(res);
},
toolbar: '#toolbar' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
});
},
error: function (err) {
console.log("获取工程下拉列表出错:", err);
}
});
}
/**
* 合并行方法
**/
function merge(res) {
var data = res.data;
var mergeIndex = 0;//定位需要添加合并属性的行数
var mark = 1; //这里涉及到简单的运算mark是计算每次需要合并的格子数
var columsName = ['postName'];//需要合并的列名称 ['business_tenant_name','land','contract_begin','contract_end','history_arrears','period'];
var columsIndex = [0];//需要合并的列索引值 [2,3,5,6,14,15];
for (var k = 0; k < columsName.length; k++) { //这里循环所有要合并的列
var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行
if (!isEmpty(res.data)) {
for (var i = 1; i < res.data.length; i++) { //这里循环表格当前的数据
var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列
var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列
if (data[i][columsName[0]] === data[i - 1][columsName[0]]) {
layui.hint().error(i);
if (data[i][columsName[k]] === data[i - 1][columsName[k]]) { //后一行的值与前一行的值做比较,相同就需要合并
mark += 1;
tdPreArr.each(function () {//相同列的第一列增加rowspan属性
$(this).attr("rowspan", mark);
});
tdCurArr.each(function () {//当前行隐藏
$(this).css("display", "none");
});
}
} else {
mergeIndex = i;
mark = 1;//一旦前后两行的值不一样了那么需要合并的格子数mark就需要重新计算
}
}
}
mergeIndex = 0;
mark = 1;
}
}
function reloadTip(tip,message,type){
parent.layNotify.notice({
title: tip+"提示",
type: type,
message: message
});
}
</script>