效果图
步骤
1，前端设置url
2，后端根据传递参数，查询表的元字段数据，传入前端
3，前端接收数据，遍历循环放入列中
代码
前端代码：
var cols = [];
function dydatagrid() {
if(!interId){
dLong.layerInfo("请选择接口！");
return;
}
var postdata={
interId: interId
}
dLong.getJSON("/BaexportController/toList",postdata,function(data){
if (data.success) {
cols = [];// 初始化
$.each(data.fielddata,function(index,row){
cols.push({
field: row.code, title: row.name,sort:'true',align:'center',width: 140}); // 元数据标题栏设置
});
// var obj2 = deepClone(data.griddata);
hstable(data.griddata,true) //数据
}else {
hstable([])
}
},true);
}
// 导出接口数据导出存储表格
function hstable(data) {
var table = layui.table;
var ins1=table.render({
elem: '#hstable',
height: "full-70",
size: 'sm' ,
filter:{
bottom:false
},
totalRow: true ,
totalRowAll: true ,
page: true,
limit:200,
limits:[15,30,50,100,200,500,1000,2000,5000,10000],
cols: [[cols]], // 作为一个参数赋予进去
data: data? data : [],
// done: function (res, curr, count) {
// layui.soulTable.render(this)
// var layuitabletotal = $("div[lay-id='hstable']").children(".layui-table-total");
// var totalje=layuitabletotal.find("td[data-field='totalincome']").children("div").text();
// var allcost=layuitabletotal.find("td[data-field='totalcost']").children("div").text();
//
// var totalincomeone=layuitabletotal.find("td[data-field='totalincomeone']").children("div").text();
// var totalcostone=layuitabletotal.find("td[data-field='totalcostone']").children("div").text();
// var actualbalanceone=layuitabletotal.find("td[data-field='actualbalanceone']").children("div").text();
// var totalincomeoneavg=parseFloat(totalincomeone.replaceAll(",",""))/parseFloat(data.length);
// var totalcostoneavg=parseFloat(totalcostone.replaceAll(",",""))/parseFloat(data.length);
// var actualbalanceoneavg=parseFloat(actualbalanceone.replaceAll(",",""))/parseFloat(data.length);
//
// var surplusone=parseFloat(totalje.replaceAll(",",""))-parseFloat(allcost.replaceAll(",",""));
// var incomeCostRate=parseFloat(allcost.replaceAll(",",""))/parseFloat(totalje.replaceAll(",",""));
// layuitabletotal.find("td[data-field='surplusone']").children("div").text(surplusone.toFixed(2))
// layuitabletotal.find("td[data-field='incomeCostRate']").children("div").text(incomeCostRate.toFixed(4))
//
// layuitabletotal.find("td[data-field='totalincomeone']").children("div").text("平均数："+totalincomeoneavg.toFixed(2))
// layuitabletotal.find("td[data-field='totalcostone']").children("div").text("平均数："+totalcostoneavg.toFixed(2))
// layuitabletotal.find("td[data-field='actualbalanceone']").children("div").text("平均数："+actualbalanceoneavg.toFixed(2))
//
// }
});
}
// 定义一个深拷贝函数 使用了对象的引用对象的时候，使用深拷贝处理对象
function deepClone(obj){
var result;
var oClass=isClass(obj);
if(oClass==="Object"){
result={
};
}else if(oClass==="Array"){
result=[];
}else{
return obj;
}
for(var key in obj){
var copy=obj[key];
if(isClass(copy)=="Object"){
result[key]=arguments.callee(copy);//递归调用
}else if(isClass(copy)=="Array"){
result[key]=arguments.callee(copy);
}else{
result[key]=obj[key];
}
}
return result;
}
//判断对象的数据类型
function isClass(o){
if(o===null) return "Null";
if(o===undefined) return "Undefined";
return Object.prototype.toString.call(o).slice(8,-1);
}
后端代码：
// 导出字段
@RequestMapping("/toList")
@ResponseBody
public Map toexceldataList(@RequestParam HashMap<String,String> paraMap,Model model) {
try {
Map<String, Object> returnmap = createResult(true, "保存成功");
String sql="select name,code from A_field where inter_id='"+paraMap.get("interId")+"'";
returnmap.put("fielddata",jdbcTemplate.queryForList(sql)); //表元字段数据
String sqldata="select name,code from A ";
returnmap.put("griddata",jdbcTemplate.queryForList(sqldata)); //表数据的查询sql
return returnmap;
} catch (Exception e) {
return createResult(false, "保存失败");
}
}