需求: 客户需要按照月份查出当月所有天数的数据
解析需求: 后台需要拿到动态生成的数据(我们是用存储过程生成或者函数),前台进行拼接
前台实现: 取到对应的天数,然后初始化字段,接着加载数据
function dynamicLoad(){
//拿到月份,需要只选取年和月份的插件可以找我
var month = $("#query_month").datebox("getValue");
if(month==""){
$.msg.alert("请选择月份");
return;
}
var dateArray = month.split("-");
//必须以这种方式传入日期,否则获取不到对应月份的天数 如果是new Date(''2020-01-01")
这样取不到对应的天数,取得值是1,也就是你传入日期的日,所以只能是new date(年,月,0)
var date = new Date(dateArray[0], dateArray[1], 0);
var days = date.getDate();
var startTime = month+"-01";
var endTime = month+"-"+days;
var columns=new Array();
$.post(url,{startTime:startTime,endTime:endTime},function(rs){
//获取存储当前日期
var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
for(var i = 0; i < rs.dates.length;i++){
var date = rs.dates[i];
var mydate=new Date(date.signDate);
var myddy=mydate.getDay();
var column={};
column["title"]=dateFormatter(date.signDate)+"<br/>"+weekday[myddy];
column["field"]='date'+i;
column["width"]=120;
column["align"]='center';
columns.push(column);
}
//如果需要格式化值,这步很关键,网上找的说拼接字符串,我也不知道怎么弄,
所以我直接这样写,{}里面拼接字符串我也不会,所以你把你需要formatter的字段做个判断,然后初始化column的值
var column={'formatter':function(val,row,index) {return (val*100).toFixed(2)}};
column["title"]="平均值"
column["field"]='avg';
column["width"]=120;
column["align"]='center';
columns.push(column);
init(columns);
$("#data_list").datagrid('loadData',rs.datas);
}
,'json');
}
//这部分就是初始化表格字段
function init(columns){
$("#data_list").datagrid( {
idField : 'id',
cache : false,
method : "post",
rownumbers : true,
nowrap: false,
border : false,
fit : true,
fitColumns: false,
toolbar : "#toolbar",
striped : true,
pagination : true,
pageList : [ 100,200,500,1000 ],
singleSelect : false,
enableHeaderClickMenu: false,
enableHeaderContextMenu: false,
enableRowContextMenu: true,
frozenColumns :[[{field:'userName',title:'人员',width:100,sortable:true,align:'center'}, {field:'vgroup',title:'班次',width:100,sortable:true,align:'center'}]],
columns : [columns],
onBeforeLoad : function(){$("#data_list").datagrid('clearSelections');return true;},
onLoadSuccess:function(data){
},
onSelect:function(rowIndex,rowData){ buttonState();
},
onUnselect:function(rowIndex,rowData){ buttonState();
},
onSelectAll:function(rows){ buttonState();
},
onUnselectAll:function(rows){ buttonState();
},
});
}
如果以上内容对你有帮助,可以的话打个赏,多少无所谓,就是让我感觉到你们的心意,如果又不懂的,欢迎评论,我一定知无不言,言无不尽,还是说一句,还是vue好用,easyui我也是用来维护老项目写的,用的很多,哈哈,最后感谢你们的阅读。