index4GY18Y.ejs 60 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375
  1. <link href="/public/css/bootstrap/bootstrap-colorpicker.min.css" rel="stylesheet">
  2. <style>
  3. ::-webkit-scrollbar {
  4. width: 3px;
  5. height: 3px;
  6. }
  7. /* 滚动条有滑块的轨道部分 */
  8. ::-webkit-scrollbar-track-piece {
  9. background-color: transparent;
  10. border-radius: 5px;
  11. }
  12. /* 滚动条滑块(竖向:vertical 横向:horizontal) */
  13. ::-webkit-scrollbar-thumb {
  14. cursor: pointer;
  15. background-color:#2C3034;
  16. border-radius: 5px;
  17. }
  18. /* 滚动条滑块hover */
  19. ::-webkit-scrollbar-thumb:hover {
  20. background-color: #999999;
  21. }
  22. /* 同时有垂直和水平滚动条时交汇的部分 */
  23. ::-webkit-scrollbar-corner {
  24. display: block; /* 修复交汇时出现的白块 */
  25. }
  26. </style>
  27. <div class="panel-content" style="background:#2c3237 !important">
  28. <div class="panel-title fluid border-top-0" style="background:#2c3237 !important">
  29. <div class="title-main d-flex justify-content-between">
  30. <div class="d-inline-block mr-2">
  31. <div class="btn-group" id="first-category">
  32. <button type="button" class="btn btn-sm btn-outline-dark text-white dropdown-toggle" data-cid="" data-value="" data-toggle="dropdown">全部</button>
  33. <div class="dropdown-menu" aria-labelledby="zhankai">
  34. <a class="dropdown-item select-cate" data-value="" href="javascript:void(0);">全部</a>
  35. <% if (categoryData.length > 0 && categoryData[0].value.length > 0) { %>
  36. <% for (const c of categoryData[0].value) { %>
  37. <a class="dropdown-item select-cate" data-cid="<%- c.cid %>" data-value="<%- c.id %>" href="javascript:void(0);"><%- c.value %></a>
  38. <% } %>
  39. <% } %>
  40. </div>
  41. </div>
  42. <% if (categoryData[1] && categoryData[1].value.length > 0) { %>
  43. <div class="btn-group" id="second-category" style="display: none">
  44. <button type="button" class="btn btn-sm btn-outline-dark text-white dropdown-toggle" data-cid="" data-value="" data-toggle="dropdown">全部</button>
  45. <div class="dropdown-menu" aria-labelledby="zhankai">
  46. <a class="dropdown-item select-cate" data-value="" href="javascript:void(0);">全部</a>
  47. <% for (const c of categoryData[1].value) { %>
  48. <a class="dropdown-item select-cate" data-cid="<%- c.cid %>" data-value="<%- c.id %>" href="javascript:void(0);"><%- c.value %></a>
  49. <% } %>
  50. </div>
  51. </div>
  52. <% } %>
  53. </div>
  54. <div>
  55. <a href="javascript:void(0)" title="全屏显示" id="showFull" class="text-white"><i class="fa fa-arrows-alt"></i></a>
  56. <div class="btn-group">
  57. <button type="button" class="btn btn-sm btn-outline-dark text-white dropdown-toggle" data-toggle="dropdown" id="zhankai">决策大屏<span>6</span></button>
  58. <div class="dropdown-menu" aria-labelledby="zhankai">
  59. <% for (const i of projectData.data_collect_pages) { %>
  60. <a class="dropdown-item" href="/datacollect/index/<%- i %>">决策大屏<%- i %></a>
  61. <% } %>
  62. </div>
  63. </div>
  64. </div>
  65. </div>
  66. </div>
  67. <div class="content-wrap" id="big-data">
  68. <div style="height: 30px;background-color: #2c3237; display: none" id="exitfull-div">
  69. <div class="title-main d-flex">
  70. <div class="ml-auto">
  71. <div class="dropdown d-flex float-left mt-1 mr-2">
  72. <button id="exitFull" class="btn btn-sm btn-secondary ml-auto">退出全屏</button>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. <div class="c-body" style="background:#2c3237 !important">
  78. <div class="flex-content">
  79. <div class="row mx-3" style="height: 63.5vh">
  80. <div class="col-4 px-0 pb-1 height-100">
  81. <div class="height-100 pr-1">
  82. <div class="center-chart pb-1">
  83. <div class="card height-100 bg-dark">
  84. <div class="gcsrmx_chart" style="height: 100%; width: 100%;"></div>
  85. </div>
  86. </div>
  87. <div class="center-chart pt-1">
  88. <div class="card height-100 bg-dark">
  89. <div class="gccb" style="height: 100%; width: 100%;">
  90. <h6 class="bg-dark text-center text-white m-0 py-3">工程成本管理汇总</h6>
  91. <div class="tablebox" style="overflow: auto;">
  92. <table>
  93. <thead>
  94. <tr style="text-align: center">
  95. <th></th>
  96. <th>已完成</th>
  97. <th>应支付</th>
  98. <th>已支付</th>
  99. <th>待支付</th>
  100. </tr>
  101. </thead>
  102. <tbody class="stage-data">
  103. </tbody>
  104. </table>
  105. </div>
  106. </div>
  107. </div>
  108. </div>
  109. </div>
  110. </div>
  111. <div class="col-4 px-0 pb-1 height-100">
  112. <div class="height-100 px-1">
  113. <div class="center-chart pb-1">
  114. <div class="card height-100 bg-dark">
  115. <div class="gcsrqk_chart" style="height: 100%; width: 100%;"></div>
  116. </div>
  117. </div>
  118. <div class="center-chart pt-1 text-center text-white">
  119. <div class="height-100 row">
  120. <div class="col-6 pr-1">
  121. <div class="center-chart pb-1">
  122. <div class="card height-100 bg-dark">
  123. <div class="height-100" style="display: grid;place-items: center;">
  124. <div style="line-height: 3;">
  125. <div style="font-size: 1.2rem" class="gcsr_price"></div>
  126. <div style="font-size: .9rem;">
  127. <span style="background-color: #42474c;border-radius: 1rem;padding: .25rem .75rem">工程收入</span>
  128. </div>
  129. </div>
  130. </div>
  131. </div>
  132. </div>
  133. <div class="center-chart pt-1">
  134. <div class="card height-100 bg-dark">
  135. <div class="height-100" style="display: grid;place-items: center;">
  136. <div style="line-height: 3;">
  137. <div style="font-size: 1.2rem" class="gclr_price"></div>
  138. <div style="font-size: .9rem;">
  139. <span style="background-color: #42474c;border-radius: 1rem;padding: .25rem .75rem">工程利润</span>
  140. </div>
  141. </div>
  142. </div>
  143. </div>
  144. </div>
  145. </div>
  146. <div class="col-6 pl-1">
  147. <div class="center-chart pb-1">
  148. <div class="card height-100 bg-dark">
  149. <div class="height-100" style="display: grid;place-items: center;">
  150. <div style="line-height: 3;">
  151. <div style="font-size: 1.2rem" class="gccb_price"></div>
  152. <div style="font-size: .9rem;">
  153. <span style="background-color: #42474c;border-radius: 1rem;padding: .25rem .75rem">工程成本</span>
  154. </div>
  155. </div>
  156. </div>
  157. </div>
  158. </div>
  159. <div class="center-chart pt-1">
  160. <div class="card height-100 bg-dark">
  161. <div class="height-100" style="display: grid;place-items: center;">
  162. <div style="line-height: 3;">
  163. <div style="font-size: 1.2rem" class="gclrl_num"></div>
  164. <div style="font-size: .9rem;">
  165. <span style="background-color: #42474c;border-radius: 1rem;padding: .25rem .75rem">工程利润率</span>
  166. </div>
  167. </div>
  168. </div>
  169. </div>
  170. </div>
  171. </div>
  172. </div>
  173. </div>
  174. </div>
  175. </div>
  176. <div class="col-4 px-0 pb-1 height-100">
  177. <div class="height-100 pl-1">
  178. <div class="center-chart pb-1">
  179. <div class="card height-100 bg-dark">
  180. <div class="yingsf_chart" style="height: 100%; width: 100%;"></div>
  181. </div>
  182. </div>
  183. <div class="center-chart pt-1">
  184. <div class="card height-100 bg-dark">
  185. <div class="yisf_chart" style="height: 100%; width: 100%;"></div>
  186. </div>
  187. </div>
  188. </div>
  189. </div>
  190. </div>
  191. <div class="row mx-3" style="height: 32vh">
  192. <div class="col-3 px-0 pt-1 height-100">
  193. <div class="height-100" style="padding-right: .375rem !important;">
  194. <% if (dpCategory.length > 0 && dpCategory[0]) { %>
  195. <div class="card bg-dark height-100">
  196. <div class="dpgl_chart" style="height: 100%; width: 100%;"></div>
  197. </div>
  198. <% } %>
  199. </div>
  200. </div>
  201. <div class="col-3 px-0 pt-1 height-100">
  202. <div class="height-100 pr-1" style="padding-left: .125rem !important;">
  203. <% if (dpCategory.length > 1 && dpCategory[1]) { %>
  204. <div class="card bg-dark height-100">
  205. <div class="dpgl_chart" style="height: 100%; width: 100%;"></div>
  206. </div>
  207. <% } %>
  208. </div>
  209. </div>
  210. <div class="col-3 px-0 pt-1 height-100">
  211. <div class="height-100 pl-1" style="padding-right: .125rem !important;">
  212. <% if (dpCategory.length > 2 && dpCategory[2]) { %>
  213. <div class="card bg-dark height-100">
  214. <div class="dpgl_chart" style="height: 100%; width: 100%;"></div>
  215. </div>
  216. <% } %>
  217. </div>
  218. </div>
  219. <div class="col-3 px-0 pt-1 height-100">
  220. <div class="height-100" style="padding-left: .375rem !important;">
  221. <% if (dpCategory.length > 3 && dpCategory[3]) { %>
  222. <div class="card bg-dark height-100">
  223. <div class="dpgl_chart" style="height: 100%; width: 100%;"></div>
  224. </div>
  225. <% } %>
  226. </div>
  227. </div>
  228. </div>
  229. </div>
  230. </div>
  231. </div>
  232. </div>
  233. <!--<script src="/public/js/datacollect_scroll.js"></script>-->
  234. <script type="text/javascript"> autoFlashHeight();</script>
  235. <script type="text/javascript">
  236. const category = JSON.parse(unescape('<%- escape(JSON.stringify(categoryData)) %>'));
  237. const daping06Set = JSON.parse(unescape('<%- escape(JSON.stringify(daping06Set)) %>'));
  238. const dpCategory = JSON.parse(unescape('<%- escape(JSON.stringify(dpCategory)) %>'));
  239. const gcsrmx_option = {
  240. title: {
  241. text: '工程收入明细',
  242. left: 'center',
  243. top:'5%'
  244. },
  245. color: ['rgba(0, 157, 255,1)','rgba(34,228,255,1)',
  246. 'rgba(59,255,208,1)','rgba(108, 78, 229,0.7)',
  247. 'rgba(58,207,221,0.7)','rgba(164, 229, 78,0.7)',
  248. 'rgba(199, 78, 229,0.7)', 'rgba(229, 92, 174, 0.7)',
  249. 'rgba(229, 214, 78, 0.7)', 'rgba(241, 87, 96, 0.7)',
  250. 'rgba(242, 179, 82, 0.7)'],
  251. backgroundColor: '#343a40 ',
  252. tooltip: {
  253. trigger: 'axis',
  254. axisPointer: { // 坐标轴指示器,坐标轴触发有效
  255. type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
  256. },
  257. },
  258. dataZoom: [
  259. {
  260. brushSelect:false,
  261. // zoomLock: false,
  262. type: 'slider',
  263. show: true,
  264. realtime: true,
  265. showdetail: false,
  266. showDataShadow: false,
  267. // dataZoomIndex: 10,
  268. start: 0,
  269. end: 8,
  270. handleSize: 0,
  271. height: 10,
  272. bottom: '10%',
  273. },
  274. ],
  275. legend: {
  276. data: ['已完成', '应收入', '已收入'],
  277. top:'17%'
  278. },
  279. grid: {
  280. top:'25%',
  281. left: '3%',
  282. right: '4%',
  283. bottom: '15%',
  284. containLabel: true
  285. },
  286. xAxis: [
  287. {
  288. type: 'category',
  289. data: [],
  290. axisLabel: {
  291. show: true,
  292. interval: 0,
  293. textStyle: {
  294. color: "#fff",
  295. fontSize: 12
  296. },
  297. formatter: function(value) {
  298. var res = value;
  299. if(res.length > 6) {
  300. res = res.substring(0, 5) + "..";
  301. }
  302. return res;
  303. },
  304. rich: {
  305. ellipsis: {
  306. width: 100, // 控制显示宽度
  307. overflow: 'break',
  308. }
  309. }
  310. }
  311. }
  312. ],
  313. yAxis: [
  314. {
  315. type: 'value',
  316. name:'金额',
  317. position: 'left',
  318. axisLabel : {
  319. formatter: function (value, index) {
  320. if (value < 0) {
  321. let newValue = Math.abs(value);
  322. if (newValue >= 10000 && newValue < 10000000) {
  323. newValue = newValue / 10000 + "万";
  324. } else if (newValue >= 10000000) {
  325. newValue = newValue / 10000000 + "千万";
  326. }
  327. value = '-' + newValue;
  328. }
  329. if (value >= 10000 && value < 10000000) {
  330. value = value / 10000 + "万";
  331. } else if (value >= 10000000) {
  332. value = value / 10000000 + "千万";
  333. }
  334. return value;
  335. }
  336. },
  337. splitArea : {show : true}
  338. },
  339. ],
  340. series: [
  341. {
  342. name: '已完成',
  343. type: 'bar',
  344. emphasis: {
  345. focus: 'series'
  346. },
  347. data: []
  348. },
  349. {
  350. name: '应收入',
  351. type: 'bar',
  352. emphasis: {
  353. focus: 'series'
  354. },
  355. data: []
  356. },
  357. {
  358. name: '已收入',
  359. type: 'bar',
  360. emphasis: {
  361. focus: 'series'
  362. },
  363. data: []
  364. }
  365. ]
  366. };
  367. const gcsrmx_chart = document.getElementsByClassName('gcsrmx_chart');
  368. const gcsrmxChart = echarts.init(gcsrmx_chart[0], 'dark');
  369. gcsrmxChart.setOption(gcsrmx_option);
  370. const gcsrqk_option = {
  371. title: {
  372. text: '工程收入情况',
  373. left: 'center',
  374. top:'5%'
  375. },
  376. color: ['rgba(0, 157, 255, 1)','rgba(78, 139, 229,1)',
  377. 'rgba(78, 229, 139,0.7)','rgba(108, 78, 229,0.7)',
  378. 'rgba(58,207,221,0.7)','rgba(164, 229, 78,0.7)',
  379. 'rgba(199, 78, 229,0.7)', 'rgba(229, 92, 174, 0.7)',
  380. 'rgba(229, 214, 78, 0.7)', 'rgba(241, 87, 96, 0.7)',
  381. 'rgba(242, 179, 82, 0.7)'],
  382. backgroundColor: '#343a40',
  383. tooltip: {
  384. trigger: 'axis',
  385. axisPointer: { // Use axis to trigger tooltip
  386. type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
  387. }
  388. },
  389. grid: {
  390. left: '10%',
  391. right: '10%',
  392. bottom: '3%',
  393. containLabel: true
  394. },
  395. xAxis: {
  396. type: 'value',
  397. name:'金额',
  398. position: 'bottom',
  399. axisLabel : {
  400. formatter: function (value, index) {
  401. if (value < 0) {
  402. let newValue = Math.abs(value);
  403. if (newValue >= 10000 && newValue < 10000000) {
  404. newValue = newValue / 10000 + "万";
  405. } else if (newValue >= 10000000) {
  406. newValue = newValue / 10000000 + "千万";
  407. }
  408. value = '-' + newValue;
  409. }
  410. if (value >= 10000 && value < 10000000) {
  411. value = value / 10000 + "万";
  412. } else if (value >= 10000000) {
  413. value = value / 10000000 + "千万";
  414. }
  415. return value;
  416. }
  417. },
  418. splitArea : {show : true}
  419. },
  420. yAxis: {
  421. type: 'category',
  422. data: ['待收入', '已收入', '应收入', '已完成', '合同'],
  423. axisLabel: {
  424. show: true,
  425. interval: 0,
  426. formatter: function(value) {
  427. var res = value;
  428. if(res.length > 10) {
  429. res = res.substring(0, 10) + "..";
  430. }
  431. return res;
  432. }
  433. },
  434. margin: 10,
  435. },
  436. // dataZoom: [
  437. // {
  438. // brushSelect:false,
  439. // start: 0,
  440. // end: 10,
  441. // type: 'slider',
  442. // show: true,
  443. // handleSize: 0,
  444. // realtime: true,
  445. // showDetail: false,
  446. // // filterMode: 'empty',
  447. // yAxisIndex: [0,1],
  448. // width: 10,
  449. // height: '80%',
  450. // right: '5%',
  451. // bottom:'2%'
  452. // },
  453. // ],
  454. series: [
  455. {
  456. name: '情况',
  457. type: 'bar',
  458. stack: 'total',
  459. label: {
  460. show: true,
  461. // position: 'insideLeft',
  462. align: 'left'
  463. },
  464. emphasis: {
  465. focus: 'series'
  466. },
  467. data: [],
  468. }
  469. ]
  470. };
  471. const gcsrqk_chart = document.getElementsByClassName('gcsrqk_chart');
  472. const gcsrqkChart = echarts.init(gcsrqk_chart[0], 'dark');
  473. gcsrqkChart.setOption(gcsrqk_option);
  474. const yingsf_option = {
  475. title: {
  476. text: '应收与应付对比',
  477. left: 'center',
  478. top:'5%'
  479. },
  480. color: ['rgba(0, 157, 255,1)','rgba(34,228,255,1)',
  481. 'rgba(78, 229, 139,0.7)','rgba(108, 78, 229,0.7)',
  482. 'rgba(58,207,221,0.7)','rgba(164, 229, 78,0.7)',
  483. 'rgba(199, 78, 229,0.7)', 'rgba(229, 92, 174, 0.7)',
  484. 'rgba(229, 214, 78, 0.7)', 'rgba(241, 87, 96, 0.7)',
  485. 'rgba(242, 179, 82, 0.7)'],
  486. backgroundColor: '#343a40 ',
  487. tooltip: {
  488. trigger: 'axis',
  489. axisPointer: {
  490. type: 'cross',
  491. label: {
  492. backgroundColor: '#6a7985'
  493. }
  494. }
  495. },
  496. legend: {
  497. data: ['工程应收', '工程应付'],
  498. top:'15%'
  499. },
  500. grid: {
  501. top:'25%',
  502. left: '3%',
  503. right: '4%',
  504. bottom: '15%',
  505. containLabel: true
  506. },
  507. xAxis: [
  508. {
  509. type: 'category',
  510. boundaryGap: false,
  511. data: []
  512. }
  513. ],
  514. yAxis: [
  515. {
  516. type: 'value',
  517. axisLabel : {
  518. formatter: function (value, index) {
  519. if (value < 0) {
  520. let newValue = Math.abs(value);
  521. if (newValue >= 10000 && newValue < 10000000) {
  522. newValue = newValue / 10000 + "万";
  523. } else if (newValue >= 10000000) {
  524. newValue = newValue / 10000000 + "千万";
  525. }
  526. value = '-' + newValue;
  527. }
  528. if (value >= 10000 && value < 10000000) {
  529. value = value / 10000 + "万";
  530. } else if (value >= 10000000) {
  531. value = value / 10000000 + "千万";
  532. }
  533. return value;
  534. }
  535. },
  536. }
  537. ],
  538. dataZoom: [
  539. {
  540. brushSelect: false,
  541. showdetail: false,
  542. show: true,
  543. realtime: true,
  544. dataZoomIndex: 10,
  545. start: 0,
  546. end: 8,
  547. handleSize: 0,
  548. height: 10,
  549. bottom: '10%'
  550. },
  551. ],
  552. series: [
  553. {
  554. name: '工程应收',
  555. type: 'line',
  556. // stack: '总量',
  557. // areaStyle: {},
  558. emphasis: {
  559. focus: 'series'
  560. },
  561. data: []
  562. },
  563. {
  564. name: '工程应付',
  565. type: 'line',
  566. // stack: '总量',
  567. // areaStyle: {},
  568. emphasis: {
  569. focus: 'series'
  570. },
  571. data: []
  572. }
  573. ]
  574. };
  575. const yingsf_chart = document.getElementsByClassName('yingsf_chart');
  576. const yingsfChart = echarts.init(yingsf_chart[0], 'dark');
  577. yingsfChart.setOption(yingsf_option);
  578. const yisf_option = {
  579. title: {
  580. text: '已收与已付对比',
  581. left: 'center',
  582. top:'5%'
  583. },
  584. color: ['rgba(0, 157, 255,1)','rgba(34,228,255,1)',
  585. 'rgba(78, 229, 139,0.7)','rgba(108, 78, 229,0.7)',
  586. 'rgba(58,207,221,0.7)','rgba(164, 229, 78,0.7)',
  587. 'rgba(199, 78, 229,0.7)', 'rgba(229, 92, 174, 0.7)',
  588. 'rgba(229, 214, 78, 0.7)', 'rgba(241, 87, 96, 0.7)',
  589. 'rgba(242, 179, 82, 0.7)'],
  590. backgroundColor: '#343a40 ',
  591. tooltip: {
  592. trigger: 'axis',
  593. axisPointer: {
  594. type: 'cross',
  595. label: {
  596. backgroundColor: '#6a7985'
  597. }
  598. }
  599. },
  600. legend: {
  601. data: ['工程已收', '工程已付'],
  602. top:'15%'
  603. },
  604. grid: {
  605. top:'25%',
  606. left: '3%',
  607. right: '4%',
  608. bottom: '15%',
  609. containLabel: true
  610. },
  611. xAxis: [
  612. {
  613. type: 'category',
  614. boundaryGap: false,
  615. data: []
  616. }
  617. ],
  618. yAxis: [
  619. {
  620. type: 'value',
  621. axisLabel : {
  622. formatter: function (value, index) {
  623. if (value < 0) {
  624. let newValue = Math.abs(value);
  625. if (newValue >= 10000 && newValue < 10000000) {
  626. newValue = newValue / 10000 + "万";
  627. } else if (newValue >= 10000000) {
  628. newValue = newValue / 10000000 + "千万";
  629. }
  630. value = '-' + newValue;
  631. }
  632. if (value >= 10000 && value < 10000000) {
  633. value = value / 10000 + "万";
  634. } else if (value >= 10000000) {
  635. value = value / 10000000 + "千万";
  636. }
  637. return value;
  638. }
  639. },
  640. }
  641. ],
  642. dataZoom: [
  643. {
  644. brushSelect: false,
  645. showdetail: false,
  646. show: true,
  647. realtime: true,
  648. dataZoomIndex: 10,
  649. start: 0,
  650. end: 8,
  651. handleSize: 0,
  652. height: 10,
  653. bottom: '10%'
  654. },
  655. ],
  656. series: [
  657. {
  658. name: '工程已收',
  659. type: 'line',
  660. // stack: '总量',
  661. // areaStyle: {},
  662. emphasis: {
  663. focus: 'series'
  664. },
  665. data: []
  666. },
  667. {
  668. name: '工程已付',
  669. type: 'line',
  670. // stack: '总量',
  671. // areaStyle: {},
  672. emphasis: {
  673. focus: 'series'
  674. },
  675. data: []
  676. }
  677. ]
  678. };
  679. const yisf_chart = document.getElementsByClassName('yisf_chart');
  680. const yisfChart = echarts.init(yisf_chart[0], 'dark');
  681. yisfChart.setOption(yisf_option);
  682. const dpglChartOption = {
  683. title: {
  684. text: '管理',
  685. left: 'center',
  686. top:'5%'
  687. },
  688. color: ['rgba(0, 157, 255,1)','rgba(34,228,255,1)',
  689. 'rgba(78, 229, 139,0.7)','rgba(108, 78, 229,0.7)',
  690. 'rgba(58,207,221,0.7)','rgba(164, 229, 78,0.7)',
  691. 'rgba(199, 78, 229,0.7)', 'rgba(229, 92, 174, 0.7)',
  692. 'rgba(229, 214, 78, 0.7)', 'rgba(241, 87, 96, 0.7)',
  693. 'rgba(242, 179, 82, 0.7)'],
  694. backgroundColor: '#343a40 ',
  695. tooltip: {
  696. trigger: 'axis',
  697. axisPointer: { // 坐标轴指示器,坐标轴触发有效
  698. type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
  699. },
  700. },
  701. dataZoom: [
  702. {
  703. brushSelect:false,
  704. // zoomLock: false,
  705. type: 'slider',
  706. show: true,
  707. realtime: true,
  708. showdetail: false,
  709. showDataShadow: false,
  710. // dataZoomIndex: 10,
  711. start: 0,
  712. end: 8,
  713. handleSize: 0,
  714. height: 10,
  715. bottom: '10%',
  716. },
  717. ],
  718. legend: {
  719. data: ['已完成', '已支付'],
  720. top:'17%'
  721. },
  722. grid: {
  723. top:'25%',
  724. left: '3%',
  725. right: '4%',
  726. bottom: '15%',
  727. containLabel: true
  728. },
  729. xAxis: [
  730. {
  731. type: 'category',
  732. data: [],
  733. axisLabel: {
  734. show: true,
  735. interval: 0,
  736. textStyle: {
  737. color: "#fff",
  738. fontSize: 12
  739. },
  740. formatter: function(value) {
  741. var res = value;
  742. if(res.length > 6) {
  743. res = res.substring(0, 5) + "..";
  744. }
  745. return res;
  746. },
  747. rich: {
  748. ellipsis: {
  749. width: 100, // 控制显示宽度
  750. overflow: 'break',
  751. }
  752. }
  753. }
  754. }
  755. ],
  756. yAxis: [
  757. {
  758. type: 'value',
  759. name:'金额',
  760. position: 'left',
  761. axisLabel : {
  762. formatter: function (value, index) {
  763. if (value < 0) {
  764. let newValue = Math.abs(value);
  765. if (newValue >= 10000 && newValue < 10000000) {
  766. newValue = newValue / 10000 + "万";
  767. } else if (newValue >= 10000000) {
  768. newValue = newValue / 10000000 + "千万";
  769. }
  770. value = '-' + newValue;
  771. }
  772. if (value >= 10000 && value < 10000000) {
  773. value = value / 10000 + "万";
  774. } else if (value >= 10000000) {
  775. value = value / 10000000 + "千万";
  776. }
  777. return value;
  778. }
  779. },
  780. splitArea : {show : true}
  781. },
  782. ],
  783. series: [
  784. {
  785. name: '已完成',
  786. type: 'bar',
  787. emphasis: {
  788. focus: 'series'
  789. },
  790. data: []
  791. },
  792. {
  793. name: '已支付',
  794. type: 'bar',
  795. stack: '计量',
  796. emphasis: {
  797. focus: 'series'
  798. },
  799. data: []
  800. }
  801. ]
  802. };
  803. const dpgl_chart = document.getElementsByClassName('dpgl_chart');
  804. const dpgl_charts = [];
  805. for (const d in dpCategory) {
  806. dpgl_charts[d] = echarts.init(dpgl_chart[d], 'dark');
  807. const option = _.cloneDeep(dpglChartOption);
  808. option.title.text = dpCategory[d].value;
  809. dpgl_charts[d].setOption(option);
  810. }
  811. let tenders = '';
  812. $(function () {
  813. $('#showFull').click(function () {
  814. const full=document.getElementById("big-data");
  815. launchIntoFullscreen(full);
  816. });
  817. $('#exitFull').click(function () {
  818. exitFullscreen();
  819. })
  820. // 数据全屏
  821. function launchIntoFullscreen(element) {
  822. if(element.requestFullscreen){
  823. element.requestFullscreen();
  824. }
  825. else if(element.mozRequestFullScreen) {
  826. element.mozRequestFullScreen();
  827. }
  828. else if(element.webkitRequestFullscreen) {
  829. element.webkitRequestFullscreen();
  830. }
  831. else if(element.msRequestFullscreen) {
  832. element.msRequestFullscreen();
  833. }
  834. }
  835. function exitFullscreen() {
  836. if(document.exitFullscreen) {
  837. document.exitFullscreen();
  838. } else if(document.mozCancelFullScreen) {
  839. document.mozCancelFullScreen();
  840. } else if(document.webkitExitFullscreen) {
  841. document.webkitExitFullscreen();
  842. }
  843. }
  844. document.addEventListener("fullscreenchange", function (event) {
  845. if (document.fullscreenElement) {
  846. $('#exitfull-div').show();
  847. $('#showFull').hide();
  848. } else {
  849. $('#exitfull-div').hide();
  850. $('#showFull').show();
  851. }
  852. });
  853. postData('/datacollect/load', {}, function (result) {
  854. tenders = result.tenderList;
  855. if (category && category.length > 0) {
  856. if (category[0] && category[0].value.length > 0) {
  857. for (const [i, fc] of category[0].value.entries()) {
  858. const fcCategory = {cid: fc.cid, value: fc.id};
  859. if (_.findIndex(tenders, function (item) {
  860. return _.findIndex(item.category, fcCategory) !== -1;
  861. }) === -1) {
  862. $('#first-category .select-cate').eq(i + 1).hide();
  863. } else {
  864. $('#first-category .select-cate').eq(i + 1).show();
  865. }
  866. }
  867. }
  868. }
  869. for (const t of tenders) {
  870. calculateTender(t);
  871. }
  872. console.log(tenders);
  873. setData(tenders);
  874. });
  875. function calculateTender(tender) {
  876. if (tender.stage_tp) {
  877. tender.gather_tp = ZhCalc.sum([tender.stage_tp.contract_tp, tender.stage_tp.qc_tp, tender.stage_tp.pc_tp]);
  878. tender.end_contract_tp = ZhCalc.sum([tender.stage_tp.pre_contract_tp, tender.stage_tp.contract_tp, tender.stage_tp.contract_pc_tp]);
  879. tender.end_qc_tp = ZhCalc.sum([tender.stage_tp.pre_qc_tp, tender.stage_tp.qc_tp, tender.stage_tp.qc_pc_tp]);
  880. tender.end_gather_tp = ZhCalc.add(tender.end_contract_tp, tender.end_qc_tp);
  881. tender.pre_gather_tp = ZhCalc.add(tender.stage_tp.pre_contract_tp, tender.stage_tp.pre_qc_tp);
  882. tender.yf_tp = ZhCalc.add(tender.stage_tp.yf_tp);
  883. tender.end_yf_tp = ZhCalc.add(tender.stage_tp.pre_yf_tp, tender.yf_tp);
  884. tender.sf_tp = ZhCalc.add(tender.stage_tp.sf_tp);
  885. tender.end_sf_tp = ZhCalc.add(tender.stage_tp.pre_sf_tp, tender.sf_tp);
  886. }
  887. }
  888. function setData(tenderList, categoryIndex = 0) {
  889. let gcsr_price = 0;
  890. let gccb_price = 0;
  891. let gclr_price = 0;
  892. let gclrl_num = 0;
  893. // 区分工程收入和工程成本
  894. const sr_tenders = _.filter(tenderList, function (item) {
  895. return _.findIndex(item.category, {cid: daping06Set.sr, value: daping06Set.sr_value}) !== -1;
  896. });
  897. const cb_tenders = _.filter(tenderList, function (item) {
  898. return _.findIndex(item.category, {cid: daping06Set.cb, value: daping06Set.cb_value}) !== -1;
  899. });
  900. const sr_chart_option_data = {
  901. contract_price: 0,
  902. end_gather_tp: 0,
  903. end_yf_tp: 0,
  904. end_sf_tp: 0,
  905. end_ds_tp: 0,
  906. };
  907. const srmx_chart_option_name = [];
  908. const srmx_chart_option_data = {
  909. end_gather_tp: [],
  910. end_yf_tp:[],
  911. end_sf_tp:[],
  912. };
  913. const yingsf_option_data = [];
  914. const yisf_option_data = [];
  915. for (const sr of sr_tenders) {
  916. sr_chart_option_data.contract_price = ZhCalc.add(sr_chart_option_data.contract_price, sr.contract_price);
  917. sr_chart_option_data.end_gather_tp = ZhCalc.add(sr_chart_option_data.end_gather_tp, sr.end_gather_tp);
  918. sr_chart_option_data.end_yf_tp = ZhCalc.add(sr_chart_option_data.end_yf_tp, sr.end_yf_tp);
  919. sr_chart_option_data.end_sf_tp = ZhCalc.add(sr_chart_option_data.end_sf_tp, sr.end_sf_tp);
  920. srmx_chart_option_name.push(sr.name);
  921. srmx_chart_option_data.end_gather_tp.push(sr.end_gather_tp ? sr.end_gather_tp : 0);
  922. srmx_chart_option_data.end_yf_tp.push(sr.end_yf_tp ? sr.end_yf_tp : 0);
  923. srmx_chart_option_data.end_sf_tp.push(sr.end_sf_tp ? sr.end_sf_tp : 0);
  924. for (const s of sr.month_stage) {
  925. const index = _.findIndex(yingsf_option_data, { yearmonth: s.yearmonth });
  926. const yiIndex = _.findIndex(yisf_option_data, { yearmonth: s.yearmonth });
  927. if (index === -1) {
  928. yingsf_option_data.push({
  929. yearmonth: s.yearmonth,
  930. ys_tp: s.end_yf_tp,
  931. yf_tp: 0,
  932. had_ys: true,
  933. had_yf: false,
  934. });
  935. } else {
  936. yingsf_option_data[index].had_ys = true;
  937. yingsf_option_data[index].ys_tp = ZhCalc.add(yingsf_option_data[index].ys_tp, s.end_yf_tp);
  938. }
  939. if (yiIndex === -1) {
  940. yisf_option_data.push({
  941. yearmonth: s.yearmonth,
  942. ys_tp: s.end_sf_tp,
  943. yf_tp: 0,
  944. had_ys: true,
  945. had_yf: false,
  946. });
  947. } else {
  948. yisf_option_data[yiIndex].had_ys = true;
  949. yisf_option_data[yiIndex].ys_tp = ZhCalc.add(yisf_option_data[yiIndex].ys_tp, s.end_sf_tp);
  950. }
  951. }
  952. }
  953. sr_chart_option_data.end_ds_tp = ZhCalc.sub(sr_chart_option_data.end_yf_tp, sr_chart_option_data.end_sf_tp);
  954. // 工程收入明细
  955. const gcsrmx_chart_option = gcsrmxChart.getOption();
  956. gcsrmx_chart_option.dataZoom[0].start = 0;
  957. gcsrmx_chart_option.dataZoom[0].end = computedPosition(sr_tenders.length);
  958. gcsrmx_chart_option.xAxis[0].data = srmx_chart_option_name;
  959. gcsrmx_chart_option.series[0].data = srmx_chart_option_data.end_gather_tp;
  960. gcsrmx_chart_option.series[1].data = srmx_chart_option_data.end_yf_tp;
  961. gcsrmx_chart_option.series[2].data = srmx_chart_option_data.end_sf_tp;
  962. if (sr_tenders.length >= 8) {
  963. gcsrmx_chart_option.dataZoom[0].show = true;
  964. } else {
  965. gcsrmx_chart_option.dataZoom[0].show = false;
  966. }
  967. gcsrmxChart.setOption(gcsrmx_chart_option);
  968. // 工程收入情况
  969. const gcsrqk_chart_option = gcsrqkChart.getOption();
  970. // gcsrqk_chart_option.dataZoom[0].start = 0;
  971. // gcsrqk_chart_option.dataZoom[0].end = computedPosition(sr_tenders.length);
  972. gcsrqk_chart_option.series[0].data = [sr_chart_option_data.end_ds_tp, sr_chart_option_data.end_sf_tp, sr_chart_option_data.end_yf_tp, sr_chart_option_data.end_gather_tp, sr_chart_option_data.contract_price];
  973. // if (sr_tenders.length >= 8) {
  974. // gcsrqk_chart_option.dataZoom[0].show = true;
  975. // } else {
  976. // gcsrqk_chart_option.dataZoom[0].show = false;
  977. // }
  978. gcsrqkChart.setOption(gcsrqk_chart_option);
  979. const cb_chart_option_data = {
  980. // end_contract_tp: 0,
  981. end_gather_tp: 0,
  982. end_yf_tp: 0,
  983. end_sf_tp: 0,
  984. end_ds_tp: 0,
  985. };
  986. const cb_chart_option_name = [];
  987. for (const cb of cb_tenders) {
  988. cb_chart_option_name.push(cb.name);
  989. // cb_chart_option_data.end_contract_tp = ZhCalc.add(cb_chart_option_data.end_contract_tp, cb.end_contract_tp);
  990. cb_chart_option_data.end_gather_tp = ZhCalc.add(cb_chart_option_data.end_gather_tp, cb.end_gather_tp);
  991. cb_chart_option_data.end_yf_tp = ZhCalc.add(cb_chart_option_data.end_yf_tp, cb.end_yf_tp);
  992. cb_chart_option_data.end_sf_tp = ZhCalc.add(cb_chart_option_data.end_sf_tp, cb.end_sf_tp);
  993. for (const s of cb.month_stage) {
  994. const index = _.findIndex(yingsf_option_data, { yearmonth: s.yearmonth });
  995. const yiIndex = _.findIndex(yisf_option_data, { yearmonth: s.yearmonth });
  996. if (index === -1) {
  997. yingsf_option_data.push({
  998. yearmonth: s.yearmonth,
  999. ys_tp: 0,
  1000. yf_tp: s.end_yf_tp,
  1001. had_ys: false,
  1002. had_yf: true,
  1003. });
  1004. } else {
  1005. yingsf_option_data[index].had_yf = true;
  1006. yingsf_option_data[index].yf_tp = ZhCalc.add(yingsf_option_data[index].yf_tp, s.end_yf_tp);
  1007. }
  1008. if (yiIndex === -1) {
  1009. yisf_option_data.push({
  1010. yearmonth: s.yearmonth,
  1011. ys_tp: 0,
  1012. yf_tp: s.end_sf_tp,
  1013. had_ys: false,
  1014. had_yf: true,
  1015. });
  1016. } else {
  1017. yisf_option_data[index].had_yf = true;
  1018. yisf_option_data[yiIndex].yf_tp = ZhCalc.add(yisf_option_data[yiIndex].yf_tp, s.end_sf_tp);
  1019. }
  1020. }
  1021. }
  1022. cb_chart_option_data.end_ds_tp = ZhCalc.sub(cb_chart_option_data.end_yf_tp, cb_chart_option_data.end_sf_tp);
  1023. // 中间表格数值
  1024. gcsr_price = sr_chart_option_data.end_yf_tp;
  1025. $('.gcsr_price').text(formatNum(gcsr_price, '#,##0.######'));
  1026. gccb_price = cb_chart_option_data.end_yf_tp;
  1027. $('.gccb_price').text(formatNum(gccb_price, '#,##0.######'));
  1028. gclr_price = ZhCalc.sub(gcsr_price, gccb_price);
  1029. $('.gclr_price').text(formatNum(gclr_price, '#,##0.######'));
  1030. gclrl_num = ZhCalc.round(ZhCalc.div(gclr_price, gccb_price)*100, 2);
  1031. $('.gclrl_num').text((gclrl_num ? gclrl_num : 0) + '%');
  1032. // 应收应付及已收已付
  1033. const show_yingsf_option_data = {
  1034. yearmonth: [],
  1035. yf_tp: [],
  1036. ys_tp: [],
  1037. };
  1038. if (yingsf_option_data.length > 0) {
  1039. // chart_option4_data 排序
  1040. const new_yingsf_option_data = _.sortBy(yingsf_option_data, 'yearmonth');
  1041. for (const c4 of new_yingsf_option_data) {
  1042. show_yingsf_option_data.yearmonth.push(c4.yearmonth);
  1043. const hadYsDatas = _.filter(new_yingsf_option_data, function (item) {
  1044. return item.yearmonth < c4.yearmonth;
  1045. });
  1046. // 找出最近的一个had_ys为true值
  1047. if (hadYsDatas.length > 0) {
  1048. c4.ys_tp = ZhCalc.add(hadYsDatas[hadYsDatas.length - 1].ys_tp, c4.ys_tp);
  1049. }
  1050. // if (!c4.had_ys) {
  1051. // const hadYsDatas = _.filter(new_yingsf_option_data, function (item) {
  1052. // return item.had_ys && item.yearmonth < c4.yearmonth;
  1053. // });
  1054. // // 找出最近的一个had_ys为true值
  1055. // if (hadYsDatas.length > 0) {
  1056. // c4.ys_tp = hadYsDatas[hadYsDatas.length - 1].ys_tp;
  1057. // }
  1058. // }
  1059. show_yingsf_option_data.ys_tp.push(c4.ys_tp);
  1060. const hadYfDatas = _.filter(new_yingsf_option_data, function (item) {
  1061. return item.yearmonth < c4.yearmonth;
  1062. });
  1063. // 找出最近的一个had_yf为true值
  1064. if (hadYfDatas.length > 0) {
  1065. c4.yf_tp = ZhCalc.add(hadYfDatas[hadYfDatas.length - 1].yf_tp, c4.yf_tp);
  1066. }
  1067. // if (!c4.had_yf) {
  1068. // const hadYfDatas = _.filter(new_yingsf_option_data, function (item) {
  1069. // return item.had_yf && item.yearmonth < c4.yearmonth;
  1070. // });
  1071. // // 找出最近的一个had_yf为true值
  1072. // if (hadYfDatas.length > 0) {
  1073. // c4.yf_tp = hadYfDatas[hadYfDatas.length - 1].yf_tp;
  1074. // }
  1075. // }
  1076. show_yingsf_option_data.yf_tp.push(c4.yf_tp);
  1077. }
  1078. }
  1079. const yingsf_option = yingsfChart.getOption();
  1080. yingsf_option.dataZoom[0].start = 0;
  1081. yingsf_option.dataZoom[0].end = computedPosition(show_yingsf_option_data.yearmonth.length);
  1082. yingsf_option.xAxis[0].data = show_yingsf_option_data.yearmonth;
  1083. yingsf_option.series[0].data = show_yingsf_option_data.ys_tp;
  1084. yingsf_option.series[1].data = show_yingsf_option_data.yf_tp;
  1085. if (show_yingsf_option_data.yearmonth.length >= 8) {
  1086. yingsf_option.dataZoom[0].show = true;
  1087. } else {
  1088. yingsf_option.dataZoom[0].show = false;
  1089. }
  1090. yingsfChart.setOption(yingsf_option);
  1091. const show_yisf_option_data = {
  1092. yearmonth: [],
  1093. yf_tp: [],
  1094. ys_tp: [],
  1095. };
  1096. if (yisf_option_data.length > 0) {
  1097. const new_yisf_option_data = _.sortBy(yisf_option_data, 'yearmonth');
  1098. for (const c4 of new_yisf_option_data) {
  1099. show_yisf_option_data.yearmonth.push(c4.yearmonth);
  1100. const hadYsDatas = _.filter(new_yisf_option_data, function (item) {
  1101. return item.yearmonth < c4.yearmonth;
  1102. });
  1103. // 找出最近的一个had_ys为true值
  1104. if (hadYsDatas.length > 0) {
  1105. c4.ys_tp = ZhCalc.add(hadYsDatas[hadYsDatas.length - 1].ys_tp, c4.ys_tp);
  1106. }
  1107. // if (!c4.had_ys) {
  1108. // const hadYsDatas = _.filter(new_yisf_option_data, function (item) {
  1109. // return item.had_ys && item.yearmonth < c4.yearmonth;
  1110. // });
  1111. // // 找出最近的一个had_ys为true值
  1112. // if (hadYsDatas.length > 0) {
  1113. // c4.ys_tp = hadYsDatas[hadYsDatas.length - 1].ys_tp;
  1114. // }
  1115. // }
  1116. show_yisf_option_data.ys_tp.push(c4.ys_tp);
  1117. const hadYfDatas = _.filter(new_yisf_option_data, function (item) {
  1118. return item.yearmonth < c4.yearmonth;
  1119. });
  1120. // 找出最近的一个had_yf为true值
  1121. if (hadYfDatas.length > 0) {
  1122. c4.yf_tp = ZhCalc.add(hadYfDatas[hadYfDatas.length - 1].yf_tp, c4.yf_tp);
  1123. }
  1124. // if (!c4.had_yf) {
  1125. // const hadYfDatas = _.filter(new_yisf_option_data, function (item) {
  1126. // return item.had_yf && item.yearmonth < c4.yearmonth;
  1127. // });
  1128. // // 找出最近的一个had_yf为true值
  1129. // if (hadYfDatas.length > 0) {
  1130. // c4.yf_tp = hadYfDatas[hadYfDatas.length - 1].yf_tp;
  1131. // }
  1132. // }
  1133. show_yisf_option_data.yf_tp.push(c4.yf_tp);
  1134. }
  1135. }
  1136. const yisf_option = yisfChart.getOption();
  1137. yisf_option.dataZoom[0].start = 0;
  1138. yisf_option.dataZoom[0].end = computedPosition(show_yisf_option_data.yearmonth.length);
  1139. yisf_option.xAxis[0].data = show_yisf_option_data.yearmonth;
  1140. yisf_option.series[0].data = show_yisf_option_data.ys_tp;
  1141. yisf_option.series[1].data = show_yisf_option_data.yf_tp;
  1142. if (show_yisf_option_data.yearmonth.length >= 8) {
  1143. yisf_option.dataZoom[0].show = true;
  1144. } else {
  1145. yisf_option.dataZoom[0].show = false;
  1146. }
  1147. yisfChart.setOption(yisf_option);
  1148. // 最底下1排4个管理图表输出设置和工程成本管理汇总表格设置
  1149. const gccbglhz = [];
  1150. if (dpgl_charts.length > 0) {
  1151. for (const d in dpCategory) {
  1152. if (d) {
  1153. const dpgl_option = dpgl_charts[d].getOption();
  1154. dpgl_option.dataZoom[0].start = 0;
  1155. const dpgl_chart_option_name = [];
  1156. const dpgl_chart_option_data = {
  1157. end_gather_tp: [],
  1158. end_sf_tp:[],
  1159. };
  1160. const cbgl_tenders = _.filter(tenderList, function (item) {
  1161. return _.findIndex(item.category, {cid: dpCategory[d].cid, value: dpCategory[d].id}) !== -1;
  1162. });
  1163. const oneCbgl = {
  1164. name: dpCategory[d].value,
  1165. end_gather_tp: 0,
  1166. end_sf_tp: 0,
  1167. end_yf_tp: 0,
  1168. }
  1169. for (const t of cbgl_tenders) {
  1170. dpgl_chart_option_name.push(t.name);
  1171. dpgl_chart_option_data.end_gather_tp.push(t.end_gather_tp ? t.end_gather_tp : 0);
  1172. dpgl_chart_option_data.end_sf_tp.push(t.end_sf_tp ? t.end_sf_tp : 0);
  1173. oneCbgl.end_gather_tp = t.end_gather_tp ? ZhCalc.add(oneCbgl.end_gather_tp, t.end_gather_tp) : oneCbgl.end_gather_tp;
  1174. oneCbgl.end_sf_tp = t.end_sf_tp ? ZhCalc.add(oneCbgl.end_sf_tp, t.end_sf_tp) : oneCbgl.end_sf_tp;
  1175. oneCbgl.end_yf_tp = t.end_yf_tp ? ZhCalc.add(oneCbgl.end_yf_tp, t.end_yf_tp) : oneCbgl.end_yf_tp;
  1176. }
  1177. oneCbgl.end_df_tp = ZhCalc.sub(oneCbgl.end_yf_tp, oneCbgl.end_sf_tp);
  1178. gccbglhz.push(oneCbgl);
  1179. dpgl_option.dataZoom[0].end = computedPosition(cbgl_tenders.length);
  1180. dpgl_option.xAxis[0].data = dpgl_chart_option_name;
  1181. dpgl_option.series[0].data = dpgl_chart_option_data.end_gather_tp;
  1182. dpgl_option.series[1].data = dpgl_chart_option_data.end_sf_tp;
  1183. if (cbgl_tenders.length >= 8) {
  1184. dpgl_option.dataZoom[0].show = true;
  1185. } else {
  1186. dpgl_option.dataZoom[0].show = false;
  1187. }
  1188. dpgl_charts[d].setOption(dpgl_option);
  1189. }
  1190. }
  1191. }
  1192. const allgccb = {
  1193. name: '合计',
  1194. end_gather_tp: 0,
  1195. end_sf_tp: 0,
  1196. end_yf_tp: 0,
  1197. };
  1198. let hzHtml = '';
  1199. for (const cb of gccbglhz) {
  1200. allgccb.end_gather_tp = ZhCalc.add(allgccb.end_gather_tp, cb.end_gather_tp);
  1201. allgccb.end_sf_tp = ZhCalc.add(allgccb.end_sf_tp, cb.end_sf_tp);
  1202. allgccb.end_yf_tp = ZhCalc.add(allgccb.end_yf_tp, cb.end_yf_tp);
  1203. hzHtml += '<tr class="bg-dark" style="line-height: 2rem;text-align: center;"><td style="text-align: left">' + cb.name + '</td><td>' + cb.end_gather_tp + '</td><td>' + cb.end_yf_tp + '</td><td>' + cb.end_sf_tp + '</td><td>' + cb.end_df_tp + '</td></tr>';
  1204. }
  1205. allgccb.end_df_tp = ZhCalc.sub(allgccb.end_yf_tp, allgccb.end_sf_tp);
  1206. hzHtml += '<tr class="bg-dark" style="line-height: 2rem;text-align: center;"><td style="text-align: left">' + allgccb.name + '</td><td>' + allgccb.end_gather_tp + '</td><td>' + allgccb.end_yf_tp + '</td><td>' + allgccb.end_sf_tp + '</td><td>' + allgccb.end_df_tp + '</td></tr>';
  1207. $('.stage-data').html(hzHtml);
  1208. setTableboxHeight();
  1209. // console.log(sr_tenders, cb_tenders);
  1210. }
  1211. function setTableboxHeight() {
  1212. $('.tablebox').height($('.gccb').height() - 51);
  1213. }
  1214. let resizeTimer = null;
  1215. $(window).bind('resize', function () {
  1216. if (resizeTimer) clearTimeout(resizeTimer);
  1217. resizeTimer = setTimeout(function () {
  1218. echartsReset();
  1219. }, 500);
  1220. })
  1221. function echartsReset() {
  1222. gcsrmxChart.resize();
  1223. gcsrqkChart.resize();
  1224. yingsfChart.resize();
  1225. yisfChart.resize();
  1226. if (dpgl_charts.length > 0) {
  1227. for (const d in dpCategory) {
  1228. if (d) {
  1229. dpgl_charts[d].resize();
  1230. }
  1231. }
  1232. }
  1233. setTableboxHeight();
  1234. }
  1235. // 第一层分类选择
  1236. $("body").on('click', '#first-category .select-cate', function () {
  1237. const id = $(this).data('value');
  1238. $(this).parents('.dropdown-menu').siblings('button').text($(this).text());
  1239. let newTenderList = tenders;
  1240. let categoryIndex = 0;
  1241. if (!id) {
  1242. $('#second-category').hide();
  1243. $('#first-category').children('button').attr('data-cid', '').attr('data-value', '');
  1244. } else {
  1245. // 获取第一层已选类别
  1246. const firstCategory = { cid: parseInt($(this).data('cid')), value: parseInt(id) };
  1247. $('#first-category').children('button').attr('data-cid', $(this).data('cid')).attr('data-value', id);
  1248. newTenderList = _.filter(tenders, function (item) {
  1249. return _.findIndex(item.category, firstCategory) !== -1;
  1250. })
  1251. categoryIndex = 1;
  1252. if (category[1] && category[1].value.length > 0) {
  1253. $('#second-category').show();
  1254. $('#second-category').children('button').text('全部').attr('data-cid', '').attr('data-value', '');
  1255. for (const [i,sc] of category[1].value.entries()) {
  1256. const scCategory = { cid: sc.cid, value: sc.id };
  1257. if (_.findIndex(newTenderList, function (item) {
  1258. return _.findIndex(item.category, scCategory) !== -1;}) === -1) {
  1259. $('#second-category .select-cate').eq(i+1).hide();
  1260. } else {
  1261. $('#second-category .select-cate').eq(i+1).show();
  1262. }
  1263. }
  1264. }
  1265. }
  1266. // console.log(newTenderList, categoryIndex);
  1267. setData(newTenderList, categoryIndex);
  1268. });
  1269. // 第二层分类选择
  1270. $("body").on('click', '#second-category .select-cate', function () {
  1271. const id = $(this).data('value');
  1272. // 获取第一层已选类别
  1273. const first_cid = $('#first-category').children('button').attr('data-cid');
  1274. const first_value = $('#first-category').children('button').attr('data-value');
  1275. const firstCategory = { cid: parseInt(first_cid), value: parseInt(first_value) };
  1276. let newTenderList = _.filter(tenders, function (item) {
  1277. return _.findIndex(item.category, firstCategory) !== -1;
  1278. });
  1279. let categoryIndex = 1;
  1280. $(this).parents('.dropdown-menu').siblings('button').text($(this).text());
  1281. if (id) {
  1282. // 获取第二层已选类别
  1283. const secondCategory = { cid: parseInt($(this).data('cid')), value: parseInt(id) };
  1284. $('#second-category').children('button').attr('data-cid', $(this).data('cid')).attr('data-value', id);
  1285. newTenderList = _.filter(newTenderList, function (item) {
  1286. return _.findIndex(item.category, secondCategory) !== -1;
  1287. });
  1288. categoryIndex = 2;
  1289. }
  1290. // console.log(newTenderList, categoryIndex);
  1291. setData(newTenderList, categoryIndex);
  1292. });
  1293. });
  1294. // 计算显示滚动条长度
  1295. function computedPosition(xArrayLength) {
  1296. if (xArrayLength >= 8) {
  1297. return Math.floor(8 / xArrayLength * 100) > 100 ? 100 : Math.floor(8 / xArrayLength * 100);
  1298. // return length <= 10 ? 35 : 100 - Math.floor(35 / length * 100);
  1299. } else {
  1300. return 100;
  1301. }
  1302. }
  1303. function formatNum(num, pattern) {
  1304. const minus = num > 0 ? '' : '-'
  1305. const strarr = num ? Math.abs(num).toString().split('.') : ['0'];
  1306. const fmtarr = pattern ? pattern.split('.') : [''];
  1307. let retstr = '';
  1308. // 整数部分
  1309. let str = strarr[0];
  1310. let fmt = fmtarr[0];
  1311. let i = str.length - 1;
  1312. let comma = false;
  1313. for (var f = fmt.length - 1; f >= 0; f--) {
  1314. switch (fmt.substr(f, 1)) {
  1315. case '#':
  1316. if (i >= 0) retstr = str.substr(i--, 1) + retstr;
  1317. break;
  1318. case '0':
  1319. if (i >= 0) retstr = str.substr(i--, 1) + retstr;
  1320. else retstr = '0' + retstr;
  1321. break;
  1322. case ',':
  1323. comma = true;
  1324. retstr = ',' + retstr;
  1325. break;
  1326. }
  1327. }
  1328. if (i >= 0) {
  1329. if (comma) {
  1330. const l = str.length;
  1331. for (;i >= 0; i--) {
  1332. retstr = str.substr(i, 1) + retstr;
  1333. if (i > 0 && ((l - i) % 3) == 0) retstr = ',' + retstr;
  1334. }
  1335. } else retstr = str.substr(0, i + 1) + retstr;
  1336. }
  1337. retstr = retstr + '.';
  1338. // 处理小数部分
  1339. str = strarr.length > 1 ? strarr[1] : '';
  1340. fmt = fmtarr.length > 1 ? fmtarr[1] : '';
  1341. i = 0;
  1342. for (var f = 0; f < fmt.length; f++) {
  1343. switch (fmt.substr(f, 1)) {
  1344. case '#':
  1345. if (i < str.length) retstr += str.substr(i++, 1);
  1346. break;
  1347. case '0':
  1348. if (i < str.length) retstr += str.substr(i++, 1);
  1349. else retstr += '0';
  1350. break;
  1351. }
  1352. }
  1353. return minus + retstr.replace(/^,+/, '').replace(/\.$/, '');
  1354. }
  1355. </script>