hn_cloud_web/czl-web/pages/companypro/choosePerson.html

137 lines
5.4 KiB
HTML
Raw Permalink 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">
<head>
<meta charset="UTF-8">
<title>选择人员</title>
<link rel="stylesheet" href="../../layui-v2.8.18/layui/css/layui.css" media="all"/>
</head>
<body>
<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: 70px;margin-top: 2px">
<button id="searchBt" class="layui-btn layui-btn-sm">查询</button>
</div>
</div>
</div>
<table id="demo" lay-filter="test"></table>
<div class="layui-form-item" style="display: none">
<div class="layui-input-block">
<button type="submit" class="layui-btn subBtn" id="commit" lay-submit lay-filter="formDemo">提交</button>
</div>
</div>
</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="../../../public/public.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>
layui.config({
base: '../../js/layuiModules/', // 第三方模块所在目录
version: 'v1.6.4' // 插件版本号
}).extend({
soulTable: 'notice,layNotify', // 模块
});
var form;
var table;
var notice;
var layNotify;
var d;
$("#searchBt").click(function(){
table.reload('menuTable', {
url: czl_ht_url + '/proManage/getProPersonList'
, method: 'post' //方式默认是get
, page: true
, where: {
keyWord: $("#keyWord").val(),
} //设定异步数据接口的额外参数
});
})
layui.use(['table', 'form', 'notice', 'layNotify'], function () {
table = layui.table;
form = layui.form;
notice = layui.notice;
layNotify = layui.layNotify;
//渲染表格
table.render({
elem: '#demo'
, url: czl_ht_url + '/proManage/getProPersonList' //数据接口
, method: 'post' //方式默认是get
, toolbar: 'default' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
, where: {} //post请求必须加where post请求需要的参数
, cellMinWidth: 80
, cols: [[ //表头
{type: 'radio', title: '??', fixed: true}, // 单选框
{
field: 'number', width:80,title: '序号', align: 'center', type: 'numbers'
},
{field: 'name', title: '姓名', align: 'center'},
{field: 'sex', title: '性别', align: 'center'},
{field: 'idNumber', title: '身份证', align: 'center'},
{field: 'implementation', title: '执证情况',align: 'center'},
{field: 'vocationalSkillLevel', title: '职业/技能等级', align: 'center'},
]]
, 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, //解析数据列表
};
},
done: function (res, curr, count) {
// 表格渲染完成后的回调函数
// 监听单选框选择事件
table.on('radio(test)', function (obj) {
// 保存选择的行数据
d = obj.data;
console.log(d); // 打印选择的行数据,可以根据需要进行其他操作
});
},
toolbar: "#toolbar"
});
});
function getData(){
if (isEmpty(d)){
reloadTip("确认","请先选择一个人员,再点击确定按钮进行返回上级界面!","error");
return;
}
return d;
}
function reloadTip(tip, message, type) {
parent.layNotify.notice({
title: tip + "提示",
type: type,
message: message
});
}
</script>