|
|
@@ -0,0 +1,379 @@
|
|
|
+<%@ page language="java" contentType="text/html; charset=UTF-8"
|
|
|
+ pageEncoding="UTF-8"%>
|
|
|
+<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
|
|
|
+<%@ page isELIgnored="false"%>
|
|
|
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
|
|
+<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
|
|
|
+<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+<meta charset="utf-8" />
|
|
|
+<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
|
+<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
|
|
|
+<title>项目信息</title>
|
|
|
+</head>
|
|
|
+<jsp:include page="../../common/common-meta-include.jsp"></jsp:include>
|
|
|
+<jsp:include page="../../common/common-js-include.jsp"></jsp:include>
|
|
|
+<jsp:include page="../../common/common-css-include.jsp"></jsp:include>
|
|
|
+<style>
|
|
|
+ .project-title{
|
|
|
+ width:100%;
|
|
|
+ margin:17px 0;
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 27px;
|
|
|
+ color: #333333;
|
|
|
+ text-align:center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .project-status{
|
|
|
+ display:flex;
|
|
|
+ align-items:center;
|
|
|
+ justify-content:center;
|
|
|
+ width:100%;
|
|
|
+ height: 45px;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ background: rgba(28,86,163,0.05);
|
|
|
+ }
|
|
|
+
|
|
|
+ .project-status-light img{
|
|
|
+ margin-left:5px;
|
|
|
+ margin-right:5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .project-status-offset,
|
|
|
+ .project-status-info{
|
|
|
+ height:14px;
|
|
|
+ margin-left:10px;
|
|
|
+ padding-left:10px;
|
|
|
+ line-height:14px;
|
|
|
+ box-sizing:border-box;
|
|
|
+ color: #999999;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .project-status-info button{
|
|
|
+ width:fit-content;
|
|
|
+ height:18px;
|
|
|
+ margin:-2px 2px 0 2px;
|
|
|
+ padding:2px;
|
|
|
+ box-sizing:border-box;
|
|
|
+ line-height:14px;
|
|
|
+ color:#fff;
|
|
|
+ border-radius:2px;
|
|
|
+ cursor:pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .project-status-plan{
|
|
|
+ display:flex;
|
|
|
+ align-items:center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plan-box{
|
|
|
+ display:flex;
|
|
|
+ align-items:center;
|
|
|
+ height:14px;
|
|
|
+ margin-left:10px;
|
|
|
+ padding-left:10px;
|
|
|
+ line-height:14px;
|
|
|
+ box-sizing:border-box;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plan-icon{
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ margin-right:3px;
|
|
|
+ border-radius: 50%;
|
|
|
+ color: #fff;
|
|
|
+ background: gray;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plan-icon-done{
|
|
|
+ background: #4979cf;
|
|
|
+ }
|
|
|
+ .light-rgb{
|
|
|
+ width:32px;
|
|
|
+ height:32px;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+ .light-rgb-red{
|
|
|
+ width:32px;
|
|
|
+ height:32px;
|
|
|
+ margin: auto;
|
|
|
+ animation: blink 2s infinite; /* 调用动画，持续1秒，重复无限次 */
|
|
|
+ }
|
|
|
+ /* 定义闪烁的动画 */
|
|
|
+ @keyframes blink {
|
|
|
+ 0% {
|
|
|
+ opacity: 1; /* 不透明 */
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ opacity: 0; /* 透明 */
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 1; /* 不透明 */
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .project-status-lights {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center; /* 居中显示 */
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 10px; /* 与上方偏离度有间隔 */
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .light-item {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center; /* 水平居中 */
|
|
|
+ margin: 10px; /* 每个灯之间的间隔 */
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .light-item img {
|
|
|
+ width: 32px; /* 调整灯的宽度 */
|
|
|
+ height: 32px; /* 调整灯的高度 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .light-name {
|
|
|
+ margin-top: 5px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+
|
|
|
+ .page-table{
|
|
|
+ margin: 0 0 22px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .table_box .table1 .label{
|
|
|
+ color:#999;
|
|
|
+ }
|
|
|
+ .right_title{
|
|
|
+ /*margin-bottom: 20px;*/
|
|
|
+ }
|
|
|
+ .layui-layout::-webkit-scrollbar{
|
|
|
+ width: 0;
|
|
|
+ }
|
|
|
+ .amt-value{
|
|
|
+ font-weight: bold;
|
|
|
+ color: #1C56A3;
|
|
|
+ }
|
|
|
+.amt-rate{
|
|
|
+ color: #FF3300;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<body>
|
|
|
+<div id="app"></div>
|
|
|
+<template id="template">
|
|
|
+ <div class="layui-layout layui-layout-admin" style=" padding: 0 20px 0px;overflow: auto">
|
|
|
+ <input type="hidden" id="subId" value="${sunInfo.id }"/>
|
|
|
+ <input type="hidden" id="projectName" value="${sunInfo.sub_name }"/>
|
|
|
+ <input type="hidden" id="unitName" value="${sunInfo.unitName }"/>
|
|
|
+ <!-- 内容区域 -->
|
|
|
+ <div class="right_title">
|
|
|
+ <div class="project-title">
|
|
|
+ <c:choose>
|
|
|
+ <c:when test="${sunInfo.isBl == '1'}">
|
|
|
+ <div>${sunInfo.sub_name}</div>
|
|
|
+ </c:when>
|
|
|
+ <c:otherwise>
|
|
|
+ <div>${sunInfo.sub_name}</div>
|
|
|
+ </c:otherwise>
|
|
|
+ </c:choose>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="project-status">
|
|
|
+
|
|
|
+ <div class="project-status-offset">偏离度：<span class="amt-value">${sunInfo.offset}%</span></div>
|
|
|
+
|
|
|
+ <div class="project-status-info">项目状况：<span class="amt-value">${sunInfo.statusName}</span></div>
|
|
|
+
|
|
|
+ <div class="project-status-plan">
|
|
|
+ <div class="project-status-offset">总投资：<span class="amt-value">${totalAmt }亿</span></div>
|
|
|
+ <div class="project-status-offset">已完成投资：<span class="amt-value">${allEndAmt }亿</span>(<span class="amt-rate">${allEndAmtRate }%</span>)</div>
|
|
|
+ <div class="project-status-offset">年度计划投资：<span class="amt-value">${yearAmt}亿</span></div>
|
|
|
+ <div class="project-status-offset">年度完成投资：<span class="amt-value">${yearAmtSj }亿</span>(<span class="amt-rate">${yearEndAmtRate }%</span>)</div>
|
|
|
+ <div class="project-status-offset">应完成投资：<span class="amt-value">${yearPlanAmt}亿</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 灯显示区域，单独一行 -->
|
|
|
+ <div class="project-status-lights">
|
|
|
+ <div class="light-item" @click="monthReportEdit()">
|
|
|
+ <img v-if="warningLight.yb === 0" class="light-rgb" src="${WebSite.asset}/css/images/light-green.png" />
|
|
|
+ <img v-if="warningLight.yb === 1" class="light-rgb-red" src="${WebSite.asset}/css/images/light-yellow.png" />
|
|
|
+ <img v-if="warningLight.yb === 2" class="light-rgb-red" src="${WebSite.asset}/css/images/light-red.png" />
|
|
|
+ <div class="light-name">月报警示灯</div>
|
|
|
+ </div>
|
|
|
+ <div class="light-item" @click="detail()">
|
|
|
+ <img v-if="warningLight.kg === 0" class="light-rgb" src="${WebSite.asset}/css/images/light-green.png" />
|
|
|
+ <img v-if="warningLight.kg === 1" class="light-rgb-red" src="${WebSite.asset}/css/images/light-yellow.png" />
|
|
|
+ <img v-if="warningLight.kg === 2" class="light-rgb-red" src="${WebSite.asset}/css/images/light-red.png" />
|
|
|
+ <div class="light-name">开工警示灯</div>
|
|
|
+ </div>
|
|
|
+ <div class="light-item" @click="toPre()">
|
|
|
+ <img v-if="warningLight.qq === 0" class="light-rgb" src="${WebSite.asset}/css/images/light-green.png" />
|
|
|
+ <img v-if="warningLight.qq === 1" class="light-rgb-red" src="${WebSite.asset}/css/images/light-yellow.png" />
|
|
|
+ <img v-if="warningLight.qq === 2" class="light-rgb-red" src="${WebSite.asset}/css/images/light-red.png" />
|
|
|
+ <div class="light-name">手续警示灯</div>
|
|
|
+ </div>
|
|
|
+ <div class="light-item" @click="detail()">
|
|
|
+ <img v-if="warningLight.jg === 0" class="light-rgb" src="${WebSite.asset}/css/images/light-green.png" />
|
|
|
+ <img v-if="warningLight.jg === 1" class="light-rgb-red" src="${WebSite.asset}/css/images/light-yellow.png" />
|
|
|
+ <img v-if="warningLight.jg === 2" class="light-rgb-red" src="${WebSite.asset}/css/images/light-red.png" />
|
|
|
+ <div class="light-name">竣工警示灯</div>
|
|
|
+ </div>
|
|
|
+ <div class="light-item" @click="onChangeActive(2)">
|
|
|
+ <%-- 偏离度显示 --%>
|
|
|
+ <c:choose>
|
|
|
+ <c:when test="${sunInfo.status_fgw == '2'}">
|
|
|
+ <img class="light-rgb-red" src="${WebSite.asset}/css/images/light-red.png" title="${not empty sunInfo.problemReason ? sunInfo.problemReason : '暂无描述'}"></img>
|
|
|
+ </c:when>
|
|
|
+ <c:when test="${sunInfo.status_fgw == '1'}">
|
|
|
+ <div><img class="light-rgb-red" src="${WebSite.asset}/css/images/light-yellow.png" title="${not empty sunInfo.problemReason ? sunInfo.problemReason : '暂无描述'}"></img></div>
|
|
|
+ </c:when>
|
|
|
+ <c:otherwise>
|
|
|
+ <div><img class="light-rgb" src="${WebSite.asset}/css/images/light-green.png"></img></div>
|
|
|
+ </c:otherwise>
|
|
|
+ </c:choose>
|
|
|
+ <div class="light-name">偏离度警示灯</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="tab-group" style="position: relative;">
|
|
|
+ <button class="btn btn1" :class="{active: tabActive === 1}" @click="onChangeActive(1)">项目信息</button>
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 2}" @click="onChangeActive(2)">项目进度</button>
|
|
|
+ <!-- <button class="btn btn2" :class="{active: tabActive === 3}" @click="onChangeActive(3)">历史记录</button> -->
|
|
|
+<!-- <button class="btn btn2" :class="{active: tabActive === 4}" @click="onChangeActive(4)">周报</button>
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 5}" @click="onChangeActive(5)">年度计划</button> -->
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 6}" @click="onChangeActive(6)">项目前期手续办理情况</button>
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 7}" @click="onChangeActive(7)">问题督办</button>
|
|
|
+ <!-- <button class="btn btn2" :class="{active: tabActive === 8}" @click="onChangeActive(8)">牵头领导及部门</button> -->
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 9}" @click="onChangeActive(9)">项目图片及影像</button>
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 11}" @click="onChangeActive(11)">重大事项</button>
|
|
|
+<!-- <button class="btn btn2" :class="{active: tabActive === 12}" @click="onChangeActive(12)">短信发送</button>
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 13}" @click="onChangeActive(13)">项目日志</button> -->
|
|
|
+ <%--竣工项目 才有竣工报告--%>
|
|
|
+ <c:if test="${completeCheck}">
|
|
|
+ <button class="btn btn2" :class="{active: tabActive === 10}" @click="onChangeActive(10)">竣工报告</button>
|
|
|
+ </c:if>
|
|
|
+ <button class="layui-btn layui-btn-normal" style="position:relative;z-index:9;float: right" @click="backHis()">返回</button>
|
|
|
+ </div>
|
|
|
+ <iframe :src="iframeUrl" style="min-height:430px;border:none;margin-top: 30px"></iframe>
|
|
|
+</div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+new Vue({
|
|
|
+ el: "#app",
|
|
|
+ template: "#template",
|
|
|
+ data: {
|
|
|
+ winH: 0,
|
|
|
+ iframeUrl: "",
|
|
|
+ subId: "${sunInfo.id}",
|
|
|
+ collapse: false,
|
|
|
+ tabActive: 1,
|
|
|
+ warningLight: {
|
|
|
+ "qq": 0, //前期手续办理 0绿灯 1黄灯 2红灯
|
|
|
+ "yb": 0, //月报
|
|
|
+ "kg": 0, //开工
|
|
|
+ "jg": 0 //竣工
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted: function() {
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init: function() {
|
|
|
+ this.winH = document.body.clientHeight;
|
|
|
+ this.onChangeActive(1);
|
|
|
+ this.getWarningStatus();
|
|
|
+ },
|
|
|
+ monthReportEdit() {
|
|
|
+ window.location.href = App.getUrl("/monthReport/view");
|
|
|
+ },
|
|
|
+ detail() {
|
|
|
+ var self = this;
|
|
|
+ var subId = this.subId;
|
|
|
+ window.location.href=App.getUrl("/subject/subInfo/detail?subId=" + subId);
|
|
|
+ },
|
|
|
+ toPre() {
|
|
|
+ var self = this;
|
|
|
+ var subId = this.subId;
|
|
|
+ window.location.href=App.getUrl("/subPreNew/sbTodo?subId="+subId);
|
|
|
+ },
|
|
|
+ getWarningStatus() {
|
|
|
+
|
|
|
+ var self = this;
|
|
|
+ var subId = this.subId;
|
|
|
+
|
|
|
+ // 使用路径传递参数
|
|
|
+ const url = '/api/subInfo/query/getWarningBySubId/' + subId;
|
|
|
+ App.postJson(url, {}, function (res) {
|
|
|
+ if (res.success) {
|
|
|
+ console.log("获取到的数据：",res.data)
|
|
|
+ self.warningLight = res.data
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ backHis(){
|
|
|
+ if(${layer}) {
|
|
|
+ App.closeCurrentLayer();
|
|
|
+ }else {
|
|
|
+ window.location.href="${lastUrl}";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeSide() {
|
|
|
+ this.collapse = !this.collapse
|
|
|
+ },
|
|
|
+ onChangeActive(index) {
|
|
|
+ var subId = this.subId;
|
|
|
+ this.tabActive = index
|
|
|
+ if (index === 1) {
|
|
|
+ this.iframeUrl = App.getUrl("/overdue/projectInfo?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ }else if(index === 2){
|
|
|
+ this.iframeUrl = App.getUrl("/rptCont/viewBySub?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ }else if(index === 4){
|
|
|
+ this.iframeUrl = App.getUrl("/weekReport/detailView?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ }else if(index === 5){
|
|
|
+ this.iframeUrl = App.getUrl("/amtPlan/detailView?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ }/* else{
|
|
|
+ window.location.href = App.getUrl("/overdue/projHistory?layer=${layer}&subId="+subId + "&lastUrl=${lastUrl}");
|
|
|
+ } */
|
|
|
+ else if(index === 6) {
|
|
|
+ //项目前期
|
|
|
+ this.iframeUrl = App.getUrl("/subPreNew/subList?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 7) {
|
|
|
+ //问题督办
|
|
|
+ this.iframeUrl = App.getUrl("/problemreport/subDetail?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 8) {
|
|
|
+ //牵头领导
|
|
|
+ this.iframeUrl = App.getUrl("/secUserSub/subDetail?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 9) {
|
|
|
+ //现场影像
|
|
|
+ this.iframeUrl = App.getUrl("/rptCont/fileDetail?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 10) {
|
|
|
+ //竣工报告
|
|
|
+ this.iframeUrl = App.getUrl("/subComplete/view?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 11) {
|
|
|
+ //重大事项
|
|
|
+ this.iframeUrl = App.getUrl("/meetingRecords/listBySubId?layer=${layer}&subId="+subId + "&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 12) {
|
|
|
+ //短信发送
|
|
|
+ this.iframeUrl = App.getUrl("/msgLog/subDetail?layer=${layer}&subId="+subId+"&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ } else if(index === 13) {
|
|
|
+ //项目日志
|
|
|
+ this.iframeUrl = App.getUrl("/subDataLog/subList?layer=${layer}&subId="+subId+"&queryYear=${queryYear}&lastUrl=${lastUrl}");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+})
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
JiangPengLi