diff --git a/app/view/index/index.html b/app/view/index/index.html
index f147f4c..525fadb 100644
--- a/app/view/index/index.html
+++ b/app/view/index/index.html
@@ -244,50 +244,7 @@
}
}
});
- var tableIns = layui.table.render({
- id: 'carInfo',
- elem: '#car-info',
- title:'车辆信息',
- url: '{:url("/index/carInfo/")}', //数据接口
- where: getUrlParam('Object'),
- toolbar: true,
- height: 'full-210',
- page: true, //开启分页
- limit: 20,
- loading: true,
- cols: [[ //表头
- {type: 'numbers', fixed: 'left'},
- {field: 'car_no', title: '车牌号', width: 100, edit: 'text', fixed: 'left'},
- {field: 'car_frame_no', title: '车架号', width: 180, edit: 'text'},
- {field: 'engine_no', title: '发动机号', width: 100, edit: 'text'},
- {field: 'factory_model', title: '厂牌型号', width: 200, edit: 'text'},
- {field: 'register_date', title: '注册日期', width: 100, edit: 'text'},
- {field: 'car_man', title: '车主', width: 80, edit: 'text'},
- {field: 'car_number', title: '车主证件号', width: 160, edit: 'text'},
- {field: 'car_phone', title: '车主电话', width: 120, edit: 'text'},
- {field: 'id_man', title: '被保险人', width: 80, edit: 'text'},
- {field: 'id_number', title: '被保险人证件号', width: 160, edit: 'text'},
- {field: 'id_phone', title: '被保险人电话', width: 120, edit: 'text'},
- {field: 'insured_man', title: '投保人', width: 80, edit: 'text'},
- {field: 'insured_number', title: '投保人证件号', width: 160, edit: 'text'},
- {field: 'insured_phone', title: '投保人电话', width: 120, edit: 'text'},
- {field: 'link_man_1', title: '联系人1', width: 80, edit: 'text'},
- {field: 'link_phone_1', title: '联系人电话1', width: 120, edit: 'text'},
- {field: 'link_man_2', title: '联系人2', width: 80, edit: 'text'},
- {field: 'link_phone_2', title: '联系人电话2', width: 120, edit: 'text'},
- {field: 'link_man_3', title: '联系人3', width: 80, edit: 'text'},
- {field: 'link_phone_3', title: '联系人电话3', width: 120, edit: 'text'},
- {field: 'purchase_price', title: '新车购置价', width: 100, edit: 'text'},
- {field: 'export_bhx_name', title: '导出清洗', width: 140, edit: 'text', templet:'#BhxNameTpl'},
- {field: 'export_bmc_name', title: '导出上传', width: 140, edit: 'text', templet:'#BmcNameTpl'},
- {fixed: 'right', width: 100, align:'center', toolbar: '#table-bar'}
- ]],
- done: function (res, curr, count) {
- if(res.code == -1){
- $('#lock-screen').css('display','flex');
- }
- }
- });
+ var tableIns = layui.table.render(tableRender(''));
//监听行工具事件
layui.table.on('tool(car-info)', function(obj){ //注:tool 是工具条事件名,test 是 table 原始容器的属性 lay-filter="对应的值"
@@ -416,5 +373,96 @@
});
});
}
+
+ //表格 头部数据函数封装
+ function getTableCols(){
+ return [[ //表头
+ {type: 'numbers', fixed: 'left'},
+ {field: 'car_no', title: '车牌号', width: 100, edit: 'text', fixed: 'left'},
+ {field: 'car_frame_no', title: '车架号', width: 180, edit: 'text'},
+ {field: 'engine_no', title: '发动机号', width: 100, edit: 'text'},
+ {field: 'factory_model', title: '厂牌型号', width: 200, edit: 'text'},
+ {field: 'register_date', title: '注册日期', width: 100, edit: 'text'},
+ {field: 'car_man', title: '车主', width: 80, edit: 'text'},
+ {field: 'car_number', title: '车主证件号', width: 160, edit: 'text'},
+ {field: 'car_phone', title: '车主电话', width: 120, edit: 'text'},
+ {field: 'id_man', title: '被保险人', width: 80, edit: 'text'},
+ {field: 'id_number', title: '被保险人证件号', width: 160, edit: 'text'},
+ {field: 'id_phone', title: '被保险人电话', width: 120, edit: 'text'},
+ {field: 'insured_man', title: '投保人', width: 80, edit: 'text'},
+ {field: 'insured_number', title: '投保人证件号', width: 160, edit: 'text'},
+ {field: 'insured_phone', title: '投保人电话', width: 120, edit: 'text'},
+ {field: 'link_man_1', title: '联系人1', width: 80, edit: 'text'},
+ {field: 'link_phone_1', title: '联系人电话1', width: 120, edit: 'text'},
+ {field: 'link_man_2', title: '联系人2', width: 80, edit: 'text'},
+ {field: 'link_phone_2', title: '联系人电话2', width: 120, edit: 'text'},
+ {field: 'link_man_3', title: '联系人3', width: 80, edit: 'text'},
+ {field: 'link_phone_3', title: '联系人电话3', width: 120, edit: 'text'},
+ {field: 'purchase_price', title: '新车购置价', width: 100, edit: 'text'},
+ {field: 'export_bhx_name', title: '导出清洗', width: 140, edit: 'text', templet:'#BhxNameTpl'},
+ {field: 'export_bmc_name', title: '导出上传', width: 140, edit: 'text', templet:'#BmcNameTpl'},
+ {fixed: 'right', width: 100, align:'center', toolbar: '#table-bar'}
+ ]];
+ }
+
+ //layui表格渲染,其中url param为请求的数据接口以及其参数
+ function tableRender(param){
+ var tableCols = tableSetCol(getTableCols(), local_storage_key);
+ var renderParam = {
+ id: 'carInfo',
+ elem: '#car-info',
+ title:'车辆信息',
+ url: '{:url("/index/carInfo/")}', //数据接口
+ where: getUrlParam('Object'),
+ toolbar: true,
+ height: 'full-210',
+ page: true, //开启分页
+ limit: 20,
+ loading: true,
+ cols: [tableCols],
+ done: function (res, curr, count) {
+ if(res.code == -1){
+ $('#lock-screen').css('display','flex');
+ }
+ }
+ };
+ return renderParam;
+ }
+
+ //layui表格渲染后,事件需要重新绑定,并记录下筛选信息于localStorage
+ function tableDone(elem, col, key){
+ elem.next().find('[lay-event="LAYTABLE_COLS"]').click(function(e) {
+ setTimeout(function() {
+ layui.$(e.currentTarget).find('.layui-form-checkbox').click(function() {
+ var local_config = {};
+ for(var i = 0; i<=col.length-1; i++){
+ if(typeof col[i].field !== 'undefined'){
+ local_config[col[i].field] = col[i].hide ;
+ }
+ }
+ var saveColsConfig = {
+ key: 'local_config',
+ value: local_config
+ };
+ layui.data(key, saveColsConfig);
+ })
+ }, 50);
+ })
+ }
+
+ //layuitable reload或第一次加载的时候,根据存储的local_config 确定哪些列是否选中
+ function tableSetCol(col, key){
+ //参考写法:https://fly.layui.com/jie/50966/#item-1555416248250
+ var config_custom= layui.data(key);
+ var local_config = config_custom['local_config'] || {};
+ if(JSON.stringify(local_config) != '{}'){
+ for(var i =0; i<=col.length-1; i++){
+ if( typeof col[i].field !== "undefined" ){
+ col[i].hide = local_config[col[i].field];
+ }
+ }
+ }
+ return col;
+ }
{/block}