zhaocheng
/
excel_handle
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

数据页面样式调试6

Browse Source
master
zcstatham 2 years ago
parent f518ca98e1
commit e52af174ad
1 changed files with 92 additions and 44 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 136
      app/view/index/index.html

136
app/view/index/index.html
Unescape View File

@ -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;
}
</script>
{/block}

Write Preview
Loading…
Cancel
Save