detailView.jsp 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
  2. pageEncoding="UTF-8"%>
  3. <%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
  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" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
  14. <title>项目信息</title>
  15. </head>
  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. <style>
  20. .project-title{
  21. width:100%;
  22. margin:17px 0;
  23. font-weight: 500;
  24. font-size: 22px;
  25. color: #15294C;
  26. text-align:center;
  27. }
  28. .project-status{
  29. display:flex;
  30. align-items:center;
  31. justify-content:center;
  32. width:100%;
  33. height: 45px;
  34. font-weight: 400;
  35. font-size: 14px;
  36. color: #333333;
  37. background: #F0F8FF;
  38. }
  39. .project-status-light img{
  40. margin-left:5px;
  41. margin-right:5px;
  42. }
  43. .project-status-offset,
  44. .project-status-info{
  45. height:14px;
  46. margin-left:10px;
  47. padding-left:10px;
  48. line-height:14px;
  49. box-sizing:border-box;
  50. color: #999999;
  51. font-size: 12px;
  52. }
  53. .project-status-info button{
  54. width:fit-content;
  55. height:18px;
  56. margin:-2px 2px 0 2px;
  57. padding:2px;
  58. box-sizing:border-box;
  59. line-height:14px;
  60. color:#fff;
  61. border-radius:2px;
  62. cursor:pointer;
  63. }
  64. .project-status-plan{
  65. display:flex;
  66. align-items:center;
  67. }
  68. .plan-box{
  69. display:flex;
  70. align-items:center;
  71. height:14px;
  72. margin-left:10px;
  73. padding-left:10px;
  74. line-height:14px;
  75. box-sizing:border-box;
  76. }
  77. .plan-icon{
  78. display: flex;
  79. justify-content: center;
  80. align-items: center;
  81. width: 16px;
  82. height: 16px;
  83. margin-right:3px;
  84. border-radius: 50%;
  85. color: #fff;
  86. background: gray;
  87. }
  88. .plan-icon-done{
  89. background: #4979cf;
  90. }
  91. .light-rgb{
  92. width:32px;
  93. height:32px;
  94. margin: auto;
  95. }
  96. .light-rgb-red{
  97. width:32px;
  98. height:32px;
  99. margin: auto;
  100. animation: blink 2s infinite; /* 调用动画,持续1秒,重复无限次 */
  101. }
  102. /* 定义闪烁的动画 */
  103. @keyframes blink {
  104. 0% {
  105. opacity: 1; /* 不透明 */
  106. }
  107. 50% {
  108. opacity: 0; /* 透明 */
  109. }
  110. 100% {
  111. opacity: 1; /* 不透明 */
  112. }
  113. }
  114. .project-status-lights {
  115. display: flex;
  116. justify-content: center; /* 居中显示 */
  117. align-items: center;
  118. margin-top: 10px; /* 与上方偏离度有间隔 */
  119. flex-wrap: wrap;
  120. }
  121. .light-item {
  122. display: flex;
  123. flex-direction: row-reverse;
  124. align-items: center; /* 水平居中 */
  125. margin: 10px; /* 每个灯之间的间隔 */
  126. text-align: center;
  127. }
  128. .light-item img {
  129. width: 32px; /* 调整灯的宽度 */
  130. height: 32px; /* 调整灯的高度 */
  131. }
  132. .light-name {
  133. margin-top: 5px;
  134. font-size: 14px;
  135. color: #333;
  136. font-weight: 400;
  137. }
  138. .page-table{
  139. margin: 0 0 22px !important;
  140. }
  141. .table_box .table1 .label{
  142. color:#999;
  143. }
  144. .right_title{
  145. /*margin-bottom: 20px;*/
  146. }
  147. .layui-layout::-webkit-scrollbar{
  148. width: 0;
  149. }
  150. .amt-value{
  151. font-weight: bold;
  152. color: #333;
  153. }
  154. .amt-rate{
  155. color: #FF3300;
  156. }
  157. </style>
  158. <body>
  159. <div id="app"></div>
  160. <template id="template">
  161. <div class="layui-layout layui-layout-admin detail" style=" padding: 0 20px 0px;overflow: auto">
  162. <input type="hidden" id="subId" value="${sunInfo.id }"/>
  163. <input type="hidden" id="projectName" value="${sunInfo.sub_name }"/>
  164. <input type="hidden" id="unitName" value="${sunInfo.unitName }"/>
  165. <div class="tab-group" style="position: relative;">
  166. <button class="btn btn1" :class="{active: tabActive === 1}" @click="onChangeActive(1)">项目信息</button>
  167. <button class="btn btn2" :class="{active: tabActive === 2}" @click="onChangeActive(2)">项目进度</button>
  168. <button class="btn btn2" :class="{active: tabActive === 6}" @click="onChangeActive(6)">项目前期手续办理情况</button>
  169. <button class="btn btn2" :class="{active: tabActive === 7}" @click="onChangeActive(7)">问题督办</button>
  170. <button class="btn btn2" :class="{active: tabActive === 9}" @click="onChangeActive(9)">项目图片及影像</button>
  171. <%-- <button class="btn btn2" :class="{active: tabActive === 11}" @click="onChangeActive(11)">重大事项</button>--%>
  172. <c:if test="${completeCheck}">
  173. <button class="btn btn2" :class="{active: tabActive === 10}" @click="onChangeActive(10)">竣工报告</button>
  174. </c:if>
  175. <button class="layui-btn layui-btn-normal" style="position:relative;z-index:9;float: right" @click="backHis()">返回</button>
  176. </div>
  177. <iframe :src="iframeUrl" style="min-height:500px;border:none;margin-top: 30px"></iframe>
  178. </div>
  179. </template>
  180. <script>
  181. new Vue({
  182. el: "#app",
  183. template: "#template",
  184. data: {
  185. winH: 0,
  186. iframeUrl: "",
  187. subId: "${subId}",
  188. collapse: false,
  189. tabActive: 1,
  190. warningLight: {
  191. "qq": 0, //前期手续办理 0绿灯 1黄灯 2红灯
  192. "yb": 0, //月报
  193. "kg": 0, //开工
  194. "jg": 0 //竣工
  195. }
  196. },
  197. mounted: function() {
  198. this.init()
  199. },
  200. methods: {
  201. init: function() {
  202. this.winH = document.body.clientHeight;
  203. this.onChangeActive(1);
  204. this.getWarningStatus();
  205. },
  206. monthReportEdit() {
  207. window.location.href = App.getUrl("/monthReport/view");
  208. },
  209. detail() {
  210. var self = this;
  211. var subId = this.subId;
  212. window.location.href=App.getUrl("/subject/subInfo/detail?subId=" + subId);
  213. },
  214. toPre() {
  215. var self = this;
  216. var subId = this.subId;
  217. window.location.href=App.getUrl("/subPreNew/sbTodo?subId="+subId);
  218. },
  219. getWarningStatus() {
  220. var self = this;
  221. var subId = this.subId;
  222. // 使用路径传递参数
  223. const url = '/api/subInfo/query/getWarningBySubId/' + subId;
  224. App.postJson(url, {}, function (res) {
  225. if (res.success) {
  226. console.log("获取到的数据:",res.data)
  227. self.warningLight = res.data
  228. }
  229. });
  230. },
  231. backHis(){
  232. if(${layer}) {
  233. App.closeCurrentLayer();
  234. }else {
  235. window.location.href="${lastUrl}";
  236. }
  237. },
  238. changeSide() {
  239. this.collapse = !this.collapse
  240. },
  241. onChangeActive(index) {
  242. var subId = this.subId;
  243. this.tabActive = index
  244. if (index === 1) {
  245. this.iframeUrl = App.getUrl("/overdue/projectInfo2?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  246. }else if(index === 2){
  247. this.iframeUrl = App.getUrl("/rptCont/viewBySub?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  248. }else if(index === 4){
  249. this.iframeUrl = App.getUrl("/weekReport/detailView?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  250. }else if(index === 5){
  251. this.iframeUrl = App.getUrl("/amtPlan/detailView?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  252. }/* else{
  253. window.location.href = App.getUrl("/overdue/projHistory?layer=${layer}&subId="+subId + "&lastUrl=${lastUrl}");
  254. } */
  255. else if(index === 6) {
  256. //项目前期
  257. this.iframeUrl = App.getUrl("/subPreNew/subList?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  258. } else if(index === 7) {
  259. //问题督办
  260. this.iframeUrl = App.getUrl("/problemreport/subDetail?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  261. } else if(index === 8) {
  262. //牵头领导
  263. this.iframeUrl = App.getUrl("/secUserSub/subDetail?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  264. } else if(index === 9) {
  265. //现场影像
  266. this.iframeUrl = App.getUrl("/rptCont/fileDetail?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  267. } else if(index === 10) {
  268. //竣工报告
  269. this.iframeUrl = App.getUrl("/subComplete/view?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  270. } else if(index === 11) {
  271. //重大事项
  272. this.iframeUrl = App.getUrl("/meetingRecords/listBySubId?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
  273. } else if(index === 12) {
  274. //短信发送
  275. this.iframeUrl = App.getUrl("/msgLog/subDetail?layer=${layer}&subId="+subId+"&queryYear=${queryYear}&lastUrl=${lastUrl}");
  276. } else if(index === 13) {
  277. //项目日志
  278. this.iframeUrl = App.getUrl("/subDataLog/subList?layer=${layer}&subId="+subId+"&queryYear=${queryYear}&lastUrl=${lastUrl}");
  279. }
  280. }
  281. }
  282. })
  283. </script>
  284. </body>
  285. </html>