MVC中的打印功能

HTML页面：

@{
Layout = "~/Views/Shared/_IframeLayout.cshtml";
}
@Scripts.Render(ViewBag.ScriptPath + "/JS/tableExport.js" + ViewBag.ScriptVersion)
@Scripts.Render(ViewBag.RootPath + "/Scripts/DataCenter/Odometer.js" + ViewBag.JsVersion)

/*JS页面*/

var columnsObj = {
vehilceid: {
name: 'VehicleID', label: '车辆ID', hidden: true, formatter(a,b,c) {
if(a){
return a;
}
}
},
regname: { name: 'RegName', label: '车牌号', sortable: true, 50 },
bodometer: { name: 'BOdometer', label: '开始里程', sortable: true, 50 },
eodometer: { name: 'EOdometer', label: '结束里程', sortable: true, 50 },
avgspeed: { name: 'AvgSpeed', label: '平均速度(km/h)', sortable: true, 50 },
runodometer: { name: 'RunOdometer', label: '运行里程(KM)', sortable: true, 50 },
viewruntime: { name: 'ViewRunTime', label: '运行时长(s)', sortable: true, 50 },
btime: { name: 'BTime', label: '开始定位时间', sortable: true, 100, formatter: "date", formatoptions: { srcformat: 'Y-m-d H:i:s', newformat: 'Y-m-d H:i:s' } },
etime: { name: 'ETime', label: '结束定位时间', sortable: true, 100, formatter: "date", formatoptions: { srcformat: 'Y-m-d H:i:s', newformat: 'Y-m-d H:i:s' } },
bplacename: { name: 'BPlaceName', label: '开始位置', sortable: true, 100 },
eplacename: { name: 'EPlaceName', label: '结束位置', sortable: true, 100 }
};

$(function () {
$('#LiOdometerPage').addClass("active").parents('li').addClass("open active");
initTable();
var VehicleSel = new MultiSelect();
VehicleSel.InitSelect("", getRootPath() + "/ManagerCenter/Vehicle/GetVehicleTreeAjax", 'txtVehicleID', 'hidVehicleID', 'hidVehicleName');
});

function PageResize() {
$("#OdometerTable").setGridWidth($(".tableDiv").width()).setGridHeight(getHeight());
};

//设置表格高度
function getHeight() {
return $(window).height() - $("#search").outerHeight(true) - 120;
};

//初始化表格
function initTable() {
$("#OdometerTable").jqGrid({
datatype: "json",
mtype: "post",
colModel: [columnsObj.vehilceid, columnsObj.regname, columnsObj.runodometer, columnsObj.viewruntime, columnsObj.btime, columnsObj.etime, columnsObj.bplacename, columnsObj.eplacename],
styleUI: "Bootstrap",
viewrecords: true,
auto true,
scrollrows: true,
rownumbers: true,
rowNum: 20,
rowList: [20, 50, 100],
$(".tableDiv").width(),
caption: '<b style="font-size:18px;">里程报表</b>',
pager: "#OdometerPager",
height: getHeight(),
subGrid: true,
subGridOptions: {
"plusicon": "glyphicon-chevron-right",
"minusicon": "glyphicon-chevron-down",
"openicon": "",
reloadOnExpand: false
},
isHasSubGrid: function (rowid) {
var rowdata = $("#OdometerTable").jqGrid('getRowData', rowid);
if (rowdata.BTime.substring(0, 10) == rowdata.ETime.substring(0, 10)) { return false; }
return true;
},
subGridRowExpanded: function (subgrid_id, row_id) {
var rowdata = $("#OdometerTable").jqGrid('getRowData', row_id);
var subgrid_table_id, pager_id;
subgrid_table_id = subgrid_id + "_t";
pager_id = "p_" + subgrid_table_id;
$("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table><div id='" + pager_id + "' '></div>");
$("#" + subgrid_table_id).jqGrid({
url: getRootPath() + '/DataCenter/Odometer/GetOdometerDataAjax?',
datatype: 'json',
postData: {
pVehicleIDs: rowdata.VehicleID,
pType: 2,
pBTime: rowdata.BTime,
pETime: rowdata.ETime
},
colModel: [columnsObj.runodometer, columnsObj.viewruntime, columnsObj.btime, columnsObj.etime, columnsObj.bplacename, columnsObj.eplacename],
rowNum: 20,
auto true,
rownumbers: true,
pager: pager_id,
styleUI: "Bootstrap",
height: '100%'
});
$("#" + subgrid_table_id).jqGrid('navGrid', "#" + pager_id, { edit: false, add: false, del: false, search: false });
$("#" + subgrid_table_id).closest(".ui-jqgrid-bdiv").css({ "overflow": "auto" });
},
subGridRowColapsed: function (subgrid_id, row_id) { }
});
$("#OdometerTable").closest(".ui-jqgrid-bdiv").css({ "overflow": "auto" });
$("#OdometerTable").setSelection(4, true);
$("#OdometerTable").jqGrid("navGrid", "#OdometerPager", { edit: false, add: false, del: false, search: false }, { height: 200, reloadAfterSubmit: false });
$(window).bind("resize", function () {
PageResize();
});
};

//设置表格高度
function getHeight() {
return $(window).height() - $("#search").outerHeight(true) - 170;
};

//查询按钮
function SearchInfo() {
$('#btnSearch').addClass('disabled');
$("#OdometerTable").jqGrid('setGridParam', {
url: getRootPath() + '/DataCenter/Odometer/GetOdometerDataAjax?',
datatype: 'json',
postData: {
pVehicleIDs: $("#hidVehicleID").val(),
pType: 1,
pBTime: $("#begintime").val() + ' 00:00:00',
pETime: $("#endtime").val() + ' 23:59:59'
},
page: 1
}).trigger("reloadGrid"); //重新载入
$('#btnSearch').removeClass('disabled');
};

//里程汇总导出
function ImportToExcel() {
try {
var data = $("#OdometerTable").getRowData();
if (data.length == 0) {
layer.msg('当前页无可导出数据', { time: 2000, icon: 0 });
return;
}
var table = '<table id="newTable" border="1" cellspacing="0" cellpadding="0">';
table += '<thead>'
+ '<tr>'
+ ' <th>车牌号</th>'
+ ' <th>运行里程(KM)</th>'
+ ' <th>运行时长(s)</th>'
+ ' <th>开始定位时间</th>'
+ ' <th>结束定位时间</th>'
+ ' <th>开始位置</th>'
+ ' <th>结束位置</th>'
+ '</tr>'
+ '</thead><tbody>';
for (var i = 0, l = data.length; i < l; i++) {
table += '<tr>'
+ ' <td>' + data[i].RegName.toString() + '</td>'
+ ' <td>' + data[i].RunOdometer.toString() + '</td>'
+ ' <td>' + data[i].ViewRunTime.toString() + '</td>'
+ ' <td>' + data[i].BTime.toString() + '</td>'
+ ' <td>' + data[i].ETime.toString() + '</td>'
+ ' <td>' + data[i].BPlaceName.toString() + '</td>'
+ ' <td>' + data[i].EPlaceName.toString() + '</td>'
+ '</tr>';
}
table += '</tbody></table>';
// 使用outerHTML属性获取整个table元素的HTML代码（包括<table>标签），然后包装成一个完整的HTML文档，设置charset为urf-8以防止中文乱码
var html = "<html><head><meta charset='utf-8' /></head><body>" + table + "</body></html>";
// 实例化一个Blob对象，其构造函数的第一个参数是包含文件内容的数组，第二个参数是包含文件类型属性的对象
var blob = new Blob([html], { type: "application/vnd.ms-excel" });
var a = document.getElementById("aExportData");
// 利用URL.createObjectURL()方法为a元素生成blob URL
a.href = URL.createObjectURL(blob);
// 设置文件名
a.download = "里程报表.xls";
$("#aExportData span").click();
}
catch (ex) {
catchTheException("ImportToExcel", ex);
}
};