electric_fee_edit.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257
  1. <!DOCTYPE HTML>
  2. <html xmlns:th="http://www.thymeleaf.org"
  3. xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
  4. layout:decorate="~{admin/common/common}">
  5. <head>
  6. <title>电费编辑</title>
  7. <style>
  8. .line {
  9. display: block;
  10. text-align: left;
  11. background-color: #fff;
  12. color: #333;
  13. border-bottom: 1px solid #0a6999;
  14. border-color: #fff;
  15. border-bottom: 1px solid #0a6999;
  16. margin-top: 10px;
  17. vertical-align: middle;
  18. padding: 4px 12px;
  19. height: 31px;
  20. line-height: 31px;
  21. font-size: 14px;
  22. font-weight: bold;
  23. }
  24. .input-text {
  25. width: 110PX;
  26. }
  27. </style>
  28. </head>
  29. <body layout:fragment="content">
  30. <article class="page-container">
  31. <form class="form form-horizontal" id="form-electricWater-edit">
  32. <div class="line">基本信息</div>
  33. <div class="row cl">
  34. <label class="form-label col-xs-4 col-sm-2">客户名称:</label>
  35. <div class="formControls col-xs-8 col-sm-9">
  36. <span th:text="${companyName}"></span>
  37. </div>
  38. </div>
  39. <div class="row cl">
  40. <label class="form-label col-xs-4 col-sm-2">合同编号:</label>
  41. <div class="formControls col-xs-8 col-sm-9">
  42. <span th:each="contractNo,iterStat:${contractNoes}">
  43. [[*{contractNo}]] <span th:if="${iterStat.last}"></span><span th:unless="${iterStat.last}">,</span>
  44. </span>
  45. </div>
  46. </div>
  47. <div id="electricFee">
  48. <div class="line">电费信息</div>
  49. <input type="hidden" th:value="${electricFee.id}" th:name="id">
  50. <div class="row cl">
  51. <div class="formControls col-xs-8 col-sm-12">
  52. <div class="btn ">抄表信息</div>
  53. <table id="electricReadTb" class="table table-border table-bordered table-bg table-hover">
  54. <thead class="text-c">
  55. <tr class="text-c">
  56. <th>电表名称</th>
  57. <th>上期抄表日</th>
  58. <th>本期抄表日</th>
  59. <th>倍率</th>
  60. <th>本期通用(度)</th>
  61. <th>本期峰值(度)</th>
  62. <th>本期平值(度)</th>
  63. <th>本期谷值(度)</th>
  64. <th>本期通用(元/度)</th>
  65. <th>本期峰值(元/度)</th>
  66. <th>本期平值(元/度)</th>
  67. <th>本期谷值(元/度)</th>
  68. <th>小计金额(元)</th>
  69. </tr>
  70. </thead>
  71. <tbody>
  72. <tr class="text-c electric_read_company" th:each="electric,iterStat:${electricReadCompanies}"
  73. th:object="${electric}">
  74. <td th:text="*{electric_name}"></td>
  75. <td th:text="*{meter_write_before}"></td>
  76. <td th:text="*{meter_write}"></td>
  77. <td class="ratio" th:attr="is_peak=*{is_peak}" th:text="*{ratio}"></td>
  78. <td><span class="electric_count" th:unless="*{is_peak}" th:text="*{electric_count}"></span></td>
  79. <td><span class="electric_peak_count" th:if="*{is_peak}" th:text="*{electric_peak_count}"></span></td>
  80. <td><span class="electric_flat_count" th:if="*{is_peak}" th:text="*{electric_flat_count}"></span></td>
  81. <td><span class="electric_valley_count" th:if="*{is_peak}" th:text="*{electric_valley_count}"></span></td>
  82. <td>
  83. <input type="hidden" th:value="*{id}"
  84. th:name="'electricReadCompanies['+${iterStat.index}+'].id'"/>
  85. <input th:unless="*{is_peak}" type="text" required number="true" min="0"
  86. max="999.9999" th:value="*{electric_price}" class="input-text electric_price"
  87. th:onchange="'isfloat4Fn(this);initElectricTotalFee('+${iterStat.index}+');'"
  88. th:name="'electricReadCompanies['+${iterStat.index}+'].electric_price'"/></td>
  89. <td>
  90. <input th:if="*{is_peak}" type="text" required number="true" min="0" max="999.9999"
  91. th:value="*{electric_peak_price}" class="input-text electric_peak_price"
  92. th:onchange="'isfloat4Fn(this);initElectricTotalFee('+${iterStat.index}+');'"
  93. th:name="'electricReadCompanies['+${iterStat.index}+'].electric_peak_price'"/>
  94. </td>
  95. <td>
  96. <input th:if="*{is_peak}" type="text" required number="true" min="0" max="999.9999"
  97. th:value="*{electric_flat_price}" class="input-text electric_flat_price"
  98. th:onchange="'isfloat4Fn(this);initElectricTotalFee('+${iterStat.index}+');'"
  99. th:name="'electricReadCompanies['+${iterStat.index}+'].electric_flat_price'"/>
  100. </td>
  101. <td>
  102. <input th:if="*{is_peak}" type="text" required number="true" min="0" max="999.9999"
  103. th:value="*{electric_valley_price}" class="input-text electric_valley_price"
  104. th:onchange="'isfloat4Fn(this);initElectricTotalFee('+${iterStat.index}+');'"
  105. th:name="'electricReadCompanies['+${iterStat.index}+'].electric_valley_price'"/>
  106. </td>
  107. <td>
  108. <input type="text" th:value="*{total_fee}" class="input-text total_fee readonly"
  109. readonly
  110. th:name="'electricReadCompanies['+${iterStat.index}+'].total_fee'"/>
  111. </td>
  112. </tr>
  113. <tr class="text-c">
  114. <td scope="col" colspan="9">线损费用(元)</td>
  115. <td colspan="3">
  116. 线损率: <input onchange="isfloat4Fn(this);initElectricTotalFee()" type="text"
  117. th:value="*{electricFee.wire_loss}" class="input-text wire_loss"
  118. th:name="wire_loss"/>%
  119. </td>
  120. <td>
  121. <input onchange="isfloat4Fn(this);initElectricTotalFee()" type="text"
  122. th:value="*{electricFee.total_wire_loss}"
  123. class="input-text readonly total_wire_loss"
  124. readonly th:name="total_wire_loss"/>
  125. </td>
  126. </tr>
  127. <tr class="text-c">
  128. <td scope="col" colspan="12">基本电费(元)</td>
  129. <td>
  130. <input onchange="isfloat4Fn(this);initElectricTotalFee()" type="text"
  131. th:value="*{electricFee.base_electric}" class="input-text base_electric"
  132. th:name="base_electric "/>
  133. </td>
  134. </tr>
  135. <tr class="text-c">
  136. <td scope="col" colspan="12">电力设备租金(元)</td>
  137. <td>
  138. <input onchange="isfloat4Fn(this);initElectricTotalFee()" type="text"
  139. th:value="*{electricFee.electric_rent}" class="input-text electric_rent"
  140. th:name="electric_rent"/>
  141. </td>
  142. </tr>
  143. <tr class="text-c">
  144. <td scope="col" colspan="12">其他费用(元)</td>
  145. <td>
  146. <input onchange="isfloat4Fn(this);initElectricTotalFee()" type="text"
  147. class="input-text other_fee" required number="true" min="0" max="999.9999"
  148. th:value="${electricFee.other_fee}" th:name="other_fee"/>
  149. </td>
  150. </tr>
  151. <tr class="text-c">
  152. <td scope="col" colspan="9">合计</td>
  153. <td colspan="3">用电量 <span th:text="${electricFee.use_electric}"></span></td>
  154. <td>
  155. <input onchange="isfloat4Fn(this);initElectricTotalFee()" type="text"
  156. class="input-text readonly electric_fee" readonly
  157. th:value="${electricFee.electric_fee}" th:name="electric_fee"/>
  158. </td>
  159. </tr>
  160. </tbody>
  161. </table>
  162. </div>
  163. </div>
  164. </div>
  165. <div class="row cl">
  166. <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>是否已缴费:</label>
  167. <div class="formControls col-xs-8 col-sm-3">
  168. <span class="select-box">
  169. <select class="select" th:name="status" id="status">
  170. <option value="0" th:selected="${electricFee.status}=='0'">未缴费</option>
  171. <option value="2" th:selected="${electricFee.status}=='2'">已缴费</option>
  172. </select>
  173. </span>
  174. </div>
  175. </div>
  176. <div class="row cl" id="manageRow">
  177. <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
  178. <button class="btn btn-primary radius" type="submit"><i class="Hui-iconfont">&#xe632;</i>保存</button>
  179. <button onClick="removeIframe();" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
  180. </div>
  181. </div>
  182. </form>
  183. </article>
  184. <script type="text/javascript" th:src="@{/js/build/electric/electric_fee_edit.js}"></script>
  185. <script th:inline="javascript">
  186. /**
  187. * 取消
  188. */
  189. function removeIframe() {
  190. var index = parent.layer.getFrameIndex(window.name);
  191. parent.layer.close(index);
  192. }
  193. function isfloat4Fn(obj) {
  194. var val = $(obj).val();
  195. if (/^\d+(\.\d{1,4})?$/.test(String(val)) == false) {
  196. errorMessage("小数点后最多4位小数");
  197. $(obj).val(0);
  198. }
  199. }
  200. function initElectricTotalFee(obj) {
  201. var all_fee = 0;
  202. var other_fee = $(".other_fee").val();
  203. var total_wire_loss = $(".total_wire_loss").val();
  204. var base_electric = $(".base_electric").val();
  205. var electric_rent = $(".electric_rent").val();
  206. $(".electric_read_company").each(function (index, item) {
  207. if (index == obj && obj != null && $.trim(obj) != '') {
  208. var fee = 0;
  209. if ($(item).find(".ratio").attr("is_peak") == 'true') {
  210. var flatFee = parseFloat($(item).find(".electric_flat_price").val()) * parseFloat($(item).find(".electric_flat_count").text());
  211. var peakFee = parseFloat($(item).find(".electric_peak_price").val()) * parseFloat($(item).find(".electric_peak_count").text());
  212. var valleyFee = parseFloat($(item).find(".electric_valley_price").val()) * parseFloat($(item).find(".electric_valley_count").text());
  213. fee = accAdd(accAdd(flatFee , peakFee) , valleyFee) ;
  214. } else {
  215. var electricFee = parseFloat($(item).find(".electric_price").val()) * parseFloat($(item).find(".electric_count").text());
  216. fee = electricFee ;
  217. }
  218. $(item).find(".total_fee").val(fee);
  219. }
  220. if ($(item).find(".total_fee").val()) {
  221. all_fee = accAdd(parseFloat($(item).find(".total_fee").val()),all_fee);
  222. }
  223. else {
  224. all_fee += 0;
  225. }
  226. });
  227. var wire_loss = $(".wire_loss").val();
  228. if (wire_loss != null && $.trim(wire_loss) != '') {
  229. total_wire_loss=parseFloat(wire_loss) * all_fee/100;
  230. $(".total_wire_loss").val(total_wire_loss);
  231. }
  232. if (other_fee) {
  233. all_fee = accAdd(parseFloat(other_fee),all_fee);
  234. }
  235. if (total_wire_loss) {
  236. all_fee = accAdd(parseFloat(total_wire_loss),all_fee);
  237. }
  238. if (electric_rent) {
  239. all_fee = accAdd(parseFloat(electric_rent),all_fee);
  240. }
  241. if (base_electric) {
  242. all_fee = accAdd(parseFloat(base_electric),all_fee);
  243. }
  244. $(".electric_fee").val(all_fee);
  245. }
  246. </script>
  247. </body>
  248. </html>