|   | 
| <!DOCTYPE HTML> | 
| <html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml"> | 
| <head> | 
| <meta charset="utf-8"> | 
| <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> | 
| <meta name="renderer" content="webkit|ie-comp|ie-stand"> | 
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | 
| <meta name="viewport" | 
|     content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> | 
| <meta http-equiv="Cache-Control" content="no-siteapp" /> | 
| <LINK rel="Bookmark" href="../images/favicon.ico"> | 
| <!-- 本框架基本脚本和样式 --> | 
| <script type="text/javascript" | 
|         th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> | 
| <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> | 
|   | 
| </head> | 
| <body class="gray-bg"> | 
|     <div class="ibox-content"> | 
|         <!-- 搜索框部分start --> | 
|         <form class="form-inline" id="serchform"> | 
|         <div class="row mb-10"> | 
|                 <div class="col-sm-8"> | 
|                     <button  onclick="myGrid.serchData()" type="button" class="btn btn-info btn-sm"><i class="fa fa-search" ></i> 搜索</button> | 
|                     <button  onclick="myGrid.resetForm()" type="button"   class="btn btn-default btn-sm"><i class="fa fa-refresh " ></i> 重置</button> | 
|                 </div> | 
|             </div> | 
|   | 
|             <div class="form-group mr-20"> | 
|                 <label>日期范围</label> | 
|                 <input autocomplete="off"   name="beginTime" type="text" class="form-control datetimepicker" id="beginTime">- | 
|                 <input autocomplete="off"   name="endTime"  type="text" class="form-control datetimepicker" id="endTime"> | 
|             </div> | 
|             <div class="form-group mr-20"> | 
|                 <label >所属门店</label> <select id="select_id" | 
|                     class="form-control autoFull" | 
|                     th:data-url="@{/admin/shopInfo/findShops}" data-value="id" | 
|                     data-filed="shopName" data-def="${obj.shopId}" name="shopId"> | 
|                     <option value="">--请选择所属门店--</option> | 
|                 </select> | 
|             </div> | 
|               | 
|         </form> | 
|         <!--TODO 导出--> | 
|   | 
|         <table id="mgrid"> | 
|             <thead> | 
|                 <tr> | 
|                     <th data-formatter="MGrid.indexfn" data-align="center" | 
|                         data-width="30px" data-footer-formatter="footCountTitle">序号</th> | 
|                     <th data-field="time">日期</th> | 
|                     <th data-field="shopName" >门店</th> | 
|                     <th data-field="cashPay" data-footer-formatter="countColumn">收现金额</th> | 
|                     <th data-field="cardPay" data-footer-formatter="countColumn">实收余额支付</th> | 
|                     <th data-field="consumePay" data-footer-formatter="countColumn">消耗金额</th> | 
|                     <th data-field="freeConsumePay" data-footer-formatter="countColumn">赠送消耗</th> | 
|                     <th data-field="refundCashPay" data-footer-formatter="countColumn">现金退款</th> | 
|                     <th data-field="refundCardPay" data-footer-formatter="countColumn">卡项退款</th> | 
|                     <th data-field="arrearsPay" data-footer-formatter="countColumn">欠款</th> | 
|                 </tr> | 
|             </thead> | 
|         </table> | 
|     </div> | 
|   | 
|     <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script><script type="text/javascript"> | 
|         var myGrid; | 
|         var initParam = { | 
|                 format : "yyyy-mm-dd", //默认显示年与日,如果想显示十分秒:"yyyy-mm-dd hh:ii:ss" | 
|             minView: 2, //"month",只显示年月日的选择,不会再跳转去选择时分秒;如果想要选择时分秒的:"hour" | 
|             startView:2, | 
|             } | 
|          MTools.ininDatetimepicker(initParam); | 
|         //限制结束时间不小于开始时间 | 
|          MTools.limitStartEndTime({});  | 
|   | 
|   | 
|         $(function() { | 
|             MTools.autoFullSelect(); | 
|             myGrid = MGrid.initGrid({ | 
|                 url : basePath+"/admin/sysBusinessData/showList", | 
|                 showExport : true, | 
|                 showFooter : true, | 
|                 height:'', | 
|                 width:'', | 
|                 exportDataType : "basic", //basic', 'all', 'selected'. | 
|                 exportTypes : [ 'excel', 'xlsx' ], //导出类型 | 
|                 exportOptions : { | 
|                     ignoreColumn : [ 0 ], | 
|                     fileName : "每日单据统计" + MTools.getTime(), //文件名称设置   | 
|                     worksheetName : 'Sheet1', //表格工作区名称   | 
|                     tableName : '每日单据统计', | 
|                     excelstyles : [ 'background-color', 'color', 'font-size', | 
|                             'font-weight' ], | 
|                 } | 
|             }); | 
|         }); | 
|   | 
|         function footCountTitle(data) { | 
|             return "<b>合计</b>"; | 
|         }; | 
|         function countColumn(data) { | 
|             console.log(data) | 
|              field = this.field; | 
|                 var resultsumQuantity = parseFloat((data.reduce(function(sum, row) {  | 
|                     console.log(sum,row[field]); | 
|                     return sum + (+row[field]); | 
|                 }, 0)).toFixed(2));//保留有效数字 | 
|                 return "<b>"+resultsumQuantity+"</b>"; | 
|         }; | 
|     </script> | 
| </body> | 
| </html> |