detail.ejs 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357
  1. <% include ./tender_sub_menu.ejs %>
  2. <div class="panel-content">
  3. <div class="panel-title">
  4. <div class="title-main d-flex">
  5. <% include ./tender_sub_mini_menu.ejs %>
  6. <% if (tender.ledger_status !== audit.ledger.status.uncheck) { %>
  7. <h2>进行至
  8. <% if (lastStage) { %>
  9. 第<%- lastStage.order %>期<small class="<%- audit.stage.statusClass[lastStage.status] %>">(<%- audit.stage.statusString[lastStage.status] %>)</small>
  10. <% } else { %>
  11. 台账<small class="<%- audit.ledger.auditStringClass[tender.ledger_status] %>">(<%- audit.ledger.auditString[tender.ledger_status] %>)</small>
  12. <% } %>
  13. </h2>
  14. <% } %>
  15. <% if (cooperation) { %>
  16. <div>
  17. <a href="/tender/<%= tender.id %>/cooperation" class="btn btn-sm btn-light" ><i class="fa fa-users"></i> 协作办公</a>
  18. </div>
  19. <% } %>
  20. </div>
  21. </div>
  22. <div class="content-wrap">
  23. <div class="c-body">
  24. <div class="sjs-height-0">
  25. <div class="m-3">
  26. <!--金额概况-->
  27. <div class="row mx-0 mb-3">
  28. <div class="col-auto p-0">
  29. <div class="card text-center">
  30. <div class="card-body">
  31. <h5 class="card-title"><%- ctx.helper.formatMoney(tender.total_price) %></h5>
  32. <p class="card-text text-muted">0号台帐合同</p>
  33. </div>
  34. </div>
  35. </div>
  36. <div class="col-auto pr-0">
  37. <div class="card text-center">
  38. <div class="card-body">
  39. <h5 class="card-title"><%- ctx.helper.formatMoney(tender.gather_tp) %></h5>
  40. <p class="card-text text-muted">本期完成</p>
  41. </div>
  42. </div>
  43. </div>
  44. <div class="col-auto pr-0">
  45. <div class="card text-center">
  46. <div class="card-body">
  47. <h5 class="card-title"><%- ctx.helper.formatMoney(tender.end_qc_tp) %><small class="text-danger" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="占合同比例"><%- tender.qc_ratio %>%</small></h5>
  48. <p class="card-text text-muted">截止本期变更</p>
  49. </div>
  50. </div>
  51. </div>
  52. <div class="col-auto pr-0">
  53. <div class="card text-center">
  54. <div class="card-body">
  55. <h5 class="card-title"><%- ctx.helper.formatMoney(tender.end_gather_tp) %></h5>
  56. <p class="card-text text-muted">截止本期完成</p>
  57. </div>
  58. </div>
  59. </div>
  60. <div class="col-auto pr-0">
  61. <div class="card text-center">
  62. <div class="card-body">
  63. <h5 class="card-title"><%- ctx.helper.formatMoney(tender.pre_gather_tp) %></h5>
  64. <p class="card-text text-muted">截止上期完成</p>
  65. </div>
  66. </div>
  67. </div>
  68. <div class="col-auto pr-0">
  69. <div class="card text-center">
  70. <div class="card-body">
  71. <h5 class="card-title"><%- ctx.helper.formatMoney(tender.yf_tp) %></h5>
  72. <p class="card-text text-muted">本期应付</p>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. <!--进度条-->
  78. <div class="mb-3">
  79. <div class="progress">
  80. <% if (tender.pre_ratio > 0) { %>
  81. <div class="progress-bar bg-success" style="width: <%- tender.pre_ratio %>%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥<%- ctx.helper.formatMoney(tender.pre_gather_tp) %>"><%- tender.pre_ratio %>%</div>
  82. <% } %>
  83. <% if (tender.cur_ratio > 0) { %>
  84. <div class="progress-bar bg-info" style="width: <%- tender.cur_ratio %>%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥<%- ctx.helper.formatMoney(tender.gather_tp) %>"><%- tender.cur_ratio %>%</div>
  85. <% } %>
  86. <% if (tender.other_ratio > 0) { %>
  87. <div class="progress-bar bg-gray" style="width: <%- tender.other_ratio %>%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥<%- ctx.helper.formatMoney(tender.other_tp) %>"><%- tender.other_ratio %>%</div>
  88. <% } %>
  89. </div>
  90. </div>
  91. <!--标段设置-->
  92. <div class="col-6 p-0 mb-3">
  93. <div class="card">
  94. <div class="card-body">
  95. <h5 class="card-title">标段设置</h5>
  96. <a href="#bd-set-1" data-toggle="modal" data-target="#bd-set-1" class="btn btn-sm btn-outline-primary">标段属性</a>
  97. <a href="#bd-set-2" data-toggle="modal" data-target="#bd-set-2" class="btn btn-sm btn-outline-primary">小数位数</a>
  98. <a href="#bd-set-3" data-toggle="modal" data-target="#bd-set-3" class="btn btn-sm btn-outline-primary">数量精度</a>
  99. <a href="#bd-set-4" data-toggle="modal" data-target="#bd-set-4" class="btn btn-sm btn-outline-primary">合同参数</a>
  100. <a href="#bd-set-5" data-toggle="modal" data-target="#bd-set-5" class="btn btn-sm btn-outline-primary">显示设置</a>
  101. <a href="#bd-set-6" data-toggle="modal" data-target="#bd-set-6" class="btn btn-sm btn-outline-primary">章节设置</a>
  102. </div>
  103. </div>
  104. </div>
  105. <!--图表-->
  106. <div class="card mb-3 mr-1">
  107. <div class="card-body">
  108. <h5 class="card-title">期进度表</h5>
  109. <div id="chartContainer4" style="height: 300px; width: 100%;">
  110. </div>
  111. </div>
  112. </div>
  113. <div class="card mb-3 mr-1">
  114. <div class="card-body">
  115. <h5 class="card-title">月进度表</h5>
  116. <div id="chartContainer3" style="height: 300px; width: 100%;">
  117. </div>
  118. </div>
  119. </div>
  120. </div>
  121. </div>
  122. </div>
  123. </div>
  124. </div>
  125. <script src="/public/js/sub_menu.js"></script>
  126. <script>
  127. $.subMenu({
  128. menu: '#sub-menu', miniMenu: '#sub-mini-menu', miniMenuList: '#mini-menu-list',
  129. toMenu: '#to-menu', toMiniMenu: '#to-mini-menu',
  130. key: 'menu.1.0.0',
  131. miniHint: '#sub-mini-hint', hintKey: 'menu.hint.1.0.1',
  132. callback: function (info) {
  133. if (info.mini) {
  134. $('.panel-title').addClass('fluid');
  135. $('#sub-menu').removeClass('panel-sidebar');
  136. } else {
  137. $('.panel-title').removeClass('fluid');
  138. $('#sub-menu').addClass('panel-sidebar');
  139. }
  140. autoFlashHeight();
  141. }
  142. });
  143. </script>
  144. <script type="text/javascript">
  145. //4 标段期数计量进度//
  146. var myChart = echarts.init(document.getElementById('chartContainer4'));
  147. var option = {
  148. color: ['#e9af68','#57b7b6','#e4575a','#959eac','#6699FF',
  149. '#d38b70','#8fb7cf','#cd5c5c','#ffa500','#40e0d0',
  150. '#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
  151. '#5c616b','#ff6666','#3cb371','#b8860b','#30e0e0'],
  152. title : {
  153. text: '标段期进度'
  154. },
  155. tooltip : {
  156. trigger: 'axis',
  157. },
  158. calculable : true,
  159. legend: {
  160. data:['本期合同计量','本期数量变更计量','截至上期累计完成','本期完成计量','完成度']
  161. },
  162. dataZoom: [
  163. {show: true, start: 0, end: 100}
  164. ],
  165. xAxis : [
  166. {
  167. type : 'category',
  168. splitLine : {show : true},
  169. data : [
  170. <% for (const s of stages) {%>
  171. '第<%- s.order %>期',
  172. <% } %>
  173. ]
  174. }
  175. ],
  176. yAxis : [
  177. {
  178. type : 'value',
  179. name : '金额',
  180. position:'left',
  181. axisLabel : {
  182. formatter: '{value} 元'
  183. },
  184. splitArea : {show : true},
  185. splitLine : {show : true},
  186. },
  187. {
  188. type : 'value',
  189. name:'完成度',
  190. axisLabel : {
  191. formatter: '{value} %'
  192. },
  193. position: 'right',
  194. splitArea : {show : false},
  195. splitLine : {show : false},
  196. }
  197. ],
  198. series : [
  199. {
  200. name:'本期合同计量',
  201. type:'bar',
  202. tooltip : {trigger: 'item',formatter: "{b} <br/>{a}:{c}元"},
  203. stack: '合同',
  204. data:[
  205. <% for (const s of stages) {%>
  206. <%- s.contract_tp %>,
  207. <% } %>
  208. ]
  209. },
  210. {
  211. name:'本期数量变更计量',
  212. type:'bar',
  213. tooltip : {trigger: 'item',formatter: "{b} <br/>{a}:{c}元"},
  214. stack: '变更',
  215. data:[
  216. <% for (const s of stages) {%>
  217. <%- s.qc_tp %>,
  218. <% } %>
  219. ]
  220. },
  221. {
  222. name:'截至上期累计完成',
  223. type:'bar',
  224. tooltip : {trigger: 'item',formatter: "{b} <br/>{a}:{c}元"},
  225. stack: '完成',
  226. data:[
  227. <% for (const s of stages) {%>
  228. <%- ctx.helper.add(s.pre_contract_tp, s.pre_qc_tp) %>,
  229. <% } %>
  230. ]
  231. },
  232. {
  233. name:'本期完成计量',
  234. type:'bar',
  235. tooltip : {trigger: 'item',formatter: "{b} <br/>{a}:{c}元"},
  236. stack: '完成',
  237. data:[
  238. <% for (const s of stages) {%>
  239. <%- ctx.helper.add(s.contract_tp, s.qc_tp) %>,
  240. <% } %>
  241. ]
  242. },
  243. {
  244. name:'完成度',
  245. type:'line',
  246. tooltip : {trigger: 'axis',formatter: "{b}占总标段<br/>{a}:{c} %"},
  247. yAxisIndex: 1,
  248. data:[
  249. <% for (const s of stages) {%>
  250. <%- ctx.helper.mul(ctx.helper.div(ctx.helper.add(s.contract_tp, s.qc_tp), tender.sum, 2), 100) %>,
  251. <% } %>
  252. ]
  253. },
  254. ]
  255. };
  256. // 为echarts对象加载数据
  257. myChart.setOption(option);
  258. //4 标段期数计量进度//
  259. //3 标段月进度//
  260. // 基于准备好的dom,初始化echarts图表
  261. var myChart = echarts.init(document.getElementById('chartContainer3'));
  262. var option = {
  263. color:["#e9af68","#57b7b6"],
  264. title : {
  265. text: '标段月进度'
  266. },
  267. tooltip : {
  268. trigger: 'axis',
  269. <% if (monthProgress && monthProgress.length > 0) { %>
  270. formatter: "{b} <br/>{a0}:{c0} %<br/>{a1}:{c1} %",
  271. <% } else { %>
  272. formatter: "{a0}:-<br/>{a1}:-",
  273. <% } %>
  274. },
  275. legend: {
  276. data:['累计完成','本月完成']
  277. },
  278. toolbox: {
  279. show : true,
  280. feature : {
  281. magicType : {show: true, type: ['line', 'bar']}
  282. }
  283. },
  284. dataZoom : {
  285. show : true,
  286. start : 50,
  287. end : 100
  288. },
  289. xAxis : [
  290. {
  291. type : 'category',
  292. boundaryGap : true,
  293. data : [
  294. <% for (const mp of monthProgress) { %>
  295. '<%- mp.month %>',
  296. <% } %>
  297. ]
  298. }
  299. ],
  300. yAxis : [
  301. {
  302. type : 'value',
  303. axisLabel : {
  304. formatter: '{value} %'
  305. },
  306. splitArea : {show : true}
  307. }
  308. ],
  309. series : [
  310. {
  311. name:'累计完成',
  312. type:'line',
  313. itemStyle: {
  314. normal: {
  315. lineStyle: {
  316. shadowColor : 'rgba(0,0,0,0.4)',
  317. shadowBlur: 5,
  318. shadowOffsetX: 3,
  319. shadowOffsetY: 3
  320. }
  321. }
  322. },
  323. data:[
  324. <% for (const mp of monthProgress) { %>
  325. <%- mp.end_ratio %>,
  326. <% } %>
  327. ]
  328. },
  329. {
  330. name:'本月完成',
  331. type:'line',
  332. itemStyle: {
  333. normal: {
  334. lineStyle: {
  335. shadowColor : 'rgba(0,0,0,0.4)',
  336. shadowBlur: 5,
  337. shadowOffsetX: 3,
  338. shadowOffsetY: 3
  339. }
  340. }
  341. },
  342. data:[
  343. <% for (const mp of monthProgress) { %>
  344. <%- mp.ratio %>,
  345. <% } %>
  346. ]
  347. }
  348. ]
  349. };
  350. // 为echarts对象加载数据
  351. myChart.setOption(option);
  352. //3 标段月进度//
  353. </script>
  354. <script>
  355. </script>