FEBS-Shiro的前端layui集成tableSelect
最终效果
FEBS-Shiro的前端使用的是layui,需要集成tableSelect这个扩展,layui数据表默认后台返回的数据的正常的状态是0.
FEBS-Shiro默认返回的状态是http状态码200
所以用的时候需要翻译一下。
代码
layui.extend({
tableSelect: ctx + 'lay/extends/tableSelect'
}).use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'slider', 'tableSelect','laydate'], function () {
var $ = layui.$
, febs = layui.febs
, layer = layui.layer
, formSelects = layui.formSelects
, form = layui.form
, slider = layui.slider
, validate = layui.validate
, tableSelect = layui.tableSelect
,laydate = layui.laydate;
var userTable2 = {
url: '/user/list',
cols: [
[
{type: 'checkbox'},
{field: 'username', title: '用户名', minWidth: 100},
{title: '性别', templet: '#user-sex'},
{field: 'deptName', title: '部门'},
{title: '状态', templet: '#user-status'}
]
],
parseData: function (res) {
return {
"code": res.code === 200 ? 0 : res.code,
"count": res.data.total,
"data": res.data.rows
}
}
};
tableSelect.render({
elem: '#headerId', //定义输入框input对象
checkedKey: 'project_id',//表格的唯一建值,非常重要,影响到选中状态 必填
searchKey: 'username', //搜索输入框的name值 默认keyword
searchPlaceholder: '关键词搜索', //搜索输入框的提示文字 默认关键词搜索
table: userTable2,
done: function (elem, data) {
//选择完后的回调,包含2个返回值 elem:返回之前input对象;data:表格返回的选中的数据 []
//拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
}
});