zr_gzt.jsp 50 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069
  1. <%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
  2. <%@ page language="java" contentType="text/html; charset=UTF-8"
  3. pageEncoding="UTF-8" %>
  4. <%@ page isELIgnored="false" %>
  5. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
  6. <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
  7. <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
  8. <!DOCTYPE html>
  9. <html>
  10. <head>
  11. <meta charset="utf-8"/>
  12. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  13. <meta name="viewport"
  14. content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
  15. <title>工作台</title>
  16. <jsp:include page="../common/common-meta-include.jsp"></jsp:include>
  17. <jsp:include page="../common/common-js-include.jsp"></jsp:include>
  18. <jsp:include page="../common/common-css-include.jsp"></jsp:include>
  19. <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.4.3/echarts.min.js"
  20. integrity="sha512-EmNxF3E6bM0Xg1zvmkeYD3HDBeGxtsG92IxFt1myNZhXdCav9MzvuH/zNMBU1DmIPN6njrhX1VTbqdJxQ2wHDg=="
  21. crossorigin="anonymous" referrerpolicy="no-referrer"></script>
  22. <style type="text/css">
  23. .tips {
  24. position: absolute;
  25. display: contents;
  26. float: right;
  27. }
  28. .tips a {
  29. color: blue;
  30. }
  31. body {
  32. background: #ffffff;
  33. }
  34. .layui-table-cell{
  35. height: 42px !important;
  36. line-height: 42px;
  37. }
  38. </style>
  39. </head>
  40. <body>
  41. <div class="layui-layout layui-layout-admin zr_gzt" >
  42. <!-- 内容区域 -->
  43. <div class="zheren_taizhang" id="app">
  44. <%--政府端--%>
  45. <div class="top_bar" v-if="kingUnit=='1'">
  46. <div class="left">
  47. <%-- <div class="layui-card active" @click="initChart(this)">--%>
  48. <%-- <div class="layui-card-header"></div>--%>
  49. <%-- <div class="layui-card-body" style="padding-top: 15px;">--%>
  50. <%-- <img src="${WebSite.asset }/css/images/u394.svg" /> 工作台账--%>
  51. <%-- </div>--%>
  52. <%-- </div>--%>
  53. <%-- <div class="layui-card" @click="getTotalTodo(this)">--%>
  54. <%-- <div class="layui-card-body">--%>
  55. <%-- <div class="img_num">--%>
  56. <%-- <img src="${WebSite.asset }/css/images/workPlat/backlog.png"/>--%>
  57. <%-- <span class="num">${numData.num_1}</span>--%>
  58. <%-- </div>--%>
  59. <%-- <div class="word">--%>
  60. <%-- 待办事项--%>
  61. <%-- </div>--%>
  62. <%-- </div>--%>
  63. <%-- </div>--%>
  64. <%-- <div class="line"></div>--%>
  65. <%-- <div class="layui-card" @click="getTotalDo(this)">
  66. <div class="layui-card-header"></div>
  67. <div class="layui-card-body" style="padding-top: 15px;">
  68. <img src="${WebSite.asset }/css/images/u138.svg" /> 已办事项
  69. </div>
  70. </div> --%>
  71. <div class="layui-card" @click="toYQ()">
  72. <div class="layui-card-body">
  73. <div class="img_num">
  74. <img src="${WebSite.asset }/css/images/workPlat/remind.png"/>
  75. <%-- <span class="num">${numData.num_2}</span>--%>
  76. <span class="num">${warningNum}</span>
  77. </div>
  78. <div class="word">
  79. <%-- 项目逾期竣工--%>
  80. 预警提醒
  81. </div>
  82. </div>
  83. </div>
  84. <%-- <div class="line"></div>--%>
  85. <%-- <div class="layui-card" @click="openCt()">--%>
  86. <%-- <div class="layui-card-body">--%>
  87. <%-- <div class="img_num">--%>
  88. <%-- <img src="${WebSite.asset }/css/images/workPlat/remind.png"/>--%>
  89. <%-- <span class="num">${openNum}</span>--%>
  90. <%-- </div>--%>
  91. <%-- <div class="word">--%>
  92. <%-- 开工红黄灯预警--%>
  93. <%-- </div>--%>
  94. <%-- </div>--%>
  95. <%-- </div>--%>
  96. <div class="line"></div>
  97. <div class="layui-card" @click="offsetCt()">
  98. <div class="layui-card-body">
  99. <div class="img_num">
  100. <img src="${WebSite.asset }/css/images/workPlat/remind.png"/>
  101. <span class="num">${exceedNum}</span>
  102. </div>
  103. <div class="word">
  104. <%-- 偏离度红黄灯--%>
  105. 进度红灯
  106. </div>
  107. </div>
  108. </div>
  109. <%-- <div class="line" style="display: none"></div>--%>
  110. <%-- <div class="layui-card" @click="toItems(7)" style="display: none">--%>
  111. <%-- <div class="layui-card-body">--%>
  112. <%-- <div class="img_num">--%>
  113. <%-- <img src="${WebSite.asset }/css/images/workPlat/rgb.png"/>--%>
  114. <%-- </div>--%>
  115. <%-- <div class="word">--%>
  116. <%-- 红黄绿灯--%>
  117. <%-- </div>--%>
  118. <%-- </div>--%>
  119. <%-- </div>--%>
  120. <%-- <div class="line"></div>--%>
  121. <%-- <div class="layui-card">--%>
  122. <%-- <div class="layui-card-body" @click="toItems(6)">--%>
  123. <%-- <div class="img_num">--%>
  124. <%-- <img src="${WebSite.asset }/css/images/workPlat/wisdom.png"/>--%>
  125. <%-- </div>--%>
  126. <%-- <div class="word">--%>
  127. <%-- 智慧工地--%>
  128. <%-- </div>--%>
  129. <%-- </div>--%>
  130. <%-- </div>--%>
  131. <%-- <div class="layui-card">--%>
  132. <%-- <div class="layui-card-body" @click="toItems(5)">--%>
  133. <%-- <div class="img_num">--%>
  134. <%-- <img src="${WebSite.asset }/css/images/workPlat/flow.png"/>--%>
  135. <%-- </div>--%>
  136. <%-- <div class="word">--%>
  137. <%-- 办事流程--%>
  138. <%-- </div>--%>
  139. <%-- </div>--%>
  140. <%-- </div>--%>
  141. <%-- <div class="line" style="display: none"></div>--%>
  142. <%-- <div class="layui-card" style="margin-bottom: 17px;display: none" >--%>
  143. <%-- <div class="layui-card-body" @click="toItems(4)">--%>
  144. <%-- <div class="img_num">--%>
  145. <%-- <img src="${WebSite.asset }/css/images/workPlat/project.png"/>--%>
  146. <%-- </div>--%>
  147. <%-- <div class="word">--%>
  148. <%-- 包联项目--%>
  149. <%-- </div>--%>
  150. <%-- </div>--%>
  151. <%-- </div>--%>
  152. </div>
  153. <%-- <div class="tips">--%>
  154. <%-- <span>提示:</span>--%>
  155. <%-- <ul>--%>
  156. <%-- <li>1.如果是新项目申报,请在&lt;<a href="${domain }/subject/subInfo/report">项目信息</a>&gt;里,点击新增进行项目申报</li>--%>
  157. <%-- <li>2.如果需要查询项目基本信息和进度等,请到&lt;<a href="${domain }/subject/subInfo/projTz">项目信息台帐</a>&gt;页面查询</li>--%>
  158. <%-- <li>3.进入施工阶段后,需要编制计划,项目开工申报,竣工申报,项目变更,请到&lt;<a href="${domain }/subject/process/manage">项目施工阶段管理</a>&gt;页面</li>--%>
  159. <%-- </ul>--%>
  160. <%-- </div>--%>
  161. <div class="right">
  162. <div class="layui-card bgc">
  163. <div class="layui-card-body" @click="toItems(1)" style="padding-top: 0;">
  164. <div class="img_num">
  165. <img src="${WebSite.asset }/css/images/workPlat/week.png"/>
  166. </div>
  167. <div class="word">
  168. 周报查询
  169. </div>
  170. </div>
  171. </div>
  172. <div class="layui-card bgc">
  173. <div class="layui-card-body" @click="toItems(2)" style="padding-top: 0;">
  174. <div class="img_num">
  175. <img src="${WebSite.asset }/css/images/workPlat/month.png"/>
  176. </div>
  177. <div class="word">
  178. 月报查询
  179. </div>
  180. </div>
  181. </div>
  182. <div class="layui-card bgc" style="margin-bottom: 27px;padding-top: 0;">
  183. <div class="layui-card-body" @click="toItems(3)">
  184. <div class="img_num">
  185. <img src="${WebSite.asset }/css/images/workPlat/question.png"/>
  186. </div>
  187. <div class="word">
  188. 问题推送处理
  189. </div>
  190. </div>
  191. </div>
  192. </div>
  193. <%-- <div class="right" @click="reportEdit()">--%>
  194. <%-- <span class="layui-badge">${numData.num_3}</span>--%>
  195. <%-- <img src="${WebSite.asset }/css/images/u397.svg" /> --%>
  196. <%-- <span class="txt">写周报</span>--%>
  197. <%-- </div>--%>
  198. </div>
  199. <%--企业端--%>
  200. <div class="top_bar" v-if="kingUnit=='2'">
  201. <div class="left" style="width: 52%">
  202. <%-- <div class="layui-card active" @click="initChart(this)">--%>
  203. <%-- <div class="layui-card-header"></div>--%>
  204. <%-- <div class="layui-card-body" style="padding-top: 15px;">--%>
  205. <%-- <img src="${WebSite.asset }/css/images/u394.svg" /> 工作台账--%>
  206. <%-- </div>--%>
  207. <%-- </div>--%>
  208. <div class="layui-card" @click="getTotalTodo(this)">
  209. <div class="layui-card-body">
  210. <div class="img_num">
  211. <img src="${WebSite.asset }/css/images/workPlat/backlog.png"/>
  212. <span class="num">${numData.num_1}</span>
  213. </div>
  214. <div class="word">
  215. 待办事项
  216. </div>
  217. </div>
  218. </div>
  219. <div class="line"></div>
  220. <%-- <div class="layui-card" @click="getTotalDo(this)">
  221. <div class="layui-card-header"></div>
  222. <div class="layui-card-body" style="padding-top: 15px;">
  223. <img src="${WebSite.asset }/css/images/u138.svg" /> 已办事项
  224. </div>
  225. </div> --%>
  226. <div class="layui-card" @click="toYQ()">
  227. <div class="layui-card-body">
  228. <div class="img_num">
  229. <img src="${WebSite.asset }/css/images/workPlat/remind.png"/>
  230. <span class="num">${numData.num_2}</span>
  231. </div>
  232. <div class="word">
  233. <%-- 预警提醒--%>
  234. <%-- 项目逾期竣工--%>
  235. 预警提醒
  236. </div>
  237. </div>
  238. </div>
  239. <%-- <div class="line"></div>--%>
  240. <%-- <div class="layui-card" @click="openCt()">--%>
  241. <%-- <div class="layui-card-body">--%>
  242. <%-- <div class="img_num">--%>
  243. <%-- <img src="${WebSite.asset }/css/images/workPlat/remind.png"/>--%>
  244. <%-- <span class="num">${openNum}</span>--%>
  245. <%-- </div>--%>
  246. <%-- <div class="word">--%>
  247. <%-- 开工红黄灯预警--%>
  248. <%-- </div>--%>
  249. <%-- </div>--%>
  250. <%-- </div>--%>
  251. <div class="line"></div>
  252. <div class="layui-card" @click="offsetCt()">
  253. <div class="layui-card-body">
  254. <div class="img_num">
  255. <img src="${WebSite.asset }/css/images/workPlat/remind.png"/>
  256. <span class="num">${offsetNum}</span>
  257. </div>
  258. <div class="word">
  259. 偏离度红黄灯
  260. </div>
  261. </div>
  262. </div>
  263. <div class="line"></div>
  264. <div class="layui-card">
  265. <div class="layui-card-body" @click="reportEdit()">
  266. <div class="img_num">
  267. <img src="${WebSite.asset }/css/images/workPlat/week_com.png"/>
  268. </div>
  269. <div class="word">
  270. 写周报
  271. </div>
  272. </div>
  273. </div>
  274. <div class="layui-card">
  275. <%-- <div class="layui-card-header"></div>--%>
  276. <div class="layui-card-body" style="margin-bottom: 17px;" @click="monthReportEdit()">
  277. <div class="img_num">
  278. <img src="${WebSite.asset }/css/images/workPlat/month_com.png"/>
  279. </div>
  280. <div class="word">
  281. 写月报
  282. </div>
  283. </div>
  284. </div>
  285. </div>
  286. <%-- <div class="tips">--%>
  287. <%-- <span>快捷提示</span>--%>
  288. <%-- <ul>--%>
  289. <%-- <li>新项目申报,点击<a href="${domain }/subject/subInfo/report">项目信息</a>申报,点击新增进行项目申报;查询项目基本信息和进度等,点击<a--%>
  290. <%-- href="${domain }/subject/subInfo/projTz">项目信息台帐</a>;施工阶段,编制计划,开工申报,竣工申报,项目变更,点击<a--%>
  291. <%-- href="${domain }/subject/process/manage">项目施工阶段管理</a>--%>
  292. <%-- </li>--%>
  293. <%-- </ul>--%>
  294. <%-- </div>--%>
  295. <div class="tips">
  296. <span>快捷提示</span>
  297. <ul>
  298. <li>新项目申报,1.点击<a href="${domain }/subject/subInfo/report">【项目信息申报】</a>,然后点击新增进行项目申报;2.点击<a @click="add()">【新增项目】</a>直接进行申报;
  299. <%-- 查询项目基本信息和进度等,点击<a--%>
  300. <%-- href="${domain }/subject/subInfo/projTz">项目信息台帐</a>;施工阶段,编制计划,开工申报,竣工申报,项目变更,点击<a--%>
  301. <%-- href="${domain }/subject/process/manage">项目施工阶段管理</a>--%>
  302. </li>
  303. </ul>
  304. </div>
  305. </div>
  306. <div class="table_box" id="chart" style="box-shadow: 0 2px 13px transparent;padding: 0;">
  307. <section class="section1">
  308. <div class="box1">
  309. <div class="build-rate-charts" id="charts-year-start"></div>
  310. <%-- <div class="num_box">--%>
  311. <%-- <span class="num" id="year"></span>--%>
  312. <%-- </div>--%>
  313. <div class="plan_number">
  314. <div class="nummber_top" style="border-bottom: 1px solid #EDEDED;display: flex;flex-direction:column;align-items:flex-start;">
  315. <div>
  316. <span class="title">项目总数</span>
  317. <span class="num" id="totalNum"></span>
  318. </div>
  319. <div>
  320. <span class="title">储备项目数</span>
  321. <span class="num" id="cbNum"></span>
  322. </div>
  323. <div>
  324. <span class="title">新建项目数</span>
  325. <span class="num" id="xjNum"></span>
  326. </div>
  327. <div>
  328. <span class="title">在建项目数</span>
  329. <span class="num" id="zjNum"></span>
  330. </div>
  331. <div>
  332. <span class="title">投产项目数</span>
  333. <span class="num" id="tcNum"></span>
  334. </div>
  335. <%-- <div class="num_box" style="border-right: 1px solid #EDEDED;">--%>
  336. <%-- <span class="num_unit">--%>
  337. <%-- <span class="num" id="proTotalNum"></span>--%>
  338. <%-- <span style="font-size: 16px;color: #111111">个</span>--%>
  339. <%-- </span>--%>
  340. <%-- <span class="title">项目总数</span>--%>
  341. <%-- </div>--%>
  342. <%-- <div class="num_box">--%>
  343. <%-- <span class="num_unit">--%>
  344. <%-- <span class="num" id="proDoingNum"></span>--%>
  345. <%-- <span style="font-size: 16px;color: #111111">个</span>--%>
  346. <%-- </span>--%>
  347. <%-- <span class="title">已开工</span>--%>
  348. <%-- </div>--%>
  349. </div>
  350. <%-- <div class="nummber_top">--%>
  351. <%-- <div class="num_box" style="border-right: 1px solid #EDEDED;">--%>
  352. <%-- <span class="num_unit">--%>
  353. <%-- <span class="num" id="proNoStartNum"></span>--%>
  354. <%-- <span style="font-size: 16px;color: #111111">个</span>--%>
  355. <%-- </span>--%>
  356. <%-- <span class="title">未开工</span>--%>
  357. <%-- </div>--%>
  358. <%-- <!-- <div class="num_box">--%>
  359. <%-- <span class="num" style="color: #fc1cf4;" id="yearPlanNum"></span>--%>
  360. <%-- 年度计划完成--%>
  361. <%-- </div> -->--%>
  362. <%-- <div class="num_box">--%>
  363. <%-- <span class="num_unit">--%>
  364. <%-- <span class="num" id="proEndNum"></span>--%>
  365. <%-- <span style="font-size: 16px;color: #111111">个</span>--%>
  366. <%-- </span>--%>
  367. <%-- <span class="title">已竣工</span>--%>
  368. <%-- </div>--%>
  369. <%-- </div>--%>
  370. </div>
  371. </div>
  372. <div class="box2">
  373. <div class="nummber_top" style="border-bottom: 1px solid #EDEDED;display: flex;flex-direction:column;align-items:flex-start;justify-content: space-evenly;">
  374. <div>
  375. <span class="title">绿灯项目数</span>
  376. <span class="num" id="greenNum">${notExceedNum}</span>
  377. </div>
  378. <div>
  379. <span class="title">黄灯项目数</span>
  380. <span class="num" id="yellowNum">${withinNum}</span>
  381. </div>
  382. <div>
  383. <span class="title">红灯项目数</span>
  384. <span class="num" id="redNum">${outsideNum}</span>
  385. </div>
  386. </div>
  387. <%-- <div class="monthly-charts" id="charts-year-done"></div>--%>
  388. <%-- <div class="plan_number">--%>
  389. <%-- <div class="nummber_top" style="border-bottom: 1px solid #EDEDED;">--%>
  390. <%-- <div class="num_box" style="width: 100%">--%>
  391. <%-- <span class="num_unit">--%>
  392. <%-- <span class="num" id="proPlanAmt"></span>--%>
  393. <%-- <span style="font-size: 16px;color: #111111">亿</span>--%>
  394. <%-- </span>--%>
  395. <%-- <span class="title">年度目标总投资</span>--%>
  396. <%-- </div>--%>
  397. <%-- </div>--%>
  398. <%-- <div class="nummber_top">--%>
  399. <%-- <div class="num_box" style="border-right: 1px solid #EDEDED;width: 50%;">--%>
  400. <%-- <span class="num_unit">--%>
  401. <%-- <span class="num" id="proActualTotal"></span>--%>
  402. <%-- <span style="font-size: 16px;color: #111111">亿</span>--%>
  403. <%-- </span>--%>
  404. <%-- <span class="title">年度计划投资</span>--%>
  405. <%-- </div>--%>
  406. <%-- <div class="num_box" style="border-right: 1px solid #EDEDED;width: 50%;">--%>
  407. <%-- <span class="num_unit">--%>
  408. <%-- <span class="num" id="proActualTotalGt"></span>--%>
  409. <%-- <span style="font-size: 16px;color: #111111">亿</span>--%>
  410. <%-- </span>--%>
  411. <%-- <span class="title">年度固投金额</span>--%>
  412. <%-- </div>--%>
  413. <%-- <!-- <div class="num_box">--%>
  414. <%-- <span class="num" style="color: #fc1cf4;" id="yearPlanNum"></span>--%>
  415. <%-- 年度计划完成--%>
  416. <%-- </div> -->--%>
  417. <%-- <div class="num_box" style="width: 50%;">--%>
  418. <%-- <span class="num_unit">--%>
  419. <%-- <span class="num" id="proActualAmt"></span>--%>
  420. <%-- <span style="font-size: 16px;color: #111111">亿</span>--%>
  421. <%-- </span>--%>
  422. <%-- <span class="title">年度实际投资</span>--%>
  423. <%-- </div>--%>
  424. <%-- </div>--%>
  425. <%-- </div>--%>
  426. </div>
  427. <%-- <div class="box3">--%>
  428. <%-- <div class="txt">整体进度</div>--%>
  429. <%-- <div class="layui-progress" lay-showPercent="true" lay-filter="demo">--%>
  430. <%-- <div class="layui-progress-bar" id="propercent"></div>--%>
  431. <%-- </div>--%>
  432. <%-- </div>--%>
  433. </section>
  434. <section class="section2">
  435. <div class="layui-card" style="box-shadow: 0px 0px 0px 0px transparent;">
  436. <%-- <div class="layui-card-header" style="border:none;display: flex;">--%>
  437. <%-- <span :class="{activeSpan:checkChart==1}" @click="checkChartFun(1)">项目数量占比</span>--%>
  438. <%-- <span :class="{activeSpan:checkChart==2}" @click="checkChartFun(2)" style="margin-left: 20px;">项目投资占比</span>--%>
  439. <%-- </div>--%>
  440. <div class="layui-card-body" style="border:none">
  441. <div class="chart" id="charts1" v-if="checkChart==1"></div>
  442. <%-- <div class="chart" id="charts2" v-if="checkChart==2"></div>--%>
  443. </div>
  444. </div>
  445. <%-- <div class="layui-card" style="box-shadow: 0px 0px 0px 0px transparent;">--%>
  446. <%-- <div class="layui-card-header" style="border:none">--%>
  447. <%-- <span class="activeSpan">投资情况月度分析</span>--%>
  448. <%-- </div>--%>
  449. <%-- <div class="layui-card-body" style="border:none">--%>
  450. <%-- <div class="chart" id="charts3"></div>--%>
  451. <%-- </div>--%>
  452. <%-- </div>--%>
  453. </section>
  454. </div>
  455. </div>
  456. <div id="toDo">
  457. </div>
  458. <%-- <c:if test="${overAmount.isOver != '0' || overAmount.willOver != '0'}">--%>
  459. <%-- <ul class="layui-fixbar" id="fixedBlock" style="right: 10px; bottom: 0px;width:200px;height:90px;display:none;">--%>
  460. <%-- <li class="" style="width:200px;height:26px;line-height:26px;font-size:14px;background-color:#3362c9;color:#fafafa;border-radius: 7px 7px 0px 0px;">--%>
  461. <%-- <span style="position: relative;left: -50px;bottom:0;">逾期提醒</span>--%>
  462. <%-- </li>--%>
  463. <%-- <li class="" style="width:200px;height:32px;line-height:32px;background-color:#fff;color:#f69401;font-size:14px;" @click="loadOverDue(0)">--%>
  464. <%-- <i class="layui-icon layui-icon-radio" style="position: relative;left: -25px;"></i><span style="position: relative;left: -15px;">即将逾期:</span><i style="position:relative;left:20px;"><span>${overAmount.willOver}</span><a href="javascript:void(0);" style="color:#5b64d7;">></a></i>--%>
  465. <%-- </li>--%>
  466. <%-- <li class="" style="width:200px;height:32px;line-height:32px;background-color:#fff;color:#ff2222;border-radius: 0px 0px 7px 7px;font-size:14px;" @click="loadOverDue(1)">--%>
  467. <%-- <i class="layui-icon icon-diy" style="position: relative;left: -28px;"></i><span style="position: relative;left: -18px;">已逾期:</span><i style="position:relative;left:28px;"><span>${overAmount.isOver}</span><a href="javascript:void(0);" style="color:#5b64d7;">></a></i>--%>
  468. <%-- </li>--%>
  469. <%-- </ul>--%>
  470. <%-- </c:if>--%>
  471. </div>
  472. </body>
  473. <script type="text/javascript">
  474. new Vue({
  475. el: '#app',
  476. data: {
  477. checkChart: 1,
  478. kingUnit: "${kingUnit}",
  479. },
  480. mounted() {
  481. this.init();
  482. },
  483. methods: {
  484. init: function () {
  485. this.initChartsYearStart();
  486. // this.initChartsYearDone();
  487. this.initChart();
  488. },
  489. initChart: function (target) {
  490. $("#year").text(new Date().getFullYear() + "年度")
  491. $("#chart").show();
  492. $("#toDo").hide();
  493. $("#fixedBlock").show();
  494. this.changeTab(target);
  495. this.getStatisData();
  496. },
  497. loadOverDue: function (status) {
  498. window.location.href = App.getUrl("/overdue/view?overStatus=" + status);
  499. },
  500. getStatisData: function () {
  501. var self = this;
  502. var data = {};
  503. App.postJson("/api/workBench/getStatis", {}, function (res) {
  504. if (res.success) {
  505. data.chart1Data = {
  506. // 统计数据
  507. cbNum: res.data.cbNum,
  508. xjNum: res.data.xjNum,
  509. zjNum: res.data.zjNum,
  510. tcNum: res.data.tcNum
  511. // nProNum: res.data.zhData.num_X1_total,
  512. // nProNumRate: res.data.zhData.num_X1_zb,
  513. // xProNum: res.data.zhData.num_X2_total,
  514. // xProNumRate: res.data.zhData.num_X2_zb,
  515. // cProNum: res.data.zhData.num_X3_total,
  516. // cProNumRate: res.data.zhData.num_X3_zb,
  517. };
  518. data.chart2Data = {
  519. nProMon: res.data.zhData.amt_X1_total,
  520. nProMonRate: res.data.zhData.amt_X1_zb,
  521. xProMon: res.data.zhData.amt_X2_total,
  522. xProMonRate: res.data.zhData.amt_X2_zb,
  523. cProMon: res.data.zhData.amt_X3_total,
  524. cProMonRate: res.data.zhData.amt_X3_zb,
  525. };
  526. data.chart3Data = res.data.monthAnalys;
  527. self.chartsAmtRate=res.data.zhData.num_bl || '0.00%';
  528. res.data.zhData.amt_jh=(res.data.zhData.amt_jh/10000).toFixed(2);
  529. res.data.zhData.amt_total=(res.data.zhData.amt_total/10000).toFixed(2);
  530. res.data.zhData.amt_sj=(res.data.zhData.amt_sj/10000).toFixed(2);
  531. res.data.zhData.amt_gt=(res.data.zhData.amt_gt/10000).toFixed(2);
  532. $("#proTotalNum").text(res.data.zhData.num_total || 0);
  533. $("#proNoStartNum").text(res.data.zhData.num_1 || 0);
  534. $("#proDoingNum").text(res.data.zhData.num_2 || 0);
  535. $("#proEndNum").text(res.data.zhData.num_3 || 0);
  536. $("#proActualTotal").text(res.data.zhData.amt_jh || 0);
  537. $("#proActualTotalGt").text(res.data.zhData.amt_gt || 0);
  538. $("#proPlanAmt").text(res.data.zhData.amt_total || 0);
  539. $("#proActualAmt").text(res.data.zhData.amt_sj || 0);
  540. $("#yearPlanNum").text(res.data.zhData.num_4 || 0);
  541. // 统计数据
  542. $("#totalNum").text(res.data.totalNum || 0);
  543. $("#cbNum").text(res.data.cbNum || 0);
  544. $("#xjNum").text(res.data.xjNum || 0);
  545. $("#zjNum").text(res.data.zjNum || 0);
  546. $("#tcNum").text(res.data.tcNum || 0);
  547. if (res.data.yearKgl){
  548. self.beginBl = res.data.yearKgl;
  549. }
  550. // if(res.data.zhData.num_total!=0){
  551. // self.beginBl = ((res.data.zhData.num_2 + res.data.zhData.num_3) * 100 / res.data.zhData.num_total).toFixed(2);
  552. // }else{
  553. // self.beginBl=0;
  554. // }
  555. self.initChart1(data.chart1Data);
  556. self.initChart2(data.chart2Data);
  557. self.initChart3(data.chart3Data);
  558. self.initChartsYearStart();
  559. // self.initChartsYearDone();
  560. setTimeout(() => {
  561. layui.element.progress('demo', res.data.zhData.num_bl || '0%');
  562. }, 100);
  563. }
  564. });
  565. },
  566. getTotalTodo: function (target) {
  567. //this.changeTab(target);
  568. $("#chart").hide();
  569. // $("#fixedBlock").hide();
  570. $("#toDo").show();
  571. $("#toDo").load(App.getUrl("workBench/toDoView"));
  572. // window.location.href = App.getUrl("/workBench/toDoView");
  573. },
  574. getTotalDo: function (target) {
  575. // this.changeTab(target);
  576. $("#chart").hide();
  577. // $("#toDo").show();
  578. $("#fixedBlock").hide();
  579. $("#toDo").load(App.getUrl("workBench/doView"));
  580. },
  581. changeTab: function (target) {
  582. if (target) {
  583. $(".layui-card").removeClass("active");
  584. $(target).addClass("active");
  585. }
  586. },
  587. toYQ: function () {
  588. //window.location.href = App.getUrl("/overdue/view?overStatus=2");
  589. window.location.href = App.getUrl("/problem/info/index");
  590. },
  591. openCt: function () {
  592. window.location.href = App.getUrl("/subject/subInfo/lightCt?type=1");
  593. },
  594. offsetCt: function () {
  595. window.location.href = App.getUrl("/subject/subInfo/lightCt?type=2");
  596. },
  597. add : function(){
  598. var self = this;
  599. var content='<span style="color:red;font-size:25px;"> SM项目禁止录入!!!!</span>';
  600. layer.confirm(content,{
  601. area: ['350px',''],
  602. btn: ['开始录入','取消']
  603. }, function(){
  604. window.location.href= App.getUrl("/subject/subInfo/add");
  605. })
  606. },
  607. reportEdit: function () {
  608. window.location.href = App.getUrl("weekReport/view");
  609. },
  610. monthReportEdit: function () {
  611. window.location.href = App.getUrl("/monthReport/view");
  612. },
  613. initChart1: function (datas) {
  614. const option = {
  615. grid: {
  616. left: 10,
  617. right: 10,
  618. bottom: 20
  619. },
  620. title: {
  621. show: false
  622. },
  623. legend: {
  624. bottom: 10,
  625. left: 'center',
  626. data: [{
  627. name: '储备项目',
  628. icon: 'circle'
  629. }, {
  630. name: '新建项目',
  631. icon: 'circle'
  632. }, {
  633. name: '在建项目',
  634. icon: 'circle'
  635. }, {
  636. name: '投产项目',
  637. icon: 'circle'
  638. }]
  639. },
  640. color: ['#1faff8', '#e1b710', '#f1555d','#449a34'],
  641. tooltip: {
  642. formatter: '{c}<br/>({d}%)',
  643. position: ['45%', '38%'],
  644. backgroundColor: 'none',
  645. borderWidth: 0,
  646. textStyle: {
  647. color: '#333',
  648. fontSize: 20
  649. }
  650. },
  651. series: [{
  652. type: 'pie',
  653. radius: ['35%', '50%'],
  654. label: {
  655. formatter: '{c}个 {d}%'
  656. },
  657. emphasis: {
  658. label: {
  659. show: true
  660. }
  661. },
  662. data: [
  663. {value: datas.cbNum, name: '储备项目', label: {rotate: 50}},
  664. {value: datas.xjNum, name: '新建项目'},
  665. {value: datas.zjNum, name: '在建项目'},
  666. {value: datas.tcNum, name: '投产项目', label: {rotate: -30}}
  667. ]
  668. }]
  669. }
  670. if (document.getElementById('charts1')) {
  671. const myChart = echarts.init(document.getElementById('charts1'));
  672. myChart.setOption(option);
  673. }
  674. },
  675. initChart2: function (datas) {
  676. const option = {
  677. grid: {
  678. left: 10,
  679. right: 10,
  680. bottom: 20
  681. },
  682. title: {
  683. show: false
  684. },
  685. legend: {
  686. bottom: 10,
  687. left: 'center',
  688. data: [{
  689. name: '储备项目',
  690. icon: 'circle'
  691. }, {
  692. name: '新建项目',
  693. icon: 'circle'
  694. }, {
  695. name: '续建项目',
  696. icon: 'circle'
  697. }]
  698. },
  699. color: ['#1faff8', '#e1b710', '#f1555d'],
  700. tooltip: {
  701. formatter: '{c}<br/>({d}%)',
  702. position: ['40%', '38%'],
  703. backgroundColor: 'none',
  704. borderWidth: 0,
  705. textStyle: {
  706. color: '#333',
  707. fontSize: 20
  708. }
  709. },
  710. series: [{
  711. type: 'pie',
  712. radius: ['35%', '50%'],
  713. label: {
  714. formatter: '{c}万元 {d}%'
  715. },
  716. data: [
  717. {value: datas.cProMon, name: '储备项目', label: {rotate: 50}},
  718. {value: datas.nProMon, name: '新建项目'},
  719. {value: datas.xProMon, name: '续建项目', label: {rotate: -30}}
  720. ]
  721. }]
  722. }
  723. if (document.getElementById('charts2')) {
  724. const myChart = echarts.init(document.getElementById('charts2'));
  725. myChart.setOption(option);
  726. }
  727. },
  728. initChart3: function (datas) {
  729. const option = {
  730. grid: {
  731. left: 60,
  732. right: 10,
  733. bottom: 50,
  734. top: 20
  735. },
  736. tooltip: { trigger: 'axis'},
  737. title: {
  738. show: false
  739. },
  740. legend: {
  741. left: 'center',
  742. bottom: 0
  743. },
  744. xAxis: {
  745. type: 'category',
  746. data: datas.months
  747. },
  748. yAxis: {
  749. type: 'value'
  750. },
  751. color: ['#1faff8','#e1b710'],
  752. series: [{
  753. name: '实际投资',
  754. data: datas.sjMoney,
  755. type: 'bar',
  756. barWidth: 10,
  757. itemStyle: {
  758. normal: {
  759. label: {
  760. show: false, //开启显示
  761. position: 'top', //在上方显示
  762. textStyle: { //数值样式
  763. color: 'black',
  764. fontSize: 16
  765. }
  766. }
  767. }
  768. }
  769. },{
  770. name: '计划投资',
  771. data: datas.jhMoney,
  772. type: 'bar',
  773. barWidth: 10,
  774. itemStyle: {
  775. normal: {
  776. label: {
  777. show: false, //开启显示
  778. position: 'top', //在上方显示
  779. textStyle: { //数值样式
  780. color: 'black',
  781. fontSize: 16
  782. }
  783. }
  784. }
  785. }
  786. }]
  787. };
  788. if (document.getElementById('charts3')) {
  789. const myChart = echarts.init(document.getElementById('charts3'));
  790. myChart.setOption(option);
  791. }
  792. },
  793. // Echarts--年度开工率on
  794. initChartsYearStart: function () {
  795. let dataValue = this.beginBl?this.beginBl.toString():'0.00';
  796. // 拆分整数小数
  797. let dataValueArr = dataValue.includes(".") ? dataValue.split(".") : [dataValue, "00"];
  798. let dataValueInt = dataValueArr[0];
  799. let dataValueFloat = dataValueArr[1] + "%";
  800. let option = {
  801. title: {
  802. text: '{a|' + dataValueInt + '}{b|.' + dataValueFloat + '}',
  803. subtext: '年度开工率',
  804. left: 'center',
  805. top: '35%',
  806. itemGap: 1,
  807. textStyle: {
  808. color: '#FC5E74',
  809. fontSize: 24,
  810. lineHeight: 10,
  811. rich: {
  812. b: {
  813. fontSize: 16,
  814. }
  815. }
  816. },
  817. subtextStyle: {
  818. color: "#333333",
  819. fontSize: 12
  820. }
  821. },
  822. tooltip: {
  823. formatter: function (params) {
  824. return (
  825. '<span style="color: #000;">年度开工率:' + params.value + '%</span>'
  826. );
  827. }
  828. },
  829. angleAxis: {
  830. max: 100,
  831. clockwise: true, // 逆时针
  832. show: false,
  833. startAngle: 90
  834. },
  835. radiusAxis: {
  836. type: 'category',
  837. show: true,
  838. axisLabel: {
  839. show: false
  840. },
  841. axisLine: {
  842. show: false
  843. },
  844. axisTick: {
  845. show: false
  846. }
  847. },
  848. polar: [
  849. {
  850. center: ['50%', '50%'], //中心点位置
  851. radius: ['87%', '95%'] //图形大小
  852. }
  853. ],
  854. series: [
  855. {
  856. type: 'bar',
  857. z: 10,
  858. data: [dataValue],
  859. showBackground: false,
  860. coordinateSystem: 'polar',
  861. roundCap: false,
  862. barWidth: 18, //大的占比环
  863. itemStyle: {
  864. normal: {
  865. opacity: 1,
  866. color: "#3F90FF",
  867. borderRadius: '50%'
  868. }
  869. }
  870. },
  871. {
  872. type: 'pie',
  873. name: '内层细圆环',
  874. radius: ['89%', '94%'],
  875. startAngle: 90,
  876. hoverAnimation: false,
  877. clockWise: true,
  878. itemStyle: {
  879. color: "#ccc",
  880. },
  881. tooltip: {
  882. show: false
  883. },
  884. label: {
  885. show: false
  886. },
  887. data: [100]
  888. }
  889. ]
  890. };
  891. let myChart = document.getElementById("charts-year-start") && echarts.init(document.getElementById("charts-year-start"));
  892. myChart.setOption(option);
  893. },
  894. // Echarts--年度投资率
  895. initChartsYearDone: function () {
  896. let dataValue = this.chartsAmtRate?this.chartsAmtRate:'0.00%';
  897. // 拆分整数小数
  898. let dataValueArr = dataValue.includes(".") ? dataValue.split(".") : [dataValue, "00"];
  899. let dataValueInt = dataValueArr[0];
  900. let dataValueFloat = dataValueArr[1];
  901. let option = {
  902. title: {
  903. text: '{a|' + dataValueInt + '}{b|.' + dataValueFloat + '}',
  904. subtext: '年度投资率',
  905. left: 'center',
  906. top: '35%',
  907. itemGap: 1,
  908. textStyle: {
  909. color: '#3F90FF',
  910. fontSize: 24,
  911. lineHeight: 10,
  912. rich: {
  913. b: {
  914. fontSize: 16,
  915. }
  916. }
  917. },
  918. subtextStyle: {
  919. color: "#333333",
  920. fontSize: 12
  921. }
  922. },
  923. tooltip: {
  924. formatter: function (params) {
  925. return (
  926. '<span style="color: #000;">年度投资率:' + params.value + '</span>'
  927. );
  928. }
  929. },
  930. angleAxis: {
  931. max: 100,
  932. clockwise: true, // 逆时针
  933. show: false,
  934. startAngle: 90
  935. },
  936. radiusAxis: {
  937. type: 'category',
  938. show: true,
  939. axisLabel: {
  940. show: false
  941. },
  942. axisLine: {
  943. show: false
  944. },
  945. axisTick: {
  946. show: false
  947. }
  948. },
  949. polar: [
  950. {
  951. center: ['50%', '50%'], //中心点位置
  952. radius: ['87%', '95%'] //图形大小
  953. }
  954. ],
  955. series: [
  956. {
  957. type: 'bar',
  958. z: 10,
  959. data: [dataValue],
  960. showBackground: false,
  961. coordinateSystem: 'polar',
  962. roundCap: false,
  963. barWidth: 18, //大的占比环
  964. itemStyle: {
  965. normal: {
  966. opacity: 1,
  967. color: "#FC5E74",
  968. borderRadius: '50%'
  969. }
  970. }
  971. },
  972. {
  973. type: 'pie',
  974. name: '内层细圆环',
  975. radius: ['89%', '94%'],
  976. startAngle: 90,
  977. hoverAnimation: false,
  978. clockWise: true,
  979. itemStyle: {
  980. color: "#CCCCCC",
  981. },
  982. tooltip: {
  983. show: false
  984. },
  985. label: {
  986. show: false
  987. },
  988. data: [100]
  989. }
  990. ]
  991. };
  992. let myChart = document.getElementById("charts-year-done") && echarts.init(document.getElementById("charts-year-done"));
  993. myChart.setOption(option);
  994. },
  995. toItems: function (index) {
  996. if (index === 1) {
  997. //周报查询
  998. window.location.href = App.getUrl("/weekReport/view");
  999. } else if (index === 2) {
  1000. //月报查询
  1001. window.location.href = App.getUrl("/monthReport/view");
  1002. } else if (index === 3) {
  1003. //问题跟踪
  1004. window.location.href = App.getUrl("/problemtrack/index");
  1005. } else if (index === 4) {
  1006. //包联项目
  1007. window.location.href = App.getUrl("/subject/subInfo/blSub");
  1008. } else if (index === 5) {
  1009. //办事流程
  1010. // window.location.href = App.getUrl("/problem/tracing/tracinglist");
  1011. } else if (index === 6) {
  1012. //智慧工地
  1013. window.location.href = App.getUrl("/smart/index");
  1014. } else if (index === 7) {
  1015. //红黄绿灯
  1016. window.location.href = App.getUrl("/subject/subInfo/projTz?type=2");
  1017. }
  1018. },
  1019. checkChartFun: function (index) {
  1020. this.checkChart = index;
  1021. this.getStatisData();
  1022. }
  1023. }
  1024. })
  1025. </script>
  1026. </html>