848 lines
35 KiB
Python
848 lines
35 KiB
Python
<template>
|
||
<div class="app-container">
|
||
<el-card>
|
||
<el-row :gutter="6">
|
||
<el-select
|
||
v-model="listQuery.belong_dept"
|
||
placeholder="报送部门"
|
||
clearable
|
||
@change="belongDeptChange"
|
||
>
|
||
<el-option
|
||
v-for="item in orgData"
|
||
:key="item.id"
|
||
:label="item.name"
|
||
:value="item.id"
|
||
/>
|
||
</el-select>
|
||
<el-date-picker
|
||
v-model="listQuery.task2__year"
|
||
type="year"
|
||
placeholder="选择年"
|
||
value-format="yyyy"
|
||
style="width:200px"
|
||
>
|
||
</el-date-picker>
|
||
<el-button
|
||
class="filter-item"
|
||
type="primary"
|
||
icon="el-icon-search"
|
||
@click="handleFilter"
|
||
>查看</el-button>
|
||
<el-button
|
||
type="primary"
|
||
@click="handlePrint"
|
||
>打印</el-button
|
||
>
|
||
</el-row>
|
||
</el-card>
|
||
<el-card style="margin-top:10px">
|
||
<div ref="print" id="myReport" class="printContainer">
|
||
<!-- <el-table
|
||
ref="tableRef"
|
||
:key="timeStamp"
|
||
:data="tableDatas"
|
||
class="tableStyle"
|
||
:header-cell-style="handerMethod"
|
||
:span-method="objectSpanMethod"
|
||
border
|
||
>
|
||
<el-table-column label="统计周期" width="180" prop="type"></el-table-column>
|
||
<el-table-column label="统计周期" width="180" prop="title"></el-table-column>
|
||
<el-table-column prop="first" label="1-2月">
|
||
<template slot-scope="scope" v-if="scope.row.first">{{ scope.row.first }}</template>
|
||
</el-table-column>
|
||
<el-table-column prop="seconde" label="3-4月">
|
||
<template slot-scope="scope" v-if="scope.row.seconde">{{ scope.row.seconde }}</template>
|
||
</el-table-column>
|
||
<el-table-column prop="third" label="5-6月">
|
||
<template slot-scope="scope" v-if="scope.row.third">{{ scope.row.third }}</template>
|
||
</el-table-column>
|
||
<el-table-column prop="fouth" label="7-8月">
|
||
<template slot-scope="scope" v-if="scope.row.fouth">{{ scope.row.fouth }}</template>
|
||
</el-table-column>
|
||
<el-table-column prop="fifth" label="9-10月">
|
||
<template slot-scope="scope" v-if="scope.row.fifth">{{ scope.row.fifth }}</template>
|
||
</el-table-column>
|
||
<el-table-column prop="sixth" label="11-12月">
|
||
<template slot-scope="scope" v-if="scope.row.sixth">{{ scope.row.sixth }}</template>
|
||
</el-table-column>
|
||
<el-table-column prop="all" label="年度">
|
||
<template slot-scope="scope" v-if="scope.row.all">{{ scope.row.all }}</template>
|
||
</el-table-column>
|
||
</el-table> -->
|
||
<h3 style="text-align: center;">{{ fileName }}</h3>
|
||
<p v-if="fileName!==''" style="text-align: center;">{{ listQuery.task2__year }}年 1—12月质量目标双月报</p>
|
||
<table border="1" width="1000" cellspacing="0" :key="timeStamp" id="numTable">
|
||
<thead style="background: #efefef;height: 40px;">
|
||
<tr>
|
||
<th colspan="2">统计周期</th>
|
||
<th>1-2月</th>
|
||
<th>3-4月</th>
|
||
<th>5-6月</th>
|
||
<th>7-8月</th>
|
||
<th>9-10月</th>
|
||
<th>11-12月</th>
|
||
<th>年度</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr v-for="(item,index) in tableDatas">
|
||
<td v-if="index==0" colspan="2">重大质量事故</td>
|
||
<td v-if="index==1" rowspan="3">报告/证书合格率</td>
|
||
<td v-if="index==1">已发放报告/证书数量</td>
|
||
<td v-if="index==2">不准确报告/证书数量</td>
|
||
<td v-if="index==3">报告/证书合格率(%)</td>
|
||
<td v-if="index==4" rowspan="3">报告/证书及时率</td>
|
||
<td v-if="index==4">应发报告/证书数量</td>
|
||
<td v-if="index==5">实际按时完成报告/证书数量</td>
|
||
<td v-if="index==6">报告/证书及时率(%)</td>
|
||
<td v-if="index==7" rowspan="3">能力验证满意率</td>
|
||
<td v-if="index==7">全部获结果参数数量</td>
|
||
<td v-if="index==8">满意结果参数数量</td>
|
||
<td v-if="index==9">报告/能力验证满意率(%)</td>
|
||
<td v-if="index==10" rowspan="3">客户投诉处理满意率</td>
|
||
<td v-if="index==10">全部已处理投诉数量</td>
|
||
<td v-if="index==11">获满意结果的投诉数量</td>
|
||
<td v-if="index==12">报告/客户投诉处理满意率(%)</td>
|
||
<td class="numCell">{{item[0]}}</td>
|
||
<td class="numCell">{{item[1]}}</td>
|
||
<td class="numCell">{{item[2]}}</td>
|
||
<td class="numCell">{{item[3]}}</td>
|
||
<td class="numCell">{{item[5]}}</td>
|
||
<td class="numCell">{{item[6]}}</td>
|
||
<td class="numCell numCell_last">{{item[7]}}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<el-row id="echartsContainer">
|
||
<el-col :span="12" class="chartsWrap" style="border-right:1px solid #eeeeee;border-top:0">
|
||
<div id="bar1" style="width:495px;height:300px;"></div>
|
||
</el-col>
|
||
<el-col :span="12" class="chartsWrap" style="border-top:0">
|
||
<div id="bar2" style="width:495px;height:300px;margin-left: 10px;"></div>
|
||
</el-col>
|
||
<el-col :span="12" class="chartsWrap" style="border-right:1px solid #eeeeee">
|
||
<div id="lin1" style="width:495px;height:300px;"></div>
|
||
</el-col>
|
||
<el-col :span="12" class="chartsWrap">
|
||
<div id="lin2" style="width:495px;height:300px;margin-left: 10px;"></div>
|
||
</el-col>
|
||
<el-col :span="12" class="chartsWrap" style="border-right:1px solid #eeeeee">
|
||
<div id="lin3" style="width:495px;height:300px;"></div>
|
||
</el-col>
|
||
<el-col :span="12" class="chartsWrap">
|
||
<div id="lin4" style="width:495px;height:300px;margin-left: 10px;"></div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import { getTask2Do } from "@/api/task";
|
||
import { getOrgList, getSubOrgList } from "@/api/org";
|
||
import checkPermission from "@/utils/permission";
|
||
import * as echarts from 'echarts';
|
||
export default {
|
||
data() {
|
||
return {
|
||
timeStamp:0,
|
||
listQuery:{
|
||
belong_dept:'',
|
||
task2__year:'',
|
||
page:0
|
||
},
|
||
tableData: [{
|
||
type:'重大质量事故',
|
||
title:'重大质量事故',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},{
|
||
type:'报告/证书合格率',
|
||
title:'已发放报告/证书数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},{
|
||
type:'报告/证书合格率',
|
||
title:'不准确报告/证书数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
}, {
|
||
type:'报告/证书合格率',
|
||
title:'报告/证书合格率',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
}, {
|
||
type:'报告/证书及时率',
|
||
title:'应发报告/证书数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},{
|
||
type:'报告/证书及时率',
|
||
title:'实际按时完成报告/证书数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
}, {
|
||
type:'报告/证书及时率',
|
||
title:'报告/证书及时率',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},
|
||
{
|
||
type:'能力验证满意率',
|
||
title:'全部获结果参数数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},{
|
||
type:'能力验证满意率',
|
||
title:'满意结果参数数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
}, {
|
||
type:'能力验证满意率',
|
||
title:'能力验证满意率',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},{
|
||
type:'客户投诉处理满意率',
|
||
title:'全部已处理投诉数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},{
|
||
type:'客户投诉处理满意率',
|
||
title:'获满意结果的投诉数量',
|
||
first:'1',
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
}, {
|
||
type:'客户投诉处理满意率',
|
||
title:'客户投诉处理满意率',
|
||
first:1,
|
||
seconde:'2',
|
||
third:'3',
|
||
fouth:'4',
|
||
fifth:'5',
|
||
sixth:'6',
|
||
all:'21'
|
||
},
|
||
],
|
||
deptName:'',
|
||
fileName:'',
|
||
tableData1:[],
|
||
// tableDatas:[
|
||
// {type:'重大质量事故',title:'重大质量事故'},
|
||
// {type:'报告/证书合格率',title:'已发放报告/证书数量'},
|
||
// {type:'报告/证书合格率',title:'不准确报告/证书数量'},
|
||
// {type:'报告/证书合格率',title:'报告/证书合格率'},
|
||
// {type:'报告/证书及时率',title:'应发报告/证书数量'},
|
||
// {type:'报告/证书及时率',title:'实际按时完成报告/证书数量'},
|
||
// {type:'报告/证书及时率',title:'报告/证书及时率'},
|
||
// {type:'能力验证满意率',title:'全部获结果参数数量'},
|
||
// {type:'能力验证满意率',title:'满意结果参数数量'},
|
||
// {type:'能力验证满意率',title:'能力验证满意率'},
|
||
// {type:'客户投诉处理满意率',title:'全部已处理投诉数量'},
|
||
// {type:'客户投诉处理满意率',title:'获满意结果的投诉数量'},
|
||
// {type:'客户投诉处理满意率',title:'客户投诉处理满意率'},
|
||
// ],
|
||
|
||
tableDatas:[
|
||
[],[],[],[],[],[],[],[],[],[],[],[],[]
|
||
],
|
||
orgData:[],
|
||
barChart1:null,
|
||
bar1option:{},
|
||
barchart2:null,
|
||
lineChart1:null,
|
||
lineChart2:null,
|
||
lineChart3:null,
|
||
lineChart4:null,
|
||
xAxisData:["1-2月","3-4月","5-6月","7-8月","9-10月","11-12月"],
|
||
bar1Data:[],
|
||
bar2Data:[],
|
||
line1Data:[],
|
||
line2Data:[],
|
||
line3Data:[],
|
||
line4Data:[],
|
||
bar1Option:{},
|
||
bar2Option:{},
|
||
line1Option:{},
|
||
line2Option:{},
|
||
line3Option:{},
|
||
line4Option:{},
|
||
};
|
||
},
|
||
mounted() {
|
||
this.getGroup();
|
||
this.optionSet();
|
||
},
|
||
methods: {
|
||
belongDeptChange(a){
|
||
this.fileName = '';
|
||
let selectItem = this.orgData.filter(item=>{
|
||
return item.id==a
|
||
})
|
||
this.deptName = selectItem[0].name;
|
||
},
|
||
optionSet(){
|
||
let chartDom1 = document.getElementById('bar1');
|
||
this.barChart1 = echarts.init(chartDom1);
|
||
this.bar1Option = {
|
||
title:{
|
||
text:"已发放报告/证书数量"
|
||
},
|
||
xAxis:{
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
data:this.xAxisData
|
||
},
|
||
grid: {
|
||
left: '5%',
|
||
right: '7%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
yAxis:{},
|
||
series:[
|
||
{
|
||
name:"已发放报告/证书数量",
|
||
type:"bar",
|
||
data:this.bar1Data
|
||
}
|
||
]
|
||
}
|
||
let chartDom2 = document.getElementById('bar2');
|
||
this.barChart2 = echarts.init(chartDom2);
|
||
this.bar2Option = {
|
||
title:{
|
||
text:"应发报告/证书数量"
|
||
},
|
||
grid: {
|
||
left: '5%',
|
||
right: '7%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
xAxis:{
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
data:this.xAxisData
|
||
},
|
||
yAxis:{},
|
||
series:[
|
||
{
|
||
name:"应发报告/证书数量",
|
||
type:"bar",
|
||
data:this.bar2Data
|
||
}
|
||
]
|
||
}
|
||
let chartDom3 = document.getElementById('lin1');
|
||
this.lineChart1 = echarts.init(chartDom3);
|
||
this.line1Option = {
|
||
title: {
|
||
text: '报告/证书合格率'
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
legend: {
|
||
data: ['报告/证书合格率']
|
||
},
|
||
grid: {
|
||
left: '5%',
|
||
right: '7%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
saveAsImage: {}
|
||
}
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: this.xAxisData
|
||
},
|
||
yAxis: {
|
||
type: 'value'
|
||
},
|
||
series: [
|
||
{
|
||
name: '报告/证书合格率',
|
||
type: 'line',
|
||
stack: 'Total',
|
||
data: this.line1Data
|
||
}
|
||
]
|
||
};
|
||
let chartDom4 = document.getElementById('lin2');
|
||
this.lineChart2 = echarts.init(chartDom4);
|
||
this.line2Option = {
|
||
title: {
|
||
text: '报告/证书及时率'
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
legend: {
|
||
data: ['报告/证书及时率']
|
||
},
|
||
grid: {
|
||
left: '7%',
|
||
right: '5%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
saveAsImage: {}
|
||
}
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: this.xAxisData
|
||
},
|
||
yAxis: {
|
||
type: 'value'
|
||
},
|
||
series: [
|
||
{
|
||
name: '报告/证书及时率',
|
||
type: 'line',
|
||
stack: 'Total',
|
||
data: this.line2Data
|
||
}
|
||
]
|
||
};
|
||
let chartDom5 = document.getElementById('lin3');
|
||
this.lineChart3 = echarts.init(chartDom5);
|
||
this.line3Option = {
|
||
title: {
|
||
text: '能力验证满意率'
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
legend: {
|
||
data: ['能力验证满意率']
|
||
},
|
||
grid: {
|
||
left: '5%',
|
||
right: '7%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
saveAsImage: {}
|
||
}
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: this.xAxisData
|
||
},
|
||
yAxis: {
|
||
type: 'value'
|
||
},
|
||
series: [
|
||
{
|
||
name: '能力验证满意率',
|
||
type: 'line',
|
||
stack: 'Total',
|
||
data: this.line3Data
|
||
}
|
||
]
|
||
};
|
||
let chartDom6 = document.getElementById('lin4');
|
||
this.lineChart4 = echarts.init(chartDom6);
|
||
this.line4Option = {
|
||
title: {
|
||
text: '客户投诉处理满意率'
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
legend: {
|
||
data: ['客户投诉处理满意率']
|
||
},
|
||
grid: {
|
||
left: '7%',
|
||
right: '5%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
saveAsImage: {}
|
||
}
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: this.xAxisData
|
||
},
|
||
yAxis: {
|
||
type: 'value'
|
||
},
|
||
series: [
|
||
{
|
||
name: '客户投诉处理满意率',
|
||
type: 'line',
|
||
stack: 'Total',
|
||
data:this.line4Data
|
||
}
|
||
]
|
||
};
|
||
},
|
||
handleFilter(){
|
||
let that = this;
|
||
if(that.listQuery.belong_dept!==''){
|
||
if(that.listQuery.task2__year!==''){
|
||
that.bar1Data = [];
|
||
that.bar2Data = [];
|
||
that.line1Data = [];
|
||
that.line2Data = [];
|
||
that.line3Data = [];
|
||
that.line4Data = [];
|
||
that.fileName = that.deptName;
|
||
that.tableData1 = [];
|
||
that.tableDatas = [ [],[],[],[],[],[],[],[],[],[],[],[],[]];
|
||
getTask2Do(that.listQuery).then(res=>{
|
||
let data = res.data.filter(item=>{
|
||
return item.task2_.type==20
|
||
});
|
||
console.log(data)
|
||
data.forEach(element => {
|
||
let obj = element;
|
||
if(element.num_issue!==null&&element.num_error!==null&&element.num_issue!==0){
|
||
let rate1 = ((element.num_issue-element.num_error)/element.num_issue).toFixed(4)
|
||
obj.rate1 = Number(rate1)*100
|
||
}else{
|
||
obj.rate1 = ''
|
||
}
|
||
if(element.num_expect!==null&&element.num_issue!==null&&element.num_expect!==0){
|
||
let rate2 = (element.num_issue/element.num_expect).toFixed(4)
|
||
obj.rate2 = Number(rate2)*100
|
||
}
|
||
else{
|
||
obj.rate2 = ''
|
||
}
|
||
if(element.num_pt!==null&&element.num_pt_10!==null&&element.num_pt!==0){
|
||
let rate3 = (element.num_pt_10/element.num_pt).toFixed(4)
|
||
obj.rate3 = Number(rate3)*100
|
||
}
|
||
else{
|
||
obj.rate3 = ''
|
||
}
|
||
if(element.num_complaint!==null&&element.num_complaint_10!==null&&element.num_complaint!==0){
|
||
let rate4 = (element.num_complaint_10/element.num_complaint).toFixed(4)
|
||
obj.rate4 = Number(rate4)*100
|
||
}
|
||
else{
|
||
obj.rate4 = ''
|
||
}
|
||
let ind = element.task2_.cycle-1;
|
||
that.tableData1[ind] = obj;
|
||
});
|
||
for (let i = 0; i < that.tableData1.length; i++) {
|
||
let item = that.tableData1[i];
|
||
if(item!==undefined){
|
||
for(let j = 0; j < that.tableDatas.length; j++){
|
||
that.tableDatas[j][i] =
|
||
j==0?item.num_acc:
|
||
j==1?item.num_issue:
|
||
j==2?item.num_error:
|
||
j==3?item.rate1:
|
||
j==4?item.num_expect:
|
||
j==5?item.num_issue:
|
||
j==6?item.rate2:
|
||
j==7?item.num_pt:
|
||
j==8?item.num_pt_10:
|
||
j==9?item.rate3:
|
||
j==10?item.num_complaint:
|
||
j==11?item.num_complaint_10:
|
||
item.rate4;
|
||
}
|
||
}
|
||
}
|
||
// debugger;
|
||
console.log(that.tableDatas)
|
||
that.timeStamp++;
|
||
for(let k=0;k<that.tableDatas.length;k++){
|
||
let num = 0;
|
||
let num1 = that.tableDatas[k][0]?that.tableDatas[k][0]:0;
|
||
let num2 = that.tableDatas[k][1]?that.tableDatas[k][1]:0;
|
||
let num3 = that.tableDatas[k][2]?that.tableDatas[k][2]:0;
|
||
let num4 = that.tableDatas[k][3]?that.tableDatas[k][3]:0;
|
||
let num5 = that.tableDatas[k][4]?that.tableDatas[k][4]:0;
|
||
let num6 = that.tableDatas[k][5]?that.tableDatas[k][5]:0;
|
||
if(k==3){
|
||
num = ((that.tableDatas[1][7]-that.tableDatas[2][7])/that.tableDatas[1][7]).toFixed(4)
|
||
}else if(k==6){
|
||
num = (that.tableDatas[5][7]/that.tableDatas[4][7]).toFixed(4)
|
||
}else if(k==9){
|
||
num =(that.tableDatas[8][7]/that.tableDatas[7][7]).toFixed(4)
|
||
}else if(k==12){
|
||
num = (that.tableDatas[11][7]/that.tableDatas[10][7]).toFixed(4)
|
||
}else{
|
||
num = Number(num1)+Number(num2)+Number(num3)+Number(num4)+Number(num5)+Number(num6);
|
||
}
|
||
if(num!=='NaN'&&num!==NaN){
|
||
if(k==3||k==6||k==9||k==12){
|
||
let numbe = Number(num)*100;
|
||
that.tableDatas[k][7] = numbe;
|
||
}else{
|
||
that.tableDatas[k][7] = num;
|
||
}
|
||
}else{
|
||
that.tableDatas[k][7] = ''
|
||
}
|
||
}
|
||
|
||
for(let i=0;i<6;i++){
|
||
if(that.tableDatas[1][i]!==undefined){
|
||
that.bar1Data.push(Number(that.tableDatas[1][i]))
|
||
}else{
|
||
that.bar1Data.push(0)
|
||
}
|
||
if(that.tableDatas[4][i]!==undefined){
|
||
that.bar2Data.push(Number(that.tableDatas[4][i]))
|
||
}else{
|
||
that.bar2Data.push(0)
|
||
}
|
||
if(that.tableDatas[3][i]!==undefined){
|
||
that.line1Data.push(Number(that.tableDatas[3][i]))
|
||
}else{
|
||
that.line1Data.push(0)
|
||
}
|
||
if(that.tableDatas[6][i]!==undefined){
|
||
that.line2Data.push(Number(that.tableDatas[6][i]))
|
||
}else{
|
||
that.line2Data.push(0)
|
||
}
|
||
if(that.tableDatas[9][i]!==undefined){
|
||
that.line3Data.push(Number(that.tableDatas[9][i]))
|
||
}else{
|
||
that.line3Data.push(0)
|
||
}
|
||
if(that.tableDatas[12][i]!==undefined){
|
||
that.line4Data.push(Number(that.tableDatas[12][i]))
|
||
}else{
|
||
that.line4Data.push(0)
|
||
}
|
||
}
|
||
that.bar1Option.series[0].data = that.bar1Data;
|
||
that.bar2Option.series[0].data = that.bar2Data;
|
||
that.line1Option.series[0].data = that.line1Data;
|
||
that.line2Option.series[0].data = that.line2Data;
|
||
that.line3Option.series[0].data = that.line3Data;
|
||
that.line4Option.series[0].data = that.line4Data;
|
||
|
||
that.barChart1.clear();
|
||
that.barChart1.setOption(that.bar1Option);
|
||
that.barChart2.clear();
|
||
that.barChart2.setOption(that.bar2Option);
|
||
|
||
that.lineChart1.clear();
|
||
that.lineChart1.setOption(that.line1Option);
|
||
that.lineChart2.clear();
|
||
that.lineChart2.setOption(that.line2Option);
|
||
|
||
that.lineChart3.clear();
|
||
that.lineChart3.setOption(that.line3Option);
|
||
that.lineChart4.clear();
|
||
that.lineChart4.setOption(that.line4Option);
|
||
})
|
||
}else{
|
||
this.$message.warning('请选择时间')
|
||
}
|
||
}else{
|
||
this.$message.warning('请选择部门')
|
||
}
|
||
|
||
},
|
||
handlePrint() {
|
||
this.$PRINT('#myReport');
|
||
},
|
||
|
||
checkPermission,
|
||
getGroup() {
|
||
if (this.checkPermission(["record_confirm"])) {
|
||
getOrgList({ can_supervision: true }).then((res) => {
|
||
this.orgData = res.data;
|
||
});
|
||
} else {
|
||
getSubOrgList().then((res) => {
|
||
this.orgData = res.data;
|
||
});
|
||
}
|
||
},
|
||
//合并单位表头
|
||
handerMethod ({ row, column, rowIndex, columnIndex }) {
|
||
if (row[0].level == 1) {
|
||
//这里有个非常坑的bug 必须是row[0]=0 row[1]=2才会生效
|
||
row[0].colSpan = 0
|
||
row[1].colSpan = 2
|
||
if (columnIndex === 0) {
|
||
return { display: 'none' }
|
||
}
|
||
}
|
||
},
|
||
//合并单元格
|
||
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
||
if (rowIndex==0) {
|
||
if(columnIndex==1){
|
||
return {
|
||
rowspan: 1,
|
||
colspan: 0,// 如果相等，则将colspan设置为0
|
||
};
|
||
}else if(columnIndex==0){
|
||
return {
|
||
rowspan: 1,
|
||
colspan: 2,
|
||
};
|
||
}else{
|
||
return {
|
||
rowspan: 1,
|
||
colspan: 1,
|
||
};
|
||
}
|
||
}else{
|
||
if(columnIndex==0){
|
||
if(rowIndex==1||rowIndex==4||rowIndex==7||rowIndex==10){
|
||
return {
|
||
rowspan: 3,
|
||
colspan: 1,
|
||
}
|
||
}else{
|
||
return {
|
||
rowspan:0,
|
||
colspan:1,
|
||
}
|
||
}
|
||
}else{
|
||
return {
|
||
rowspan:1,
|
||
colspan:1,
|
||
}
|
||
}
|
||
}
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
<style>
|
||
.printContainer{
|
||
width: 1075px;
|
||
}
|
||
#numTable,#echartsContainer{
|
||
margin-left: 37px;
|
||
}
|
||
#numTable td{
|
||
height: 32px;
|
||
padding-left: 5px;
|
||
}
|
||
.numCell{
|
||
width: 80px;
|
||
}
|
||
.numCell.numCell_last{
|
||
width: 100px;
|
||
}
|
||
#echartsContainer{
|
||
margin-top: 30px;
|
||
}
|
||
.chartsWrap{
|
||
/* margin-top: 30px; */
|
||
/* padding-top: 50px; */
|
||
border-top: 1px solid #eeeeee;
|
||
}
|
||
</style> |