view_annualbudget.html 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  6. <title>查看</title>
  7. <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" media="all">
  8. <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
  9. <link rel="stylesheet" th:href="@{/lib/font-awesome-4.7.0/css/font-awesome.min.css}" media="all">
  10. <style>
  11. body {
  12. background-color: #ffffff;
  13. }
  14. </style>
  15. </head>
  16. <body>
  17. <form class="layui-form" action="" lay-filter="formDemo">
  18. <div class="layui-tab layui-tab-card">
  19. <ul class="layui-tab-title">
  20. <li class="layui-this">常规</li>
  21. <li>预算</li>
  22. </ul>
  23. <div class="layui-tab-content">
  24. <!--常规开始-->
  25. <div class="layui-tab-item layui-show" style="min-height: 550px; margin-bottom: 5px">
  26. <form class="layui-form" action="" lay-filter="formDemo">
  27. <div class="layui-form layuimini-form">
  28. <div class="layui-form-item layui-inline" style="width: 100%">
  29. <label class="layui-form-label" style="width: 70px">名称</label>
  30. <div class="layui-input-inline" style="width: 855px">
  31. <input type="hidden" id="id" name="id" class="layui-input"
  32. th:value="${annualbudget.id}">
  33. <input type="text" id="mc" name="mc" class="layui-input" th:value="${annualbudget.mc}"
  34. readonly>
  35. </div>
  36. </div>
  37. <div class="layui-form-item layui-inline" style="width: 100%">
  38. <label class="layui-form-label" style="width: 70px">任务书</label>
  39. <div class="layui-input-inline" style="width: 855px">
  40. <input type="hidden" id="rws" name="rws" class="layui-input"
  41. th:value="${annualbudget.rws}">
  42. <input type="text" id="rwsmc" name="rwsmc" class="layui-input"
  43. th:value="${annualbudget.rwsmc}" readonly>
  44. </div>
  45. </div>
  46. <div class="layui-form-item layui-inline" style="width: 100%">
  47. <label class="layui-form-label" style="width: 70px">项目执行期</label>
  48. <div class="layui-input-inline" style="width: 855px">
  49. <input type="text" id="xmzxq" name="xmzxq" class="layui-input" autocomplete="off"
  50. th:value="${annualbudget.xmzxq}" readonly>
  51. </div>
  52. </div>
  53. <div class="layui-form-item layui-inline" style="width: 100%">
  54. <label class="layui-form-label required" style="width: 70px">年份</label>
  55. <div class="layui-input-inline" style="width: 855px">
  56. <input type="number" id="nf" name="nf" value="2023" lay-verify="required"
  57. lay-reqtext="年份不能为空" class="layui-input" autocomplete="off"
  58. th:value="${annualbudget.nf}" readonly>
  59. </div>
  60. </div>
  61. <div class="layui-form-item layui-inline" style="width: 100%">
  62. <label class="layui-form-label" style="width: 70px">说明</label>
  63. <div class="layui-input-inline" style="width: 855px">
  64. <textarea id="sm" name="sm" class="layui-textarea" style="width: 100%;height: 150px"
  65. th:text="${annualbudget.sm}" readonly></textarea>
  66. </div>
  67. </div>
  68. <div class="layui-form-item layui-inline" style="width: 100%">
  69. <label class="layui-form-label" style="width: 70px">申请人</label>
  70. <div class="layui-input-inline" style="width: 380px">
  71. <input type="text" name="sqrxm" class="layui-input" th:value="${annualbudget.sqrxm}"
  72. readonly>
  73. </div>
  74. <label class="layui-form-label" style="width: 65px">申请时间</label>
  75. <div class="layui-input-inline" style="width: 370px">
  76. <input type="text" id="sqsj" name="sqsj" class="layui-input"
  77. th:value="${annualbudget.sqsj}" readonly>
  78. </div>
  79. </div>
  80. <!-- <div class="layui-form-item layui-inline" style="width: 100%">-->
  81. <!-- <label class="layui-form-label" style="width: 70px">审批状态</label>-->
  82. <!-- <div class="layui-input-inline" style="width: 855px">-->
  83. <!-- <input type="text" id="spzt" name="spzt" class="layui-input" value="未提交" readonly>-->
  84. <!-- </div>-->
  85. <!-- </div>-->
  86. <div class="layui-form-item layui-inline" style="width: 100%">
  87. <label class="layui-form-label" style="width: 70px">可研报告</label>
  88. <div class="layui-input-inline" style="width: 855px">
  89. <input type="text" id="xmmc" name="xmmc" class="layui-input"
  90. th:value="${annualbudget.xmmc}" readonly>
  91. </div>
  92. </div>
  93. <div class="layui-form-item layui-inline" style="width: 100%">
  94. <label class="layui-form-label" style="width: 70px">ERP编号</label>
  95. <div class="layui-input-inline" style="width: 380px">
  96. <input type="text" id="erpbh" name="erpbh" class="layui-input"
  97. th:value="${annualbudget.erpbh}" readonly>
  98. </div>
  99. <label class="layui-form-label" style="width: 65px">项目类型</label>
  100. <div class="layui-input-inline" style="width: 370px">
  101. <input type="text" id="xmlxmc" name="xmlxmc" class="layui-input"
  102. th:value="${annualbudget.xmlxmc}" readonly>
  103. </div>
  104. </div>
  105. <div class="layui-form-item layui-inline" style="width: 100%">
  106. <label class="layui-form-label" style="width: 90px">电科院负责人</label>
  107. <div class="layui-input-inline" style="width: 370px">
  108. <input type="text" id="xmfzrxm" name="xmfzrxm" class="layui-input"
  109. th:value="${annualbudget.xmfzrxm}" readonly>
  110. </div>
  111. <label class="layui-form-label" style="width: 65px">所属部门</label>
  112. <div class="layui-input-inline" style="width: 370px">
  113. <input type="text" id="ssbmmc" name="ssbmmc" class="layui-input"
  114. th:value="${annualbudget.ssbmmc}" readonly>
  115. </div>
  116. </div>
  117. <!-- 右侧悬浮按钮 -->
  118. <div class="right-bottom-btn" style="margin-bottom: 5px">
  119. <button class="layui-btn" lay-filter="viewRwsBtn">
  120. <i class="layui-icon layui-icon-file"></i>查看任务书
  121. </button>
  122. <button class="layui-btn" lay-filter="cancleBtn">
  123. <i class="layui-icon layui-icon-close"></i>关闭
  124. </button>
  125. </div>
  126. </div>
  127. </form>
  128. </div>
  129. <!--常规结束-->
  130. <!--预算开始-->
  131. <div class="layui-tab-item" style="min-height: 550px; padding-left: 25px; padding-right: 25px">
  132. <form class="layui-form" action="" lay-filter="formDemo">
  133. <div class="layui-form layuimini-form">
  134. <div class="layui-form-item" style="margin-bottom: -10px">
  135. <div class="layui-inline">
  136. <label class="layui-form-label "
  137. style="width: fit-content; margin-bottom: -10px">单位:万元</label>
  138. <label class="layui-form-label" style="width: 100px"></label>
  139. </div>
  140. <div class="layui-inline">
  141. <label class="layui-form-label"
  142. style="width: 120px; margin-left: -10px">[[${ysmc}]]</label>
  143. <div class="layui-input-inline" style="width: 100px">
  144. <input type="text" id="rwsys" name="rwsys" class="layui-input" th:value="${rwsys}"
  145. readonly>
  146. </div>
  147. </div>
  148. <div class="layui-inline">
  149. <label class="layui-form-label" style="width: 60px; margin-left: -15px">年度经费</label>
  150. <div class="layui-input-inline" style="width: 100px">
  151. <input type="text" id="ndczje" name="ndczje" class="layui-input"
  152. th:value="${ndczje}" readonly>
  153. </div>
  154. </div>
  155. <div class="layui-inline">
  156. <label class="layui-form-label" style="width: 70px; margin-left: -15px">年度备用金</label>
  157. <div class="layui-input-inline" style="width: 100px; margin-right: -15px">
  158. <input type="number" id="ndbyj" name="ndbyj" class="layui-input" readonly>
  159. </div>
  160. </div>
  161. </div>
  162. <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
  163. <!-- 右侧悬浮按钮 -->
  164. <div class="right-bottom-btn" style="margin-bottom: 5px">
  165. <button class="layui-btn" lay-filter="viewRwsBtn">
  166. <i class="layui-icon layui-icon-file"></i>查看任务书
  167. </button>
  168. <button class="layui-btn" lay-filter="cancleBtn">
  169. <i class="layui-icon layui-icon-close"></i>关闭
  170. </button>
  171. </div>
  172. </div>
  173. </form>
  174. </div>
  175. <!--预算结束-->
  176. </div>
  177. </div>
  178. </form>
  179. <script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" charset="utf-8"></script>
  180. <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
  181. <script th:src="@{/lib/coco-message/coco-message.js}" charset="utf-8"></script>
  182. <script th:src="@{/lib/xm-select-v1.2.2/xm-select.js}" charset="utf-8"></script>
  183. <script th:src="@{/js/lay-config.js}" charset="utf-8"></script>
  184. <script type="text/javascript" th:inline="javascript">
  185. AjaxUtil.ctx = /*[[@{/}]]*/'';
  186. layui.use(['form', 'treeTable', 'layCascader', 'tableSelect', 'laydate'], function () {
  187. var form = layui.form,
  188. layer = layui.layer,
  189. treeTable = layui.treeTable,
  190. laydate = layui.laydate;
  191. var rwsId = $("#rws").val(),
  192. ysId = $("#id").val();
  193. var zjfy = 0;
  194. // 监听查看任务书按钮
  195. $("button[lay-filter='viewRwsBtn']").click(function () {
  196. parent.layer.open({
  197. title: '查看项目任务书',
  198. type: 2,
  199. shade: 0.3,
  200. // maxmin: true,
  201. shadeClose: true,
  202. area: ['1100px', '750px'],
  203. content: AjaxUtil.ctx + 'prjProject/forView/' + rwsId,
  204. end: function (index) {
  205. layer.close(index);
  206. }
  207. });
  208. return false;
  209. });
  210. //预算
  211. var dataBudget = new Array();
  212. $.ajax({
  213. url: AjaxUtil.ctx + 'prjAnnualbudgetdetail/list/' + ysId,
  214. type: "post",
  215. async: false,
  216. dataType: "json",
  217. success: function (result) {
  218. dataBudget = result;
  219. for (let i = 0; i < dataBudget.length; i++) {
  220. if (dataBudget[i].fymc.indexOf('总计') > -1) {
  221. zjfy = i;
  222. }
  223. }
  224. $("#ndbyj").val(dataBudget[zjfy].byj);
  225. $("#rwsys").val(dataBudget[zjfy].xmzys);
  226. }
  227. });
  228. //经费预算
  229. var dataBudget1 = new Array();
  230. $.ajax({
  231. url: AjaxUtil.ctx + 'prjAnnualbudget/list/' + ysId,
  232. type: "post",
  233. async: false,
  234. dataType: "json",
  235. success: function (result) {
  236. dataBudget1 = result;
  237. }
  238. });
  239. console.log(dataBudget1);
  240. let fjArray = []
  241. fjArray = Array.from(dataBudget1,({fj}) => fj)
  242. console.log('fjArray'+fjArray);
  243. for (var j = 0; j < dataBudget1.length; j++){
  244. if (!fjArray.includes(dataBudget1[j].bm)) {
  245. setFjBudget(dataBudget1[j].fj);
  246. }
  247. }
  248. treeTable.render({
  249. elem: '#currentTableId',
  250. data: dataBudget1,
  251. skin: 'grid',
  252. tree: {
  253. treeColIndex: 1,
  254. treeSpid: "", //最上级的父级id
  255. iconIndex: 1, // 折叠图标显示在第几列
  256. isPidData: true,// 是否是id、pid形式数据
  257. idName: 'bm', // id字段名称
  258. pidName: 'fj', // pid字段名称
  259. arrowType: 'arrow2',
  260. getIcon: 'ew-tree-icon-style2',
  261. openName: 'bm'
  262. },
  263. treeDefaultClose: false,
  264. page: false,
  265. // toolbar: '#toolbarDemo',
  266. cols: [
  267. [
  268. {type: 'numbers', width: '3%'},
  269. {field: 'fymc', width: '30%', title: '费用名称'},
  270. {field: 'xmzys', width: '12%', title: '项目总预算'},
  271. {field: 'xtjsyzx', width: '15%', title: '系统计算已执行'},
  272. {field: 'sjyzx', width: '12%', title: '实际已执行'},
  273. {field: 'ysje', width: '10%', title: '预算金额'},
  274. {field: 'xmz', width: '9%', title: '项目组'},
  275. {field: "byj", width: '9%', title: '备用金'}
  276. // {field: 'ysqje', width: '11%', title: '已申请金额'},
  277. // {field: 'ybzje', width: '11%', title: '已报账金额'},
  278. // {field: 'byjysq', width: '11%', title: '备用金已申请'},
  279. // {field: 'byjybz', width: '11%', title: '备用金已报账'}
  280. ]
  281. ],
  282. done: function () {
  283. }
  284. });
  285. // 监听取消按钮
  286. $("button[lay-filter='cancleBtn']").click(function () {
  287. var iframeIndex = parent.layer.getFrameIndex(window.name);
  288. parent.layer.close(iframeIndex);
  289. });
  290. //父级预算
  291. function setFjBudget(fj) {
  292. if (fj != null && fj != '') {
  293. var xmzys = 0, xmz = 0, byj = 0, xtjsyzx = 0, sjyzx = 0;
  294. //子节点的值相加
  295. for (var j = 0; j < dataBudget1.length; j++) {
  296. if (fj == dataBudget1[j].fj) {
  297. // var t = parseFloat(dataBudget[j].xmzys);
  298. // if (!isNaN(t))
  299. // xmzys += t;
  300. var t1 = parseFloat(dataBudget1[j].xmz);
  301. if (!isNaN(t1))
  302. xmz += t1;
  303. var t2 = parseFloat(dataBudget1[j].byj);
  304. if (!isNaN(t2))
  305. byj += t2;
  306. var t3 = parseFloat(dataBudget1[j].xtjsyzx);
  307. if (!isNaN(t3))
  308. xtjsyzx += t3;
  309. var t4 = parseFloat(dataBudget1[j].sjyzx);
  310. if (!isNaN(t4))
  311. sjyzx += t4;
  312. }
  313. }
  314. console.log(sjyzx);
  315. //更新父节点的值
  316. for (var j = 0; j < dataBudget1.length; j++) {
  317. if (fj == dataBudget1[j].bm) {
  318. // if (xmzys == 0)
  319. // dataBudget[j].xmzys = '';
  320. // else
  321. // dataBudget[j].xmzys = xmzys.toFixed(2);
  322. if (xmz == 0)
  323. dataBudget1[j].xmz = '';
  324. else
  325. dataBudget1[j].xmz = xmz.toFixed(2);
  326. if (xtjsyzx == 0)
  327. dataBudget1[j].xtjsyzx = '';
  328. else
  329. dataBudget1[j].xtjsyzx = xtjsyzx.toFixed(2);
  330. if (sjyzx == 0)
  331. dataBudget1[j].sjyzx = '';
  332. else
  333. dataBudget1[j].sjyzx = sjyzx.toFixed(2);
  334. // if (byj > 0)
  335. // dataBudget[j].byj = byj.toFixed(2);
  336. // else if(dataBudget[j].fj != '')
  337. // dataBudget[j].byj = '';
  338. // console.log(dataBudget[j].fj);
  339. // console.log(dataBudget[j].byj);
  340. var ysje = xmz + byj;
  341. if (ysje == 0)
  342. dataBudget1[j].ysje = "";
  343. else
  344. dataBudget1[j].ysje = ysje.toFixed(2);
  345. setFjBudget(dataBudget1[j].fj);
  346. break;
  347. }
  348. }
  349. }
  350. }
  351. });
  352. </script>
  353. </body>
  354. </html>