需要引入拓展插件excel 市场拓展插件找得到
layui.config({
base: '${pageContext.request.contextPath}/admin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index', 'form', 'laydate', 'table', 'element', 'formSelects', 'excel', 'upload'], function () {
var $ = layui.$,
form = layui.form,
laydate = layui.laydate,
table = layui.table,
element = layui.element,
formSelects = layui.formSelects,
excel = layui.excel,
upload = layui.upload;
})
//第一张表格对象
tableObj = table.render({
elem: '#data_table',
title: '资源投入明细表',
cols: [
[{field: 'branchlr',title: '编码',align: 'center',sort: true,rowspan: 3,width: 100,},
{field: 'name',title: '机构',align: 'center',rowspan: 3,width: 150,},
{title: '业务发展',align: 'center',colspan: 2,width: 100},
{align: 'center',title: '队伍建设',colspan: 2},
{align: 'center',title: '基础管理',colspan: 2},
{align: 'center',title: '运营费用',colspan: 2,totalRow:true},
{align: 'center',title: '资产费用',colspan: 2,totalRow:true},
{align: 'center',title: '行政办公费用',colspan: 2,totalRow:true},
{align: 'center',title: '其他',colspan: 2},
{align: 'center',title: '合计',colspan: 2}],
[{field: 'VAL01',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL01',title: '占比',align: 'center',sort: true,width: 100},
{field: 'VAL02',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL02',title: '占比',align: 'center',sort: true,width: 100},
{field: 'VAL03',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL03',title: '占比',align: 'center',sort: true,width: 100},
{field: 'VAL04',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL04',title: '占比',align: 'center',sort: true,width: 100},
{field: 'VAL05',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL05',title: '占比',align: 'center',sort: true,width: 100},
{field: 'VAL06',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL06',title: '占比',align: 'center',sort: true,width: 100},
{field: 'VAL07',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProVAL07',title: '占比',align: 'center',sort: true,width: 100},
{field: 'TotalVAL',title: '金额',align: 'center',sort: true,width: 100,totalRow:true},
{field: 'ProTotalVAL',title: '占比',align: 'center',sort: true,width: 100}]
],
toolbar: '#toolbar', //toolbar: '#toolbar' //指向自定义工具栏模板选择器
cellMinWidth: 100,
defaultToolbar: ['exports'], //自由配置头部工具栏右侧的图标
totalRow: false, //是否开启合计行区域
page: true, //开启分页(默认:false)
limit: 50, //每页显示的条数(默认:10)。值务必对应 limits 参数的选项。
limits: [50, 100, 200, 1000], //每页条数的选择项
skin: 'row',
data: [],
even: true //true/false 若不开启隔行背景,不设置该参数即可
});
// 第一张表格对象头工具栏事件
table.on('toolbar(data_table)', function (obj) {
switch (obj.event) {
case 'searchData_evn': // 查询数据
searchData_fun("0");
break;
case 'exportsData_evn': // 导出数据
exportsData_fun("0");
break;
};
});
// 导出表格函数 第一张表
function exportsData_fun() {
var tableDate=table.cache['data_table']
if (tableDate==null || tableDate.length==0){
layer.msg("当前无数据,不允许导出");
return;
}
// 报表名称
var fileName = '测试表'
// 模板
var public_template={
'branchlr': '',
'name': '',
'v01': '','v02': '','v03': '','v04': '','v05': '','v06': '', 'v07': '','v08': '','v09': '','v10': '',
'v11': '','v12': '','v13': '','v14': '','v15': '','v16': ''
}
//Excel内容 多级表头第一表头
var firstLine=deepCopy(public_template)
firstLine["branchlr"]="编码"
firstLine["name"]="机构"
firstLine["v01"]="业务发展"
firstLine["v02"]="占比"
firstLine["v03"]="队伍建设"
firstLine["v04"]="占比"
firstLine["v05"]="基础管理"
firstLine["v06"]="占比"
firstLine["v07"]="运营费用"
firstLine["v08"]="占比"
firstLine["v09"]="资产费用"
firstLine["v10"]="占比"
firstLine["v11"]="行政办公费用"
firstLine["v12"]="占比"
firstLine["v13"]="其他"
firstLine["v14"]="占比"
firstLine["v15"]="合计"
firstLine["v16"]="占比"
//Excel内容 多级表头第二表头
var secondLine=deepCopy(public_template)
secondLine["branchlr"]="编码"
secondLine["name"]="机构"
secondLine["v01"]="金额"
secondLine["v02"]="占比"
secondLine["v03"]="金额"
secondLine["v04"]="占比"
secondLine["v05"]="金额"
secondLine["v06"]="占比"
secondLine["v07"]="金额"
secondLine["v08"]="占比"
secondLine["v09"]="金额"
secondLine["v10"]="占比"
secondLine["v11"]="金额"
secondLine["v12"]="占比"
secondLine["v13"]="金额"
secondLine["v14"]="占比"
secondLine["v15"]="金额"
secondLine["v16"]="占比"
var exportData = [] // 导出的数据
for (var i = 0; i < tableDate.length; i++) {
var list = {
'branchlr': tableDate[i].branchlr,
'name': tableDate[i].name,
'v01': tableDate[i].VAL01,
'v02': tableDate[i].ProVAL01,
'v03': tableDate[i].VAL02,
'v04': tableDate[i].ProVAL02,
'v05': tableDate[i].VAL03,
'v06': tableDate[i].ProVAL03,
'v07': tableDate[i].VAL04,
'v08': tableDate[i].ProVAL04,
'v09': tableDate[i].VAL05,
'v10': tableDate[i].ProVAL05,
'v11': tableDate[i].VAL06,
'v12': tableDate[i].ProVAL06,
'v13': tableDate[i].VAL07,
'v14': tableDate[i].ProVAL07,
'v15': tableDate[i].TotalVAL,
'v16': tableDate[i].ProTotalVAL,
};
exportData.push(list);
}
exportData.unshift(firstLine,secondLine);
// 加边框范围
var round="A1:R" + exportData.length
// 边框加粗
excel.setExportCellStyle(exportData,round,{
s:{
fill: { patternType:"solid", bgColor: { indexed: 64 }, fgColor: { rgb: "FFFFFF" } },
border:{
top:{ style: "thin" },
bottom:{ style: "thin"},
left:{ style: "thin"},
right:{ style: "thin"}
}
}
})
// Excel内容 表头样式
excel.setExportCellStyle(exportData,'A1:R2',{
s:{
alignment: {
horizontal: 'center',
vertical: 'center'
}
}
})
// 合并多级表头
var mergeConf = excel.makeMergeConfig([
['A1', 'A2'],
['B1', 'B2'],
['C1', 'D1'],
['E1', 'F1'],
['G1', 'H1'],
['I1', 'J1'],
['K1', 'L1'],
['M1', 'N1'],
['O1', 'P1'],
['Q1', 'R1']
]);
// 列单元格撑大
var colConf = excel.makeColConfig({
'B':100
}, 80);
excel.exportExcel({
sheet1: exportData
}, fileName + '.xlsx', 'xlsx', {
extend: {
sheet1: {
'!merges': mergeConf,
'!cols': colConf
}
}
});
}
效果如下