修改注释并增加自动计算表格列

This commit is contained in:
邹景立 2022-04-28 20:34:05 +08:00
parent 7d53d94124
commit 970edecac0

View File

@ -70,20 +70,30 @@
<script> <script>
require(['excel'], function (excel) { require(['excel'], function (excel) {
excel.bind(function (data) { excel.bind(function (data) {
// 设置表格内容 // 设置表格内容
data.forEach(function (item, index) { data.forEach(function (item, index) {
data[index] = [item.username, item.node, item.geoip, item.geoisp, item.action, item.content, item.create_at]; data[index] = [item.username, item.node, item.geoip, item.geoisp, item.action, item.content, item.create_at];
}); });
// 设置表头内容 // 设置表头内容
data.unshift(['操作账号', '访问节点', '访问IP地址', '访问地理区域', '访问操作', '操作内容', '操作时间']); data.unshift(['操作账号', '访问节点', '访问IP地址', '访问地理区域', '访问操作', '操作内容', '操作时间']);
// 自动计算列序号
var lastCol = layui.excel.numToTitle((function (count, idx) {
for (idx in data[0]) count++;
return count;
})(0));
// 设置表头样式 // 设置表头样式
layui.excel.setExportCellStyle(data, 'A1:G1', { layui.excel.setExportCellStyle(data, 'A1:' + lastCol + '1', {
s: { s: {
font: {sz: 14, bold: true, color: {rgb: "FFFFFF"}, shadow: true}, font: {sz: 14, bold: true, color: {rgb: "FFFFFF"}, shadow: true},
fill: {bgColor: {indexed: 64}, fgColor: {rgb: "5FB878"}}, fill: {bgColor: {indexed: 64}, fgColor: {rgb: "5FB878"}},
alignment: {vertical: 'center', horizontal: 'center'} alignment: {vertical: 'center', horizontal: 'center'}
} }
}); });
// 设置内容样式 // 设置内容样式
var style1 = { var style1 = {
fill: {bgColor: {indexed: 64}, fgColor: {rgb: "EAEAEA"}}, fill: {bgColor: {indexed: 64}, fgColor: {rgb: "EAEAEA"}},
@ -92,7 +102,7 @@
fill: {bgColor: {indexed: 64}, fgColor: {rgb: "FFFFFF"}}, fill: {bgColor: {indexed: 64}, fgColor: {rgb: "FFFFFF"}},
alignment: {vertical: 'center', horizontal: 'center'} alignment: {vertical: 'center', horizontal: 'center'}
}; };
layui.excel.setExportCellStyle(data, 'A2:G' + data.length, { layui.excel.setExportCellStyle(data, 'A2:' + lastCol + data.length, {
s: style1 s: style1
}, function (oldCell, newCell, row, config, currentRow, currentCol, fieldKey) { }, function (oldCell, newCell, row, config, currentRow, currentCol, fieldKey) {
// oldCell:原有数据, // oldCell:原有数据,
@ -108,14 +118,18 @@
oldCell.s = style2; oldCell.s = style2;
return (currentRow % 2 === 0) ? newCell : oldCell; return (currentRow % 2 === 0) ? newCell : oldCell;
}); });
// 设置表格行宽高,需要设置最后的行或列宽高,否则部分不生效 // 设置表格行宽高,需要设置最后的行或列宽高,否则部分不生效
var rowsC = {1: 40}, colsC = {'A': 160, 'G': 160}; var rowsC = {1: 40}, colsC = {'A': 160};
rowsC[data.length] = 33, this.options.extend = { rowsC[data.length] = 33, colsC[lastCol] = 160;
this.options.extend = {
'!rows': layui.excel.makeRowConfig(rowsC, 33), // 设置每行高度,默认 33 '!rows': layui.excel.makeRowConfig(rowsC, 33), // 设置每行高度,默认 33
'!cols': layui.excel.makeColConfig(colsC, 160) // 设置每行宽度,默认 160 '!cols': layui.excel.makeColConfig(colsC, 160) // 设置每行宽度,默认 160
}; };
// 其他更多样式,可以配置 this.options.extend 参数,每次执行 bind 会被重置 // 其他更多样式,可以配置 this.options.extend 参数,每次执行 bind 会被重置
// 在线文档http://excel.wj2015.com/_book/docs/%E5%87%BD%E6%95%B0%E5%88%97%E8%A1%A8/%E6%A0%B7%E5%BC%8F%E8%AE%BE%E7%BD%AE%E7%9B%B8%E5%85%B3%E5%87%BD%E6%95%B0.html // 在线文档http://excel.wj2015.com/_book/docs/%E5%87%BD%E6%95%B0%E5%88%97%E8%A1%A8/%E6%A0%B7%E5%BC%8F%E8%AE%BE%E7%BD%AE%E7%9B%B8%E5%85%B3%E5%87%BD%E6%95%B0.html
return data; return data;
}, '操作日志'); }, '操作日志');
}); });