admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

flx：安全绩效

Browse Source
This commit is contained in:
Vce 2024-05-13 20:48:56 +08:00
parent 86c0ded6e7
commit 984f248886
5 changed files with 602 additions and 163 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/assets/js/api/laborPerson.js
View File

@ -225,11 +225,18 @@ export const entryRecordListApi = data => get('xmgl/workerAccessRecord/page', da
export const delayAlarmRecordListApi = data => get('xmgl/xzCertificateExpireAlarmRecord/page', data);
// 安全分析
// export const getProjectDetailData = data => post('', data); // 查询对应企业统计数据
export const getSelectQualityStatisticsNumApi = data => post('/xmgl/xzSecurityQualityInspectionRecord/selectQualityStatisticsNum', data); // 检查统计
export const getStatsByEnterpriseApi= data => post('/xmgl/xzSecurityQualityInspectionRecord/statsByEnterprise', data); // 分包单位统计
export const getRiskChartApi = data => post('/xmgl/xzSecurityQualityInspectionRecord/riskChart', data); // 风险走势图
export const getCountDangerLevelApi = data => post('/xmgl/xzSecurityQualityInspectionRecord/countDangerLevel', data); // 隐患数量展示
export const getcountQualityInspectionRecordRegionApi = data => post('/xmgl/xzSecurityQualityInspectionRecord/countQualityInspectionRecordRegion', data); // 责任区域数据统计
// 人员安全绩效评分
// export const getRiskChartApi = data => post('/xmgl/xzSecurityQualityInspectionRecord/riskChart', data); // 风险走势图
export const getStatsSafeScoreApi = data => post('/xmgl/workerInfo/statsSafeScore', data); // 人员风险概览
export const getStatsEnterpriseApi = data => post('/xmgl/workerInfo/statsEnterprise', data); // 企业安全评分汇总
export const getStatsEnterpriseRiskApi = data => post('/xmgl/workerInfo/statsEnterpriseRisk', data); // 企业人员风险汇总
export const getEnterpriseListApi = data => post('/xmgl/enterpriseInfo/list', data); // 企业列表
export const getSelectWorkerInfoListApi = data => post('/xmgl/workerInfo/selectWorkerInfoList', data); // 人员列表
export const getDeductScoreListApi = data => get('/xmgl/xzDeductScoreRecord/list', data); // 安全扣分记录

7
src/assets/js/api/quality.js
View File

@ -212,3 +212,10 @@ export const editSystemUserApi = data=>post('/xmgl/systemUser/zjwj/update',data)
export const getSystemUserPageApi = data=>get('/xmgl/systemUser/zjwj/list',data)
// 质量分析
// export const getProjectDetailData = data => post('', data); // 查询对应企业统计数据
export const getSelectQualityStatisticsNumApi = data => post('/xmgl/qualityInspectionRecord/selectQualityStatisticsNum', data); // 检查统计
export const getStatsByEnterpriseApi= data => post('/xmgl/qualityInspectionRecord/statsByEnterprise', data); // 分包单位统计
export const getRiskChartApi = data => post('/xmgl/qualityInspectionRecord/riskChart', data); // 风险走势图
export const getCountDangerLevelApi = data => post('/xmgl/qualityInspectionRecord/countDangerLevel', data); // 隐患数量展示
export const getcountQualityInspectionRecordRegionApi = data => post('/xmgl/qualityInspectionRecord/countQualityInspectionRecordRegion', data); // 责任区域数据统计

127
src/views/projectFront/quality/qualityAnalysis.vue
View File

@ -34,7 +34,7 @@
<div class="blockInner">
<!-- 分包单位 -->
<div class="box-between">
<div>分包单位统计TOP10</div>
<div>分包单位质量隐患统计</div>
<div class="flex">
<!-- <el-radio-group v-model="radio">
@ -49,7 +49,7 @@
</div>
</div>
<div style="position: relative;height:100%">
<div v-show="enterpriseList.length > 0" class="chart" ref="BarGraphChartOne"></div>
<div v-show="enterpriseList.length > 0" class="chart" ref="BarGraphChartOne"></div>
<div v-if="enterpriseList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
@ -110,7 +110,7 @@
<div>隐患分析</div>
</div>
<div style="position: relative;height:100%">
<div class="chart" ref="radarCharts"></div>
<div class="chart" ref="radarCharts"></div>
<div v-if="!examineInfo2.investigateNum">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
@ -124,15 +124,14 @@
<div class="blockInner">
<!-- 分包单位 -->
<div class="box-between">
<div>风险走势图（{{ riskListup }}%<span :style="riskListup > 0 > 0 ? 'color:green' : 'color:red'">{{
riskListup > 0 ? '↑' : '↓' }}</span>比上月（{{ riskList.length > 2 &&
riskList[riskList.length - 1].lastMonth }}））</div>
<div>风险走势图（{{ riskCount }}%<span :style="riskCount > 0 ? 'color:green' : 'color:red'">{{
riskCount > 0 ? '↑' : '↓' }}</span>比上月（{{ riskName }}））</div>
<!-- <el-date-picker v-model="value1" type="daterange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" size="mini">
</el-date-picker> -->
</div>
<div style="position: relative;height:100%">
<div class="chart" ref="lineCharts"></div>
<div class="chart" ref="lineCharts"></div>
<div v-if="riskList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
@ -156,22 +155,24 @@
<div class="flex sub-container_box">
<div class="sub-container">
<div>隐患超期未整改</div>
<div>重大隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[0].count : '0'
<div>重大隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[0].count :
'0'
}}</span>个，占比<span>{{ this.dangerLevelInfo1.data ?
this.dangerLevelInfo1.data[0].percent: '0'}}</span>%</div>
<div>严重隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[1].count : '0'
this.dangerLevelInfo1.data[0].percent : '0' }}</span>%</div>
<div>严重隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[1].count :
'0'
}}</span>个，占比<span>{{ this.dangerLevelInfo1.data
? this.dangerLevelInfo1.data[1].percent: '0'}}</span>%</div>
? this.dangerLevelInfo1.data[1].percent : '0' }}</span>%</div>
<div class="chart" ref="annulusChartOne"></div>
</div>
<div class="sub-container">
<div>未消项隐患</div>
<div>重大隐患未消项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
<div>未销项隐患</div>
<div>重大隐患未销项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
}}</span>个，占比<span>{{ this.dangerLevelInfo2.data ?
this.dangerLevelInfo2.data[0].percent : '0'}}</span>%</div>
<div>严重隐患未消项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
this.dangerLevelInfo2.data[0].percent : '0' }}</span>%</div>
<div>严重隐患未销项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
}}</span>个，占比<span>{{ this.dangerLevelInfo2.data ?
this.dangerLevelInfo2.data[0].percent : '0'}}</span>%</div>
this.dangerLevelInfo2.data[0].percent : '0' }}</span>%</div>
<div class="chart" ref="annulusChartTwo"></div>
</div>
</div>
@ -197,15 +198,15 @@
</div>
<div class="sub-container_box">
<div style="position: relative;height:100%">
<div class="chart" ref="barGraphFallCharts"></div>
<div v-if="inspectionList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
<div class="chart" ref="barGraphFallCharts"></div>
<div v-if="inspectionList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@ -213,14 +214,14 @@
</template>
<script>
import echarts from 'echarts4';
import dayjs from 'dayjs'
import {
getSelectQualityStatisticsNumApi,
getStatsByEnterpriseApi,
getRiskChartApi,
getCountDangerLevelApi,
getcountQualityInspectionRecordRegionApi
} from "@/assets/js/api/laborPerson";
} from "@/assets/js/api/quality";
export default {
data() {
return {
@ -242,8 +243,19 @@ export default {
projectSn: "",
examineTime: "",
examineInfo: {},
examineInfo2: {},
examineInfo: {
dangerNum: 0,
totalNum: 0,
greatFaultLevelNum: 0,
overdueNotCloseNum: 0,
},
examineInfo2: {
dangerNum :0,
generalRiskNum :0,
largerRiskNum :0,
greatFaultLevelNum :0,
lowRiskNum:0,
},
examineInfoFlag: true,
enterpriseTime: "",
@ -256,17 +268,12 @@ export default {
inspectionRadio: "",
inspectionList: [],
riskCount: 0,
riskName: "暂无",
};
},
computed: {
riskListup() {
const num = this.riskList.length > 2 && (this.riskList[this.riskList.length - 1].dangerNum - this.riskList[this.riskList.length - 2].dangerNum) / 100;
console.log(this.riskList, num);
return num
}
},
mounted() {
this.getRiskChart();
},
@ -349,6 +356,12 @@ export default {
console.log('风险走势图', res);
this.riskList = res.result;
if (this.riskList.length > 0) {
// this.riskCount = this.riskList[this.riskList.length - 2].dangerNum == 0 ? (this.riskList[this.riskList.length - 1].dangerNum).toFixed(2) : ((this.riskList[this.riskList.length - 1].dangerNum - this.riskList[this.riskList.length - 2].dangerNum) / this.riskList[this.riskList.length - 2].dangerNum).toFixed(2);
this.riskCount = this.riskList[this.riskList.length - 1].monthlyBasis;
this.riskName = this.riskList[this.riskList.length - 1].lastMonth;
}
this.lineCharts(this.$refs.lineCharts);
// this.barGraphCharts(this.$refs.BarGraphChartOne);
}
@ -365,12 +378,16 @@ export default {
}).then((res) => {
if (res.code == 200) {
console.log('隐患数量展示', res);
let arr = res.result.data.length > 0 ? res.result.data : [{ value: 0, name: '重大隐患' },
{ value: 0, name: '较大隐患' },
{ value: 0, name: '一般隐患' },
{ value: 0, name: '低隐患' },]
if (isOverdueRectification == 1) {
this.dangerLevelInfo1 = res.result;
this.annulusChart(this.$refs.annulusChartOne, res.result.data, 0, res.result.count);
this.annulusChart(this.$refs.annulusChartOne, arr, 0, res.result.count);
} else {
this.dangerLevelInfo2 = res.result;
this.annulusChart(this.$refs.annulusChartTwo, res.result.data, 1, res.result.count);
this.annulusChart(this.$refs.annulusChartTwo, arr, 1, res.result.count);
}
// this.enterpriseList = res.result.records;
// this.barGraphCharts(this.$refs.BarGraphChartOne);
@ -416,6 +433,18 @@ export default {
name: '分包单位', //X轴标题
type: 'category',
data: this.enterpriseList.map(item => item.enterpriseName),
//设置文本过长超出隐藏...表示
axisLabel: {
formatter: function (params) {
var val = "";
if (params.length > 4) {
val = params.substr(0, 4) + '...';
return val;
} else {
return params;
}
}
},
},
yAxis: {
name: '数量', //Y轴标题
@ -639,6 +668,17 @@ export default {
]
};
ageChart.setOption(option);
ageChart.on('mousemove', (params) => {
if(params.dataIndex == 0){
this.riskCount = 0;
this.riskName = "暂无";
return
}
// this.riskCount = this.riskList[params.dataIndex - 1].dangerNum == 0 ? (this.riskList[params.dataIndex].dangerNum).toFixed(2) : ((this.riskList[params.dataIndex].dangerNum - this.riskList[params.dataIndex - 1].dangerNum) / this.riskList[params.dataIndex - 1].dangerNum).toFixed(2);
this.riskCount = this.riskList[params.dataIndex].monthlyBasis;
this.riskName = this.riskList[params.dataIndex].lastMonth;
});
window.addEventListener("resize", () => {
ageChart.resize();
})
@ -648,7 +688,7 @@ export default {
let ageChart = echarts.init(el);
let option = {
title: {
subtext: `${flag == 0 ? '超期未整改' : '未消项'}\n${count}个`,//副标题文本
subtext: `${flag == 0 ? '超期未整改' : '未销项'}\n${count}个`,//副标题文本
left: 'center',
top: '40%',
subtextStyle: {
@ -695,6 +735,7 @@ export default {
return colorList[colors.dataIndex];
}
},
avoidLabelOverlap:true,
// emphasis: {
// label: {
// show: true,
@ -774,6 +815,18 @@ export default {
show: false,
color: '#268C8C',
},
//设置文本过长超出隐藏...表示
axisLabel: {
formatter: function (params) {
var val = "";
if (params.length > 5) {
val = params.substr(0, 5) + '...';
return val;
} else {
return params;
}
}
},
},
series: [
{

125
src/views/projectFront/safetyEducation/safetyAnalysis.vue
View File

@ -34,7 +34,7 @@
<div class="blockInner">
<!-- 分包单位 -->
<div class="box-between">
<div>分包单位统计TOP10</div>
<div>分包单位安全隐患统计</div>
<div class="flex">
<!-- <el-radio-group v-model="radio">
@ -49,7 +49,7 @@
</div>
</div>
<div style="position: relative;height:100%">
<div v-show="enterpriseList.length > 0" class="chart" ref="BarGraphChartOne"></div>
<div v-show="enterpriseList.length > 0" class="chart" ref="BarGraphChartOne"></div>
<div v-if="enterpriseList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
@ -110,7 +110,7 @@
<div>隐患分析</div>
</div>
<div style="position: relative;height:100%">
<div class="chart" ref="radarCharts"></div>
<div class="chart" ref="radarCharts"></div>
<div v-if="!examineInfo2.investigateNum">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
@ -124,15 +124,14 @@
<div class="blockInner">
<!-- 分包单位 -->
<div class="box-between">
<div>风险走势图（{{ riskListup }}%<span :style="riskListup > 0 > 0 ? 'color:green' : 'color:red'">{{
riskListup > 0 ? '↑' : '↓' }}</span>比上月（{{ riskList.length > 2 &&
riskList[riskList.length - 1].lastMonth }}））</div>
<div>风险走势图（{{ riskCount }}%<span :style="riskCount > 0 ? 'color:green' : 'color:red'">{{
riskCount > 0 ? '↑' : '↓' }}</span>比上月（{{ riskName }}））</div>
<!-- <el-date-picker v-model="value1" type="daterange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" size="mini">
</el-date-picker> -->
</div>
<div style="position: relative;height:100%">
<div class="chart" ref="lineCharts"></div>
<div class="chart" ref="lineCharts"></div>
<div v-if="riskList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
@ -156,22 +155,24 @@
<div class="flex sub-container_box">
<div class="sub-container">
<div>隐患超期未整改</div>
<div>重大隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[0].count : '0'
<div>重大隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[0].count :
'0'
}}</span>个，占比<span>{{ this.dangerLevelInfo1.data ?
this.dangerLevelInfo1.data[0].percent: '0'}}</span>%</div>
<div>严重隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[1].count : '0'
this.dangerLevelInfo1.data[0].percent : '0' }}</span>%</div>
<div>严重隐患超期未整改<span>{{ this.dangerLevelInfo1.data ? this.dangerLevelInfo1.data[1].count :
'0'
}}</span>个，占比<span>{{ this.dangerLevelInfo1.data
? this.dangerLevelInfo1.data[1].percent: '0'}}</span>%</div>
? this.dangerLevelInfo1.data[1].percent : '0' }}</span>%</div>
<div class="chart" ref="annulusChartOne"></div>
</div>
<div class="sub-container">
<div>未消项隐患</div>
<div>重大隐患未消项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
<div>未销项隐患</div>
<div>重大隐患未销项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
}}</span>个，占比<span>{{ this.dangerLevelInfo2.data ?
this.dangerLevelInfo2.data[0].percent : '0'}}</span>%</div>
<div>严重隐患未消项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
this.dangerLevelInfo2.data[0].percent : '0' }}</span>%</div>
<div>严重隐患未销项<span>{{ this.dangerLevelInfo2.data ? this.dangerLevelInfo2.data[0].count : '0'
}}</span>个，占比<span>{{ this.dangerLevelInfo2.data ?
this.dangerLevelInfo2.data[0].percent : '0'}}</span>%</div>
this.dangerLevelInfo2.data[0].percent : '0' }}</span>%</div>
<div class="chart" ref="annulusChartTwo"></div>
</div>
</div>
@ -197,15 +198,15 @@
</div>
<div class="sub-container_box">
<div style="position: relative;height:100%">
<div class="chart" ref="barGraphFallCharts"></div>
<div v-if="inspectionList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
<div class="chart" ref="barGraphFallCharts"></div>
<div v-if="inspectionList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@ -213,7 +214,7 @@
</template>
<script>
import echarts from 'echarts4';
import dayjs from 'dayjs'
import {
getSelectQualityStatisticsNumApi,
getStatsByEnterpriseApi,
@ -242,8 +243,19 @@ export default {
projectSn: "",
examineTime: "",
examineInfo: {},
examineInfo2: {},
examineInfo: {
dangerNum: 0,
totalNum: 0,
greatFaultLevelNum: 0,
overdueNotCloseNum: 0,
},
examineInfo2: {
dangerNum: 0,
generalRiskNum: 0,
largerRiskNum: 0,
greatFaultLevelNum: 0,
lowRiskNum: 0,
},
examineInfoFlag: true,
enterpriseTime: "",
@ -256,17 +268,12 @@ export default {
inspectionRadio: "",
inspectionList: [],
riskCount: 0,
riskName: "暂无",
};
},
computed: {
riskListup() {
const num = this.riskList.length > 2 && (this.riskList[this.riskList.length - 1].dangerNum - this.riskList[this.riskList.length - 2].dangerNum) / 100;
console.log(this.riskList, num);
return num
}
},
mounted() {
this.getRiskChart();
},
@ -349,6 +356,12 @@ export default {
console.log('风险走势图', res);
this.riskList = res.result;
if (this.riskList.length > 0) {
// this.riskCount = this.riskList[this.riskList.length - 2].dangerNum == 0 ? (this.riskList[this.riskList.length - 1].dangerNum).toFixed(2) : ((this.riskList[this.riskList.length - 1].dangerNum - this.riskList[this.riskList.length - 2].dangerNum) / this.riskList[this.riskList.length - 2].dangerNum).toFixed(2);
this.riskCount = this.riskList[this.riskList.length - 1].monthlyBasis;
this.riskName = this.riskList[this.riskList.length - 1].lastMonth;
}
this.lineCharts(this.$refs.lineCharts);
// this.barGraphCharts(this.$refs.BarGraphChartOne);
}
@ -365,12 +378,16 @@ export default {
}).then((res) => {
if (res.code == 200) {
console.log('隐患数量展示', res);
let arr = res.result.data.length > 0 ? res.result.data : [{ value: 0, name: '重大隐患' },
{ value: 0, name: '较大隐患' },
{ value: 0, name: '一般隐患' },
{ value: 0, name: '低隐患' },]
if (isOverdueRectification == 1) {
this.dangerLevelInfo1 = res.result;
this.annulusChart(this.$refs.annulusChartOne, res.result.data, 0, res.result.count);
this.annulusChart(this.$refs.annulusChartOne, arr, 0, res.result.count);
} else {
this.dangerLevelInfo2 = res.result;
this.annulusChart(this.$refs.annulusChartTwo, res.result.data, 1, res.result.count);
this.annulusChart(this.$refs.annulusChartTwo, arr, 1, res.result.count);
}
// this.enterpriseList = res.result.records;
// this.barGraphCharts(this.$refs.BarGraphChartOne);
@ -416,6 +433,18 @@ export default {
name: '分包单位', //X轴标题
type: 'category',
data: this.enterpriseList.map(item => item.enterpriseName),
//设置文本过长超出隐藏...表示
axisLabel: {
formatter: function (params) {
var val = "";
if (params.length > 4) {
val = params.substr(0, 4) + '...';
return val;
} else {
return params;
}
}
},
},
yAxis: {
name: '数量', //Y轴标题
@ -639,6 +668,17 @@ export default {
]
};
ageChart.setOption(option);
ageChart.on('mousemove', (params) => {
if (params.dataIndex == 0) {
this.riskCount = 0;
this.riskName = "暂无";
return
}
// this.riskCount = this.riskList[params.dataIndex - 1].dangerNum == 0 ? (this.riskList[params.dataIndex].dangerNum).toFixed(2) : ((this.riskList[params.dataIndex].dangerNum - this.riskList[params.dataIndex - 1].dangerNum) / this.riskList[params.dataIndex - 1].dangerNum).toFixed(2);
this.riskCount = this.riskList[params.dataIndex].monthlyBasis;
this.riskName = this.riskList[params.dataIndex].lastMonth;
});
window.addEventListener("resize", () => {
ageChart.resize();
})
@ -648,7 +688,7 @@ export default {
let ageChart = echarts.init(el);
let option = {
title: {
subtext: `${flag == 0 ? '超期未整改' : '未消项'}\n${count}个`,//副标题文本
subtext: `${flag == 0 ? '超期未整改' : '未销项'}\n${count}个`,//副标题文本
left: 'center',
top: '40%',
subtextStyle: {
@ -684,6 +724,7 @@ export default {
return params.name.slice(0, 4) + "\n" + params.name.slice(4, params.name.length);
},
},
avoidLabelOverlap:true,
itemStyle: {
color: function (colors) {
var colorList = [
@ -774,6 +815,18 @@ export default {
show: false,
color: '#268C8C',
},
//设置文本过长超出隐藏...表示
axisLabel: {
formatter: function (params) {
var val = "";
if (params.length > 4) {
val = params.substr(0, 4) + '...';
return val;
} else {
return params;
}
}
},
},
series: [
{

497
src/views/projectFront/safetyEducation/securityRiskAnalysis.vue
View File

@ -6,21 +6,21 @@
<!-- 数据统计 -->
<div class="box-between">
<div>人员风险概览</div>
<el-date-picker v-model="value1" type="daterange" range-separator="至" start-placeholder="开始日期"
<!-- <el-date-picker v-model="value1" type="daterange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" size="mini">
</el-date-picker>
</el-date-picker> -->
</div>
<div class="show-pointer">
<div class="green-bg">
<div class="green-num">143</div>
<div class="green-num">{{ safeScoreInfo.lowRiskNum }}</div>
<div>低风险</div>
</div>
<div class="org-bg">
<div class="org-num">12</div>
<div class="org-num">{{ safeScoreInfo.mediumRiskNum }}</div>
<div>中等风险</div>
</div>
<div class="red-bg">
<div class="red-num">143</div>
<div class="red-num">{{ safeScoreInfo.highRiskNum }}</div>
<div>高风险</div>
</div>
</div>
@ -28,72 +28,109 @@
<div class="blockInner blockInnerup">
<!-- 数据统计 -->
<div class="box-between justify-start">
<div>企业安全评分汇总图</div>
<el-tooltip placement="top">
<div>企业安全评分汇总表</div>
<!-- <el-tooltip placement="top">
<div slot="content">统计企业下面的全部人员的安全评<br />分之和/人员总数</div>
<i class="el-icon-question"></i>
</el-tooltip>
</el-tooltip> -->
</div>
<div style="position: relative;height:100%">
<div class="chart" ref="barGraphFallCharts"></div>
<div v-if="safeList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div>
</div>
</div>
<div class="chart" ref="barGraphFallCharts"></div>
</div>
<div class="blockInner blockInnerup">
<!-- 数据统计 -->
<div class="box-between justify-start">
<div>企业人员风险汇总分析</div>
<div>企业人员风险汇总表</div>
</div>
<div style="position: relative;height:100%">
<div class="chart" ref="lineCharts"></div>
<div v-if="statsEnterpriseList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div>
</div>
</div>
<div class="chart" ref="lineCharts"></div>
</div>
</div>
<div class="topRight whiteBlock3">
<div class="blockInner">
<div class="blockInner" style="position: relative;">
<!-- 分包单位 -->
<div class="box-between">
<div>企业人员安全评分考核明显表</div>
<div class="flex">
<div class="flex align-center">通过人名首字母进行筛选</div>
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label"
<el-select v-model="letterName" placeholder="请选择">
<el-option v-for="item in letterTypeList" :key="item.value" :label="item.label"
:value="item.value" size="mini">
</el-option>
</el-select>
</div>
</div>
<el-tabs v-model="activeName">
<el-tab-pane label="盛世五寰" name="first">
<div class="tablelist">
<el-row class="tablelist-box">
<el-col :class="{'bg-ecf': item == 3,'bg-ffe': item == 5,'bg-fcf': item == 8}" @click.native="innerVisible = true" :span="4" v-for="item in 13"
:key=item>杨静云</el-col>
</el-row>
<el-row class="tablelist-box">
<el-col :span="4" v-for="item in 13" :key=item>杨静云</el-col>
</el-row>
<el-row class="tablelist-box">
<el-col :span="4" v-for="item in 13" :key=item>杨静云</el-col>
</el-row>
<el-tabs v-model="enterpriseId">
<el-tab-pane v-for="item in enterpriseList" :key="item.id" :label="item.enterpriseName"
:name="item.enterpriseId">
<div>
<div class="tablelist" v-infinite-scroll="getSelectWorkerInfoList"
infinite-scroll-disabled="disabled">
<el-row class="tablelist-box" v-for="(ele, index) in workerList" :key="index">
<el-col v-for="item in ele" :key="item.id"
:class="{ 'bg-ecf': item.safeScore >= 90, 'bg-fcf': item.safeScore >= 80, 'bg-ffe': item.safeScore < 80 }"
@click.native="onDeductScore(item)" :span="4">{{ item.workerName }}</el-col>
</el-row>
<!-- <el-row class="tablelist-box">
<el-col :span="4" v-for="item in 13" :key=item>杨静云</el-col>
</el-row>
<el-row class="tablelist-box">
<el-col :span="4" v-for="item in 13" :key=item>杨静云</el-col>
</el-row> -->
</div>
<!-- <p v-if="loading" style="text-align: center;">加载中...</p> -->
<!-- <p v-if="noMore" style="text-align: center;">没有更多了</p> -->
</div>
</el-tab-pane>
<el-tab-pane label="中冶" name="second"></el-tab-pane>
<!-- <el-tab-pane label="中冶" name="second"></el-tab-pane> -->
</el-tabs>
<div v-if="workerList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div>
</div>
</div>
</div>
</div>
<el-dialog width="30%" title="人员安全绩效评分" :visible.sync="innerVisible">
<div class="dialog-box1">
<div>15</div>
<div>{{ deductScoreInfo.safeScore }}</div>
<div>当前分数</div>
</div>
<div class="box-between">
<div class="box-between1">
<div>人员扣分记录</div>
</div>
<div class="dialog-box2">
<div class="dialog-box2" v-for="item in deductScoreInfo.deductScoreList" :key="item.id">
<div>
<div>张三</div>
<div>扣分分数: -3</div>
<div>{{ deductScoreInfo.workerName }}</div>
<div>扣分分数: {{ item.deductScore }}</div>
</div>
<div>扣分原因：安全管理（安全文明施工-未佩戴安全帽）</div>
<div>扣分原因：{{ item.deductReason }}</div>
</div>
<div style="position: relative;height: 50%;">
<div v-if="deductScoreInfo.deductScoreList.length == 0">
<div class="placeholderBox">
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div>
</div>
</div>
</el-dialog>
</div>
@ -101,10 +138,13 @@
<script>
import echarts from 'echarts4';
import {
selectCarStatisticsByCameraIdApi,
selectCarPassRecordInOutCountApi,
getCarPassRecordListApi,
} from "@/assets/js/api/carManage";
getStatsSafeScoreApi,
getStatsEnterpriseApi,
getStatsEnterpriseRiskApi,
getEnterpriseListApi,
getSelectWorkerInfoListApi,
getDeductScoreListApi,
} from "@/assets/js/api/laborPerson";
export default {
data() {
return {
@ -123,51 +163,227 @@ export default {
value1: "",
radio: "",
radio3: "",
options: [{
value: '选项1',
label: 'A'
}, {
value: '选项2',
label: 'B'
}, {
value: '选项3',
label: 'C'
}],
options: [],
value: '',
activeName: "first",
innerVisible: false,
safeScoreInfo: {
highRiskNum: 0,
mediumRiskNum: 0,
lowRiskNum: 0,
},
statsEnterpriseList: [],
enterpriseList: [],
letterName: "",
letterTypeList: [],
enterpriseId: "",
workerList: [],
workerInfo: {
pageNo: 1,
pageSize: 13,
total: 0,
},
loading: false,
safeList: [],
deductScoreInfo: {
deductScoreList: [],
},
};
},
computed: {
noMore() {
// console.log((this.workerInfo.pageNo * this.workerInfo.pageSize) , this.workerInfo.total);
return (this.workerInfo.pageNo * this.workerInfo.pageSize) > (this.workerInfo.total + this.workerInfo.pageSize);
},
disabled() {
return this.loading || this.noMore
},
listenChange() {
const { enterpriseId, letterName } = this;
return { enterpriseId, letterName }
}
},
created() {
this.getStatsSafeScore();
this.getStatsEnterprise();
this.getStatsEnterpriseRisk();
this.getEnterpriseList();
for (var i = -1; i < 26; i++) {
if (i == -1) {
this.letterTypeList.push({
lable: "全部",
value: "全部",
})
} else {
this.letterTypeList.push({
lable: String.fromCharCode(65 + i),
value: String.fromCharCode(65 + i),
})
}
}
},
mounted() {
this.lineCharts(this.$refs.lineCharts);
this.barGraphFallCharts(this.$refs.barGraphFallCharts);
},
watch: {
listenChange: {
handler(newVal) {
console.log(newVal);
this.workerInfo.pageNo = 1;
this.workerList = [];
this.getSelectWorkerInfoList();
},
},
},
methods: {
// 人员风险概览
getStatsSafeScore() {
// if(time && time.length > 0 && time && (time[0] == time[1])) {
// time[0] = time[0] + ' 24:00:00'
// time[1] = time[1] + ' 23:59:59'
// }
getStatsSafeScoreApi({
projectSn: this.$store.state.projectSn,
}).then((res) => {
if (res.code == 200) {
console.log('人员风险概览', res);
this.safeScoreInfo = res.result;
}
});
},
// 企业安全评分汇总
getStatsEnterprise() {
getStatsEnterpriseApi({
projectSn: this.$store.state.projectSn,
}).then((res) => {
if (res.code == 200) {
console.log('企业安全评分汇总', res);
this.safeList = res.result;
this.barGraphFallCharts(this.$refs.barGraphFallCharts);
}
});
},
// 企业人员风险汇总
getStatsEnterpriseRisk() {
getStatsEnterpriseRiskApi({
projectSn: this.$store.state.projectSn,
}).then((res) => {
if (res.code == 200) {
console.log('企业人员风险汇总', res);
this.statsEnterpriseList = res.result;
this.lineCharts(this.$refs.lineCharts);
}
});
},
// 企业列表
getEnterpriseList() {
getEnterpriseListApi({
projectSn: this.$store.state.projectSn,
}).then((res) => {
if (res.code == 200) {
console.log('企业列表', res);
this.enterpriseList = res.result;
this.enterpriseId = this.enterpriseList[0].enterpriseId;
}
});
},
// 人员列表
getSelectWorkerInfoList() {
this.loading = true
getSelectWorkerInfoListApi({
projectSn: this.$store.state.projectSn,
pageNo: this.workerInfo.pageNo,
pageSize: this.workerInfo.pageSize,
enterpriseId: this.enterpriseId,
letter: this.letterName == '全部' ? '' : this.letterName,
inserviceType: 1,
}).then((res) => {
if (res.code == 200) {
console.log('人员列表', res);
if (res.result.records.length > 0) {
if (res.result.records.length == this.workerInfo.pageSize) {
this.workerList.push(res.result.records);
} else {
const countLength = this.workerInfo.pageSize - res.result.records.length;
for (let index = 0; index < countLength; index++) {
res.result.records.push({});
if (index == countLength - 1) {
this.workerList.push(res.result.records);
}
}
}
}
this.workerInfo.total = parseInt(res.result.total);
this.workerInfo.pageNo += 1;
}
}).finally(() => {
this.loading = false;
});
},
// 安全扣分记录
onDeductScore(row) {
if (!row.id) return;
this.deductScoreInfo = { ...this.deductScoreInfo, ...row };
getDeductScoreListApi({
projectSn: this.$store.state.projectSn,
workerId: row.id,
}).then((res) => {
if (res.code == 200) {
console.log('扣分记录', res);
this.deductScoreInfo.deductScoreList = res.result;
}
});
this.innerVisible = true;
},
// 折线图
lineCharts(el) {
let ageChart = echarts.init(el);
let option = {
grid: {
left: '15%',
left: '8%',
right: '8%',
top: '10%',
bottom: "20%",
top: '18%',
bottom: "12%",
// containLabel: true,
},
tooltip: {
icon: "rect",
trigger: 'axis',
axisPointer: { // 坐标轴指示器，鼠标放上时变阴影，而不是线
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
},
textStyle: {
color: '#000000',
},
backgroundColor: "#F3F3F3",
extraCssText: "box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.25);"
},
legend: {
data: ['低风险', '中风险', '高风险'],
x: 'center', //可设定图例在左、右、居中
y: 'bottom', //可设定图例在上、下、居中
x: 'left', //可设定图例在左、右、居中
y: 'top', //可设定图例在上、下、居中
icon: "rect",
},
xAxis: {
type: 'category',
data: ['盛世五寰', '中冶', '上海五建']
data: this.statsEnterpriseList.map(item => item.enterpriseName),
//设置文本过长超出隐藏...表示
axisLabel: {
formatter: function (params) {
var val = "";
if (params.length > 4) {
val = params.substr(0, 4) + '...';
return val;
} else {
return params;
}
}
},
},
yAxis: {
type: 'value',
@ -183,32 +399,35 @@ export default {
name: '低风险',
type: 'line',
stack: 'Total',
data: [150, 230, 224, 218, 135, 147, 260],
data: this.statsEnterpriseList.map(item => item.lowRiskNum),
itemStyle: { //颜色 默认灰色
color: 'rgba(217,117,89,1)',
color: '#FFE500',
},
},
{
name: '中风险',
type: 'line',
stack: 'Total',
data: [220, 182, 191, 234, 290, 330, 310],
data: this.statsEnterpriseList.map(item => item.mediumRiskNum),
itemStyle: { //颜色 默认灰色
color: 'rgba(228,196,119,1)',
color: '#FF9901',
},
},
{
name: '高风险',
type: 'line',
stack: 'Total',
data: [150, 232, 201, 154, 190, 330, 410],
data: this.statsEnterpriseList.map(item => item.highRiskNum),
itemStyle: { //颜色 默认灰色
color: 'rgba(218,116,123,1)',
color: '#FF0000',
},
},
]
};
ageChart.setOption(option);
window.addEventListener("resize", () => {
ageChart.resize();
})
},
// 柱状图 倒
barGraphFallCharts(el) {
@ -220,9 +439,14 @@ export default {
axisPointer: { // 坐标轴指示器，鼠标放上时变阴影，而不是线
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
},
textStyle: {
color: '#000000',
},
backgroundColor: "#F3F3F3",
extraCssText: "box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.25);"
},
grid: {
left: '15%',
left: '14%',
right: '8%',
top: '10%',
bottom: "10%",
@ -249,7 +473,7 @@ export default {
},
yAxis: {
type: 'category',
data: ['中治治勤', '上海五建', '上海建工', '盛世五寰'],
data: this.safeList.map(item => item.x),
axisTick: {
// 轴刻度
show: true,
@ -262,10 +486,22 @@ export default {
show: false,
color: '#268C8C',
},
//设置文本过长超出隐藏...表示
axisLabel: {
formatter: function (params) {
var val = "";
if (params.length > 4) {
val = params.substr(0, 4) + '...';
return val;
} else {
return params;
}
}
},
},
series: [
{
data: [120, 200, 150, 80],
data: this.safeList.map(item => item.y),
type: 'bar',
barWidth: '35%',
color: "#268dff"
@ -275,36 +511,52 @@ export default {
};
ageChart.setOption(option);
window.addEventListener("resize", () => {
ageChart.resize();
})
},
},
};
</script>
<style lang="less" scoped>
.el-tabs {
height: 95%;
}
/deep/ .el-tabs__content {
overflow-y: scroll;
height: 93%;
}
.dialog-box2 {
margin-top: 15px;
margin-top: 31px;
display: flex;
flex-direction: column;
background-color: white;
box-shadow: 2px 2px 4px 2px rgba(33, 33, 34, 0.12);
padding: 10px 20px;
background: #FFFFFF;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
border-radius: 5px 5px 5px 5px;
padding: 12px 12px 25px 12px;
}
.dialog-box2 > div:first-child {
.dialog-box2>div:first-child {
display: flex;
align-items: center;
justify-content: space-between;
}
.dialog-box2 > div:first-child > div:first-child {
.dialog-box2>div:first-child>div:first-child {
color: black;
font-size: 16px;
}
.dialog-box2 > div:first-child > div:last-child {
color: red;
font-size: 24px;
}
.dialog-box2 > div:not(:first-child) {
font-size: 14px;
color: #707070;
.dialog-box2>div:first-child>div:last-child {
color: #C50000;
font-size: 16px;
}
.dialog-box2>div:not(:first-child) {
font-size: 16px;
color: #98999F;
margin-top: 8px
}
@ -314,38 +566,86 @@ export default {
align-items: center;
justify-content: center;
}
.dialog-box1 >div:first-child{
font-size: 30px;
color: red;
.dialog-box1>div:first-child {
font-size: 96px;
color: #C50000;
}
.dialog-box1 >div:last-child{
font-size: 20px;
.dialog-box1>div:last-child {
font-size: 24px;
color: black;
}
.bg-ffe{
.bg-ffe {
background-color: #FFEDED;
// border-color: #ECF8F7 !important;
}
.bg-fcf{
.bg-fcf {
background-color: #FCF8E8;
// border-color: #ECF8F7 !important;
}
.bg-ecf{
.bg-ecf {
background-color: #ECF8F7;
// border-color: #ECF8F7 !important;
}
/deep/ .el-dialog__body {
padding-top: 10px;
height: 480px;
overflow-y: scroll;
}
.el-dialog__title::before {
// 美化滚动条
/deep/ .el-dialog__body::-webkit-scrollbar,
/deep/ .el-tabs__content::-webkit-scrollbar {
width: 6px;
height: 6px;
}
/deep/ .el-dialog__body::-webkit-scrollbar-track,
/deep/ .el-tabs__content::-webkit-scrollbar-track {
width: 6px;
background: rgba(#101F1C, 0.1);
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em;
}
/deep/ .el-dialog__body::-webkit-scrollbar-thumb,
/deep/ .el-tabs__content::-webkit-scrollbar-thumb {
background-color: rgba(144, 147, 153, .5);
background-clip: padding-box;
min-height: 28px;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em;
transition: background-color .3s;
cursor: pointer;
}
/deep/ .el-dialog__body::-webkit-scrollbar-thumb:hover,
/deep/ .el-tabs__content::-webkit-scrollbar-thumb:hover {
background-color: rgba(144, 147, 153, .3);
}
/deep/ .el-dialog__title::before {
display: none
}
/deep/ .el-dialog__title {
color: #7F7F80;
font-size: 24px;
padding-left: 0;
}
.tablelist-box {
display: flex;
justify-content: space-around;
justify-content: flex-start;
// flex-wrap: wrap;
}
@ -356,7 +656,7 @@ export default {
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #dddddd;
border: 1px solid #f2f2f2;
}
.tablelist>div:nth-child(odd) {
@ -674,5 +974,24 @@ export default {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
margin-left: 8px;
}
.box-between::before {
content: "";
width: 3px;
height: 14px;
background: #268DFF;
position: absolute;
left: -8px;
}
.box-between1 {
display: flex;
justify-content: space-between;
align-items: center;
color: #98999F;
font-size: 24px;
}
</style>