flx：修改指挥部大屏
This commit is contained in:
parent
54aed72315
commit
34b387da80
@ -4,7 +4,7 @@ NODE_ENV = 'development'
|
||||
# 本地环境接口地址(/api/index.ts文件中使用)
|
||||
# 后端本地
|
||||
# VITE_API_URL = 'http://192.168.34.155:19111'
|
||||
VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
|
||||
# VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
|
||||
# VITE_API_URL = 'http://182.90.224.237:51234' #雄哥远程
|
||||
# VITE_API_URL = 'http://192.168.34.221:28889'
|
||||
# VITE_API_URL = 'http://121.196.214.246/api'
|
||||
@ -17,7 +17,7 @@ VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
|
||||
# 演示平台
|
||||
# VITE_API_URL = 'http://jxj.zhgdyun.com:9809'
|
||||
# 百色七参数线上地址
|
||||
# VITE_API_URL = 'http://101.43.164.214:11111'
|
||||
VITE_API_URL = 'http://101.43.164.214:11111'
|
||||
# 七参数标准版(测试平台)
|
||||
# VITE_API_URL = 'http://jxj.zhgdyun.com:15551'
|
||||
# 七参数标准版(测试平台)
|
||||
|
||||
@ -21,10 +21,10 @@ NODE_ENV = "production"
|
||||
# 七参数标准版(测试平台)
|
||||
# VITE_API_URL = 'http://182.90.224.237:15551'
|
||||
# agjt
|
||||
VITE_API_URL = 'http://42.180.188.17:9809' #生产环境
|
||||
# VITE_API_URL = 'http://42.180.188.17:9809' #生产环境
|
||||
# VITE_API_URL = 'http://42.180.188.17:11211' #测试环境
|
||||
# 苏立信/重庆市南岸区
|
||||
# VITE_API_URL = 'http://101.43.164.214:11111'
|
||||
VITE_API_URL = 'http://101.43.164.214:11111'
|
||||
# 中科安信
|
||||
# VITE_API_URL = 'http://8.136.222.164:8808'
|
||||
# 中科佳成
|
||||
|
||||
@ -148,7 +148,9 @@ export const getStatsDirectorateBigScreenApi = (params: {}, showLoading: boolean
|
||||
};
|
||||
// centerTop评分数据接口
|
||||
export const getStatScoreApi = (params: {}, showLoading: boolean) => {
|
||||
return http.get(BASEURL + `/xmgl/xzSecurityQualityInspectionRecord/getStatScore`, params, { headers: { noLoading: showLoading } });
|
||||
return http.get(BASEURL + `/xmgl/xzSecurityQualityInspectionRecord/getStatScore`, params, {
|
||||
headers: { noLoading: showLoading }
|
||||
});
|
||||
};
|
||||
|
||||
// 项目人员考勤
|
||||
@ -232,6 +234,26 @@ export const getXzParentChildTaskListApi = (params: {}) => {
|
||||
export const getXzMilestoneListApi = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/xzMilestone/list`, params, { headers: { noLoading: true } });
|
||||
};
|
||||
|
||||
|
||||
// 甘特图接口结束位置
|
||||
// 获取月度安全综合评分（五种）
|
||||
export const getFiveScoresApi = (params: {}, showLoading: boolean) => {
|
||||
return http.post(BASEURL + `/xmgl/safetyInspectionStandardBigScreen/getFiveScores`, params, {
|
||||
headers: { noLoading: showLoading }
|
||||
});
|
||||
};
|
||||
// 获取月度安全综合评分（十种）
|
||||
export const getScoresApi = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/safetyInspectionStandardBigScreen/getScores`, params, { headers: { noLoading: true } });
|
||||
};
|
||||
// 获取分项检查评分表列表
|
||||
export const getTypeRecordListApi = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/safetyInspectionStandardBigScreen/getTypeRecordList`, params, {
|
||||
headers: { noLoading: true }
|
||||
});
|
||||
};
|
||||
// 获取分项检查评分表详情
|
||||
export const getScoresDetailsApi = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/safetyInspectionStandardBigScreen/getScoresDetails`, params, {
|
||||
headers: { noLoading: true }
|
||||
});
|
||||
};
|
||||
|
||||
@ -29,7 +29,7 @@ export const BASE_IMAGE_URL = import.meta.env.VITE_BASE_IMAGE_URL;
|
||||
// export const COMPANY: string = "as"; //鞍山项目
|
||||
// export const COMPANY: string = "agjt"; //鞍钢集团
|
||||
// export const COMPANY: string = "tj"; // 同济项目
|
||||
export const COMPANY: string = "agjtLive"; //鞍钢集团现场大屏
|
||||
// export const COMPANY: string = "agjtLive"; //鞍钢集团现场大屏
|
||||
// export const COMPANY: string = "agjtCommand"; //鞍钢集团指挥部大屏
|
||||
// export const COMPANY: string = "agjtProjectKanban"; //鞍钢集团项目看板大屏
|
||||
// export const COMPANY: string = "agjtOverviewScreen"; //鞍钢集团项目总览
|
||||
@ -42,7 +42,7 @@ export const COMPANY: string = "agjtLive"; //鞍钢集团现场大屏
|
||||
// export const COMPANY: string = "jsyc"; // 江苏盐城项目
|
||||
// export const COMPANY: string = "syhy"; //沈阳合盈盘锦项目 (需要去src\routers\modules\staticRouter.ts更换首页)
|
||||
// export const COMPANY: string = "jxwjj"; //嘉兴王江泾公用码头项目 (需要去src\routers\modules\staticRouter.ts更换首页)
|
||||
// export const COMPANY: string = "phmw"; //鄱湖美湾医疗、医美产业集群项目 (需要去src\routers\modules\staticRouter.ts更换首页)
|
||||
export const COMPANY: string = "phmw"; //鄱湖美湾医疗、医美产业集群项目 (需要去src\routers\modules\staticRouter.ts更换首页)
|
||||
// export const COMPANY: string = "xjnb"; // 新建宁波项目
|
||||
// export const COMPANY: string = "ahsa"; // 安徽水安项目
|
||||
// export const COMPANY: string = "zkax"; // 中科安信项目
|
||||
|
||||
@ -26,11 +26,11 @@ export const staticRouter: RouteRecordRaw[] = [
|
||||
name: "大屏",
|
||||
// component: () => import("@/views/sevenLargeScreen/indexL.vue"), //七参数标准版
|
||||
// component: () => import("@/views/commandScreen/indexCommand.vue"), //指挥部大屏
|
||||
component: () => import("@/views/agjtLiveScreen/indexLive.vue"), //鞍钢现场大屏
|
||||
// component: () => import("@/views/agjtLiveScreen/indexLive.vue"), //鞍钢现场大屏
|
||||
// component: () => import("@/views/overviewScreen/indexCommand.vue"), //总览大屏
|
||||
// component: () => import("@/views/locationLive/locationL.vue"), //人员定位大屏
|
||||
// component: () => import("@/views/agjtProjectKanban/indexL.vue"), //鞍钢集团项目看板大屏
|
||||
// component: () => import("@/views/sevenLargeScreen/indexL_syhy.vue"), // 只有一级路由(盘锦、嘉兴、鄱湖美湾医疗项目需切换至该首页)
|
||||
component: () => import("@/views/sevenLargeScreen/indexL_syhy.vue"), // 只有一级路由(盘锦、嘉兴、鄱湖美湾医疗项目需切换至该首页)
|
||||
children: [
|
||||
{
|
||||
path: "/headNoise",
|
||||
|
||||
@ -318,6 +318,7 @@ const getNoticeList = async (showLoading: boolean) => {
|
||||
|
||||
// listData.value = res.result.records;
|
||||
// listData.value = res.result.page.records;
|
||||
console.log(333333333, res.result.page.records);
|
||||
listData.value = res.result.page.records.map((item: any) => {
|
||||
let statusMsg1 = item.status == 2 ? "未整改" : item.status == 3 ? "未复查" : item.status == 4 ? "未核验" : "";
|
||||
// item.status == 5 ? "合格":
|
||||
@ -1026,7 +1027,7 @@ onMounted(async () => {
|
||||
width: 100%;
|
||||
line-height: 110%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// align-items: center;
|
||||
// justify-content: flex-start;
|
||||
justify-content: space-between;
|
||||
// background-color: green;
|
||||
@ -1036,7 +1037,7 @@ onMounted(async () => {
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
// align-items: center;
|
||||
font-size: 16px;
|
||||
width: 80%;
|
||||
|
||||
@ -1046,7 +1047,7 @@ onMounted(async () => {
|
||||
background: rgba(224, 32, 32, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
// margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@ -1057,7 +1058,7 @@ onMounted(async () => {
|
||||
background: rgba(244, 102, 73, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
// margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@ -1068,7 +1069,7 @@ onMounted(async () => {
|
||||
background: rgba(236, 190, 69, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
// margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@ -1079,7 +1080,7 @@ onMounted(async () => {
|
||||
background: rgba(83, 148, 247, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
// margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@ -1090,7 +1091,7 @@ onMounted(async () => {
|
||||
background: rgba(148, 0, 211, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
// margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@ -1101,16 +1102,19 @@ onMounted(async () => {
|
||||
background: rgba(0, 206, 209, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
// margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
> div:not(.itemContent) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.itemContent {
|
||||
margin-left: 10px;
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
// white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
// text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
width: 100%;
|
||||
line-height: 30px;
|
||||
}
|
||||
@ -1120,7 +1124,7 @@ onMounted(async () => {
|
||||
// background-color: #fff;
|
||||
width: 20%;
|
||||
font-size: 16px;
|
||||
|
||||
line-height: 30px;
|
||||
.timeInfo {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
@ -6,14 +6,20 @@
|
||||
<span>{{ statScore.hiddenDangerScore }}分</span>
|
||||
</div> -->
|
||||
<div id="waterAq" style="width: 80%; height: 80%; transform: translateY(-25px)"></div>
|
||||
<span style="transform: translateY(-50px)">安全隐患治理</span>
|
||||
<span style="transform: translateY(-50px)">
|
||||
<!-- 安全隐患治理 -->
|
||||
安全管理
|
||||
</span>
|
||||
</div>
|
||||
<div class="content-div wd">
|
||||
<!-- <div class="circle-box">
|
||||
<span>{{ statScore.dangerEngScore }}分</span>
|
||||
</div> -->
|
||||
<div id="waterWd" style="width: 80%; height: 80%; transform: translateY(-25px)"></div>
|
||||
<span style="transform: translateY(-50px)">危大工程</span>
|
||||
<span style="transform: translateY(-50px)">
|
||||
<!-- 危大工程 -->
|
||||
文明施工
|
||||
</span>
|
||||
</div>
|
||||
<div class="content-div jy">
|
||||
<!-- <div class="circle-box"> -->
|
||||
@ -21,59 +27,70 @@
|
||||
<!-- <span>25分</span>
|
||||
</div> -->
|
||||
<div id="waterJy" style="width: 80%; height: 80%; transform: translateY(-25px)"></div>
|
||||
<span style="transform: translateY(-50px)">安全教育</span>
|
||||
<span style="transform: translateY(-50px)">
|
||||
<!-- 安全教育 -->
|
||||
施工支具
|
||||
</span>
|
||||
</div>
|
||||
<div class="content-div fx">
|
||||
<!-- <div class="circle-box">
|
||||
<span>{{ statScore.riskScore }}分</span>
|
||||
</div> -->
|
||||
<div id="waterFx" style="width: 80%; height: 80%; transform: translateY(-25px)"></div>
|
||||
<span style="transform: translateY(-50px)">风险管理</span>
|
||||
<span style="transform: translateY(-50px)">
|
||||
<!-- 风险管理 -->
|
||||
工程器械
|
||||
</span>
|
||||
</div>
|
||||
<div class="content-div zn">
|
||||
<!-- <div class="circle-box">
|
||||
<span>{{ statScore.aiScore }}分</span>
|
||||
</div> -->
|
||||
<div id="waterZn" style="width: 80%; height: 80%; transform: translateY(-25px)"></div>
|
||||
<span style="transform: translateY(-50px)">AI警报</span>
|
||||
<span style="transform: translateY(-50px)">
|
||||
<!-- AI警报 -->
|
||||
危险作业
|
||||
</span>
|
||||
</div>
|
||||
<div class="count-div">
|
||||
<div class="count-div-item">
|
||||
<span>上月安全综合评分</span>
|
||||
<span>{{ statScore.lastMonthTotal }}</span>
|
||||
<span>{{ statScore2.lastMonthScore }}</span>
|
||||
<span>分</span>
|
||||
</div>
|
||||
<div class="count-div-item">
|
||||
<span
|
||||
>相较上月{{
|
||||
statScore.radio > 0
|
||||
? "上升" + (statScore.radio ? statScore.radio : 0)
|
||||
: "下降" + (statScore.radio ? statScore.radio.toString().substr(1) : 0)
|
||||
statScore2.differScoreRate > 0
|
||||
? "上升" + (statScore2.differScoreRate ? statScore2.differScoreRate : 0)
|
||||
: "下降" + (statScore2.differScoreRate ? statScore2.differScoreRate.toString().substr(1) : 0)
|
||||
}}
|
||||
%</span
|
||||
>
|
||||
<span :style="statScore.radio > 0 ? 'color:#0db027' : 'color:#f77c7d'">{{ statScore.radio > 0 ? "↑" : "↓" }} </span>
|
||||
<span :style="statScore2.differScoreRate > 0 ? 'color:#0db027' : 'color:#f77c7d'"
|
||||
>{{ statScore2.differScoreRate > 0 ? "↑" : "↓" }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
:class="['score-div', statScore.total >= 80 ? 'scoreBg1' : statScore.total >= 60 ? 'scoreBg2' : 'scoreBg3']"
|
||||
:class="['score-div', statScore2.monthScore >= 80 ? 'scoreBg1' : statScore2.monthScore >= 60 ? 'scoreBg2' : 'scoreBg3']"
|
||||
@click="openDialogData({ index: 9, title: '月度安全综合评分' })"
|
||||
>
|
||||
<div class="score-part">
|
||||
<span>{{ statScore.total }}</span>
|
||||
<span>{{ statScore2.monthScore }}</span>
|
||||
<span>分</span>
|
||||
</div>
|
||||
<div class="scoreInner scoreTextBg1" v-if="statScore.total >= 80">
|
||||
<div class="scoreInner scoreTextBg1" v-if="statScore2.monthScore >= 80">
|
||||
<span style="font-size: 18px">安全评分</span>
|
||||
<div class="scoreReview">优秀</div>
|
||||
<div class="scoreStar"></div>
|
||||
</div>
|
||||
<div class="scoreInner scoreTextBg2" v-if="statScore.total >= 60 && statScore.total < 80">
|
||||
<div class="scoreInner scoreTextBg2" v-if="statScore2.monthScore >= 60 && statScore2.monthScore < 80">
|
||||
<span style="font-size: 18px">安全评分</span>
|
||||
<div class="scoreReview">一般</div>
|
||||
<div class="scoreStar"></div>
|
||||
</div>
|
||||
<div class="scoreInner scoreTextBg3" v-if="statScore.total < 60">
|
||||
<div class="scoreInner scoreTextBg3" v-if="statScore2.monthScore < 60">
|
||||
<span style="font-size: 18px">安全评分</span>
|
||||
<div class="scoreReview">差</div>
|
||||
<div class="scoreStar"></div>
|
||||
@ -121,7 +138,7 @@ import * as echarts from "echarts";
|
||||
import "echarts-liquidfill";
|
||||
|
||||
import { editProjectInfo, eidtProjectShowConfig, queryBySnData } from "@/api/modules/projectOverview";
|
||||
import { getStatsDirectorateBigScreenApi, getStatScoreApi } from "@/api/modules/agjtCommandApi";
|
||||
import { getStatsDirectorateBigScreenApi, getStatScoreApi, getFiveScoresApi } from "@/api/modules/agjtCommandApi";
|
||||
import { selectLiveVideoListApi } from "@/api/modules/video";
|
||||
import ckplayerComp from "./ckplayerComp.vue";
|
||||
import { COMPANY } from "@/config/config";
|
||||
@ -216,7 +233,7 @@ function drawAqWater() {
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function () {
|
||||
return statScore.value.hiddenDangerScore + "分";
|
||||
return statScore2.value.thisMonthScores.aqgl + "分";
|
||||
},
|
||||
textStyle: {
|
||||
// color: "#6495ED", //蓝色
|
||||
@ -295,7 +312,7 @@ function drawWdWater() {
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function () {
|
||||
return statScore.value.dangerEngScore + "分";
|
||||
return statScore2.value.thisMonthScores.wmsg + "分";
|
||||
},
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
@ -373,8 +390,8 @@ function drawJyWater() {
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function () {
|
||||
// return statScore.value + "分"
|
||||
return "30分";
|
||||
// return statScore2.value + "分"
|
||||
return statScore2.value.thisMonthScores.sgzj + "分";
|
||||
},
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
@ -452,7 +469,7 @@ function drawFxWater() {
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function () {
|
||||
return statScore.value.riskScore + "分";
|
||||
return statScore2.value.thisMonthScores.gcqx + "分";
|
||||
},
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
@ -530,7 +547,7 @@ function drawZnWater() {
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function () {
|
||||
return statScore.value.aiScore + "分";
|
||||
return statScore2.value.thisMonthScores.wxzy + "分";
|
||||
},
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
@ -606,11 +623,28 @@ let statScore = ref({
|
||||
total: 0,
|
||||
lastMonthTotal: 0
|
||||
} as any);
|
||||
const statScore2 = ref({
|
||||
differScoreRate: 0,
|
||||
lastMonthScore: 0,
|
||||
monthScore: 0,
|
||||
thisMonthScores: {
|
||||
aqgl: 0,
|
||||
gcqx: 0,
|
||||
sgzj: 0,
|
||||
wmsg: 0,
|
||||
wxzy: 0
|
||||
}
|
||||
} as any);
|
||||
//获取centerTop底部按钮显示数据
|
||||
const getStatScore = async (showLoading: boolean) => {
|
||||
// getStatScoreApi
|
||||
const res = await getStatScoreApi({ projectSn: store.sn }, showLoading);
|
||||
statScore.value = res.result;
|
||||
|
||||
const result = await getFiveScoresApi({ projectSn: store.sn }, showLoading);
|
||||
statScore2.value = result.result;
|
||||
console.log("获取月度安全综合评分（五种）", res.result);
|
||||
|
||||
drawAqWater();
|
||||
drawWdWater();
|
||||
drawJyWater();
|
||||
@ -931,6 +965,7 @@ onMounted(async () => {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -124,7 +124,7 @@ function goBackend(item: any) {
|
||||
if (item.url != "") {
|
||||
// window.location.replace('http://localhost:8080/#/login?command=1&pathItem='+ item.url +'&token=' + store.token);
|
||||
console.log(BASEURL);
|
||||
window.open("http://192.168.34.175:8080" + "/#/login?command=1&pathItem=" + item.url + "&token=" + store.token, "_blank");
|
||||
window.open("http://42.180.188.17:9809" + "/#/login?command=1&pathItem=" + item.url + "&token=" + store.token, "_blank");
|
||||
// window.open('http://10.0.1.77:8080' + '/#/login?command=1&pathItem='+ item.url +'&token=' + store.token, '_blank');
|
||||
}
|
||||
}
|
||||
|
||||
@ -310,8 +310,14 @@ const queryAttendanceOfEachCompany = async (showLoading: boolean) => {
|
||||
);
|
||||
if (res.result) {
|
||||
projectCompanyWorkTotalList.value = res.result.projectCompanyWorkTotalList;
|
||||
xData.value = projectCompanyWorkTotalList.value.map(item => item.enterpriseName.substring(0, 4));
|
||||
yData.value = projectCompanyWorkTotalList.value.map(item => item.attendancePersonNum);
|
||||
xData.value = projectCompanyWorkTotalList.value
|
||||
.filter((item: any) => item.attendancePersonNum > 0)
|
||||
.sort((a: any, b: any) => b.attendancePersonNum - a.attendancePersonNum)
|
||||
.map((item: any) => item.enterpriseName.substring(0, 4));
|
||||
yData.value = projectCompanyWorkTotalList.value
|
||||
.filter((item: any) => item.attendancePersonNum > 0)
|
||||
.sort((a: any, b: any) => b.attendancePersonNum - a.attendancePersonNum)
|
||||
.map((item: any) => item.attendancePersonNum);
|
||||
if (projectCompanyWorkTotalList.value.length > 0) {
|
||||
isFlag.value = true;
|
||||
drawBar();
|
||||
|
||||
@ -1,12 +1,24 @@
|
||||
<template>
|
||||
<div class="list-detail" v-if="showDialog && mapsDetail.length == 0">
|
||||
<div
|
||||
:class="postData.type == 1 ? 'dialog-content' : postData.type == 2 ? 'dialog-content-show' : postData.type == 3 ? 'dialog-content-three' : postData.type == 4 ? 'dialog-content-ai' : 'dialog-content-more'"
|
||||
:class="
|
||||
postData.type == 1
|
||||
? 'dialog-content'
|
||||
: postData.type == 2
|
||||
? 'dialog-content-show'
|
||||
: postData.type == 3
|
||||
? 'dialog-content-three'
|
||||
: postData.type == 4
|
||||
? 'dialog-content-ai'
|
||||
: postData.type == 5
|
||||
? 'dialog-content-table'
|
||||
: 'dialog-content-more'
|
||||
"
|
||||
:style="
|
||||
postData.index == 98
|
||||
? { left: '5%', width: '90%', top: '5%', height: '90%' }
|
||||
: postData.index == 9
|
||||
? { left: '10%', top: '10%', width: '80%', height: '70%' }
|
||||
? { left: '50%', top: '50%', transform: 'translate(-50%, -50%)', width: '80%', height: '70%' }
|
||||
: {}
|
||||
"
|
||||
>
|
||||
@ -77,11 +89,26 @@
|
||||
<div class="political-outlook" v-if="showIndex == 13">
|
||||
<memberMoreList ref="historyAlarmList"></memberMoreList>
|
||||
</div>
|
||||
<div class="political-outlook" v-if="showIndex == 14">
|
||||
<monthSafeScoreDetail ref="historyAlarmList" :tableDetail="postData"></monthSafeScoreDetail>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="showIndex == 10">
|
||||
<div class="list-detail" v-for="ele in mapsDetail.filter((option: any) => option.show)" :key="ele.id">
|
||||
<div :class="postData.type == 1 ? 'dialog-content' : postData.type == 2 ? 'dialog-content-show' : postData.type == 3 ? 'dialog-content-three' : postData.type == 4 ? 'dialog-content-ai' : 'dialog-content-more'">
|
||||
<div
|
||||
:class="
|
||||
postData.type == 1
|
||||
? 'dialog-content'
|
||||
: postData.type == 2
|
||||
? 'dialog-content-show'
|
||||
: postData.type == 3
|
||||
? 'dialog-content-three'
|
||||
: postData.type == 4
|
||||
? 'dialog-content-ai'
|
||||
: 'dialog-content-more'
|
||||
"
|
||||
>
|
||||
<div class="warning-bg"></div>
|
||||
<div class="dialog-title">
|
||||
<!-- <div class="title-img"><img src="@/assets/images/titleIcon.png" alt="" /></div> -->
|
||||
@ -122,6 +149,7 @@ import myMap from "./my-map.vue";
|
||||
import radarMapList from "./radar-map-list.vue";
|
||||
import memberAllShow from "./member-all-show.vue";
|
||||
import memberMoreList from "./member-more-list.vue";
|
||||
import monthSafeScoreDetail from "./month-safe-score-detail.vue";
|
||||
|
||||
// import { GlobalStore } from "@/stores";
|
||||
let showDialog = ref(false as any);
|
||||
@ -303,7 +331,7 @@ onMounted(async () => {});
|
||||
background-size: 100% 100%;
|
||||
z-index: 21;
|
||||
}
|
||||
.dialog-content-ai{
|
||||
.dialog-content-ai {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
padding: 1%;
|
||||
@ -315,6 +343,20 @@ onMounted(async () => {});
|
||||
background-size: 100% 100%;
|
||||
z-index: 21;
|
||||
}
|
||||
|
||||
.dialog-content-table {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
padding: 1%;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 100%;
|
||||
height: 90%;
|
||||
background: url("@/assets/images/commandScreen/dialog-bg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
z-index: 21;
|
||||
transform: translate(-49%, -65%);
|
||||
}
|
||||
.dialog-content-more {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
@ -326,12 +368,16 @@ onMounted(async () => {});
|
||||
background: url("@/assets/images/commandScreen/dialog-bg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
z-index: 21;
|
||||
// left: 50%;
|
||||
// top: 50%;
|
||||
// transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.dialog-content,
|
||||
.dialog-content-show,
|
||||
.dialog-content-more,
|
||||
.dialog-content-three,
|
||||
.dialog-content-table,
|
||||
.dialog-content-ai {
|
||||
padding-top: 50px;
|
||||
position: relative;
|
||||
@ -391,6 +437,10 @@ onMounted(async () => {});
|
||||
padding-top: 70px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dialog-content-table {
|
||||
padding-top: 35px;
|
||||
}
|
||||
.dialog-content-ai {
|
||||
padding-top: 70px;
|
||||
position: relative;
|
||||
|
||||
@ -476,6 +476,7 @@ const searchForm = ref({
|
||||
//tab控制属性
|
||||
const currentTab = ref("danger" as any);
|
||||
function handleChangeTab(val: any) {
|
||||
if (currentTab.value == val) return;
|
||||
currentTab.value = val;
|
||||
partyMemberList.value = [];
|
||||
pageNo.value = 1;
|
||||
|
||||
@ -0,0 +1,242 @@
|
||||
<template>
|
||||
<div class="political-outlook">
|
||||
<div class="content">
|
||||
<div class="table-header">
|
||||
<div
|
||||
:class="{ 'color-7b8daf': tableInfo.searchCode != item.code }"
|
||||
@click="onChange(item)"
|
||||
v-for="item in tableInfo.serachList"
|
||||
:key="item.id"
|
||||
>
|
||||
{{ item.dangerName }}
|
||||
</div>
|
||||
<!-- {{ props.tableDetail.tableItem }} -->
|
||||
</div>
|
||||
<div class="tabbody">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
:colspan="index == 1 && (tableInfo.projectList[0].length > 0 || tableInfo.projectList[1].length > 0) ? 2 : 1"
|
||||
v-for="(item, index) in tableInfo.tableHeader"
|
||||
:key="item"
|
||||
>
|
||||
{{ item }}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, index) in tableInfo.tableList" :key="item.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td v-if="index == 0 && tableInfo.projectList[0].length > 0" :rowspan="tableInfo.projectList[0].length">
|
||||
保证项目
|
||||
</td>
|
||||
<td
|
||||
v-if="index == tableInfo.projectList[0].length && tableInfo.projectList[1].length > 0"
|
||||
:rowspan="tableInfo.projectList[1].length"
|
||||
>
|
||||
一般项目
|
||||
</td>
|
||||
<td
|
||||
v-if="
|
||||
(tableInfo.projectList[0].length > 0 || tableInfo.projectList[1].length > 0) &&
|
||||
((tableInfo.projectList[0].length == 0 && index == tableInfo.projectList[1].length) ||
|
||||
(tableInfo.projectList[1].length == 0 && index == tableInfo.projectList[0].length)) &&
|
||||
tableInfo.projectList[1].length + tableInfo.projectList[0].length != tableInfo.tableList.length
|
||||
"
|
||||
:rowspan="
|
||||
tableInfo.tableList.length -
|
||||
(tableInfo.projectList[0].length == 0 ? tableInfo.projectList[1].length : tableInfo.projectList[0].length)
|
||||
"
|
||||
></td>
|
||||
<td>{{ item.name }}</td>
|
||||
<td>{{ item.shouldScore }}</td>
|
||||
<td>{{ item.deductScore }}</td>
|
||||
<td>{{ item.score }}</td>
|
||||
<td style="width: 480px">
|
||||
<div
|
||||
class="text-left"
|
||||
:class="{ 'mt-20': eIndex != 0 }"
|
||||
v-for="(ele, eIndex) in item.deductReasonList"
|
||||
:key="ele"
|
||||
>
|
||||
{{ eIndex + 1 }}、 {{ ele.inspectTime }}检查到{{ ele.mainEnterpriseName }}的{{
|
||||
ele.regionName
|
||||
}}责任区域内有一条{{ ele.dangerItemContent }}的隐患{{
|
||||
ele.status == 2 ? "未整改" : ele.status == 3 ? "未复查" : ele.status == 4 ? "未核验" : ""
|
||||
}}，扣{{ ele.deductScore }}分
|
||||
</div>
|
||||
</td>
|
||||
<td v-if="index == 0" :rowspan="tableInfo.tableList.length">
|
||||
{{ tableInfo.score }}
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted, reactive } from "vue";
|
||||
import { getTypeRecordListApi, getScoresDetailsApi } from "@/api/modules/agjtCommandApi";
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
const props = defineProps(["tip", "tableDetail"]);
|
||||
// const BASEURL = import.meta.env.VITE_API_URL;
|
||||
// 表单
|
||||
const tableInfo = reactive({
|
||||
tableHeader: ["序号", "检查项目", "应得分数", "扣除分数", "实得分数", "扣分原因", "总分"],
|
||||
tableList: [
|
||||
{
|
||||
id: 1,
|
||||
title: "安全生产责任制",
|
||||
score: 10,
|
||||
deductscore: 1,
|
||||
actualscore: 9,
|
||||
isordinary: "保证项目",
|
||||
causeList: [
|
||||
"2024-7-28 12:21:32检查到上海建工五建集团有限公司的最终精矿过滤厂房责任区域内未配备各工种安全技术操作规程，扣0.5分",
|
||||
"2024-7-28 12:21:32检查到上海建工五建集团有限公司的最终精矿过滤厂房责任区域内未配备各工种安全技术操作规程，扣0.5分"
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "安全生产责任制",
|
||||
score: 10,
|
||||
deductscore: 1,
|
||||
actualscore: 9,
|
||||
isordinary: "保证项目",
|
||||
causeList: [
|
||||
"2024-7-28 12:21:32检查到上海建工五建集团有限公司的最终精矿过滤厂房责任区域内未配备各工种安全技术操作规程，扣0.5分"
|
||||
]
|
||||
}
|
||||
] as any[],
|
||||
projectList: [[], []] as any[],
|
||||
score: 0,
|
||||
serachList: [] as any[],
|
||||
searchCode: -1
|
||||
});
|
||||
|
||||
// 取分项检查评分表列表
|
||||
const getTypeRecordList = async () => {
|
||||
let requestData: any = {
|
||||
projectSn: store.sn,
|
||||
tenType: props.tableDetail.tableItem.tenType
|
||||
};
|
||||
const res: any = await getTypeRecordListApi(requestData);
|
||||
tableInfo.serachList = res.result;
|
||||
tableInfo.searchCode = res.result[0].code;
|
||||
console.log(res.result);
|
||||
getScoresDetails();
|
||||
};
|
||||
// 取分项检查评分表列表
|
||||
const getScoresDetails = async () => {
|
||||
let requestData: any = {
|
||||
projectSn: store.sn,
|
||||
month: props.tableDetail.currentDate,
|
||||
code: tableInfo.searchCode
|
||||
};
|
||||
const res: any = await getScoresDetailsApi(requestData);
|
||||
tableInfo.tableList = res.result.safetyScoreDetails
|
||||
.map((item: any) => {
|
||||
return {
|
||||
...item,
|
||||
projectType: item.projectType ? item.projectType : 3
|
||||
};
|
||||
})
|
||||
.sort((a: any, b: any) => a.projectType - b.projectType);
|
||||
tableInfo.projectList = tableInfo.tableList.reduce(
|
||||
(prev: any[], item: any) => {
|
||||
if (item.projectType == 1) {
|
||||
prev[0].push(item);
|
||||
} else if (item.projectType == 2) {
|
||||
prev[1].push(item);
|
||||
}
|
||||
return prev;
|
||||
},
|
||||
[[], []]
|
||||
);
|
||||
tableInfo.score = res.result.score;
|
||||
console.log(tableInfo.tableList, tableInfo.projectList);
|
||||
};
|
||||
const onChange = (item: any) => {
|
||||
tableInfo.searchCode = item.code;
|
||||
getScoresDetails();
|
||||
};
|
||||
onMounted(async () => {
|
||||
console.log(props.tableDetail);
|
||||
getTypeRecordList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tabbody {
|
||||
margin-top: 20px;
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
.mt-20 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
tr {
|
||||
height: 60px;
|
||||
}
|
||||
td {
|
||||
text-align: center;
|
||||
}
|
||||
table,
|
||||
td,
|
||||
th {
|
||||
border: 1px solid #dbdbdb;
|
||||
border-collapse: collapse;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.political-outlook {
|
||||
height: 100%;
|
||||
margin: 0 60px;
|
||||
// background-color: #fff;
|
||||
transform: translateY(5px) translateX(-20px);
|
||||
.content {
|
||||
height: 90%;
|
||||
width: 100%;
|
||||
// background: url("@/assets/images/cardImg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 0 15px;
|
||||
.table-header {
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
> div:not(:first-child) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
> div {
|
||||
cursor: pointer;
|
||||
}
|
||||
.color-7b8daf {
|
||||
color: #7b8daf;
|
||||
}
|
||||
}
|
||||
|
||||
.tabbody {
|
||||
overflow-y: scroll;
|
||||
height: 90%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -2,154 +2,100 @@
|
||||
<div class="political-outlook">
|
||||
<div class="content">
|
||||
<div class="all-score">
|
||||
<span>综合得分：{{ countData.total || 0 }}</span>
|
||||
<span>综合得分：{{ tableInfo.score || 0 }}</span>
|
||||
</div>
|
||||
<div class="all-title">
|
||||
<span>月度安全综合评分表</span>
|
||||
</div>
|
||||
<div class="all-subTitle">
|
||||
<span>工程名称：{{ projectData.projectName || "" }}</span>
|
||||
<span>表格日期：{{ currentDate }}</span>
|
||||
<!-- <span>表格日期：{{ currentDate }}</span> -->
|
||||
<span
|
||||
>按月筛选：<el-date-picker @change="getScores" v-model="currentDate" type="month" placeholder="Pick a month"
|
||||
/></span>
|
||||
</div>
|
||||
<div class="table-one">
|
||||
<div class="tabList">
|
||||
<div style="width: 15%; margin: 0 0 0 0">考核分类</div>
|
||||
<div style="width: 6%; margin: 0 0 0 7%">考核指标</div>
|
||||
<div style="width: 6%; margin: 0 0 0 12%">指标说明</div>
|
||||
<div style="width: 6%; margin: 0 0 0 13.5%">单模块权重</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2.5%">单模块得分</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2%">扣除分数</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2.5%">模块权重</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2%">模块得分</div>
|
||||
<div>项目名称及分值<text>(点击进入各分项查看扣分详情)</text></div>
|
||||
</div>
|
||||
<div class="tabbody">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th v-for="item in tableInfo.tableBody" :key="item" @click="openPeopleCountDialog(item)">{{ item.name }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>单模块权重</td>
|
||||
<td v-for="item in tableInfo.tableBody.map(ele => ele.weight)" :key="item">{{ item }}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="color: #ff0000">单项扣分</td>
|
||||
<td style="color: #ff0000" v-for="item in tableInfo.tableBody.map(ele => ele.deductScore)" :key="item">
|
||||
{{ item }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>单项得分</td>
|
||||
<td v-for="item in tableInfo.tableBody.map(ele => ele.score)" :key="item">{{ item }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td>总计得分</td>
|
||||
<td :colspan="tableInfo.tableBody.length">{{ tableInfo.score }}</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
<el-scrollbar class="listBox" ref="refScrollbar">
|
||||
<div class="table-head-nine">
|
||||
<div class="table-head-nine-part1" v-for="(value2, key2, index2) in value" :key="index2">
|
||||
<div class="category-title">
|
||||
<span>{{ key2 }}</span>
|
||||
</div>
|
||||
<div class="category-content" style="width: 80%">
|
||||
<div v-for="(item, index3) in value2" :key="index3">
|
||||
<div>
|
||||
<span>{{ index3 }}</span>
|
||||
</div>
|
||||
<div style="width: 50%">{{ item.name }}</div>
|
||||
<div style="width: 20%">
|
||||
<span>{{ item.value }}</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ item.score }}</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ item.deduction }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span v-if="key2 == '隐患治理排查'">35%</span>
|
||||
<span v-else-if="key2 == '危大工程'">15%</span>
|
||||
<span v-else-if="key2 == '风险管理'">0%</span>
|
||||
<span v-else-if="key2 == '安全教育'">30%</span>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span v-if="key2 == '隐患治理排查'">{{ countData.hiddenDangerScore || 0 }}</span>
|
||||
<span v-else-if="key2 == '危大工程'">{{ countData.dangerEngScore || 0 }}</span>
|
||||
<span v-else-if="key2 == '风险管理'">{{ countData.riskscore || 0 }}</span>
|
||||
<span v-else-if="key2 == '安全教育'">30</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-head-nine-part1">
|
||||
<div class="category-title">
|
||||
<span>AI报警</span>
|
||||
</div>
|
||||
<div class="category-content" style="width: 80%">
|
||||
<div>
|
||||
<div>
|
||||
<span>AI违章抓拍</span>
|
||||
</div>
|
||||
<div style="width: 50%">告警数量月度环比对比</div>
|
||||
<div style="width: 20%">
|
||||
<span>100%</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ countData.aiModuleScore || 0 }}</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ countData.aiModuleDeScore || 0 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span>20%</span>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span>{{ countData.aiScore || 0 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="table-head-nine-part2">
|
||||
<div class="category-title">
|
||||
<span>AI报警</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>AI违章抓拍</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>告警数量月度环比对比</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>100%</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>20%</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>{{ countData.aiScore || 0 }}</span>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="table-head-nine-part3">
|
||||
<div style="width: 14.5%"><span>综合得分</span></div>
|
||||
<div style="width: 85.5%">
|
||||
<span>{{ countData.total || 0 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-for="(item, index) in partyMemberList" class="listStyle" :key="item.id">
|
||||
<div>{{ item.workerName }}</div>
|
||||
<div>{{ item.rectifiedNum }}</div>
|
||||
<div>{{ item.overTimeRectifiedNum }}</div>
|
||||
<div>{{ item.overTimeNotRectifiedNum }}</div>
|
||||
<div>{{ item.rectifiedNumRatio }}</div>
|
||||
<div>{{ item.rectifiedNumRatioTimely }}</div>
|
||||
</div>
|
||||
<div class="notoDta" v-if="partyMemberList.length == 0">
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<p>暂无数据</p>
|
||||
</div> -->
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
<dataDialog ref="partyBuildRefMore"></dataDialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted } from "vue";
|
||||
import { ref, onMounted, reactive } from "vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { getMemberJobStatusApi, getStatScoreApi } from "@/api/modules/agjtCommandApi";
|
||||
import { getStatScoreApi, getScoresApi } from "@/api/modules/agjtCommandApi";
|
||||
import { getProjectDetail } from "@/api/modules/projectOverview";
|
||||
import dataDialog from "./data-dialog.vue";
|
||||
import moment from "moment";
|
||||
const store = GlobalStore();
|
||||
const props = defineProps(["tip"]);
|
||||
const currentDate = ref("" as any);
|
||||
let pageNo = ref(1 as any);
|
||||
let moreScroll = ref(true as any);
|
||||
const refScrollbar = ref(null as any); // 绑定到滚动的盒子上
|
||||
const partyMemberList = ref({} as any);
|
||||
|
||||
// 表单
|
||||
const tableInfo = reactive({
|
||||
tableBody: [] as any[],
|
||||
score: 0
|
||||
});
|
||||
|
||||
const partyBuildRefMore = ref();
|
||||
// 弹窗
|
||||
const openPeopleCountDialog = (obj: any) => {
|
||||
partyBuildRefMore.value.openDialog({
|
||||
index: 14,
|
||||
type: 5,
|
||||
title: "检查评分表",
|
||||
tableItem: obj,
|
||||
currentDate: currentDate.value
|
||||
});
|
||||
// console.log(partyBuildRef.value);
|
||||
};
|
||||
|
||||
// let pageNo = ref(1 as any);
|
||||
// let moreScroll = ref(true as any);
|
||||
// const refScrollbar = ref(null as any); // 绑定到滚动的盒子上
|
||||
// const partyMemberList = ref({} as any);
|
||||
const value = ref({});
|
||||
const countData = ref({} as any);
|
||||
const projectData = ref({} as any);
|
||||
//获取项目信息
|
||||
const getProjectInfo = async () => {
|
||||
const res = await getProjectDetail({ projectSn: store.sn });
|
||||
const res = await getProjectDetail({ projectSn: store.sn }, false);
|
||||
projectData.value = res.result;
|
||||
};
|
||||
// 获取统计数据
|
||||
@ -157,7 +103,7 @@ const getStatScoreFn = async () => {
|
||||
let requestData: any = {
|
||||
projectSn: store.sn
|
||||
};
|
||||
const res: any = await getStatScoreApi(requestData);
|
||||
const res: any = await getStatScoreApi(requestData, false);
|
||||
countData.value = res.result;
|
||||
value.value = {
|
||||
隐患治理排查: {
|
||||
@ -225,50 +171,63 @@ const getStatScoreFn = async () => {
|
||||
};
|
||||
};
|
||||
|
||||
//获取数据
|
||||
const getMemberCountList = async (tip: any) => {
|
||||
// 获取月度安全综合评分（十种）
|
||||
const getScores = async () => {
|
||||
let requestData: any = {
|
||||
projectSn: store.sn,
|
||||
pageSize: 100,
|
||||
pageNo: 1
|
||||
month: currentDate.value
|
||||
};
|
||||
const res: any = await getMemberJobStatusApi(requestData);
|
||||
if (tip == "more") {
|
||||
partyMemberList.value = partyMemberList.value.concat(res.result.records);
|
||||
} else {
|
||||
partyMemberList.value = res.result.records;
|
||||
}
|
||||
// 为图片拼接IP
|
||||
// partyMemberList.value.map((item:any) => {
|
||||
// item.fieldAcquisitionUrl = BASEURL + '/image/' + item.fieldAcquisitionUrl
|
||||
// })
|
||||
if (res.result.pages == pageNo.value) {
|
||||
moreScroll.value = false;
|
||||
} else {
|
||||
pageNo.value = pageNo.value + 1;
|
||||
}
|
||||
const res: any = await getScoresApi(requestData);
|
||||
tableInfo.tableBody = res.result.safetyTypeScores;
|
||||
tableInfo.score = res.result.score;
|
||||
console.log(res);
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
currentDate.value = moment(new Date()).format("YYYY-MM-DD");
|
||||
await getProjectInfo();
|
||||
await getMemberCountList("search");
|
||||
await getStatScoreFn();
|
||||
refScrollbar.value.wrapRef.addEventListener("scroll", (e: any) => {
|
||||
const scrollTop = e.target.scrollTop;
|
||||
const scrollHeight = e.target.scrollHeight;
|
||||
const clientHeight = e.target.clientHeight;
|
||||
// 向上加载更多
|
||||
if (scrollTop >= scrollHeight - clientHeight - 1) {
|
||||
if (moreScroll.value) {
|
||||
getMemberCountList("more");
|
||||
}
|
||||
}
|
||||
});
|
||||
currentDate.value = moment(new Date()).format("YYYY-MM");
|
||||
getProjectInfo();
|
||||
getStatScoreFn();
|
||||
getScores();
|
||||
// refScrollbar.value.wrapRef.addEventListener("scroll", (e: any) => {
|
||||
// const scrollTop = e.target.scrollTop;
|
||||
// const scrollHeight = e.target.scrollHeight;
|
||||
// const clientHeight = e.target.clientHeight;
|
||||
// // 向上加载更多
|
||||
// if (scrollTop >= scrollHeight - clientHeight - 1) {
|
||||
// if (moreScroll.value) {
|
||||
// getMemberCountList("more");
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tabbody {
|
||||
margin-top: 20px;
|
||||
table {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
tr {
|
||||
height: 60px;
|
||||
}
|
||||
td {
|
||||
text-align: center;
|
||||
}
|
||||
th:not(:first-child) {
|
||||
cursor: pointer;
|
||||
}
|
||||
table,
|
||||
td,
|
||||
th {
|
||||
border: 1px solid #dbdbdb;
|
||||
border-collapse: collapse;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -276,7 +235,8 @@ onMounted(async () => {
|
||||
|
||||
.political-outlook {
|
||||
height: 97%;
|
||||
margin: 0 60px;
|
||||
margin: 0 20px;
|
||||
padding: 0 40px;
|
||||
// background-color: #fff;
|
||||
transform: translateY(40px) translateX(-13px);
|
||||
.content {
|
||||
@ -327,10 +287,11 @@ onMounted(async () => {
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
line-height: 30px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
margin-top: 2%;
|
||||
div {
|
||||
text-align: center;
|
||||
width: 17%;
|
||||
text {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.listBox {
|
||||
|
||||
548
src/views/commandScreen/dialogCompnnents/oldmonth-safe-score.vue
Normal file
548
src/views/commandScreen/dialogCompnnents/oldmonth-safe-score.vue
Normal file
@ -0,0 +1,548 @@
|
||||
<template>
|
||||
<div class="political-outlook">
|
||||
<div class="content">
|
||||
<div class="all-score">
|
||||
<span>综合得分：{{ countData.total || 0 }}</span>
|
||||
</div>
|
||||
<div class="all-title">
|
||||
<span>月度安全综合评分表</span>
|
||||
</div>
|
||||
<div class="all-subTitle">
|
||||
<span>工程名称：{{ projectData.projectName || "" }}</span>
|
||||
<span>表格日期：{{ currentDate }}</span>
|
||||
</div>
|
||||
<div class="table-one">
|
||||
<div class="tabList">
|
||||
<div style="width: 15%; margin: 0 0 0 0">考核分类</div>
|
||||
<div style="width: 6%; margin: 0 0 0 7%">考核指标</div>
|
||||
<div style="width: 6%; margin: 0 0 0 12%">指标说明</div>
|
||||
<div style="width: 6%; margin: 0 0 0 13.5%">单模块权重</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2.5%">单模块得分</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2%">扣除分数</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2.5%">模块权重</div>
|
||||
<div style="width: 6%; margin: 0 0 0 2%">模块得分</div>
|
||||
</div>
|
||||
<el-scrollbar class="listBox" ref="refScrollbar">
|
||||
<div class="table-head-nine">
|
||||
<div class="table-head-nine-part1" v-for="(value2, key2, index2) in value" :key="index2">
|
||||
<div class="category-title">
|
||||
<span>{{ key2 }}</span>
|
||||
</div>
|
||||
<div class="category-content" style="width: 80%">
|
||||
<div v-for="(item, index3) in value2" :key="index3">
|
||||
<div>
|
||||
<span>{{ index3 }}</span>
|
||||
</div>
|
||||
<div style="width: 50%">{{ item.name }}</div>
|
||||
<div style="width: 20%">
|
||||
<span>{{ item.value }}</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ item.score }}</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ item.deduction }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span v-if="key2 == '隐患治理排查'">35%</span>
|
||||
<span v-else-if="key2 == '危大工程'">15%</span>
|
||||
<span v-else-if="key2 == '风险管理'">0%</span>
|
||||
<span v-else-if="key2 == '安全教育'">30%</span>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span v-if="key2 == '隐患治理排查'">{{ countData.hiddenDangerScore || 0 }}</span>
|
||||
<span v-else-if="key2 == '危大工程'">{{ countData.dangerEngScore || 0 }}</span>
|
||||
<span v-else-if="key2 == '风险管理'">{{ countData.riskscore || 0 }}</span>
|
||||
<span v-else-if="key2 == '安全教育'">30</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-head-nine-part1">
|
||||
<div class="category-title">
|
||||
<span>AI报警</span>
|
||||
</div>
|
||||
<div class="category-content" style="width: 80%">
|
||||
<div>
|
||||
<div>
|
||||
<span>AI违章抓拍</span>
|
||||
</div>
|
||||
<div style="width: 50%">告警数量月度环比对比</div>
|
||||
<div style="width: 20%">
|
||||
<span>100%</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ countData.aiModuleScore || 0 }}</span>
|
||||
</div>
|
||||
<div style="width: 15%">
|
||||
<span>{{ countData.aiModuleDeScore || 0 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span>20%</span>
|
||||
</div>
|
||||
<div class="category-other" style="width: 10%">
|
||||
<span>{{ countData.aiScore || 0 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="table-head-nine-part2">
|
||||
<div class="category-title">
|
||||
<span>AI报警</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>AI违章抓拍</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>告警数量月度环比对比</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>100%</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>20%</span>
|
||||
</div>
|
||||
<div class="category-title">
|
||||
<span>{{ countData.aiScore || 0 }}</span>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="table-head-nine-part3">
|
||||
<div style="width: 14.5%"><span>综合得分</span></div>
|
||||
<div style="width: 85.5%">
|
||||
<span>{{ countData.total || 0 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-for="(item, index) in partyMemberList" class="listStyle" :key="item.id">
|
||||
<div>{{ item.workerName }}</div>
|
||||
<div>{{ item.rectifiedNum }}</div>
|
||||
<div>{{ item.overTimeRectifiedNum }}</div>
|
||||
<div>{{ item.overTimeNotRectifiedNum }}</div>
|
||||
<div>{{ item.rectifiedNumRatio }}</div>
|
||||
<div>{{ item.rectifiedNumRatioTimely }}</div>
|
||||
</div>
|
||||
<div class="notoDta" v-if="partyMemberList.length == 0">
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<p>暂无数据</p>
|
||||
</div> -->
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted } from "vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { getMemberJobStatusApi, getStatScoreApi } from "@/api/modules/agjtCommandApi";
|
||||
import { getProjectDetail } from "@/api/modules/projectOverview";
|
||||
import moment from "moment";
|
||||
const store = GlobalStore();
|
||||
const props = defineProps(["tip"]);
|
||||
const currentDate = ref("" as any);
|
||||
let pageNo = ref(1 as any);
|
||||
let moreScroll = ref(true as any);
|
||||
const refScrollbar = ref(null as any); // 绑定到滚动的盒子上
|
||||
const partyMemberList = ref({} as any);
|
||||
const value = ref({});
|
||||
const countData = ref({} as any);
|
||||
const projectData = ref({} as any);
|
||||
//获取项目信息
|
||||
const getProjectInfo = async () => {
|
||||
const res = await getProjectDetail({ projectSn: store.sn });
|
||||
projectData.value = res.result;
|
||||
};
|
||||
// 获取统计数据
|
||||
const getStatScoreFn = async () => {
|
||||
let requestData: any = {
|
||||
projectSn: store.sn
|
||||
};
|
||||
const res: any = await getStatScoreApi(requestData);
|
||||
countData.value = res.result;
|
||||
value.value = {
|
||||
隐患治理排查: {
|
||||
隐患整改率: {
|
||||
name: "隐患整改率=已整改（除了待整改和已撤回）/隐患总数（不包含排查记录）x100%",
|
||||
value: "40%",
|
||||
score: res.result.hiddenDangerScoreClz.zgl ? res.result.hiddenDangerScoreClz.zgl : 0,
|
||||
deduction: res.result.hiddenDangerScoreClz.zglkf ? res.result.hiddenDangerScoreClz.zglkf : 0
|
||||
},
|
||||
隐患及时整改率: {
|
||||
name: "及时整改率=状态是已整改（除了待整改和已撤回）的未超期整改的隐患记录数/状态是已整改（除了待整改和已撤回）的隐患总数x100%",
|
||||
value: "30%",
|
||||
score: res.result.hiddenDangerScoreClz.jszgl ? res.result.hiddenDangerScoreClz.jszgl : 0,
|
||||
deduction: res.result.hiddenDangerScoreClz.jszglkf ? res.result.hiddenDangerScoreClz.jszglkf : 0
|
||||
},
|
||||
隐患闭合率: {
|
||||
name: "隐患闭合率=状态是合格的隐患记录/隐患总数x100%",
|
||||
value: "30%",
|
||||
score: res.result.hiddenDangerScoreClz.bhl ? res.result.hiddenDangerScoreClz.bhl : 0,
|
||||
deduction: res.result.hiddenDangerScoreClz.bhlkf ? res.result.hiddenDangerScoreClz.bhlkf : 0
|
||||
},
|
||||
项目自检数量: {
|
||||
name: "每周完成项目自检次数\n每周正常7次自检",
|
||||
value: "0%",
|
||||
score: res.result.hiddenDangerScoreClz.zj ? res.result.hiddenDangerScoreClz.zj : 0,
|
||||
deduction: res.result.hiddenDangerScoreClz.zjkf ? res.result.hiddenDangerScoreClz.zjkf : 0
|
||||
}
|
||||
},
|
||||
危大工程: {
|
||||
危大工程排查覆盖率: {
|
||||
name: "危大工程排查覆盖率=实际排查天数/应排查天数x100%(在施危大工程应每天排查)",
|
||||
value: "60%",
|
||||
score: res.result.dangerEngScoreClz.pcfgl ? res.result.dangerEngScoreClz.pcfgl : 0,
|
||||
deduction: res.result.dangerEngScoreClz.pcfglkf ? res.result.dangerEngScoreClz.pcfglkf : 0
|
||||
},
|
||||
旁站记录更新: {
|
||||
name: "实际旁站记录次数/应完成旁站记录x100%(在施危大工程应每天旁站)",
|
||||
value: "40%",
|
||||
score: res.result.dangerEngScoreClz.pzjl ? res.result.dangerEngScoreClz.pzjl : 0,
|
||||
deduction: res.result.dangerEngScoreClz.pzjlkf ? res.result.dangerEngScoreClz.pzjlkf : 0
|
||||
}
|
||||
},
|
||||
风险管理: {
|
||||
风险排查执行率: {
|
||||
name: "有排查记录不同的风险/生成待办任务不同的风险x100%",
|
||||
value: "99%",
|
||||
score: res.result.riskScoreClz.fxpczxl ? res.result.riskScoreClz.fxpczxl : 0,
|
||||
deduction: res.result.riskScoreClz.fxpczxlkf ? res.result.riskScoreClz.fxpczxlkf : 0
|
||||
},
|
||||
风险辨识数量: {
|
||||
name: "排查和待办任务中至少识别3个不同的风险",
|
||||
value: "1%",
|
||||
score: res.result.riskScoreClz.fxbsull ? res.result.riskScoreClz.fxbsull : 0,
|
||||
deduction: res.result.riskScoreClz.fxbsullkf ? res.result.riskScoreClz.fxbsullkf : 0
|
||||
}
|
||||
},
|
||||
安全教育: {
|
||||
三级入场教育完成率: {
|
||||
name: "三级入场教育完成率=三级教育完成人数/所有在岗人数",
|
||||
value: "100%",
|
||||
score: res.result.eduModuleScore ? res.result.eduModuleScore : 0,
|
||||
deduction: res.result.eduModuleDeScore ? res.result.eduModuleDeScore : 0
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
//获取数据
|
||||
const getMemberCountList = async (tip: any) => {
|
||||
let requestData: any = {
|
||||
projectSn: store.sn,
|
||||
pageSize: 100,
|
||||
pageNo: 1
|
||||
};
|
||||
const res: any = await getMemberJobStatusApi(requestData);
|
||||
if (tip == "more") {
|
||||
partyMemberList.value = partyMemberList.value.concat(res.result.records);
|
||||
} else {
|
||||
partyMemberList.value = res.result.records;
|
||||
}
|
||||
// 为图片拼接IP
|
||||
// partyMemberList.value.map((item:any) => {
|
||||
// item.fieldAcquisitionUrl = BASEURL + '/image/' + item.fieldAcquisitionUrl
|
||||
// })
|
||||
if (res.result.pages == pageNo.value) {
|
||||
moreScroll.value = false;
|
||||
} else {
|
||||
pageNo.value = pageNo.value + 1;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
currentDate.value = moment(new Date()).format("YYYY-MM-DD");
|
||||
await getProjectInfo();
|
||||
await getMemberCountList("search");
|
||||
await getStatScoreFn();
|
||||
refScrollbar.value.wrapRef.addEventListener("scroll", (e: any) => {
|
||||
const scrollTop = e.target.scrollTop;
|
||||
const scrollHeight = e.target.scrollHeight;
|
||||
const clientHeight = e.target.clientHeight;
|
||||
// 向上加载更多
|
||||
if (scrollTop >= scrollHeight - clientHeight - 1) {
|
||||
if (moreScroll.value) {
|
||||
getMemberCountList("more");
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@mixin flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.political-outlook {
|
||||
height: 97%;
|
||||
margin: 0 60px;
|
||||
// background-color: #fff;
|
||||
transform: translateY(40px) translateX(-13px);
|
||||
.content {
|
||||
height: 95%;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
// background: url("@/assets/images/cardImg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 20px 15px;
|
||||
.all-subTitle {
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 0px;
|
||||
}
|
||||
.all-title {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.all-score {
|
||||
width: 100%;
|
||||
height: 31px;
|
||||
line-height: 31px;
|
||||
background: linear-gradient(90deg, rgba(52, 146, 252, 0.43) 0%, #3186e8 31%, rgba(21, 43, 78, 0.02) 100%);
|
||||
margin-top: 10px;
|
||||
text-indent: 2em;
|
||||
span {
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
.table-one {
|
||||
height: 88%;
|
||||
.tabList {
|
||||
display: flex;
|
||||
// width: 100%;
|
||||
height: 8%;
|
||||
background: url("@/assets/images/vehicleManagement/ListTitleImg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// position: absolute;
|
||||
left: 75.5%;
|
||||
top: 75%;
|
||||
color: #ccc;
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
line-height: 30px;
|
||||
align-items: center;
|
||||
margin-top: 2%;
|
||||
div {
|
||||
text-align: center;
|
||||
width: 17%;
|
||||
}
|
||||
}
|
||||
.listBox {
|
||||
height: 73%;
|
||||
// background-color: #fff;
|
||||
.listStyle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
padding: 5px 0px;
|
||||
.list-img {
|
||||
.el-img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
div {
|
||||
width: 17%;
|
||||
white-space: nowrap; //单行
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.listStyle:hover {
|
||||
background: #091f3f;
|
||||
}
|
||||
}
|
||||
.table-head-nine {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.table-head-nine-part1 {
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
margin-bottom: 5px;
|
||||
.category-title {
|
||||
width: 17%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: #102959;
|
||||
// overflow-wrap: anywhere;
|
||||
// text-align: left !important;
|
||||
}
|
||||
.category-other {
|
||||
width: 17%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: #041e51;
|
||||
}
|
||||
.category-content {
|
||||
width: 49%;
|
||||
> div:nth-child(2n - 1) {
|
||||
background-color: #041e51;
|
||||
}
|
||||
> div:nth-child(2n) {
|
||||
background-color: #102959;
|
||||
}
|
||||
> div {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
> div {
|
||||
width: 33.3%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
> div:nth-child(2) {
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-head-nine-part2 {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
margin-bottom: 5px;
|
||||
> div {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
> div:nth-child(1) {
|
||||
width: 17%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
background-color: #102959;
|
||||
}
|
||||
> div:not(:first-child) {
|
||||
background-color: #041e51;
|
||||
}
|
||||
> div:nth-child(2) {
|
||||
width: 17%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
}
|
||||
> div:nth-child(3) {
|
||||
width: 32%;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
}
|
||||
> div:nth-child(4) {
|
||||
width: 17%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
}
|
||||
> div:nth-child(5) {
|
||||
width: 17%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.table-head-nine-part3 {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
> div {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
> div:nth-child(1) {
|
||||
width: 17%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
background-color: #102959;
|
||||
> span:not(:first-child) {
|
||||
border-top: 1px solid #086d93;
|
||||
}
|
||||
}
|
||||
> div:nth-child(2) {
|
||||
width: 83%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
background-color: #041e51;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep() {
|
||||
.el-tabs__item {
|
||||
color: white;
|
||||
}
|
||||
.el-tabs__item.is-active {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.notoDta {
|
||||
top: 35%;
|
||||
width: 20%;
|
||||
left: 40%;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
img {
|
||||
width: 40%;
|
||||
margin: 5% 30%;
|
||||
}
|
||||
p {
|
||||
color: #fff;
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
margin: -6% 37%;
|
||||
}
|
||||
}
|
||||
// element 组件样式
|
||||
:deep() {
|
||||
.el-date-editor .el-range-input,
|
||||
.el-range-separator {
|
||||
color: #fff;
|
||||
}
|
||||
.el-input__wrapper {
|
||||
background: #112d59;
|
||||
}
|
||||
.el-input__inner {
|
||||
color: #fff;
|
||||
}
|
||||
.el-button {
|
||||
background-color: #2758c0;
|
||||
color: white;
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
// ::v-deep .el-select .el-input .el-select__caret {
|
||||
// color: #fff;
|
||||
// }
|
||||
</style>
|
||||
@ -29,7 +29,7 @@
|
||||
<div
|
||||
class="grid"
|
||||
v-for="day in getDays(date)"
|
||||
:key="'grid' + day.num"
|
||||
:key="'grid' + day.num + Date.now()"
|
||||
:ref="(el: any) => setItemRef(el, p.id + '@|@' + day.date)"
|
||||
></div>
|
||||
</div>
|
||||
@ -188,12 +188,13 @@ const getGanttStyle = (project: any) => {
|
||||
const endLeft = endRef?.offsetLeft;
|
||||
const ganttWidth = endLeft - startLeft + endWidth;
|
||||
|
||||
return { left: startLeft + "px", width: ganttWidth + "px" };
|
||||
return { left: startLeft + "px", width: ganttWidth + "px" } as any;
|
||||
};
|
||||
const configGantts = (projects: any) => {
|
||||
// console.log("进入渲染 setGantts -- ", projects);
|
||||
projects.forEach((project: any) => {
|
||||
let { finishDate, name, gantts } = project;
|
||||
const configGantts = (projects: any[]) => {
|
||||
console.log("进入渲染 setGantts -- ", projects, projects.length);
|
||||
if (projects.length == 0) return;
|
||||
Array.from(projects).forEach((project: any) => {
|
||||
let { finishDate, name, gantts } = project as any;
|
||||
const gantt = getGanttStyle(project);
|
||||
if (gantt.background) return;
|
||||
// gantt.background = colors.value[project.state - 1];
|
||||
@ -218,14 +219,14 @@ const configGantts = (projects: any) => {
|
||||
// gantts.push(gantt);
|
||||
// }
|
||||
// }
|
||||
if (project.children.length > 0) {
|
||||
project.children && configGantts(project.children);
|
||||
}
|
||||
// if (project.children.length > 0) {
|
||||
// project.children && configGantts(project.children, type);
|
||||
// }
|
||||
});
|
||||
};
|
||||
const setGantts = () => {
|
||||
if (props.treeData.length == 0) return;
|
||||
configGantts(props.treeData);
|
||||
const setGantts = (treeData: any[]) => {
|
||||
if (treeData.length == 0) return;
|
||||
configGantts(treeData);
|
||||
};
|
||||
const increaseDate = (date: any, delay: any) => {
|
||||
const timestamp = new Date(date).getTime() + (delay + 1) * 1000 * 60 * 60 * 24;
|
||||
@ -266,9 +267,7 @@ const getDays = (date: any) => {
|
||||
})();
|
||||
};
|
||||
onMounted(() => {
|
||||
nextTick(() => {
|
||||
setGantts();
|
||||
});
|
||||
setGantts(props.treeData);
|
||||
});
|
||||
const handleOpen = (index: any, children: any) => {
|
||||
// console.log(666);
|
||||
@ -280,7 +279,7 @@ const handleOpen = (index: any, children: any) => {
|
||||
children.openedIndex = index;
|
||||
}
|
||||
// nextTick(() => {
|
||||
// setGantts(children);
|
||||
// setGantts(children.children);
|
||||
// });
|
||||
// setTimeout(() => {
|
||||
// setGantts(children);
|
||||
|
||||
@ -152,7 +152,7 @@
|
||||
</div>
|
||||
<div class="right-content">备注：更新（进度填报）内容后该甘特图将自动更新</div>
|
||||
</div>
|
||||
<div class="gantt-chart" v-if="projects.length > 0">
|
||||
<div class="gantt-chart" v-if="projectsInfo.projects.length > 0">
|
||||
<div class="table" @scroll="handleScroll">
|
||||
<div class="thead">
|
||||
<div class="row">
|
||||
@ -174,7 +174,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbody">
|
||||
<myTree :treeData="projects" :dateList="dateList"></myTree>
|
||||
<myTree :treeData="projectsInfo.projects" :dateList="dateList"></myTree>
|
||||
</div>
|
||||
<div class="tooltips" :style="tooltipsStyle">
|
||||
{{ tooltipContent.taskName }}
|
||||
@ -450,7 +450,12 @@ const headerList = reactive([
|
||||
// { label: "逾期已完成", color: "#C13F5B" }
|
||||
]);
|
||||
|
||||
const projects = ref([] as any);
|
||||
const projectsInfo = reactive({
|
||||
projectListAll: [] as any[],
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
projects: [] as any[]
|
||||
});
|
||||
// const projects = ref([
|
||||
// {
|
||||
// pName: "抹灰工程1",
|
||||
@ -514,8 +519,8 @@ const onUpdate = async () => {
|
||||
ElMessage.success("页面已更新");
|
||||
};
|
||||
|
||||
const scrollLeft = ref(0);
|
||||
const scrollTimer = ref(0);
|
||||
const scrollLeft = ref(0 as any);
|
||||
const scrollTimer = ref(0 as any);
|
||||
|
||||
const tooltipsStyle = ref({
|
||||
display: "none",
|
||||
@ -553,14 +558,19 @@ const getDataList = () => {
|
||||
projectSn: searchSn.value,
|
||||
enterpriseId: treeData.value.id
|
||||
}).then(res => {
|
||||
projects.value = dealArr(res.result);
|
||||
projectsInfo.projects = dealArr(res.result);
|
||||
// projectsInfo.projectListAll = dealArr(res.result);
|
||||
// projectsInfo.projects = projectsInfo.projectListAll.slice(
|
||||
// (projectsInfo.pageNo - 1) * projectsInfo.pageSize,
|
||||
// projectsInfo.pageNo * projectsInfo.pageSize
|
||||
// );
|
||||
// console.log("获取甘特图数据", projects.value);
|
||||
});
|
||||
};
|
||||
|
||||
const dealArr = arr => {
|
||||
arr.map(item => {
|
||||
item.gantts = [];
|
||||
const dealArr = (arr: any) => {
|
||||
arr.map((item: any) => {
|
||||
item.gantts = [] as any[];
|
||||
item.delay = 0;
|
||||
if (item.children && item.children.length > 0) {
|
||||
dealArr(item.children);
|
||||
@ -621,6 +631,17 @@ const getDays = (date: any) => {
|
||||
};
|
||||
|
||||
const handleScroll = (e: any) => {
|
||||
// if (e.target.clientHeight + e.target.scrollTop === e.target.scrollHeight) {
|
||||
// console.log(e.target.scrollLeft, e.target.scrollTop, e.target.scrollBottom);
|
||||
// if (projectsInfo.projects.length >= projectsInfo.projectListAll.length) return;
|
||||
// projectsInfo.pageNo += 1;
|
||||
// const resultList = projectsInfo.projectListAll.slice(
|
||||
// (projectsInfo.pageNo - 1) * projectsInfo.pageSize,
|
||||
// projectsInfo.pageNo * projectsInfo.pageSize
|
||||
// );
|
||||
// projectsInfo.projects = projectsInfo.projects.concat(resultList);
|
||||
// return;
|
||||
// }
|
||||
if (scrollTimer.value) {
|
||||
clearTimeout(scrollTimer.value);
|
||||
}
|
||||
@ -628,11 +649,10 @@ const handleScroll = (e: any) => {
|
||||
scrollLeft.value = e.target.scrollLeft;
|
||||
scrollTimer.value = null;
|
||||
}, 100);
|
||||
// console.log(scrollLeft.value);
|
||||
// if (e.target.scrollLeft == 0) return;
|
||||
const fixedElement1 = document.querySelectorAll(".fixed_1");
|
||||
const fixedElement2 = document.querySelectorAll(".fixed_2");
|
||||
const fixedElement3 = document.querySelectorAll(".fixed_3");
|
||||
const fixedElement1: any = document.querySelectorAll(".fixed_1");
|
||||
const fixedElement2: any = document.querySelectorAll(".fixed_2");
|
||||
const fixedElement3: any = document.querySelectorAll(".fixed_3");
|
||||
// console.log(fixedElement1);
|
||||
// console.log(fixedElement1[0]);
|
||||
// console.log(fixedElement1.length);
|
||||
@ -669,15 +689,16 @@ const handleLeave = () => {
|
||||
tooltipsStyle.value.display = "none";
|
||||
};
|
||||
const dateList = computed(() => {
|
||||
let dates = [];
|
||||
const mapDates = data => {
|
||||
data.map(p => {
|
||||
let dates = [] as any[];
|
||||
const mapDates = (data: any) => {
|
||||
data.map((p: any) => {
|
||||
dates.push(p.startDate);
|
||||
dates.push(p.finishDate);
|
||||
if (p.children == 0) return;
|
||||
p.children && mapDates(p.children);
|
||||
});
|
||||
};
|
||||
mapDates(projects.value);
|
||||
mapDates(projectsInfo.projects);
|
||||
dates = dates.map(date => date.slice(0, 7)).sort();
|
||||
dates = [...new Set(dates)];
|
||||
console.log("dateList----", dates);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user