material.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236
  1. <!DOCTYPE html>
  2. <html lang="en" xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>材料费用</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  9. <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" media="all">
  10. <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
  11. <style>
  12. body{overflow-y: scroll;} /* 禁止刷新后出现横向滚动条 */
  13. </style>
  14. </head>
  15. <body>
  16. <div class="layuimini-container">
  17. <div class="layuimini-main">
  18. <fieldset class="table-search-fieldset">
  19. <legend>搜索信息(<b>收起-展开</b>)</legend>
  20. <div id="search-div" style="margin: 5px 10px -10px 0px">
  21. <form class="layui-form" action="" lay-filter="search-form">
  22. <div class="layui-form-item">
  23. <div class="layui-inline">
  24. <label class="layui-form-label" style="width: 30px">项目名称</label>
  25. <div class="layui-input-inline" style="width: 220px">
  26. <input type="text" id="XMMC" name="XMMC" autocomplete="off" class="layui-input">
  27. </div>
  28. </div>
  29. <div class="layui-inline">
  30. <label class="layui-form-label" style="width: 60px; margin-left: -10px">材料名称</label>
  31. <div class="layui-input-inline" style="width: 150px">
  32. <input type="text" id="CLMC" name="CLMC" class="layui-input" autocomplete="off" />
  33. </div>
  34. </div>
  35. <div class="layui-inline">
  36. <label class="layui-form-label" style="width: 60px; margin-left: -10px">物料编码</label>
  37. <div class="layui-input-inline" style="width: 150px">
  38. <input type="text" id="WLBM" name="WLBM" class="layui-input" autocomplete="off" />
  39. </div>
  40. </div>
  41. <div class="layui-inline">
  42. <label class="layui-form-label" style="width: 60px; margin-left: -10px">备注</label>
  43. <div class="layui-input-inline" style="width: 150px">
  44. <input type="text" id="BZ" name="BZ" class="layui-input" autocomplete="off" />
  45. </div>
  46. </div>
  47. <div class="layui-inline">
  48. <label class="layui-form-label" style="width: 60px; margin-left: -10px">创建日期</label>
  49. <div class="layui-input-inline" style="width: 100px;">
  50. <input type="text" name="QSRQ" id="QSRQ" placeholder="开始日期" class="layui-input" readonly>
  51. </div>
  52. <div class="layui-form-mid">-</div>
  53. <div class="layui-input-inline" style="width: 100px;">
  54. <input type="text" name="JZRQ" id="JZRQ" placeholder="结束日期" class="layui-input" readonly>
  55. </div>
  56. </div>
  57. <!-- <div class="layui-inline">-->
  58. <!-- <label class="layui-form-label" style="width: 45px; margin-left: -10px">已审批</label>-->
  59. <!-- <div class="layui-input-inline" style="width: 80px">-->
  60. <!-- <select name="YSP" id="YSP" lay-filter="status">-->
  61. <!-- <option value="">全部</option>-->
  62. <!-- <option th:each="item:${approvedList}" th:text="${item.name}"-->
  63. <!-- th:value="${item.code}"></option>-->
  64. <!-- </select>-->
  65. <!-- </div>-->
  66. <!-- </div>-->
  67. <div class="layui-inline">
  68. <button type="submit" id="btn_search" class="layui-btn" lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索 </button>
  69. <button type="submit" class="layui-btn layui-btn-primary" lay-submit lay-filter="data-reset-btn"><i class="layui-icon layui-icon-refresh"></i> 重 置 </button>
  70. </div>
  71. </div>
  72. </form>
  73. </div>
  74. </fieldset>
  75. <script type="text/html" id="toolbarDemo">
  76. </script>
  77. <input type="hidden" id="userId" name="userId" class="layui-input" th:value="${userId}">
  78. <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
  79. <script type="text/html" id="currentTableBar">
  80. <a class="layui-btn layui-btn-xs data-count-edit" lay-event="edit" th:if="${editRight}">
  81. <i class="layui-icon layui-icon-edit" style="font-size: 10px;"></i>编辑
  82. </a>
  83. <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete" th:if="${delRight}">
  84. <i class="layui-icon layui-icon-delete" style="font-size: 10px;"></i>删除
  85. </a>
  86. </script>
  87. </div>
  88. </div>
  89. <script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" charset="utf-8"></script>
  90. <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
  91. <script th:src="@{/lib/coco-message/coco-message.js}" charset="utf-8"></script>
  92. <script th:src="@{/js/lay-config.js}" charset="utf-8"></script>
  93. <script th:src="@{/lib/xm-select-v1.2.2/xm-select.js}" charset="utf-8"></script>
  94. <script th:inline="javascript" type="text/javascript">
  95. AjaxUtil.ctx = /*[[@{/}]]*/'';
  96. var updateflag = 0;
  97. var xmApproval = {};
  98. layui.use(['form', 'table'], function () {
  99. var form = layui.form,
  100. table = layui.table,
  101. laydate = layui.laydate;
  102. var userId = $("#userId").val();
  103. //日期
  104. laydate.render({
  105. elem: '#SQRQStart'
  106. });
  107. laydate.render({
  108. elem: '#SQRQEnd'
  109. });
  110. laydate.render({
  111. elem: '#QSRQ'
  112. });
  113. laydate.render({
  114. elem: '#JZRQ'
  115. });
  116. var currTable = table.render({
  117. elem: '#currentTableId',
  118. url: AjaxUtil.ctx + 'staMaterial/searchData',
  119. method: 'post',
  120. toolbar: '#toolbarDemo',
  121. defaultToolbar: ['filter', 'exports', 'print'],
  122. cols: [
  123. [
  124. {type: "checkbox", fixed: 'left'},
  125. {type: 'numbers', align: 'center'},
  126. {field: 'BM', width: '7%', title: '项目部门'},
  127. {field: 'XMBH', width: '7%', title: '项目编号'},
  128. {field: 'XMMC', width: '15%', title: '项目名称', sort: true},
  129. {field: 'XMLXMC', width: '10%', title: '项目类型'},
  130. {field: 'CLMC', width: '10%', title: '材料名称'},
  131. {field: 'WLBM', width: '9%', title: '物料编码'},
  132. {field: 'CGDJ', width: '15%', title: '采购单价'},
  133. {field: 'BHSJE', width: '10%', title: '不含税金额(元)'},
  134. {field: 'HSJE', width: '10%', title: '含税金额(元)'},
  135. {field: 'SFBYJ', width: '10%', title: '是否备用金'},
  136. {field: 'BZJEBHS', width: '15%', title: '备注'},
  137. {field: 'SQSJ', width: '10%', title: '申请时间'},
  138. {field: 'ID', width: '0', title: 'id', hide: true}
  139. ]
  140. ],
  141. autoSort: false,
  142. limits: [10, 15, 20, 25, 50, 100],
  143. limit: 10,
  144. page: true,
  145. skin: 'grid',
  146. parseData: function (res) { //res 即为原始返回的数据
  147. return {
  148. "code": res.code, //解析接口状态
  149. "msg": res.message, //解析提示文本
  150. "count": res.data.total, //解析数据长度
  151. "data": res.data.rows //解析数据列表
  152. };
  153. }
  154. });
  155. // 监听搜索操作
  156. form.on('submit(data-search-btn)', function (data) {
  157. //起止日期格式判断
  158. var qsrq = document.getElementById('QSRQ').value;
  159. var jsrq = document.getElementById('JSRQ').value;
  160. var sd=new Date(qsrq);
  161. var ed=new Date(jsrq);
  162. if(sd>ed)
  163. {
  164. Message.warning("起始日期必须小于结束日期", 1500);
  165. return ;
  166. }
  167. // 执行搜索重载
  168. currTable.reload({
  169. page: {
  170. curr: 1 // 页码从1开始
  171. },
  172. where: form.val("search-form")
  173. });
  174. return false;
  175. });
  176. // 监听重置操作
  177. form.on('submit(data-reset-btn)', function (data) {
  178. form.val("search-form", {
  179. "XMMC": '',
  180. "CLMC": '',
  181. 'WLBM': '',
  182. 'BZ': '',
  183. 'QSRQ': '',
  184. 'JZRQ': ''
  185. });
  186. // 执行搜索重载
  187. currTable.reload({
  188. page: {
  189. curr: 1
  190. },
  191. where: form.val("search-form")
  192. });
  193. return false;
  194. });
  195. // 监听排序事件
  196. table.on('sort(currentTableFilter)', function (obj) {
  197. currTable.reload({
  198. initSort: obj,
  199. where: {
  200. sortName: toLine(obj.field), //排序字段
  201. sortOrder: toLine(obj.type) //排序方式
  202. }
  203. });
  204. });
  205. var cancelIndex;
  206. /**
  207. * toolbar监听事件
  208. */
  209. });
  210. function setUpdateFlag() {
  211. updateflag = 1;
  212. }
  213. function getXmApproval() {
  214. return xmApproval;
  215. }
  216. </script>
  217. </body>
  218. </html>