charge_year.html 8.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>收费记录查询</title>
  6. </head>
  7. <body>
  8. <div class="layui-card layadmin-header">
  9. <div class="layui-breadcrumb" lay-filter="breadcrumb">
  10. <a lay-href="">主页</a>
  11. <a><cite>车辆检测管理</cite></a>
  12. <a><cite>收费记录查询</cite></a>
  13. </div>
  14. </div>
  15. <div class="layui-fluid">
  16. <div class="layui-row layui-col-space15">
  17. <div class="layui-col-md12">
  18. <div class="layui-card">
  19. <!--<div class="layui-card-header">开启头部工具栏</div>-->
  20. <div class="layui-card-body">
  21. <div class="test-table-reload-btn" style="margin-bottom: 10px;">
  22. 环保类型:
  23. <div class="layui-inline layui-form" lay-filter="detectionSelect">
  24. <select name="EP_type" lay-verify="required" lay-search="" lay-filter="detectionChangeType" id="detectionSelect">
  25. <option value="">全部</option>
  26. </select>
  27. </div>
  28. 挂账客户:
  29. <div class="layui-inline layui-form" lay-filter="customerSelect">
  30. <select name="customer" lay-verify="required" lay-search="" lay-filter="customerSelect" id="customerSelect">
  31. <!--<option value="">全部</option>-->
  32. </select>
  33. </div>
  34. 安检类型:
  35. <div class="layui-inline layui-form" lay-filter="carTypeSelect">
  36. <select name="car_type" lay-verify="required" lay-search="" lay-filter="carChangeType" id="carTypeSelect">
  37. <option value="">全部</option>
  38. </select>
  39. </div>
  40. 检测年份:
  41. <div class="layui-input-inline">
  42. <input type="text" class="layui-input" id="test-laydate-range-date">
  43. </div>
  44. <button class="layui-btn" data-type="reload">搜索</button>
  45. </div>
  46. <table class="layui-hide" id="test-table-totalRow" lay-filter="test-table-totalRow"></table>
  47. </div>
  48. <div class="layui-card-body">
  49. 支付宝总计:
  50. <div class="layui-input-inline" style="width: 80px">
  51. <input type="text" class="layui-input" id="ali_pay_sum" style="border:none;font-weight:bold">
  52. </div>
  53. 挂账总计:
  54. <div class="layui-input-inline" style="width: 80px">
  55. <input type="text" class="layui-input" id="on_account_sum" style="border:none;font-weight:bold">
  56. </div>
  57. 环检应收总计:
  58. <div class="layui-input-inline" style="width: 80px">
  59. <input type="text" class="layui-input" id="EP_sum" style="border:none;font-weight:bold">
  60. </div>
  61. 安检应收总计:
  62. <div class="layui-input-inline" style="width: 80px">
  63. <input type="text" class="layui-input" id="Safe_sum" style="border:none;font-weight:bold">
  64. </div>
  65. 应收总计:
  66. <div class="layui-input-inline" style="width: 80px">
  67. <input type="text" class="layui-input" id="rece_sum" style="border:none;font-weight:bold">
  68. </div>
  69. 实收总计:
  70. <div class="layui-input-inline" style="width: 80px" >
  71. <input type="text" class="layui-input" id="cost_sum" style="border:none;font-weight:bold">
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. </body>
  79. <script>
  80. layui.use(['admin', 'table','laydate','form'], function(){
  81. var admin = layui.admin
  82. ,$ = layui.$
  83. ,laydate = layui.laydate
  84. ,table = layui.table
  85. ,form = layui.form;
  86. // form.render(null, 'form-group');
  87. table.render({
  88. elem: '#test-table-totalRow'
  89. ,url:'/charge/chargeYear'
  90. ,method:'post'
  91. ,toolbar: '#'
  92. ,even: true//隔行背景
  93. ,title: '收费记录数据表'
  94. ,cols: [[
  95. // {type:'numbers',fixed: 'left', totalRowText: '合计:'}
  96. {field:'license', title:'车牌',align: 'center'},
  97. {field:'EP_type', title:'环保类型',align: 'center'},
  98. {field:'car_type', title:'安检类型',align: 'center'},
  99. {field:'customer', title:'挂账客户',align: 'center'},
  100. {field:'contracted_customer', title:'签约客户',align: 'center'},
  101. {field:'ali_pay', title:'支付宝',align: 'center'},
  102. {field:'on_account', title:'挂账金额',align: 'center'},
  103. {field:'EP_receivable', title:'环检应收',align: 'center'},
  104. {field:'Safe_receivable', title:'安检应收',align: 'center'},
  105. {field:'receivable', title:'应收总和',align: 'center'},
  106. {field:'cost', title:'实收总和',align: 'center'},
  107. {field:'remarks', title:'备注',align: 'center'}
  108. // ,{fixed: 'right', title:'操作', toolbar: '#test-table-toolbar-barDemo', width:150}
  109. ]]
  110. ,page: true
  111. ,done:function (data) {
  112. $('#ali_pay_sum').val(data.sum.ali_pay_sum);
  113. $('#on_account_sum').val(data.sum.on_account_sum);
  114. $('#EP_sum').val(data.sum.EP_sum);
  115. $('#Safe_sum').val(data.sum.Safe_sum);
  116. $('#rece_sum').val(data.sum.rece_sum);
  117. $('#cost_sum').val(data.sum.cost_sum);
  118. }
  119. });
  120. //环检下拉
  121. $.ajax({
  122. url:"/chargingStandard/getSelect",
  123. type:'POST',
  124. data:{"project":"环检"},
  125. success:function (res) {
  126. var data = res;
  127. $.each(data,function (index,item) {
  128. $('#detectionSelect').append('<option value="'+item.carType+'">'+item.carType+'</option>');
  129. });
  130. form.render('select', 'detectionSelect');
  131. }
  132. });
  133. //安检下拉
  134. $.ajax({
  135. url:"/chargingStandard/getSelect",
  136. type:'POST',
  137. data:{"project":"安检"},
  138. success:function (res) {
  139. var data = res;
  140. $.each(data,function (index,item) {
  141. $('#carTypeSelect').append('<option value="'+item.carType+'">'+item.carType+'</option>');
  142. });
  143. form.render('select', 'carTypeSelect');
  144. }
  145. });
  146. //客户下拉
  147. $.ajax({
  148. url:"/customer/getCustomer",
  149. type:'GET',
  150. // data:{"project":"安检"},
  151. success:function (res) {
  152. var data = res;
  153. $.each(data,function (index,item) {
  154. if (index===0){
  155. $('#customerSelect').append('<option value="">'+item.name+'</option>');
  156. }else {
  157. $('#customerSelect').append('<option value="'+item.name+'">'+item.name+'</option>');
  158. }
  159. });
  160. form.render('select', 'customerSelect');
  161. }
  162. });
  163. var active = {
  164. reload: function(){
  165. var date = $('#test-laydate-range-date');
  166. var ep = $('#detectionSelect');
  167. var car = $('#carTypeSelect');
  168. var customer = $('#customerSelect');
  169. //执行重载
  170. table.reload('test-table-totalRow', {
  171. where: {
  172. 'EP_type': ep.val(),
  173. 'car_type': car.val(),
  174. 'customer': customer.val(),
  175. 'date': date.val()
  176. },page: {
  177. curr: 1 //重新从第 1 页开始
  178. }
  179. });
  180. }
  181. };
  182. $('.test-table-reload-btn .layui-btn').on('click', function(){
  183. var type = $(this).data('type');
  184. active[type] ? active[type].call(this) : '';
  185. });
  186. laydate.render({
  187. elem: '#test-laydate-range-date',
  188. type:'year'
  189. });
  190. });
  191. </script>
  192. </html>