Skip to content

Z
zh-baseversion-project
Commit 53ba49c1 authored by xulihui's avatar xulihui
Browse files
Options

监督检查新增检查结果分析

parent 2808b7a3
Show whitespace changes
Inline Side-by-side
Showing with 1927 additions and 10 deletions
zh-baseversion-admin/src/main/java/com/zehong/web/controller/supervision/TInsRecInforController.java
View file @ 53ba49c1
package com.zehong.web.controller.supervision; package com.zehong.web.controller.supervision;
import java.util.Calendar;
import java.util.HashMap;
import java.util.List; import java.util.List;
import java.util.Map;
import java.util.stream.Collectors;
import com.zehong.system.domain.TEnterpriseInfo;
import com.zehong.system.domain.TLinePatrol;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.PostMapping;
...@@ -119,4 +126,11 @@ public class TInsRecInforController extends BaseController ...@@ -119,4 +126,11 @@ public class TInsRecInforController extends BaseController
return AjaxResult.error("上传检查记录接口异常"); return AjaxResult.error("上传检查记录接口异常");
} }
} }
@GetMapping("/checkStatistics")
public AjaxResult checkStatistics()
{
HashMap map = tInsRecInforService.checkStatistics();
return AjaxResult.success(map);
}
} }
zh-baseversion-admin/src/main/java/com/zehong/web/controller/supervision/TInsSpotHazardRefController.java
View file @ 53ba49c1
package com.zehong.web.controller.supervision; package com.zehong.web.controller.supervision;
import java.util.List; import java.util.List;
import com.zehong.system.domain.TInspectReport;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.PostMapping;
...@@ -103,4 +105,13 @@ public class TInsSpotHazardRefController extends BaseController ...@@ -103,4 +105,13 @@ public class TInsSpotHazardRefController extends BaseController
{ {
return toAjax(tInsSpotHazardRefService.deleteTInsSpotHazardRefByIds(fInsSpotHazardRefIds)); return toAjax(tInsSpotHazardRefService.deleteTInsSpotHazardRefByIds(fInsSpotHazardRefIds));
} }
/**
* 隐患统计
* @return
*/
@GetMapping("/hiddenBookStatistics")
public AjaxResult hiddenBookStatistics(TInspectReport report){
return AjaxResult.success(tInsSpotHazardRefService.hiddenBookStatistics(report));
}
} }
zh-baseversion-system/src/main/java/com/zehong/system/domain/TInspectReport.java
View file @ 53ba49c1
...@@ -89,6 +89,17 @@ public class TInspectReport extends BaseEntity ...@@ -89,6 +89,17 @@ public class TInspectReport extends BaseEntity
//最后上报时间 //最后上报时间
private String lastTime; private String lastTime;
//隐患来源（1巡检，2入户安检）
private String source;
public String getSource() {
return source;
}
public void setSource(String source) {
this.source = source;
}
public Long getUserNo() { public Long getUserNo() {
return userNo; return userNo;
} }
......
zh-baseversion-system/src/main/java/com/zehong/system/mapper/TInsSpotHazardRefMapper.java
View file @ 53ba49c1
package com.zehong.system.mapper; package com.zehong.system.mapper;
import java.util.List; import java.util.List;
import java.util.Map;
import com.zehong.system.domain.TInsSpotHazardRef; import com.zehong.system.domain.TInsSpotHazardRef;
import com.zehong.system.domain.TInspectReport;
/** /**
* 监督检查-抽查隐患Mapper接口 * 监督检查-抽查隐患Mapper接口
...@@ -73,4 +76,10 @@ public interface TInsSpotHazardRefMapper ...@@ -73,4 +76,10 @@ public interface TInsSpotHazardRefMapper
*/ */
int batchInsertTInsSpotHazardRef(List<TInsSpotHazardRef> list); int batchInsertTInsSpotHazardRef(List<TInsSpotHazardRef> list);
/**
* 隐患统计
* @return
*/
Map<String,Integer> hiddenBookStatistics(TInspectReport report);
} }
zh-baseversion-system/src/main/java/com/zehong/system/service/ITInsRecInforService.java
View file @ 53ba49c1
package com.zehong.system.service; package com.zehong.system.service;
import java.util.HashMap;
import java.util.List; import java.util.List;
import java.util.Map;
import com.zehong.system.domain.TInsRecInfor; import com.zehong.system.domain.TInsRecInfor;
/** /**
...@@ -65,4 +68,6 @@ public interface ITInsRecInforService ...@@ -65,4 +68,6 @@ public interface ITInsRecInforService
* @return * @return
*/ */
int reportRecInfo(Long fInsRecInforId) throws Exception; int reportRecInfo(Long fInsRecInforId) throws Exception;
HashMap checkStatistics();
} }
zh-baseversion-system/src/main/java/com/zehong/system/service/ITInsSpotHazardRefService.java
View file @ 53ba49c1
package com.zehong.system.service; package com.zehong.system.service;
import java.util.List; import java.util.List;
import java.util.Map;
import com.zehong.system.domain.TInsSpotHazardRef; import com.zehong.system.domain.TInsSpotHazardRef;
import com.zehong.system.domain.TInspectReport;
/** /**
* 监督检查-抽查隐患Service接口 * 监督检查-抽查隐患Service接口
...@@ -65,4 +68,10 @@ public interface ITInsSpotHazardRefService ...@@ -65,4 +68,10 @@ public interface ITInsSpotHazardRefService
* @return 结果 * @return 结果
*/ */
public int deleteTInsSpotHazardRefById(Long fInsSpotHazardRefId); public int deleteTInsSpotHazardRefById(Long fInsSpotHazardRefId);
/**
* 隐患统计
* @return
*/
Map<String,Integer> hiddenBookStatistics(TInspectReport report);
} }
zh-baseversion-system/src/main/java/com/zehong/system/service/impl/TInsRecInforServiceImpl.java
View file @ 53ba49c1
...@@ -5,9 +5,7 @@ import com.zehong.common.exception.CustomException; ...@@ -5,9 +5,7 @@ import com.zehong.common.exception.CustomException;
import com.zehong.common.utils.GovernmentDataCopyUtil; import com.zehong.common.utils.GovernmentDataCopyUtil;
import com.zehong.common.utils.GovernmentDataUtil; import com.zehong.common.utils.GovernmentDataUtil;
import com.zehong.common.utils.StringUtils; import com.zehong.common.utils.StringUtils;
import com.zehong.system.domain.SysSetting; import com.zehong.system.domain.*;
import com.zehong.system.domain.TInsHazRef;
import com.zehong.system.domain.TInsRecInfor;
import com.zehong.system.domain.vo.TInsRecInforVo; import com.zehong.system.domain.vo.TInsRecInforVo;
import com.zehong.system.mapper.TInsHazRefMapper; import com.zehong.system.mapper.TInsHazRefMapper;
import com.zehong.system.mapper.TInsRecInforMapper; import com.zehong.system.mapper.TInsRecInforMapper;
...@@ -24,11 +22,9 @@ import org.springframework.util.CollectionUtils; ...@@ -24,11 +22,9 @@ import org.springframework.util.CollectionUtils;
import javax.annotation.Resource; import javax.annotation.Resource;
import java.sql.SQLIntegrityConstraintViolationException; import java.sql.SQLIntegrityConstraintViolationException;
import java.text.SimpleDateFormat; import java.text.SimpleDateFormat;
import java.time.LocalDate;
import java.time.Year; import java.time.Year;
import java.util.ArrayList; import java.util.*;
import java.util.Date;
import java.util.List;
import java.util.Map;
/** /**
* 监督检查-检查记录Service业务层处理 * 监督检查-检查记录Service业务层处理
...@@ -193,4 +189,24 @@ public class TInsRecInforServiceImpl implements ITInsRecInforService ...@@ -193,4 +189,24 @@ public class TInsRecInforServiceImpl implements ITInsRecInforService
if(i == 0) throw new CustomException("检查记录上传状态更新失败"); if(i == 0) throw new CustomException("检查记录上传状态更新失败");
return 1; return 1;
} }
@Override
public HashMap checkStatistics() {
List<TInsRecInfor> tInsRecInfors = tInsRecInforMapper.selectTInsRecInforList(new TInsRecInfor());
HashMap resultMap = new HashMap();
LocalDate now = LocalDate.now();
int year = now.getYear()+1;
String[] enterpriseName = new String[]{"","","",""};
int[] numbers = new int[enterpriseName.length];
for(int i =0;i<4;i++){
year-=1;
enterpriseName[i] = String.valueOf(year);
int finalI = i;
long count = tInsRecInfors.stream().filter(tInsRecInfor -> tInsRecInfor.getfCheckTime().contains(enterpriseName[finalI])).count();
numbers[i] = (int) count;
}
resultMap.put("enterpriseName",enterpriseName);
resultMap.put("numbers",numbers);
return resultMap;
}
} }
zh-baseversion-system/src/main/java/com/zehong/system/service/impl/TInsSpotHazardRefServiceImpl.java
View file @ 53ba49c1
...@@ -4,9 +4,11 @@ import java.sql.SQLIntegrityConstraintViolationException; ...@@ -4,9 +4,11 @@ import java.sql.SQLIntegrityConstraintViolationException;
import java.text.SimpleDateFormat; import java.text.SimpleDateFormat;
import java.util.Date; import java.util.Date;
import java.util.List; import java.util.List;
import java.util.Map;
import com.zehong.common.exception.CustomException; import com.zehong.common.exception.CustomException;
import com.zehong.common.utils.StringUtils; import com.zehong.common.utils.StringUtils;
import com.zehong.system.domain.TInspectReport;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service; import org.springframework.stereotype.Service;
import com.zehong.system.mapper.TInsSpotHazardRefMapper; import com.zehong.system.mapper.TInsSpotHazardRefMapper;
...@@ -132,4 +134,13 @@ public class TInsSpotHazardRefServiceImpl implements ITInsSpotHazardRefService ...@@ -132,4 +134,13 @@ public class TInsSpotHazardRefServiceImpl implements ITInsSpotHazardRefService
{ {
return tInsSpotHazardRefMapper.deleteTInsSpotHazardRefById(fInsSpotHazardRefId); return tInsSpotHazardRefMapper.deleteTInsSpotHazardRefById(fInsSpotHazardRefId);
} }
/**
* 隐患统计
* @return
*/
@Override
public Map<String,Integer> hiddenBookStatistics(TInspectReport report){
return tInsSpotHazardRefMapper.hiddenBookStatistics(report);
}
} }
zh-baseversion-system/src/main/resources/mapper/system/THiddenDangerStandingBookMapper.xml
View file @ 53ba49c1
...@@ -279,7 +279,10 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" ...@@ -279,7 +279,10 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
FROM FROM
t_hidden_danger_standing_book t_hidden_danger_standing_book
WHERE WHERE
is_del = '0' and source = '2' is_del = '0'
<if test="source!=null and source!=''">
AND source = #{source}
</if>
<if test="annual!=null"> AND hidden_find_date like concat('%',#{annual},'%') </if> <if test="annual!=null"> AND hidden_find_date like concat('%',#{annual},'%') </if>
<if test="companyInfoId!=null and companyInfoId!=''"> <if test="companyInfoId!=null and companyInfoId!=''">
AND beyondEnterprise_id = #{companyInfoId} AND beyondEnterprise_id = #{companyInfoId}
......
zh-baseversion-system/src/main/resources/mapper/system/TInsSpotHazardRefMapper.xml
View file @ 53ba49c1
...@@ -190,4 +190,25 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" ...@@ -190,4 +190,25 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
) )
</foreach> </foreach>
</insert> </insert>
<select id="hiddenBookStatistics" resultType="java.util.HashMap" parameterType="TInspectReport">
SELECT
IFNULL(SUM(f_after_picture is not null ),0) AS finishNum,
IFNULL(SUM(f_after_picture is null ),0) AS unFinishNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-0100' THEN 1 ELSE 0 END),0) AS blowNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-0200-0201' THEN 1 ELSE 0 END),0) AS corrosionNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-0200-0202' THEN 1 ELSE 0 END),0) AS crackNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-0200-0203' THEN 1 ELSE 0 END),0) AS deviceNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-9900-0302' THEN 1 ELSE 0 END),0) AS distanceNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-9900-0303' THEN 1 ELSE 0 END),0) AS pipeNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-9900-0304' THEN 1 ELSE 0 END),0) AS otherNum,
IFNULL(SUM(CASE f_obj_code WHEN '23-9900-0305' THEN 1 ELSE 0 END),0) AS biomassNum
FROM
t_ins_spot_hazard_ref
WHERE 1=1
<if test="annual!=null"> AND f_check_time like concat('%',#{annual},'%') </if>
<if test="companyInfoId!=null and companyInfoId!=''">
AND f_involve_enterprise_code = #{companyInfoId}
</if>
</select>
</mapper> </mapper>
\ No newline at end of file
zh-baseversion-web/src/api/supervision/record.js
View file @ 53ba49c1
...@@ -69,3 +69,10 @@ export function reportRecInfo(query) { ...@@ -69,3 +69,10 @@ export function reportRecInfo(query) {
params: query params: query
}) })
} }
export function checkStatistics() {
return request({
url: '/supervision/record/checkStatistics',
method: 'get'
})
}
zh-baseversion-web/src/api/supervision/spot.js
View file @ 53ba49c1
...@@ -60,3 +60,12 @@ export function exportRef(query) { ...@@ -60,3 +60,12 @@ export function exportRef(query) {
params: query params: query
}) })
} }
//隐患统计
export function hiddenBookStatistics(query) {
return request({
url: '/supervision/spot/hiddenBookStatistics',
method: 'get',
params: query
})
}
zh-baseversion-web/src/views/operationMonitor/xunjianxuncha/components/Middle.vue
View file @ 53ba49c1
...@@ -160,7 +160,7 @@ export default { ...@@ -160,7 +160,7 @@ export default {
}; };
}, },
getHiddenBookInfo(){ getHiddenBookInfo(){
hiddenBookStatistics().then(res =>{ hiddenBookStatistics({companyInfoId:this.companyInfoId,annual:this.annual,source:'1'}).then(res =>{
if(res.code == 200){ if(res.code == 200){
this.hiddenBookInfo= res.data; this.hiddenBookInfo= res.data;
this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}]; this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}];
......
zh-baseversion-web/src/views/supervise/analysis/components/Middle.vue
View file @ 53ba49c1
...@@ -185,7 +185,7 @@ export default { ...@@ -185,7 +185,7 @@ export default {
}; };
}, },
getHiddenBookInfo(){ getHiddenBookInfo(){
hiddenBookStatistics({companyInfoId:this.companyInfoId,annual:this.annual}).then(res =>{ hiddenBookStatistics({companyInfoId:this.companyInfoId,annual:this.annual,source:'2'}).then(res =>{
if(res.code == 200){ if(res.code == 200){
this.hiddenBookInfo= res.data; this.hiddenBookInfo= res.data;
this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}]; this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}];
......
zh-baseversion-web/src/views/supervision/analysisInspection/components/JcMiddle.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 15:07:47
* @LastEditTime: 2022-04-20 11:09:34
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/topChars/left.vue
-->
<template>
<div class="charsCom all-flex-h">
<div class="title">监督检查隐患整改</div>
<div class="two all-flex">
<div class="left">
<div class="first">
<span class="text">隐患发现情况</span>
<span>{{hiddenBookInfo.finishNum + hiddenBookInfo.unFinishNum}}次</span>
</div>
<div class="second all-flex">
<div class="left">隐患未整改数</div>
<div class="right">隐患已整改数</div>
</div>
<div class="third all-flex">
<div class="left">{{ hiddenBookInfo.unFinishNum}}</div>
<div class="right">{{hiddenBookInfo.finishNum}}</div>
</div>
</div>
<div class="right">
<div class="first">
<span class="text">隐患整改率</span>
</div>
<div class="chars-box">
<Chars color="#604AFF" :options="option"></Chars>
</div>
</div>
</div>
<div class="three all-flex-h">
<div class="first">隐患原因</div>
<div ref="myChartWidth" class="chars-box">
<Chars :options="reasonOptions" />
</div>
</div>
</div>
</template>
<script>
import Chars from "@/components/allCharsCom/Chars";
import { hiddenBookStatistics } from "@/api/supervision/spot";
export default {
components: {
Chars,
},
created(){
this.getHiddenBookInfo();
},
props:{
annual: {
type: String,
default: 2025,
},
companyInfoId: {
type: String,
default: 23,
},
},
data() {
return {
bottomData: [
[
{ name: "气代煤", value: 0, color: "#604AFF" },
{ name: "传统电代煤", value: 0, color: "#FFC337" },
{ name: "石墨烯", value: 0, color: "#86FF5B" },
{ name: "聚能", value: 0, color: "#03C4F1" },
{ name: "光伏+", value: 0, color: "#1F8DF3" },
],
],
option:{
color:['blue','lightblue'],
grid: {
bottom: "7%",
containLabel: true,
},
tooltip: {
trigger: "item",
},
series: [
{
name: '访问来源',
type: 'pie',
radius: ['40%', '70%'],
label: {
show: true,
position: 'center'
},
labelLine: {
show: false
},
data: [
{value: 0, name: '整改'},
{value: 0, name: '未整改'},
]
}
]
},
reasonOptions:{},
hiddenBookInfo: {
unFinishNum: 0,
finishNum: 0
}
};
},
watch: {
annual(newVal, oldVal) {
console.log(`Message changed from "${oldVal}" to "${newVal}"`);
this.getHiddenBookInfo();
},
companyInfoId(newVal, oldVal){
this.getHiddenBookInfo();
}
},
methods: {
bottomOptions() {
return {
series: this.bottomData.map((data, idx) => {
const rich = {};
data
.map((item) => ({
fontsize: 12,
color: item.color,
}))
.forEach((item, index) => {
rich[`dataIndex${index}`] = item;
});
return {
type: "pie",
radius: ["68%", "80%"],
tooltip: {
trigger: "item",
},
color: data.map((item) => item.color),
itemStyle: {
borderWidth: 2,
borderRadius: 10,
borderColor: "#fff",
},
label: {
alignTo: "edge",
// formatter: "{name|{b}}\n{num|{c} 个}",
formatter: (parm) => {
return `{dataIndex${parm.dataIndex}|${parm.data.name}}\n{dataIndex${parm.dataIndex}|${parm.data.value}}`;
},
minMargin: 5,
edgeDistance: 10,
lineHeight: 15,
rich,
},
labelLine: {
length: 15,
length2: 0,
maxSurfaceAngle: 80,
},
labelLayout: (params) => {
const { width } = this.$refs.myChartWidth.getBoundingClientRect();
const isLeft = params.labelRect.x < width / 2;
const points = params.labelLinePoints;
// Update the end point.
points[2][0] = isLeft
? params.labelRect.x
: params.labelRect.x + params.labelRect.width;
return {
labelLinePoints: points,
};
},
data: data,
};
}),
};
},
getHiddenBookInfo(){
console.log("this.companyInfoId",this.companyInfoId)
console.log("this.annual",this.annual)
hiddenBookStatistics({companyInfoId:this.companyInfoId,annual:this.annual,source:'1'}).then(res =>{
if(res.code == 200){
this.hiddenBookInfo= res.data;
this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}];
this.bottomData = [
[{ name: "气代煤", value: res.data.blowNum, color: "#604AFF" },
{ name: "传统电代煤", value: res.data.corrosionNum, color: "#FFC337" },
{ name: "石墨烯", value: res.data.crackNum, color: "#86FF5B" },
{ name: "聚能", value: res.data.deviceNum, color: "#03C4F1" },
{ name: "光伏+", value: res.data.distanceNum, color: "#1F8DF3" },
{ name: "光热+", value: res.data.pipeNum, color: "#03C4F1" },
{ name: "醇基燃料", value: res.data.otherNum, color: "#1F8DF3" },
{ name: "生物质", value: res.data.biomassNum, color: "#e3c25d" }]
],
this.reasonOptions = this.bottomOptions();
}
//console.log("res==================",res)
})
}
},
};
</script>
<style lang="scss" scoped>
.charsCom {
width: 100%;
height: 100%;
color: #333333;
}
.title {
text-align: center;
font-size: 24px;
margin-bottom: 7px;
}
.two {
// flex: 1;
> .left {
margin-right: 70px;
.first {
margin-bottom: 6px;
}
.second {
width: 213px;
height: 30px;
line-height: 30px;
box-sizing: border-box;
box-shadow: 0px 0px 3px 1px #dddddd;
margin-bottom: 19px;
> div {
// flex: 1;
text-align: center;
&.left {
color: #1d8cf3;
}
&.right {
color: #00c3f1;
}
}
}
.third {
text-align: center;
width: 213px;
margin-bottom: 24px;
}
}
> .right {
.first {
text-align: center !important;
}
.chars-box {
width: 90px;
height: 90px;
margin: 0 auto;
}
}
> div {
font-size: 16px;
flex: 1;
// display: flex;
// flex-direction: column;
}
.left,
.right {
// display: flex;
// flex-direction: column;
// justify-content: space-between;
.first {
text-align: left;
.text {
display: inline-block;
margin-right: 8px;
}
}
}
}
.three {
font-size: 16px;
flex: 1;
// background: red;
.chars-box {
flex: 1;
}
}
</style>
zh-baseversion-web/src/views/supervision/analysisInspection/components/Left.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 15:07:47
* @LastEditTime: 2022-04-12 09:55:18
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/topChars/left.vue
-->
<template>
<div class="charsCom all-flex-h">
<div class="title">各年度入户安检统计</div>
<div id="main1" class="two all-flex">
<!--<chars :options="options"></chars>-->
</div>
</div>
</template>
<script>
import Chars from "@/components/allCharsCom/Chars";
import { indoorsummary } from "@/api/statistic/statisticAnalysis";
export default {
components: {
Chars,
},
props:{
annual: {
type: String,
default: 2025,
},
companyInfoId: {
type: String,
default: 23,
},
},
data(){
return{
totalObj: {
taskTotal: 0,
taskFeedbackTotal: 0
},
maps:{},
options: {
grid: {
top: '10%', // 上边距
right: '5%', // 右边距
bottom: '0%', // 下边距
left: '5%', // 左边距
containLabel: true // 保证坐标轴标签等内容不被遮挡
},
legend: {},
tooltip: {},
dataset: {
source: [
['product', '已安检', '未安检', '到访不遇','拒绝安检'],
['2026', 43.3, 85.8, 93.7,10],
['2025', 83.1, 73.4, 55.1,10],
['2024', 86.4, 65.2, 82.5,10],
['2023', 72.4, 53.9, 39.1,10]
]
},
xAxis: { type: 'category' },
yAxis: {},
series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
}
}
},
created(){
this.getStatiData();
//setTimeout(this.getzhanshi,1000);
},
methods:{
getzhanshi(){
var myChart = this.$echarts.init(document.getElementById('main1'));
myChart.setOption(this.options);
},
getStatiData() {
indoorsummary().then(response => {
console.log(response.data);
var source = [
['product', '已安检', '未安检', '到访不遇','拒绝安检']
]
for(var map of response.data){
source.push([map.yearNum,map.doneNum,map.allNum-map.yearNum-map.noneNum-map.rejNum,map.noneNum,map.rejNum]);
}
console.log('canshu',source)
this.options.dataset.source = source;
var myChart = this.$echarts.init(document.getElementById('main1'));
myChart.setOption(this.options);
// source: [
// ['product', '已安检', '未安检', '到访不遇','拒绝安检'],
// ['2026', 43.3, 85.8, 93.7,10],
// ['2025', 83.1, 73.4, 55.1,10],
// ['2024', 86.4, 65.2, 82.5,10],
// ['2023', 72.4, 53.9, 39.1,10]
// ]
});
},
}
};
</script>
<style lang="scss" scoped>
.charsCom {
width: 100%;
height: 100%;
color: #333333;
}
.title {
text-align: center;
font-size: 24px;
margin-bottom: 7px;
}
.two {
flex: 1;
> .left {
margin-right: 70px;
}
> .right {
}
> div {
font-size: 16px;
flex: 1;
// display: flex;
// flex-direction: column;
}
.left,
.right {
display: flex;
flex-direction: column;
justify-content: space-between;
.first {
margin-bottom: 6px;
text-align: left;
.text {
display: inline-block;
margin-right: 8px;
}
}
.second {
width: 250px;
height: 30px;
line-height: 30px;
box-sizing: border-box;
box-shadow: 0px 0px 3px 1px #dddddd;
margin-bottom: 19px;
> div {
// flex: 1;
text-align: center;
&.left {
color: #1d8cf3;
}
&.right {
color: #00c3f1;
}
}
}
.third {
text-align: center;
width: 250px;
margin-bottom: 24px;
}
.fifth {
flex: 1;
// background: red;
padding-top: 5px;
.contant {
width: 120px;
height: 120px;
margin: 0 auto;
}
}
}
}
</style>
zh-baseversion-web/src/views/supervision/analysisInspection/components/Middle.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 15:07:47
* @LastEditTime: 2022-04-20 11:09:34
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/topChars/left.vue
-->
<template>
<div class="charsCom all-flex-h">
<div class="title">入户安检隐患整改</div>
<div class="two all-flex">
<div class="left">
<div class="first">
<span class="text">隐患发现情况</span>
<span>{{hiddenBookInfo.finishNum + hiddenBookInfo.unFinishNum}}次</span>
</div>
<div class="second all-flex">
<div class="left">隐患未整改数</div>
<div class="right">隐患已整改数</div>
</div>
<div class="third all-flex">
<div class="left">{{ hiddenBookInfo.unFinishNum}}</div>
<div class="right">{{hiddenBookInfo.finishNum}}</div>
</div>
</div>
<div class="right">
<div class="first">
<span class="text">隐患整改率</span>
</div>
<div class="chars-box">
<Chars color="#604AFF" :options="option"></Chars>
</div>
</div>
</div>
<div class="three all-flex-h">
<div class="first">隐患原因</div>
<div ref="myChartWidth" class="chars-box">
<Chars :options="reasonOptions" />
</div>
</div>
</div>
</template>
<script>
import Chars from "@/components/allCharsCom/Chars";
import { hiddenBookStatistics } from "@/api/standingBook/hidden";
export default {
components: {
Chars,
},
created(){
this.getHiddenBookInfo();
},
props:{
annual: {
type: String,
default: 2025,
},
companyInfoId: {
type: String,
default: 23,
},
},
data() {
return {
bottomData: [
[
{ name: "裂缝", value: 0, color: "#604AFF" },
{ name: "管道称重", value: 0, color: "#FFC337" },
{ name: "其他", value: 0, color: "#86FF5B" },
{ name: "腐蚀", value: 0, color: "#03C4F1" },
{ name: "漏气", value: 0, color: "#1F8DF3" },
],
],
option:{
color:['blue','lightblue'],
grid: {
bottom: "7%",
containLabel: true,
},
tooltip: {
trigger: "item",
},
series: [
{
name: '访问来源',
type: 'pie',
radius: ['40%', '70%'],
label: {
show: true,
position: 'center'
},
labelLine: {
show: false
},
data: [
{value: 0, name: '整改'},
{value: 0, name: '未整改'},
]
}
]
},
reasonOptions:{},
hiddenBookInfo: {
unFinishNum: 0,
finishNum: 0
}
};
},
watch: {
annual(newVal, oldVal) {
console.log(`Message changed from "${oldVal}" to "${newVal}"`);
this.getHiddenBookInfo();
},
companyInfoId(newVal, oldVal){
this.getHiddenBookInfo();
}
},
methods: {
bottomOptions() {
return {
series: this.bottomData.map((data, idx) => {
const rich = {};
data
.map((item) => ({
fontsize: 12,
color: item.color,
}))
.forEach((item, index) => {
rich[`dataIndex${index}`] = item;
});
return {
type: "pie",
radius: ["68%", "80%"],
tooltip: {
trigger: "item",
},
color: data.map((item) => item.color),
itemStyle: {
borderWidth: 2,
borderRadius: 10,
borderColor: "#fff",
},
label: {
alignTo: "edge",
// formatter: "{name|{b}}\n{num|{c} 个}",
formatter: (parm) => {
return `{dataIndex${parm.dataIndex}|${parm.data.name}}\n{dataIndex${parm.dataIndex}|${parm.data.value}}`;
},
minMargin: 5,
edgeDistance: 10,
lineHeight: 15,
rich,
},
labelLine: {
length: 15,
length2: 0,
maxSurfaceAngle: 80,
},
labelLayout: (params) => {
const { width } = this.$refs.myChartWidth.getBoundingClientRect();
const isLeft = params.labelRect.x < width / 2;
const points = params.labelLinePoints;
// Update the end point.
points[2][0] = isLeft
? params.labelRect.x
: params.labelRect.x + params.labelRect.width;
return {
labelLinePoints: points,
};
},
data: data,
};
}),
};
},
getHiddenBookInfo(){
console.log("this.companyInfoId",this.companyInfoId)
console.log("this.annual",this.annual)
hiddenBookStatistics({companyInfoId:this.companyInfoId,annual:this.annual,source:'2'}).then(res =>{
if(res.code == 200){
this.hiddenBookInfo= res.data;
this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}];
this.bottomData = [
[{ name: "漏气", value: res.data.blowNum, color: "#604AFF" },
{ name: "腐蚀", value: res.data.corrosionNum, color: "#FFC337" },
{ name: "裂缝", value: res.data.crackNum, color: "#86FF5B" },
{ name: "设备故障", value: res.data.deviceNum, color: "#03C4F1" },
{ name: "安全距离不足", value: res.data.distanceNum, color: "#1F8DF3" },
{ name: "管道承重", value: res.data.pipeNum, color: "#03C4F1" },
{ name: "其他", value: res.data.otherNum, color: "#1F8DF3" }]
],
this.reasonOptions = this.bottomOptions();
}
//console.log("res==================",res)
})
}
},
};
</script>
<style lang="scss" scoped>
.charsCom {
width: 100%;
height: 100%;
color: #333333;
}
.title {
text-align: center;
font-size: 24px;
margin-bottom: 7px;
}
.two {
// flex: 1;
> .left {
margin-right: 70px;
.first {
margin-bottom: 6px;
}
.second {
width: 213px;
height: 30px;
line-height: 30px;
box-sizing: border-box;
box-shadow: 0px 0px 3px 1px #dddddd;
margin-bottom: 19px;
> div {
// flex: 1;
text-align: center;
&.left {
color: #1d8cf3;
}
&.right {
color: #00c3f1;
}
}
}
.third {
text-align: center;
width: 213px;
margin-bottom: 24px;
}
}
> .right {
.first {
text-align: center !important;
}
.chars-box {
width: 90px;
height: 90px;
margin: 0 auto;
}
}
> div {
font-size: 16px;
flex: 1;
// display: flex;
// flex-direction: column;
}
.left,
.right {
// display: flex;
// flex-direction: column;
// justify-content: space-between;
.first {
text-align: left;
.text {
display: inline-block;
margin-right: 8px;
}
}
}
}
.three {
font-size: 16px;
flex: 1;
// background: red;
.chars-box {
flex: 1;
}
}
</style>
zh-baseversion-web/src/views/supervision/analysisInspection/components/Right.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 15:07:47
* @LastEditTime: 2022-04-12 09:55:18
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/topChars/left.vue
-->
<template>
<div class="charsCom all-flex-h">
<div class="title">各年度监督检查统计</div>
<div class="two all-flex">
<div id="Jcchars" class="chars" style="width: 100%; height: 300px;"></div>
</div>
</div>
</template>
<script>
import { checkStatistics } from "@/api/supervision/record";;
export default {
components: {
},
data(){
return{
year:'2025-',
totalObj: {
taskTotal: 0,
taskFeedbackTotal: 0
},
chartInstance: null // 用于保存echarts实例
}
},
created(){
this.getChars();
},
mounted() {
// 确保DOM渲染完成后再初始化图表
this.$nextTick(() => {
this.initChart();
});
},
beforeDestroy() {
// 组件销毁前销毁echarts实例，避免内存泄漏
if (this.chartInstance) {
this.chartInstance.dispose();
this.chartInstance = null;
}
// 移除窗口大小变化监听
window.removeEventListener('resize', this.handleResize);
},
methods:{
// 初始化图表
initChart() {
const chartDom = document.getElementById('Jcchars');
if (!chartDom) {
console.error('图表容器未找到');
return;
}
try {
// 使用全局挂载的echarts
this.chartInstance = this.$echarts.init(chartDom);
// 初始空配置 - 竖向柱状图
const option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
formatter: function(params) {
const data = params[0];
return `${data.name}<br/>监督检查次数: ${data.value}`;
}
},
grid: {
left: '3%',
right: '4%',
bottom: '10%',
top: '15%',
containLabel: true
},
xAxis: {
type: 'category',
data: [],
axisLabel: {
fontSize: 12,
interval: 0,
rotate: 30, // 如果公司名称太长，可以旋转角度
width: 80,
overflow: 'truncate'
},
axisTick: {
show: false
}
},
yAxis: {
type: 'value',
name: '检查次数',
axisLabel: {
fontSize: 12
}
},
series: [
{
name: '监督检查次数',
type: 'bar',
data: [],
itemStyle: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#188df0' },
{ offset: 0.5, color: '#1d8cf3' },
{ offset: 1, color: '#83bff6' }
])
},
emphasis: {
itemStyle: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#2378f7' },
{ offset: 0.7, color: '#2378f7' },
{ offset: 1, color: '#83bff6' }
])
}
},
barWidth: '50%',
label: {
show: true,
position: 'top',
formatter: '{c}'
}
}
]
};
this.chartInstance.setOption(option);
// 窗口大小改变时重绘图表
window.addEventListener('resize', this.handleResize);
} catch (error) {
console.error('初始化图表失败:', error);
}
},
// 处理窗口大小变化
handleResize() {
if (this.chartInstance) {
this.chartInstance.resize();
}
},
// 获取数据并更新图表
getChars() {
checkStatistics().then(res =>{
if(res.code == 200){
console.log("res", res);
// 更新图表数据
this.updateChart(res.data);
}
}).catch(error => {
console.error("获取监督检查数据失败:", error);
});
},
// 更新图表数据
updateChart(data) {
if (!this.chartInstance || !data) return;
// 对数据进行排序（从大到小）
/*const combined = data.enterpriseName.map((name, index) => ({
name,
value: data.numbers[index] || 0
}));
// 按监督检查次数降序排序
combined.sort((a, b) => b.value - a.value);
// 提取排序后的数据
const sortedNames = combined.map(item => item.name);
const sortedValues = combined.map(item => item.value);*/
// 更新图表配置 - 竖向柱状图
const option = {
xAxis: {
data: data.enterpriseName
},
series: [{
data: data.numbers
}]
};
this.chartInstance.setOption(option);
}
}
};
</script>
<style lang="scss" scoped>
.charsCom {
width: 100%;
height: 100%;
color: #333333;
}
.title {
text-align: center;
font-size: 24px;
margin-bottom: 7px;
}
.two {
flex: 1;
> .left {
margin-right: 70px;
}
> .right {
}
> div {
font-size: 16px;
flex: 1;
}
.left,
.right {
display: flex;
flex-direction: column;
justify-content: space-between;
.first {
margin-bottom: 6px;
text-align: left;
.text {
display: inline-block;
margin-right: 8px;
}
}
.second {
width: 213px;
height: 30px;
line-height: 30px;
box-sizing: border-box;
box-shadow: 0px 0px 3px 1px #dddddd;
margin-bottom: 19px;
> div {
text-align: center;
&.left {
color: #1d8cf3;
}
&.right {
color: #00c3f1;
}
}
}
.third {
text-align: center;
width: 213px;
margin-bottom: 24px;
}
.fifth {
flex: 1;
padding-top: 5px;
.contant {
width: 120px;
height: 120px;
margin: 0 auto;
}
}
}
}
</style>
zh-baseversion-web/src/views/supervision/analysisInspection/components/XjLeft.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 15:07:47
* @LastEditTime: 2022-04-12 09:55:18
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/topChars/left.vue
-->
<template>
<div class="charsCom all-flex-h">
<div class="title">各公司巡检统计</div>
<div class="two all-flex">
<div id="chars" class="chars" style="width: 100%; height: 300px;"></div>
</div>
</div>
</template>
<script>
import { getPatrolChars } from "@/api/inspectionWork/linePatrol";
export default {
components: {
},
data(){
return{
year:'2025-',
totalObj: {
taskTotal: 0,
taskFeedbackTotal: 0
},
chartInstance: null // 用于保存echarts实例
}
},
created(){
this.getChars();
},
props:{
annual: {
type: String,
default: 2025,
}
},
mounted() {
// 确保DOM渲染完成后再初始化图表
this.$nextTick(() => {
this.initChart();
});
},
beforeDestroy() {
// 组件销毁前销毁echarts实例，避免内存泄漏
if (this.chartInstance) {
this.chartInstance.dispose();
this.chartInstance = null;
}
// 移除窗口大小变化监听
window.removeEventListener('resize', this.handleResize);
},
watch: {
annual(newVal, oldVal) {
console.log(`Message changed from "${oldVal}" to "${newVal}"`);
this.getChars();
}
},
methods:{
// 初始化图表
initChart() {
const chartDom = document.getElementById('chars');
if (!chartDom) {
console.error('图表容器未找到');
return;
}
try {
// 使用全局挂载的echarts
this.chartInstance = this.$echarts.init(chartDom);
// 初始空配置 - 竖向柱状图
const option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
formatter: function(params) {
const data = params[0];
return `${data.name}<br/>巡检次数: ${data.value}`;
}
},
grid: {
left: '3%',
right: '4%',
bottom: '10%',
top: '15%',
containLabel: true
},
xAxis: {
type: 'category',
data: [],
axisLabel: {
fontSize: 12,
interval: 0,
rotate: 30, // 如果公司名称太长，可以旋转角度
width: 80,
overflow: 'truncate'
},
axisTick: {
show: false
}
},
yAxis: {
type: 'value',
name: '巡检次数',
axisLabel: {
fontSize: 12
}
},
series: [
{
name: '巡检次数',
type: 'bar',
data: [],
itemStyle: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#188df0' },
{ offset: 0.5, color: '#1d8cf3' },
{ offset: 1, color: '#83bff6' }
])
},
emphasis: {
itemStyle: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#2378f7' },
{ offset: 0.7, color: '#2378f7' },
{ offset: 1, color: '#83bff6' }
])
}
},
barWidth: '50%',
label: {
show: true,
position: 'top',
formatter: '{c}'
}
}
]
};
this.chartInstance.setOption(option);
// 窗口大小改变时重绘图表
window.addEventListener('resize', this.handleResize);
} catch (error) {
console.error('初始化图表失败:', error);
}
},
// 处理窗口大小变化
handleResize() {
if (this.chartInstance) {
this.chartInstance.resize();
}
},
// 获取数据并更新图表
getChars() {
this.year = this.annual+'-';
getPatrolChars(this.year).then(res =>{
if(res.code == 200){
console.log("res", res);
// 更新图表数据
this.updateChart(res.data);
}
}).catch(error => {
console.error("获取巡检数据失败:", error);
});
},
// 更新图表数据
updateChart(data) {
if (!this.chartInstance || !data) return;
// 对数据进行排序（从大到小）
const combined = data.enterpriseName.map((name, index) => ({
name,
value: data.numbers[index] || 0
}));
// 按巡检次数降序排序
combined.sort((a, b) => b.value - a.value);
// 提取排序后的数据
const sortedNames = combined.map(item => item.name);
const sortedValues = combined.map(item => item.value);
// 更新图表配置 - 竖向柱状图
const option = {
xAxis: {
data: sortedNames
},
series: [{
data: sortedValues
}]
};
this.chartInstance.setOption(option);
}
}
};
</script>
<style lang="scss" scoped>
.charsCom {
width: 100%;
height: 100%;
color: #333333;
}
.title {
text-align: center;
font-size: 24px;
margin-bottom: 7px;
}
.two {
flex: 1;
> .left {
margin-right: 70px;
}
> .right {
}
> div {
font-size: 16px;
flex: 1;
}
.left,
.right {
display: flex;
flex-direction: column;
justify-content: space-between;
.first {
margin-bottom: 6px;
text-align: left;
.text {
display: inline-block;
margin-right: 8px;
}
}
.second {
width: 213px;
height: 30px;
line-height: 30px;
box-sizing: border-box;
box-shadow: 0px 0px 3px 1px #dddddd;
margin-bottom: 19px;
> div {
text-align: center;
&.left {
color: #1d8cf3;
}
&.right {
color: #00c3f1;
}
}
}
.third {
text-align: center;
width: 213px;
margin-bottom: 24px;
}
.fifth {
flex: 1;
padding-top: 5px;
.contant {
width: 120px;
height: 120px;
margin: 0 auto;
}
}
}
}
</style>
zh-baseversion-web/src/views/supervision/analysisInspection/components/XjMiddle.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 15:07:47
* @LastEditTime: 2022-04-20 11:09:34
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/topChars/left.vue
-->
<template>
<div class="charsCom all-flex-h">
<div class="title">巡检隐患整改</div>
<div class="two all-flex">
<div class="left">
<div class="first">
<span class="text">隐患发现情况</span>
<span>{{hiddenBookInfo.finishNum + hiddenBookInfo.unFinishNum}}次</span>
</div>
<div class="second all-flex">
<div class="left">隐患未整改数</div>
<div class="right">隐患已整改数</div>
</div>
<div class="third all-flex">
<div class="left">{{ hiddenBookInfo.unFinishNum}}</div>
<div class="right">{{hiddenBookInfo.finishNum}}</div>
</div>
</div>
<div class="right">
<div class="first">
<span class="text">隐患整改率</span>
</div>
<div class="chars-box">
<Chars color="#604AFF" :options="option"></Chars>
</div>
</div>
</div>
<div class="three all-flex-h">
<div class="first">隐患原因</div>
<div ref="myChartWidth" class="chars-box">
<Chars :options="reasonOptions" />
</div>
</div>
</div>
</template>
<script>
import Chars from "@/components/allCharsCom/Chars";
import { hiddenBookStatistics } from "@/api/standingBook/hidden";
export default {
components: {
Chars,
},
created(){
this.getHiddenBookInfo();
},
props:{
annual: {
type: String,
default: 2025,
},
companyInfoId: {
type: String,
default: 23,
},
},
data() {
return {
bottomData: [
[
{ name: "裂缝", value: 0, color: "#604AFF" },
{ name: "管道称重", value: 0, color: "#FFC337" },
{ name: "其他", value: 0, color: "#86FF5B" },
{ name: "腐蚀", value: 0, color: "#03C4F1" },
{ name: "漏气", value: 0, color: "#1F8DF3" },
],
],
option:{
color:['blue','lightblue'],
grid: {
bottom: "7%",
containLabel: true,
},
tooltip: {
trigger: "item",
},
series: [
{
name: '访问来源',
type: 'pie',
radius: ['40%', '70%'],
label: {
show: true,
position: 'center'
},
labelLine: {
show: false
},
data: [
{value: 0, name: '整改'},
{value: 0, name: '未整改'},
]
}
]
},
reasonOptions:{},
hiddenBookInfo: {
unFinishNum: 0,
finishNum: 0
}
};
},
watch: {
annual(newVal, oldVal) {
console.log(`Message changed from "${oldVal}" to "${newVal}"`);
this.getHiddenBookInfo();
},
companyInfoId(newVal, oldVal){
this.getHiddenBookInfo();
}
},
methods: {
bottomOptions() {
return {
series: this.bottomData.map((data, idx) => {
const rich = {};
data
.map((item) => ({
fontsize: 12,
color: item.color,
}))
.forEach((item, index) => {
rich[`dataIndex${index}`] = item;
});
return {
type: "pie",
radius: ["68%", "80%"],
tooltip: {
trigger: "item",
},
color: data.map((item) => item.color),
itemStyle: {
borderWidth: 2,
borderRadius: 10,
borderColor: "#fff",
},
label: {
alignTo: "edge",
// formatter: "{name|{b}}\n{num|{c} 个}",
formatter: (parm) => {
return `{dataIndex${parm.dataIndex}|${parm.data.name}}\n{dataIndex${parm.dataIndex}|${parm.data.value}}`;
},
minMargin: 5,
edgeDistance: 10,
lineHeight: 15,
rich,
},
labelLine: {
length: 15,
length2: 0,
maxSurfaceAngle: 80,
},
labelLayout: (params) => {
const { width } = this.$refs.myChartWidth.getBoundingClientRect();
const isLeft = params.labelRect.x < width / 2;
const points = params.labelLinePoints;
// Update the end point.
points[2][0] = isLeft
? params.labelRect.x
: params.labelRect.x + params.labelRect.width;
return {
labelLinePoints: points,
};
},
data: data,
};
}),
};
},
getHiddenBookInfo(){
console.log("this.companyInfoId",this.companyInfoId)
console.log("this.annual",this.annual)
hiddenBookStatistics({companyInfoId:this.companyInfoId,annual:this.annual,source:'1'}).then(res =>{
if(res.code == 200){
this.hiddenBookInfo= res.data;
this.option.series[0].data = [{value: res.data.finishNum, name: '整改'},{value: res.data.unFinishNum, name: '未整改'}];
this.bottomData = [
[{ name: "漏气", value: res.data.blowNum, color: "#604AFF" },
{ name: "腐蚀", value: res.data.corrosionNum, color: "#FFC337" },
{ name: "裂缝", value: res.data.crackNum, color: "#86FF5B" },
{ name: "设备故障", value: res.data.deviceNum, color: "#03C4F1" },
{ name: "安全距离不足", value: res.data.distanceNum, color: "#1F8DF3" },
{ name: "管道承重", value: res.data.pipeNum, color: "#03C4F1" },
{ name: "其他", value: res.data.otherNum, color: "#1F8DF3" }]
],
this.reasonOptions = this.bottomOptions();
}
//console.log("res==================",res)
})
}
},
};
</script>
<style lang="scss" scoped>
.charsCom {
width: 100%;
height: 100%;
color: #333333;
}
.title {
text-align: center;
font-size: 24px;
margin-bottom: 7px;
}
.two {
// flex: 1;
> .left {
margin-right: 70px;
.first {
margin-bottom: 6px;
}
.second {
width: 213px;
height: 30px;
line-height: 30px;
box-sizing: border-box;
box-shadow: 0px 0px 3px 1px #dddddd;
margin-bottom: 19px;
> div {
// flex: 1;
text-align: center;
&.left {
color: #1d8cf3;
}
&.right {
color: #00c3f1;
}
}
}
.third {
text-align: center;
width: 213px;
margin-bottom: 24px;
}
}
> .right {
.first {
text-align: center !important;
}
.chars-box {
width: 90px;
height: 90px;
margin: 0 auto;
}
}
> div {
font-size: 16px;
flex: 1;
// display: flex;
// flex-direction: column;
}
.left,
.right {
// display: flex;
// flex-direction: column;
// justify-content: space-between;
.first {
text-align: left;
.text {
display: inline-block;
margin-right: 8px;
}
}
}
}
.three {
font-size: 16px;
flex: 1;
// background: red;
.chars-box {
flex: 1;
}
}
</style>
zh-baseversion-web/src/views/supervision/analysisInspection/index.vue 0 → 100644
View file @ 53ba49c1
<!--
* @Author: your name
* @Date: 2022-04-11 14:11:04
* @LastEditTime: 2022-04-14 10:45:52
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/xunjianxuncha/index.vue
-->
<template>
<div class="app-container xjxc">
<div class="shai" >
<el-select
clearable
v-model="danwei"
placeholder="请选择单位"
@change="selectcompanyId"
>
<el-option
v-for="item in enterprises"
:key="item.enterpriseId"
:label="item.enterpriseName"
:value="item.enterpriseId"
></el-option>
</el-select>
</div>
<el-tabs v-model="activeName" style="width: 300px" @tab-click="handleClick">
<el-tab-pane label="2026年度" name="2026"></el-tab-pane>
<el-tab-pane label="2025年度" name="2025"></el-tab-pane>
<el-tab-pane label="2024年度" name="2024"></el-tab-pane>
<el-tab-pane label="2023年度" name="2023"></el-tab-pane>
</el-tabs>
<div class="wrapper flex-h">
<div class="top flex">
<div class="middle">
<XjMiddle :annual="activeName" :companyInfoId="companyInfoId"/>
</div>
<div class="middle">
<Middle :annual="activeName" :companyInfoId="companyInfoId" />
</div>
<div class="middle">
<JcMiddle :annual="activeName" :companyInfoId="companyInfoId"/>
</div>
</div>
<div class="middle"></div>
<div class="top flex">
<div class="middle">
<XjLeft :annual="activeName"/>
</div>
<div class="middle">
<Left />
</div>
<div class="middle">
<Right/>
</div>
</div>
<!-- <div class="bottom">
<div class="left">
<XjLeft />
</div>
<div class="middle">
<Middle />
</div>
<div class="right">
<Right />
</div>
</div>-->
<!-- <div class="top flex">
<div class="right">
<Right :annual="activeName" :companyInfoId="companyInfoId" />
</div>
<div class="left">
<Left :annual="activeName" :companyInfoId="companyInfoId" />
</div>
&lt;!&ndash;<div class="middle">&ndash;&gt;
&lt;!&ndash;<Middle />&ndash;&gt;
&lt;!&ndash;</div>&ndash;&gt;
</div>
<div class="middle"></div>
<div class="bottom">
<Middle :annual="activeName" :companyInfoId="companyInfoId" />
</div>-->
</div>
</div>
</template>
<script>
import Left from "./components/Left";
import XjLeft from "./components/XjLeft";
import Middle from "./components/Middle";
import XjMiddle from "./components/XjMiddle";
import JcMiddle from "./components/JcMiddle";
import Right from "./components/Right";
import { enterpriseLists } from "@/api/regulation/info";
export default {
name: "analysisInspection",
components: {
XjMiddle,
JcMiddle,
Left,
XjLeft,
Middle,
Right
},
data() {
return {
danwei:null,
enterprises: [],
activeName: '2025',
companyInfoId:''
};
},
created() {
this.getEnterpriseLists();
},
methods: {
selectcompanyId(e){
this.companyInfoId = e;
},
//所属单位
getEnterpriseLists(){
const param = {};
enterpriseLists(param).then(response => {
this.enterprises = response.rows;
});
},
handleClick(tab, event) {
console.log(tab, event);
}
},
mounted(){
}
};
</script>
<style lang="scss" scoped>
.app-main {
}
.xjxc {
height: calc(100vh - 50px) !important;
}
.flex {
display: flex;
justify-content: space-between;
}
.flex-h {
display: flex;
// justify-content: space-around;
flex-direction: column;
height: 100%;
.top {
height: 38.7%;
.left {
width: 70%;
padding: 15px 24px 19px;
}
.middle {
width: 35.3%;
padding: 15px 80px 19px 71px;
}
.right {
width: 30.2%;
padding: 15px 29px;
}
> div {
// box-shadow: 2px 0px 13px 1px rgba(0, 0, 0, 0.1);
box-shadow: 2px 0px 10px 1px rgba(0, 0, 0, 0.1);
border-radius: 3px;
}
}
>.middle {
margin: 5px 0;
background: repeating-linear-gradient(135deg, transparent, transparent 3px, #D6D6D6 3px, #D6D6D6 8px);
height: 2px;
}
.bottom {
flex: 1;
}
> div {
// height: 50%;
}
}
.shai{
position: fixed;
right: 20px;
width: 300px;
height: 40px;
}
::v-deep .el-select{
width: 300px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment