列印預覽:print
阿新 • • 發佈：2018-11-19
一、函式 function printed(){ $.ajaxPrint({ url: '<g:createLink controller="oneLevel" action="print"/>', title: '資金清分報表', data: { flage: '${params.flage}' }, fields: [ { title: '日期', field: 'tDate' }, { title: '訂單筆數', field: 'orderNum', sum:true }, { title: '商品總數', field: 'goodsSum', sum:true }, { title: '訂單總金額(元)', field: 'orderMoneySum', sum:true }, { title: '抵扣金額(元)', field: 'discountMoney', sum:true }, { title: '實付金額(元)', field: 'realPayMoney', sum:true }, { title: '退貨筆數', field: 'backNum', sum:true }, { title: '退貨金額(元)', field: 'backMoney', sum:true }, { title: '總筆數', field: 'totalNum', sum:true }, { title: '總金額(元)', field: 'totalMoney', sum:true } ] }); }
二、外掛 print.js /** * 非同步列印 * @author Monster * @param object 引數 * @returns */ $.ajaxPrint = function(object) { //必須指定URL if(object != undefined && object != null) { if (object.title == undefined || object.title == '' || object.title == null) { alert("未指定標題名"); return; } //去除重複UI引數 var tag = false; if (object.easygrid != undefined && object.easygrid != '' && object.easygrid != null) { delete object.jqgrid; delete object.ligergrid; tag = true; } if(!tag) { if (object.ligergrid != undefined && object.ligergrid != '' && object.ligergrid != null) { delete object.jqgrid; delete object.easygrid; tag = true; } } if(!tag) { if (object.jqgrid != undefined && object.jqgrid != '' && object.jqgrid != null) { delete object.ligergrid; delete object.easygrid; tag = true; } } } window.printParams = object; window.open("/VEMManage/print"); };
三、頁面 print.jsp <%-- Created by IntelliJ IDEA. User: Monster Date: 2015/3/26 Time: 15:05 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title> </title> </head> <style type="text/css"> table { width: 98%; min-width: 768px; } table th { height: 28px; font-size: 18px; background-color: #777777; text-align: center; font-weight: bold; font-family: "微軟雅黑", "宋體", Arial, sans-serif; } table td { height: 18px; border: 1px #777777 solid; text-align: center; font-size: 8px; padding-left: 1px; padding-right: 1px; } div, table, table tr { text-align: center; margin: auto; } @media print { table { page-break-after: auto } tr { page-break-inside: avoid; page-break-after: auto } td { page-break-inside: avoid; page-break-after: auto } thead { display: table-header-group } tfoot { display: table-footer-group } } </style> <body> </div> <div id="printContent"> <table id="print_table" cellspacing="0" cellpadding="0" align="center"> <thead> <tr> <th id="themeName"></th> </tr> <tr> <td id="operatorName" style="border: 0px; text-align: left">製表人：<span id="operator"></span></td> <td id="position" style="border: 0px;"></td> </tr> </thead> <tbody id="columnTitle"> </tbody> <tfoot> <tr> <td id="tabName" style="border: 0px; text-align: left">製表時間：<span id="tabTime"></span></td> <td id="positionTab" style="border: 0px;"></td> </tr> </tfoot> </table> </div> </body> <asset:javascript src="jquery/jquery.min.js"/> <script> $(function () { var object = window.opener.printParams; if (object != undefined) { sendAjax(object); } if (object.operator != undefined) { setOperator(object.operator); } else { var operator = "${grails.plugin.springsecurity.SpringSecurityUtils.getLastUsername(session)}"; if (operator != "") { setOperator(operator); } } setThemeName(object.title); setTabTime(); }); /** 標題列ID*/ var $columnTitle = $('#columnTitle'); /** * 預設設定編號 */ function createArray() { var columnArray = new Array(); var column = {}; column['title'] = '編號'; column['field'] = 'index'; columnArray.push(column); return columnArray; } /** 獲取ligergrid 標題名稱*/ function getLigerGridColumns(ligergrid) { /*var columns = $('#ligergrid').ligerGrid('getColumns');*/ var columnArray = new Array(); for (var i = 0; i < ligergrid.length; i++) { var col = ligergrid[i]; var display = col.display; var columnname = col.columnname; if (display != undefined && columnname != undefined && !col.hide) { var column = {}; column['title'] = display; column['field'] = columnname; if (col.render != undefined) { column['format'] = col.render; } if (col.sum != undefined && col.sum) { column['sum'] = col.sum; column['sumValue'] = 0; } columnArray.push(column); } } return columnArray; } /** * 獲取easygrid 標題名稱 * @author Monster * */ function getEasyGridColumns(easygrid) { /*var columns = $(easygrid).datagrid('options').columns[0];*/ var columnArray = new Array(); for (var i = 0; i < easygrid.length; i++) { var col = easygrid[i]; var title = col.title; var field = col.field; if (title != undefined && field != undefined && !col.hidden) { var column = {}; column['title'] = title; column['field'] = field; if (col.formatter != undefined) { column['format'] = col.formatter; } if (col.sum != undefined && col.sum) { column['sum'] = col.sum; column['sumValue'] = 0; } columnArray.push(column); } } return columnArray; } /** 獲取jqgrid 標題名稱*/ function getJQGridColumns(jqgrid) { /*var cols = $("#jQGrid").jqGrid('getGridParam', 'colModel');*/ var columnArray = new Array(); for (var i = 0; i < jqgrid.length; i++) { var col = jqgrid[i]; var label = col.label; var name = col.name; if (label != undefined && name != undefined && !col.hidden) { var column = {}; column['title'] = label; column['field'] = name; if (col.formatter != undefined) { column['format'] = col.formatter; } if (col.sum != undefined && col.sum) { column['sum'] = col.sum; column['sumValue'] = 0; } columnArray.push(column); } } return columnArray; } /** 裝載資料*/ function sendAjax(object) { var ajaxParams = {}; var data = {}; if (object.easygrid != undefined) { ajaxParams['url'] = object.easygrid.url; data = object.easygrid.queryParams; if (object.rows == undefined) { data['rows'] = 5000; } else { data['rows'] = object.rows } if (object.page == undefined) { data['page'] = 1; } else { data['page'] = object.page; } ajaxParams['data'] = data; } else if (object.jqgrid != undefined) { if (object.rows == undefined) { data['rows'] = 5000; } else { data['rows'] = object.rows } if (object.page == undefined) { data['page'] = 1; } else { data['page'] = object.page; } ajaxParams['data'] = data; } else if (object.ligergrid != undefined) { if (object.pagesize == undefined) { data['pagesize'] = 5000; } else { data['pagesize'] = object.pagesize } if (object.page == undefined) { data['page'] = 1; } else { data['page'] = object.page; } ajaxParams['data'] = data; } //如果有設定如下引數則複用UI裡的引數 if (object.url != undefined) { ajaxParams['url'] = object.url; } if (object.data != undefined) { ajaxParams['data'] = object.data; } if (object.dataType != undefined) { ajaxParams['dataType'] = object.dataType; } else { ajaxParams['dataType'] = 'json'; } if (object.contentType != undefined) { ajaxParams['contentType'] = object.contentType; } ajaxParams['success'] = function (data) { processData(data, object); }; $.ajax(ajaxParams); } /** * 獲取物件中的所有Key */ function getKeys(rows) { var keys = []; if (rows != null && rows != undefined && rows.length > 0) { keys = Object.keys(rows[0]); } return keys; } /** * 驗證資料不為空，未定義 */ function validateValue(columnValue) { if (columnValue != null && columnValue != undefined) { return true; } return false; } /** * 驗證列值，是否為整數和浮點數 */ function validateNumber(columnValue) { if (!columnValue) { return false; } //驗證浮點數 var reg = /^\d+(\.\d+)?$/; if (!reg.test(columnValue)) { return false; } try { //如果是字元或其他型別，則不是浮點數 if (parseFloat(columnValue) != columnValue) { return false; } } catch (ex) { return false; } return true; } /** * 在沒有指定fields時或者三種UI時,設定資料行 */ function setCustomColumnDatas(rows, keys) { setColumnTitles(keys); for (var idx in rows) { var row = rows[idx]; var html = '<tr>'; keys.forEach(function (column) { var columnValue = row[column]; if (validateValue(columnValue)) { html += '<td>' + row[column] + '</td>'; } else { html += '<td></td>'; } }); html += '</tr>'; $columnTitle.after(html); } } /** * 在指定UI時, 設定資料行 */ function setColumnDatas(rows, columnArray) { setColumnTitles(columnArray); var html = ""; var length = rows.length; for (var index = 0; index < length; index++) { var row = rows[index]; html += "<tr id='" + (index + 1) + "'>"; columnArray.forEach(function (columnDef) { if (columnDef.format != undefined) { columnValue = columnDef.format(row[columnDef.field], row, index); } else { var columnValue = row[columnDef.field]; } if (columnValue == undefined) { columnValue = ''; } //如果以上取得值不為未定義 var sum = columnDef.sum; //驗證統計值 if (sum != undefined && sum == true && columnValue != '' && validateNumber(columnValue)) { columnDef.sumValue += columnValue; } html += "<td>" + columnValue + "</td>" }); html += "</tr>"; } $columnTitle.after(html); setColumnSum(columnArray, length); } /** 設定標題*/ function setColumnTitles(columnArray) { var length = columnArray.length; for (var i = 0; i < length; i++) { var title = columnArray[i].title; if (title != undefined) { $columnTitle.append('<td>' + title + '</td>'); } else { $columnTitle.append('<td>' + columnArray[i] + '</td>'); } } $("#themeName").attr('colspan', length); $("#operatorName").attr('colspan', length - 1); $("#operator").attr('colspan', 1); $("#position").attr('colspan', length - 2); $("#tabName").attr('colspan', length - 1); $("#tabTime").attr('colspan', 1); $("#positionTab").attr('colspan', length - 2); } /** * 設定統計 */ function setColumnSum(columnArray, length) { var html = '<tr id="' + (length + 1) + '">合計：' + length + ''; for (var i = 0; i < columnArray.length; i++) { var sum = columnArray[i].sum; if (sum != undefined && sum) { html += '<td>' + columnArray[i].sumValue + '</td>'; } else { if (i == 0) { html += '<td>合計：' + length + '</td>'; } else { html += '<td></td>'; } } } html += '</tr>'; $("#" + length).after(html); } /** * 設定製表人 * @param operator * */ function setOperator(operator) { $('#operator').text(operator); } /** * 設定標題 * @param title * */ function setThemeName(title) { if (title == undefined) { $('#themeName').text("華夏園趣寶金融服務有限公司"); } else { $('#themeName').text("華夏園趣寶金融服務有限公司 " + title); } } /** * 設定製表時間 */ function setTabTime() { var date = new Date(); var year = date.getFullYear(); var month = date.getMonth() + 1; var day = date.getDate(); var hours = date.getHours(); var milliseconds = date.getMinutes(); var seconds = date.getSeconds(); var tabTime = year + "-" + month + '-' + day + ' '+ hours + ':' + milliseconds + ':' + seconds; $('#tabTime').text(tabTime); } function processData(data, object) { if (data != null && data != '' && data.rows != null && data.rows != '' && data.success) { var rows = data.rows; var columnArray; if (object.easygrid != undefined) { columnArray = getEasyGridColumns(object.easygrid.columns[0]); setColumnDatas(rows, columnArray); } else if (object.jqgrid != undefined) { columnArray = getJQGridColumns(object.jqgrid); setColumnDatas(rows, columnArray); } else if (object.ligergrid != undefined) { columnArray = getLigerGridColumns(object.ligergrid); setColumnDatas(rows, columnArray); } else { if (object.fields != undefined) { columnArray = getEasyGridColumns(object.fields); //使用easyui 未預設 setColumnDatas(rows, columnArray); } else { var keys = getKeys(rows); if (keys.length > 0) { setCustomColumnDatas(rows, keys); } } } } window.print(); } </script> </html>
四、java後臺伺服器
def print(){
String fileName = oneLevelService.fileName(params.flage);
List<GroovyRowResult> rows = oneLevelService.export(params);
Map<String,Object> map = [success: true,fileName:fileName, rows: rows]
render map as JSON
}