94 lines
3.7 KiB
HTML
94 lines
3.7 KiB
HTML
{layout name="layout" /}
|
||
|
||
<div style="padding: 16px;">
|
||
<table class="layui-hide" id="test" lay-filter="test"></table>
|
||
</div>
|
||
|
||
<script type="text/html" id="toolbarDemo">
|
||
<form class="layui-form layui-row layui-col-space16" action="/customer">
|
||
<div class="layui-col-md3">
|
||
<div class="layui-input-wrap">
|
||
<div id="status"></div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-col-md3">
|
||
<div class="layui-input-wrap">
|
||
<input type="text" name="name" placeholder="客户名称" lay-affix="clear" class="layui-input">
|
||
</div>
|
||
</div>
|
||
<div class="layui-btn-container layui-col-md3 layui-col-xs12">
|
||
<button class="layui-btn" lay-submit lay-filter="demo-table-search">搜索</button>
|
||
<button type="reset" class="layui-btn layui-btn-primary">Clear</button>
|
||
</div>
|
||
</form>
|
||
</script>
|
||
<script src="/js/xm-select.js"></script>
|
||
<script>
|
||
layui.use(['table', 'dropdown'], function(){
|
||
var table = layui.table;
|
||
var dropdown = layui.dropdown;
|
||
var statusList = "{$statusList}";
|
||
var name = "{$name}";
|
||
|
||
// 创建渲染实例
|
||
table.render({
|
||
elem: '#test',
|
||
url: '/customer/apiGetList?statusList=' + statusList + '&name=' + name, // 此处为静态模拟数据，实际使用时需换成真实接口
|
||
toolbar: '#toolbarDemo',
|
||
defaultToolbar: ['filter'],
|
||
height: 'full-135', // 最大高度减去其他容器已占有的高度差
|
||
css: [ // 重设当前表格样式
|
||
'.layui-table-tool-temp{padding-right: 145px;}',
|
||
'.layui-table-cell{height: auto; line-height: normal;white-space: normal;word-break: break-all;overflow: visible;}'
|
||
].join(''),
|
||
cellMinWidth: 80,
|
||
//totalRow: true, // 开启合计行
|
||
//page: true,
|
||
page: { // 支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
|
||
layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'], //自定义分页布局
|
||
//curr: 5, //设定初始在第 5 页
|
||
limit: 50,
|
||
//groups: 1, //只显示 1 个连续页码
|
||
//first: false, //不显示首页
|
||
//last: false //不显示尾页
|
||
},
|
||
// 将原始数据解析成 table 组件所规定的数据格式
|
||
parseData: function(res){
|
||
return {
|
||
"code": res.code, //解析接口状态
|
||
"msg": res.msg, //解析提示文本
|
||
"count": res.list.total, //解析数据长度
|
||
"data": res.list.data //解析数据列表
|
||
};
|
||
},
|
||
cols: [[
|
||
{field: 'id', fixed: 'left', width:60, title: 'ID'},
|
||
{field: 'name', width:200, title: '客户名称'},
|
||
{field: 'assignedToName', width:80, title: '指派给'},
|
||
{field: 'stageStr', width:100, title: '阶段'},
|
||
{field: 'statusStr', width:120, title: '状态'},
|
||
{field: 'communicationStr', title: '沟通记录', templet: function(d) {
|
||
return d.communicationStr.replace(/<br \/>/g, '<br>');
|
||
}},
|
||
{field: 'contactedDateStr', title:'最后联系', width: 110},
|
||
{field: 'nextDate', title:'下次联系', width: 110},
|
||
{field: 'createdDateStr', title:'添加时间', width: 110}
|
||
]],
|
||
done: function(){
|
||
var id = this.id;
|
||
// 下拉按钮测试
|
||
},
|
||
error: function(res, msg){
|
||
console.log(res, msg)
|
||
}
|
||
});
|
||
|
||
var customerStatus = xmSelect.render({
|
||
// 这里绑定css选择器
|
||
el: '#status',
|
||
name: 'statusList',
|
||
// 渲染的数据
|
||
data: {php}echo $statusListSelected;{/php},
|
||
})
|
||
});
|
||
</script> |