|
|
@ -4,6 +4,18 @@
|
|
|
|
<indexDanger ref="indexDangerRef"></indexDanger>
|
|
|
|
<indexDanger ref="indexDangerRef"></indexDanger>
|
|
|
|
<div class="row">
|
|
|
|
<div class="row">
|
|
|
|
<div class="left_top bcg">
|
|
|
|
<div class="left_top bcg">
|
|
|
|
|
|
|
|
<!-- 时间选择器 -->
|
|
|
|
|
|
|
|
<el-date-picker
|
|
|
|
|
|
|
|
v-model="queryParams.targetTime"
|
|
|
|
|
|
|
|
type="month"
|
|
|
|
|
|
|
|
placeholder="请选择月份"
|
|
|
|
|
|
|
|
value-format="yyyy-MM"
|
|
|
|
|
|
|
|
clearable>
|
|
|
|
|
|
|
|
</el-date-picker>
|
|
|
|
|
|
|
|
<!-- 查询按钮 -->
|
|
|
|
|
|
|
|
<el-button type="primary" @click="queryData">查询</el-button>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
|
<el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
|
<el-tab-pane label="行政区域统计" name="tj1">
|
|
|
|
<el-tab-pane label="行政区域统计" name="tj1">
|
|
|
|
<el-table
|
|
|
|
<el-table
|
|
|
@ -125,7 +137,7 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- <div class="right_top bcg" :style="$store.state.app.sidebar.opened ? 'width: 24%;': 'width: 32%;' "> -->
|
|
|
|
<!-- <div class="right_top bcg" :style="$store.state.app.sidebar.opened ? 'width: 24%;': 'width: 32%;' "> -->
|
|
|
|
<div class="right_top bcg">
|
|
|
|
<div class="right_top bcg">
|
|
|
|
<h3>本月上报隐患排名</h3>
|
|
|
|
<h3>上报隐患排名</h3>
|
|
|
|
<el-table
|
|
|
|
<el-table
|
|
|
|
ref="right_top"
|
|
|
|
ref="right_top"
|
|
|
|
class="custom-table"
|
|
|
|
class="custom-table"
|
|
|
@ -196,6 +208,7 @@ export default {
|
|
|
|
components: { indexHD, indexDanger},
|
|
|
|
components: { indexHD, indexDanger},
|
|
|
|
data() {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
|
|
|
|
value1: "",// 时间选择器的值
|
|
|
|
activeName: "tj1", //tab默认显示
|
|
|
|
activeName: "tj1", //tab默认显示
|
|
|
|
tableData: [], //table
|
|
|
|
tableData: [], //table
|
|
|
|
tableDat_1: null,
|
|
|
|
tableDat_1: null,
|
|
|
@ -206,9 +219,70 @@ export default {
|
|
|
|
myChart4: null,
|
|
|
|
myChart4: null,
|
|
|
|
myChart5: null,
|
|
|
|
myChart5: null,
|
|
|
|
year: "2023", //柱状图默认年份 参数
|
|
|
|
year: "2023", //柱状图默认年份 参数
|
|
|
|
|
|
|
|
queryParams: {
|
|
|
|
|
|
|
|
targetTime: null,
|
|
|
|
|
|
|
|
},
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
|
|
|
|
queryData() {
|
|
|
|
|
|
|
|
if (this.queryParams.targetTime) {
|
|
|
|
|
|
|
|
// 行政区域统计,所属区域统计,上报隐患排名
|
|
|
|
|
|
|
|
this.getAllData(this.queryParams.targetTime);
|
|
|
|
|
|
|
|
// 获取饼图的数据
|
|
|
|
|
|
|
|
this.getChartData(this.queryParams.targetTime);
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.$message.error("请选择日期!");
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getAllData(targetTime) {
|
|
|
|
|
|
|
|
// TODO 行政
|
|
|
|
|
|
|
|
getAdministeration()
|
|
|
|
|
|
|
|
.then((response) => {
|
|
|
|
|
|
|
|
if (response.code == 200) this.tableData = response.data;
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
|
|
|
console.log(err);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// TODO 根据位置
|
|
|
|
|
|
|
|
getPlace()
|
|
|
|
|
|
|
|
.then((response) => {
|
|
|
|
|
|
|
|
if (response.code == 200) this.tableDat_1 = response.data;
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
|
|
|
console.log(err);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
// 上报隐患
|
|
|
|
|
|
|
|
getDangerByDeptId(targetTime)
|
|
|
|
|
|
|
|
.then((response) => {
|
|
|
|
|
|
|
|
if (response.code == 200) {
|
|
|
|
|
|
|
|
response.data.map((item,index)=>{
|
|
|
|
|
|
|
|
item.index = index+1
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
this.tableData1 = response.data;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
|
|
|
console.error(err);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 获取图标数据
|
|
|
|
|
|
|
|
getChartData(targetTime) {
|
|
|
|
|
|
|
|
this.leftCenterinit(targetTime); //隐患数据
|
|
|
|
|
|
|
|
this.rightBominit(targetTime); //隐患整改进度
|
|
|
|
|
|
|
|
this.hylyinit(targetTime); // 行业领域
|
|
|
|
|
|
|
|
this.jjClassInit(targetTime); // 经济类型
|
|
|
|
|
|
|
|
this.scaleInit(targetTime); // 企业规模
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
getDefaultTargetTime() {
|
|
|
|
|
|
|
|
const now = new Date();
|
|
|
|
|
|
|
|
const year = now.getFullYear();
|
|
|
|
|
|
|
|
const month = (now.getMonth() + 1).toString().padStart(2, '0'); // 月份从0开始,所以需要+1
|
|
|
|
|
|
|
|
return `${year}-${month}`;
|
|
|
|
|
|
|
|
},
|
|
|
|
showHD(row) {
|
|
|
|
showHD(row) {
|
|
|
|
console.log(row);
|
|
|
|
console.log(row);
|
|
|
|
this.$refs.indexHDRef.openDialog(row.deptId);
|
|
|
|
this.$refs.indexHDRef.openDialog(row.deptId);
|
|
|
@ -216,8 +290,9 @@ export default {
|
|
|
|
handleClick(tab, event) {
|
|
|
|
handleClick(tab, event) {
|
|
|
|
console.log(tab, event);
|
|
|
|
console.log(tab, event);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
async leftCenterinit() {
|
|
|
|
async leftCenterinit(targetTime) {
|
|
|
|
this.year = new Date().getFullYear();
|
|
|
|
this.year = targetTime.substring(0, 4) || new Date().getFullYear();
|
|
|
|
|
|
|
|
// this.year = new Date().getFullYear();
|
|
|
|
let res = await getDangerList(this.year);
|
|
|
|
let res = await getDangerList(this.year);
|
|
|
|
let temp = res.data;
|
|
|
|
let temp = res.data;
|
|
|
|
let legendData = [];
|
|
|
|
let legendData = [];
|
|
|
@ -298,8 +373,8 @@ export default {
|
|
|
|
option && this.myChart1.setOption(option);
|
|
|
|
option && this.myChart1.setOption(option);
|
|
|
|
// myChart.resize();
|
|
|
|
// myChart.resize();
|
|
|
|
},
|
|
|
|
},
|
|
|
|
async rightBominit() {
|
|
|
|
async rightBominit(targetTime) {
|
|
|
|
let res = await getDangerStatus();
|
|
|
|
let res = await getDangerStatus(targetTime);
|
|
|
|
this.myChart2 = echarts.init(this.$refs.right_bom);
|
|
|
|
this.myChart2 = echarts.init(this.$refs.right_bom);
|
|
|
|
let option = {
|
|
|
|
let option = {
|
|
|
|
title: { text: "隐患整改进度统计" },
|
|
|
|
title: { text: "隐患整改进度统计" },
|
|
|
@ -350,8 +425,8 @@ export default {
|
|
|
|
this.$refs.indexDangerRef.openDialog1(a.status);
|
|
|
|
this.$refs.indexDangerRef.openDialog1(a.status);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
async hylyinit() {
|
|
|
|
async hylyinit(targetTime) {
|
|
|
|
let res = await getTrade();
|
|
|
|
let res = await getTrade(targetTime);
|
|
|
|
this.myChart3 = echarts.init(this.$refs.hyly);
|
|
|
|
this.myChart3 = echarts.init(this.$refs.hyly);
|
|
|
|
let option = {
|
|
|
|
let option = {
|
|
|
|
title: { text: "行业领域统计隐患数量" },
|
|
|
|
title: { text: "行业领域统计隐患数量" },
|
|
|
@ -401,8 +476,8 @@ export default {
|
|
|
|
this.$refs.indexDangerRef.openDialog4(a.enterpriseType);
|
|
|
|
this.$refs.indexDangerRef.openDialog4(a.enterpriseType);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
async jjClassInit() {
|
|
|
|
async jjClassInit(targetTime) {
|
|
|
|
let res = await getEconomics();
|
|
|
|
let res = await getEconomics(targetTime);
|
|
|
|
this.myChart4 = echarts.init(this.$refs.jjClass);
|
|
|
|
this.myChart4 = echarts.init(this.$refs.jjClass);
|
|
|
|
let option = {
|
|
|
|
let option = {
|
|
|
|
title: { text: "经济类型统计隐患数量" },
|
|
|
|
title: { text: "经济类型统计隐患数量" },
|
|
|
@ -452,8 +527,8 @@ export default {
|
|
|
|
this.$refs.indexDangerRef.openDialog3(a.economicType);
|
|
|
|
this.$refs.indexDangerRef.openDialog3(a.economicType);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
async scaleInit() {
|
|
|
|
async scaleInit(targetTime) {
|
|
|
|
let res = await getScale();
|
|
|
|
let res = await getScale(targetTime);
|
|
|
|
this.myChart5 = echarts.init(this.$refs.scale);
|
|
|
|
this.myChart5 = echarts.init(this.$refs.scale);
|
|
|
|
let option = {
|
|
|
|
let option = {
|
|
|
|
title: { text: "企业规模统计隐患数量" },
|
|
|
|
title: { text: "企业规模统计隐患数量" },
|
|
|
@ -508,46 +583,12 @@ export default {
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
created() {
|
|
|
|
// 行政
|
|
|
|
let targetTime = this.queryParams.targetTime || this.getDefaultTargetTime();
|
|
|
|
getAdministeration()
|
|
|
|
this.getAllData(targetTime);
|
|
|
|
.then((response) => {
|
|
|
|
|
|
|
|
if (response.code == 200) this.tableData = response.data;
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
|
|
|
console.log(err);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 根据位置
|
|
|
|
|
|
|
|
getPlace()
|
|
|
|
|
|
|
|
.then((response) => {
|
|
|
|
|
|
|
|
if (response.code == 200) this.tableDat_1 = response.data;
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
|
|
|
console.log(err);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 上报隐患
|
|
|
|
|
|
|
|
getDangerByDeptId()
|
|
|
|
|
|
|
|
.then((response) => {
|
|
|
|
|
|
|
|
if (response.code == 200) {
|
|
|
|
|
|
|
|
response.data.map((item,index)=>{
|
|
|
|
|
|
|
|
item.index = index+1
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
this.tableData1 = response.data;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
|
|
|
console.error(err);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
mounted() {
|
|
|
|
// this.autoScroll();自动滚动
|
|
|
|
let targetTime = this.queryParams.targetTime || this.getDefaultTargetTime();
|
|
|
|
this.leftCenterinit(); //隐患数据
|
|
|
|
this.getChartData(targetTime);
|
|
|
|
this.rightBominit(); //隐患整改进度
|
|
|
|
|
|
|
|
this.hylyinit(); // 行业领域
|
|
|
|
|
|
|
|
this.jjClassInit(); // 经济类型
|
|
|
|
|
|
|
|
this.scaleInit(); // 企业规模
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
watch: {
|
|
|
|
"$store.state.app.sidebar.opened"(value) {
|
|
|
|
"$store.state.app.sidebar.opened"(value) {
|
|
|
|