Index.cshtml 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. @{
  2. ViewBag.Title = "现金银行报表";
  3. Layout = "~/Views/Shared/_ReportIndex.cshtml";
  4. }
  5. <script>
  6. $(function () {
  7. GetGrid();
  8. })
  9. function GetGrid() {
  10. var $gridTable = $('#gridTable');
  11. $gridTable.jqGrid({
  12. url: "../../CustomerManage/CashBalanceReport/GetListJson",
  13. postData: { queryJson: JSON.stringify($("#filter-form").GetWebControls()) },
  14. datatype: "json",
  15. height: $(window).height() - 230.5,
  16. autowidth: true,
  17. colModel: [
  18. { label: "交易日期", name: "ExecutionDate", width: 100, align: 'left', sortable: true, formatter: "date", formatoptions: { newformat: 'Y-m-d' } },
  19. {
  20. label: "交易账户", name: "CashAccount", width: 130, align: "left",
  21. formatter: function (cellvalue, options, rowObject) {
  22. return top.clientdataItem["Client_PaymentAccount"][cellvalue];
  23. }
  24. },
  25. {
  26. label: "收入金额", name: "Receivable", width: 110, align: 'right',
  27. formatter: function (cellvalue, options, rowObject) {
  28. if (cellvalue != null) {
  29. return toDecimal(cellvalue);
  30. } else {
  31. return "";
  32. }
  33. }
  34. },
  35. {
  36. label: "支出金额", name: "Expenses", width: 110, align: 'right', formatter: function (cellvalue, options, rowObject) {
  37. if (cellvalue != null) {
  38. return toDecimal(cellvalue);
  39. } else {
  40. return "";
  41. }
  42. }
  43. },
  44. { label: "账户余额", name: "Balance", width: 110, align: 'right', formatter: 'number', formatoptions: { thousandsSeparator: "", decimalPlaces: 2 } },
  45. {
  46. label: '创建时间', name: 'CreateDate', index: 'CreateDate', width: 130, align: 'center',
  47. formatter: "date", formatoptions: { srcformat: 'Y-m-d H:i', newformat: 'Y-m-d H:i' }
  48. },
  49. { label: "摘要信息", name: "Abstract", width: 300, align: "left" }
  50. ],
  51. pager: false,
  52. rowNum: "1000",
  53. rownumbers: true,
  54. shrinkToFit: false,
  55. gridview: true,
  56. footerrow: true,
  57. gridComplete: function () {
  58. var totalreceivable = $(this).getCol("Receivable", false, "sum");
  59. var totalexpenses = $(this).getCol("Expenses", false, "sum");
  60. //合计
  61. $(this).footerData("set", {
  62. "ExecutionDate": "合计:",
  63. "Receivable": totalreceivable,
  64. "Expenses": totalexpenses,
  65. });
  66. $('table.ui-jqgrid-ftable td').prevUntil().css("border-right-color", "#fff");
  67. }
  68. });
  69. $gridTable.authorizeColModel();
  70. //点击时间范围(今天、近7天、近一个月、近三个月)
  71. $("#time_horizon a.btn-default").click(function () {
  72. $("#time_horizon a.btn-default").removeClass("active");
  73. $(this).addClass("active");
  74. switch ($(this).attr('data-value')) {
  75. case "1"://今天
  76. $("#StartTime").val("@DateTime.Now.ToString("yyyy-MM-dd")");
  77. $("#EndTime").val("@DateTime.Now.ToString("yyyy-MM-dd")");
  78. break;
  79. case "2"://近7天
  80. $("#StartTime").val("@DateTime.Now.AddDays(-7).ToString("yyyy-MM-dd")");
  81. $("#EndTime").val("@DateTime.Now.ToString("yyyy-MM-dd")");
  82. break;
  83. case "3"://近一个月
  84. $("#StartTime").val("@DateTime.Now.AddMonths(-1).ToString("yyyy-MM-dd")");
  85. $("#EndTime").val("@DateTime.Now.ToString("yyyy-MM-dd")");
  86. break;
  87. case "4"://近三个月
  88. $("#StartTime").val("@DateTime.Now.AddMonths(-3).ToString("yyyy-MM-dd")");
  89. $("#EndTime").val("@DateTime.Now.ToString("yyyy-MM-dd")");
  90. break;
  91. default:
  92. break;
  93. }
  94. $("#SelectedStartTime").html($("#StartTime").val());
  95. $("#SelectedEndTime").html($("#EndTime").val());
  96. $('#btn_Search').trigger("click");
  97. });
  98. //查询点击事件
  99. $("#btn_Search").click(function () {
  100. if (!$(".ui-filter-text").next('.ui-filter-list').is(":hidden")) {
  101. $(".ui-filter-text").trigger("click");
  102. }
  103. $("#SelectedStartTime").html($("#StartTime").val());
  104. $("#SelectedEndTime").html($("#EndTime").val());
  105. var queryJson = $("#filter-form").GetWebControls();
  106. $gridTable.jqGrid('setGridParam', {
  107. postData: { queryJson: JSON.stringify(queryJson) },
  108. }).trigger('reloadGrid');
  109. });
  110. }
  111. //打印
  112. function btn_print() {
  113. $("#gridPanel").printTable();
  114. }
  115. //导出
  116. function btn_export() {
  117. dialogOpen({
  118. id: "ExcelIExportDialog",
  119. title: '导出现金银行报表',
  120. url: '/Utility/ExcelExportForm?gridId=gridTable',
  121. width: "500px",
  122. height: "380px",
  123. callBack: function (iframeId) {
  124. top.frames[iframeId].AcceptClick();
  125. }, btn: ['导出Excel', '关闭']
  126. });
  127. }
  128. </script>
  129. <div class="ui-report">
  130. <div class="titlePanel">
  131. <div class="title-search">
  132. <table>
  133. <tr>
  134. <td>查询条件</td>
  135. <td style="padding-left: 10px;">
  136. <div class="ui-filter" style="width: 200px;">
  137. <div class="ui-filter-text">
  138. <strong id="SelectedStartTime">@DateTime.Now.AddDays(-7).ToString("yyyy-MM-dd")</strong> 至 <strong id="SelectedEndTime">@DateTime.Now.ToString("yyyy-MM-dd")</strong>
  139. </div>
  140. <div class="ui-filter-list" style="width: 350px;">
  141. <table class="form" id="filter-form">
  142. <tr>
  143. <th class="formTitle">交易日期:</th>
  144. <td class="formValue">
  145. <input id="Category" type="hidden" value="1" />
  146. <div style="float: left; width: 45%;">
  147. <input id="StartTime" readonly type="text" value="@DateTime.Now.AddMonths(-1).ToString("yyyy-MM-dd")" class="form-control input-wdatepicker" onfocus="WdatePicker({maxDate:'%y-%M-%d'})">
  148. </div>
  149. <div style="float: left; width: 10%; text-align: center;">至</div>
  150. <div style="float: left; width: 45%;">
  151. <input id="EndTime" readonly type="text" value="@LeaRun.Util.Time.GetToday()" class="form-control input-wdatepicker" onfocus="WdatePicker({maxDate:'%y-%M-%d'})">
  152. </div>
  153. </td>
  154. </tr>
  155. </table>
  156. <div class="ui-filter-list-bottom">
  157. <a id="btn_Reset" class="btn btn-default">&nbsp;重&nbsp;&nbsp;置</a>
  158. <a id="btn_Search" class="btn btn-primary">&nbsp;查&nbsp;&nbsp;询</a>
  159. </div>
  160. </div>
  161. </div>
  162. </td>
  163. <td style="padding-left: 10px;">
  164. <div id="time_horizon" class="btn-group">
  165. <a class="btn btn-default" data-value="1">今天</a>
  166. <a class="btn btn-default" data-value="2">近7天</a>
  167. <a class="btn btn-default active" data-value="3">近1个月</a>
  168. <a class="btn btn-default" data-value="4">近3个月</a>
  169. </div>
  170. </td>
  171. </tr>
  172. </table>
  173. </div>
  174. <div class="toolbar">
  175. <div class="btn-group">
  176. <a id="lr-replace" class="btn btn-default" onclick="reload();"><i class="fa fa-refresh"></i>&nbsp;刷新</a>
  177. <a id="lr-print" class="btn btn-default" onclick="btn_print()"><i class="fa fa-print"></i>&nbsp;打印</a>
  178. <a id="lr-export" class="btn btn-default" onclick="btn_export()"><i class="fa fa-sign-out"></i>&nbsp;导出</a>
  179. </div>
  180. <script>$('.toolbar').authorizeButton()</script>
  181. </div>
  182. </div>
  183. <div class="gridPanel" id="gridPanel">
  184. <div class="printArea">
  185. <div class="grid-title">现金银行报表</div>
  186. <div class="grid-subtitle">日期: 2016-03-10 至 2016-04-10</div>
  187. <table id="gridTable"></table>
  188. </div>
  189. </div>
  190. </div>