新增表格参数（自定义打印页面模板printPageBuilder）

5 years ago · 697a989ab3
parent e5f914277e
commit 697a989ab3
2 changed files with 49 additions and 1 deletions
--- a/ruoyi-admin/src/main/resources/static/ruoyi/js/ry-ui.js
+++ b/ruoyi-admin/src/main/resources/static/ruoyi/js/ry-ui.js
@ -142,6 +142,7 @@ var table = {
                    responseHandler: $.table.responseHandler,           // 在加载服务器发送来的数据之前处理函数
                    onLoadSuccess: $.table.onLoadSuccess,               // 当所有数据被加载时触发处理函数
                    exportOptions: options.exportOptions,               // 前端导出忽略列索引
+                    printPageBuilder: printPageBuilder,                 // 自定义打印页面模板
                    detailFormatter: options.detailFormatter,           // 在行下面展示其他数据列表
                });
            },
--- a/ruoyi-admin/src/main/resources/templates/demo/table/print.html
+++ b/ruoyi-admin/src/main/resources/templates/demo/table/print.html
@ -31,8 +31,10 @@
 		        showRefresh: false,
 		        showToggle: false,
 		        showColumns: false,
+		        printPageBuilder: printPageBuilder,
                columns: [{
-		            checkbox: true
+		            checkbox: true,
+		            printIgnore: true
 		        },
 				{
 					field : 'userId', 
@ -61,6 +63,7 @@
 		        {
 		            title: '操作',
 		            align: 'center',
+		            printIgnore: true,
 		            formatter: function(value, row, index) {
 		            	var actions = [];
                        actions.push('<a class="btn btn-danger btn-xs" href="javascript:;" onclick="remove(this)"><i class="fa fa-remove"></i>删除</a>');
@ -78,6 +81,50 @@
        	    $.modal.msgSuccess('已删除!');
        	});
        }
+        
+        // 自定义打印页面模板
+        function printPageBuilder(table){
+        	return `
+        	<html>
+        	  <head>
+        	  <style type="text/css" media="print">
+        	  @page {
+        	    size: auto;
+        	    margin: 25px 0 25px 0;
+        	  }
+        	  </style>
+        	  <style type="text/css" media="all">
+        	  table {
+        	    border-collapse: collapse;
+        	    font-size: 12px;
+        	  }
+        	  table, th, td {
+        	    border: 1px solid grey;
+        	  }
+        	  th, td {
+        	    text-align: center;
+        	    vertical-align: middle;
+        	  }
+        	  p {
+        	    font-weight: bold;
+        	    margin-left:20px;
+        	  }
+        	  table {
+        	    width:94%;
+        	    margin-left:3%;
+        	    margin-right:3%;
+        	  }
+        	  div.bs-table-print {
+        	    text-align:center;
+        	  }
+        	  </style>
+        	  </head>
+        	  <title>Print Table</title>
+        	  <body>
+        	  <div class="bs-table-print">${table}</div>
+        	  </body>
+        	</html>`
+        }
    </script>
 </body>
 </html>