Merge branch 'master' of https://e.coding.net/ctcdevteam/cma_search
This commit is contained in:
commit
adeb7256dc
|
|
@ -20,6 +20,7 @@
|
|||
"echarts": "^5.4.0",
|
||||
"element-china-area-data": "^5.0.2",
|
||||
"element-ui": "^2.15.13",
|
||||
"exceljs": "^4.3.0",
|
||||
"file-saver": "^2.0.2",
|
||||
"js-cookie": "2.2.0",
|
||||
"normalize.css": "7.0.0",
|
||||
|
|
|
|||
|
|
@ -495,3 +495,10 @@ export function noNum(id,data) {
|
|||
data
|
||||
})
|
||||
}
|
||||
export function taskAnalyse(data) {
|
||||
return request({
|
||||
url: '/supervision/analyse/group_by_dept/',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
|
@ -284,7 +284,7 @@ export const asyncRoutes = [
|
|||
path: 'statisticsGroup',
|
||||
name: 'statisticsGroup',
|
||||
component: () => import('@/views/supervisionNew/statisticsGroup.vue'),
|
||||
meta: { title: '部门报告统计'},
|
||||
meta: { title: '部门报告统计', perms: ['task2']},
|
||||
},
|
||||
{
|
||||
path: 'statistics',
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { getPgoalDeptList } from "@/api/task";
|
||||
import { getPgoalDeptList,taskAnalyse } from "@/api/task";
|
||||
import { getOrgList, getSubOrgList } from "@/api/org";
|
||||
import checkPermission from "@/utils/permission";
|
||||
import Pagination from "@/components/Pagination";
|
||||
|
|
@ -67,44 +67,87 @@
|
|||
goal_key__in:'pgoal_1,pgoal_2,pgoal_3,pgoal_4,pgoal_5',
|
||||
belong_dept__in:''
|
||||
},
|
||||
query:{
|
||||
year:'',
|
||||
dept_type_name:'2级公司'
|
||||
},
|
||||
taskList:[],
|
||||
heightTable:null,
|
||||
listLoading:false
|
||||
};
|
||||
},
|
||||
mounted(){
|
||||
this.getOrgList();
|
||||
let height = document.getElementsByClassName('app-main')[0].clientHeight;
|
||||
this.heightTable = height-90;
|
||||
debugger;
|
||||
if (checkPermission(["record_confirm"])) {
|
||||
this.getTableData();
|
||||
} else {
|
||||
this.getOrgList();
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
checkPermission,
|
||||
getOrgList() {
|
||||
let that = this;
|
||||
let ids = ''
|
||||
if (that.checkPermission(["record_confirm"])) {
|
||||
getOrgList({ can_supervision: true }).then((res) => {
|
||||
let data = res.data;
|
||||
debugger;
|
||||
for(let i=0;i<data.length;i++){
|
||||
ids= ids+data[i].id+',';
|
||||
}
|
||||
that.listQuery.belong_dept__in=ids;
|
||||
that.getList();
|
||||
});
|
||||
} else {
|
||||
getSubOrgList().then((res) => {
|
||||
let data = res.data;
|
||||
let that = this;
|
||||
let ids = ''
|
||||
getSubOrgList().then((res) => {
|
||||
let data = res.data;
|
||||
for(let i=0;i<data.length;i++){
|
||||
ids= ids+data[i].id+',';
|
||||
}
|
||||
that.listQuery.belong_dept__in=ids;
|
||||
that.getList();
|
||||
});
|
||||
},
|
||||
getTableData(){
|
||||
debugger;
|
||||
for(let i=0;i<data.length;i++){
|
||||
ids= ids+data[i].id+',';
|
||||
let that = this;
|
||||
if(that.listQuery.year==''){
|
||||
let date = new Date();
|
||||
that.query.year = date.getFullYear();
|
||||
}else{
|
||||
that.query.year =that.listQuery.year
|
||||
}
|
||||
that.listQuery.belong_dept__in=ids;
|
||||
that.getList();
|
||||
});
|
||||
}
|
||||
},
|
||||
//获取任务列表===》获取任务id
|
||||
taskAnalyse(that.query).then(res=>{
|
||||
console.log(res)
|
||||
let data = res.data;
|
||||
let arr = [];
|
||||
if(data.length>0){
|
||||
let firstObj = {};
|
||||
firstObj.year=data[0].年份;
|
||||
firstObj.dept_name=data[0].单位;
|
||||
firstObj.pgoal_1=data[0].重大事故数基础值;
|
||||
let pgoal_2 = data[0].报告证书合格率基础值+'';
|
||||
let pgoal_3=data[0].报告证书及时率基础值+'';
|
||||
let pgoal_4=data[0].能力验证满意率基础值+'';
|
||||
let pgoal_5=data[0].客户投诉处理满意率基础值+'';
|
||||
firstObj.pgoal_2=pgoal_2.indexOf('.')>-1?pgoal_2:pgoal_2+'.0';
|
||||
firstObj.pgoal_3=pgoal_3.indexOf('.')>-1?pgoal_3:pgoal_3+'.0';
|
||||
firstObj.pgoal_4=pgoal_4.indexOf('.')>-1?pgoal_4:pgoal_4+'.0';
|
||||
firstObj.pgoal_5=pgoal_5.indexOf('.')>-1?pgoal_5:pgoal_5+'.0';
|
||||
arr.push(firstObj);
|
||||
data.forEach(item=>{
|
||||
let obj = {};
|
||||
obj.year=item.年份;
|
||||
obj.dept_name=item.单位;
|
||||
obj.pgoal_1=item.重大事故数设定值;
|
||||
let pgoal2 = item.报告证书合格率设定值+'';
|
||||
let pgoal3=item.报告证书及时率设定值+'';
|
||||
let pgoal4=item.能力验证满意率设定值+'';
|
||||
let pgoal5=item.客户投诉处理满意率设定值+'';
|
||||
obj.pgoal_2=pgoal2.indexOf('.')>-1?pgoal2:pgoal2+'.0';
|
||||
obj.pgoal_3=pgoal3.indexOf('.')>-1?pgoal3:pgoal3+'.0';
|
||||
obj.pgoal_4=pgoal4.indexOf('.')>-1?pgoal4:pgoal4+'.0';
|
||||
obj.pgoal_5=pgoal5.indexOf('.')>-1?pgoal5:pgoal5+'.0';
|
||||
arr.push(obj);
|
||||
})
|
||||
}
|
||||
|
||||
that.dataList.results = arr;
|
||||
})
|
||||
},
|
||||
//获取列表
|
||||
getList(){
|
||||
let that = this;
|
||||
that.dataList.results = [];
|
||||
|
|
@ -122,6 +165,8 @@
|
|||
let data =data0.filter(item=>{
|
||||
return item.task2do!==null;
|
||||
});
|
||||
debugger;
|
||||
console.log(data)
|
||||
that.dataList.count = data.length;
|
||||
if(data.length>0){
|
||||
let alreadyId = ['000'];
|
||||
|
|
@ -182,7 +227,11 @@
|
|||
this.listQuery.year = year;
|
||||
},
|
||||
handleFilter(){
|
||||
this.getList();
|
||||
if (this.checkPermission(["record_confirm"])) {
|
||||
this.getTableData();
|
||||
} else {
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
handleExport() {
|
||||
let filename = this.listQuery.year+'部门目标.xlsx'
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
v-model="listQuery.belong_dept"
|
||||
placeholder="报送部门"
|
||||
clearable
|
||||
filterable
|
||||
@change="belongDeptChange"
|
||||
>
|
||||
<el-option
|
||||
|
|
@ -134,13 +135,16 @@
|
|||
<el-col :span="12" class="chartsWrap">
|
||||
<div id="lin4" style="width:495px;height:300px;margin-left: 10px;"></div>
|
||||
</el-col>
|
||||
<el-col class="chartsWrap">
|
||||
<div id="analyse" style="width:1000px;height:300px;"></div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getTask2Do } from "@/api/task";
|
||||
import { getTask2Do,taskAnalyse } from "@/api/task";
|
||||
import { getOrgList, getSubOrgList } from "@/api/org";
|
||||
import checkPermission from "@/utils/permission";
|
||||
import * as echarts from 'echarts';
|
||||
|
|
@ -153,158 +157,142 @@
|
|||
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'
|
||||
},
|
||||
],
|
||||
// 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:[
|
||||
[],[],[],[],[],[],[],[],[],[],[],[],[]
|
||||
],
|
||||
|
|
@ -315,6 +303,8 @@
|
|||
lineChart2:null,
|
||||
lineChart3:null,
|
||||
lineChart4:null,
|
||||
barAnalyse:null,
|
||||
xAxisDatas:['报告/证书合格率(%)','报告/证书及时率(%)','能力验证满意率(%)','客户投诉处理满意率(%)'],
|
||||
xAxisData:["1-2月","3-4月","5-6月","7-8月","9-10月","11-12月"],
|
||||
bar1Data:[],
|
||||
bar2Data:[],
|
||||
|
|
@ -339,6 +329,7 @@
|
|||
this.deptName = this.$store.getters.dept_name;
|
||||
this.listQuery.belong_dept = this.$store.getters.dept;
|
||||
this.handleFilter();
|
||||
this.getAnalyseData();
|
||||
}
|
||||
this.optionSet();
|
||||
this.getGroup();
|
||||
|
|
@ -606,6 +597,7 @@
|
|||
let that = this;
|
||||
if(that.listQuery.belong_dept!==''){
|
||||
if(that.listQuery.task2__year!==''){
|
||||
that.getAnalyseData();
|
||||
that.bar1Data = [];
|
||||
that.bar2Data = [];
|
||||
that.line1Data = [];
|
||||
|
|
@ -743,14 +735,14 @@
|
|||
}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.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();
|
||||
|
|
@ -773,6 +765,153 @@
|
|||
this.$message.warning('请选择部门')
|
||||
}
|
||||
},
|
||||
getAnalyseData(){
|
||||
function tofixed1(item){
|
||||
let item0=item+'',item1;
|
||||
if(item!==null){
|
||||
if(item0.indexOf('.')>-1){
|
||||
item1 = item.toFixed(1)
|
||||
return item1
|
||||
}else{
|
||||
item1 = item+'.0'
|
||||
return item1
|
||||
}
|
||||
}else{
|
||||
return ''
|
||||
}
|
||||
}
|
||||
function tofixed2(item){
|
||||
let item0=item+'';
|
||||
if(item!==null){
|
||||
if(item0.indexOf('.')>-1){
|
||||
let item1 = item.toFixed(2)
|
||||
return item1
|
||||
}else{
|
||||
return item
|
||||
}
|
||||
}else{
|
||||
return ''
|
||||
}
|
||||
}
|
||||
let that = this;
|
||||
let form = {};
|
||||
form.year = this.listQuery.task2__year;
|
||||
form.dept_name = this.deptName;
|
||||
taskAnalyse(form).then(res=>{
|
||||
console.log(res)
|
||||
let data1 = [],data2 = [],data3=[];
|
||||
if(res.data.length>0){
|
||||
let data = res.data[0];
|
||||
data1 = [data.报告证书合格率,data.报告证书及时率,data.能力验证满意率,data.客户投诉处理满意率];
|
||||
data2 = [data.报告证书合格率基础值,data.报告证书及时率基础值,data.能力验证满意率基础值,data.客户投诉处理满意率基础值];
|
||||
data3 = [data.报告证书合格率设定值,data.报告证书及时率设定值,data.能力验证满意率设定值,data.客户投诉处理满意率设定值];
|
||||
for(let i=0;i<data1.length;i++){
|
||||
if(data1[i]!==null){
|
||||
data1[i] = tofixed2(data1[i]);
|
||||
}
|
||||
}
|
||||
for(let j=0;j<data2.length;j++){
|
||||
if(data2[j]!==null){
|
||||
data2[j] = tofixed1(data2[j])
|
||||
}
|
||||
}
|
||||
for(let k=0;k<data3.length;k++){
|
||||
if(data3[k]!==null){
|
||||
data3[k] = tofixed1(data3[k]);
|
||||
}
|
||||
}
|
||||
}
|
||||
let chartanalyse = document.getElementById('analyse');
|
||||
that.barAnalyse = echarts.init(chartanalyse);
|
||||
let option = {
|
||||
color:['#007dcd','#c9caca','#e8e8e8'],
|
||||
title:{
|
||||
text:'年度统计',
|
||||
x:'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger:"axis",
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data:['单位完成值','单位目标值','集团目标值'],
|
||||
right:'1%',
|
||||
top:'3%',
|
||||
tooltip: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
xAxis:{
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
data:that.xAxisDatas
|
||||
},
|
||||
grid: {
|
||||
left: '5%',
|
||||
right: '7%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis:{
|
||||
type:'value',
|
||||
axisLabel:{
|
||||
formatter:"{value}%"
|
||||
},
|
||||
scale:true,
|
||||
min:85,
|
||||
max:105,
|
||||
},
|
||||
series:[
|
||||
{
|
||||
name: '单位完成值',
|
||||
type: 'bar',
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top'
|
||||
},
|
||||
barWidth:30,
|
||||
data:data1
|
||||
},
|
||||
{
|
||||
name:"单位目标值",
|
||||
type:"bar",
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top'
|
||||
},
|
||||
barWidth:30,
|
||||
data:data3
|
||||
},
|
||||
{
|
||||
name:"集团目标值",
|
||||
type:"bar",
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top'
|
||||
},
|
||||
barWidth:30,
|
||||
data:data2
|
||||
},
|
||||
|
||||
]
|
||||
}
|
||||
that.barAnalyse.clear();
|
||||
that.barAnalyse.setOption(option);
|
||||
|
||||
})
|
||||
},
|
||||
handlePrint() {
|
||||
this.$PRINT('#myReport');
|
||||
},
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<el-card>
|
||||
<el-row :gutter="6">
|
||||
<el-date-picker
|
||||
v-model="listQuery.task2__year"
|
||||
v-model="listQuery.year"
|
||||
type="year"
|
||||
placeholder="选择年"
|
||||
value-format="yyyy"
|
||||
|
|
@ -21,25 +21,30 @@
|
|||
@click="handlePrint"
|
||||
>打印</el-button
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="exportExcel"
|
||||
>导出</el-button
|
||||
>
|
||||
</el-row>
|
||||
</el-card>
|
||||
<el-card style="margin-top:10px">
|
||||
<div ref="print" id="myReport" class="printContainer">
|
||||
<div ref="print" id="myReport" class="printContainers">
|
||||
<h3 style="text-align: center;">{{ fileName }}</h3>
|
||||
<p v-if="fileName!==''" style="text-align: center;">{{ listQuery.task2__year }}年 </p>
|
||||
<!-- 5个目标值 -->
|
||||
<!-- 5个单位目标 -->
|
||||
<el-row id="echartsContainer">
|
||||
<el-col class="chartsWrap" style="">
|
||||
<div id="main" style="width:1800px;height:300px;margin-left: 10px;"></div>
|
||||
<el-col class="chartsWraps">
|
||||
<div id="main" style="width:100%;height:700px;margin-left: 10px;" ref="chart"></div>
|
||||
</el-col>
|
||||
<el-col class="chartsWrap" style="">
|
||||
<div id="main2" style="width:1800px;height:300px;margin-left: 10px;"></div>
|
||||
<el-col class="chartsWraps">
|
||||
<div id="main2" style="width:100%;height:700px;margin-left: 10px;" ref="chart2"></div>
|
||||
</el-col>
|
||||
<el-col class="chartsWrap" style="">
|
||||
<div id="main3" style="width:1800px;height:300px;margin-left: 10px;"></div>
|
||||
<el-col class="chartsWraps">
|
||||
<div id="main3" style="width:100%;height:700px;margin-left: 10px;" ref="chart3"></div>
|
||||
</el-col>
|
||||
<el-col class="chartsWrap" style="">
|
||||
<div id="main4" style="width:1800px;height:300px;margin-left: 10px;"></div>
|
||||
<el-col class="chartsWraps">
|
||||
<div id="main4" style="width:100%;height:700px;margin-left: 10px;" ref="chart4"></div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
|
@ -47,314 +52,481 @@
|
|||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getTask2Do } from "@/api/task";
|
||||
import { getOrgList, getSubOrgList } from "@/api/org";
|
||||
import { taskAnalyse } from "@/api/task";
|
||||
import checkPermission from "@/utils/permission";
|
||||
import * as echarts from 'echarts';
|
||||
import ExcelJS from 'exceljs'; // 引入exceljs, 用于生成excel文件
|
||||
import { saveAs } from 'file-saver'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
timeStamp:0,
|
||||
listQuery:{
|
||||
task2__year:'',
|
||||
page:0
|
||||
year:'',
|
||||
dept_type_name:'2级公司'
|
||||
},
|
||||
xaxis:[],
|
||||
deptName:'',
|
||||
fileName:'',
|
||||
option:{},
|
||||
option1:{},
|
||||
option2:{},
|
||||
option3:{},
|
||||
option4:{},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.getGroup();
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 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
|
||||
// });
|
||||
// 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;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// 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){
|
||||
// // debugger;
|
||||
// console.log(parseFloat((Number(num)*100)))
|
||||
// // parseFloat((Number(num)*100).toPrecision(12))
|
||||
// let numbe = parseFloat((Number(num)*100).toPrecision(12));
|
||||
// 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');
|
||||
},
|
||||
setOption(){
|
||||
var myChart = echarts.init(document.getElementById('main'));
|
||||
var myChart2 = echarts.init(document.getElementById('main2'));
|
||||
var myChart3 = echarts.init(document.getElementById('main3'));
|
||||
var myChart4 = echarts.init(document.getElementById('main4'));
|
||||
var option = {
|
||||
var myDate = new Date();
|
||||
this.listQuery.year = myDate.getFullYear();
|
||||
this.setOption();
|
||||
this.handleFilter();
|
||||
this.option = {
|
||||
//标题
|
||||
title: {
|
||||
text: '',
|
||||
// subtext: '小标题',
|
||||
x: 'center',
|
||||
top:'3%'
|
||||
},
|
||||
tooltip: {
|
||||
trigger:"axis",
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
},
|
||||
formatter:"{a1}<br/>{b1}：{c1}%"
|
||||
},
|
||||
legend: {
|
||||
data:['目标值']
|
||||
data:['单位完成值','单位单位目标',{name:'集团单位目标',itemStyle:{opacity:0}}],
|
||||
right:'10%',
|
||||
top:'3%'
|
||||
},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '2%',
|
||||
bottom: '10%',
|
||||
top: '2%',
|
||||
bottom: '25%',
|
||||
top: '12%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
axisLabel: {
|
||||
interval: 'auto',
|
||||
rotate: 80 //设置倾斜角度，数值 可设置 正负 两种，
|
||||
xAxis: [
|
||||
{
|
||||
axisLabel: {
|
||||
interval: 'auto',
|
||||
color:'#000000',
|
||||
rotate: 45 //设置倾斜角度，数值 可设置 正负 两种，
|
||||
},
|
||||
type: 'category',
|
||||
data: [],
|
||||
},
|
||||
type: 'category',
|
||||
data: this.xaxis,
|
||||
},
|
||||
color:['#91cc75','#438af4'],
|
||||
{
|
||||
type: 'category',
|
||||
position: 'bottom',
|
||||
offset: 180,
|
||||
axisPointer: {
|
||||
type: 'none',
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
length: 35,
|
||||
inside: true,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
inside: true,
|
||||
textStyle: {
|
||||
fontSize: '14',
|
||||
},
|
||||
interval: 0,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
position: 'bottom',
|
||||
offset: 145,
|
||||
axisPointer: {
|
||||
type: 'none',
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
length: 35,
|
||||
inside: true,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
inside: true,
|
||||
textStyle: {
|
||||
fontSize: '14',
|
||||
},
|
||||
interval: 0,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
position: 'bottom',
|
||||
offset: 110,
|
||||
axisPointer: {
|
||||
type: 'none',
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
length: 35,
|
||||
inside: true,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
inside: true,
|
||||
textStyle: {
|
||||
fontSize: '14',
|
||||
},
|
||||
interval: 0,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
position: 'bottom',
|
||||
offset: 75,
|
||||
axisPointer: {
|
||||
type: 'none',
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
length: 35,
|
||||
inside: true,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
inside: true,
|
||||
textStyle: {
|
||||
fontSize: '14',
|
||||
},
|
||||
interval: 0,
|
||||
},
|
||||
data: [],
|
||||
}
|
||||
],
|
||||
color:['#c9caca','#007dcd','#000000'],
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel:{
|
||||
formatter:"{value}%"
|
||||
}
|
||||
},
|
||||
scale:true,
|
||||
min:85,
|
||||
max:100,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
name: '单位完成值',
|
||||
type: 'bar',
|
||||
z:"-1",
|
||||
barGap: '-100%',
|
||||
barGap: 0,
|
||||
barWidth:10,
|
||||
data: [100, 100, 100, 100, 100, 100],
|
||||
data: [],
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top'
|
||||
},
|
||||
markLine : {
|
||||
symbol:"none",
|
||||
label: {
|
||||
position: "end", //将警示值放在哪个位置，三个值“start”,"middle","end" 开始 中点 结束
|
||||
},
|
||||
data : [{
|
||||
data :[
|
||||
{
|
||||
silent:false, //鼠标悬停事件 true没有，false有
|
||||
lineStyle:{ //警戒线的样式 ，虚实 颜色
|
||||
type:"solid",
|
||||
color:"#ffb4b4",
|
||||
color:"#000000",
|
||||
},
|
||||
label:{
|
||||
position:'end',
|
||||
formatter:"目标(90)",
|
||||
color:"#ffb4b4",
|
||||
fontSize:'8'
|
||||
formatter:'{c}',
|
||||
color:"#000000",
|
||||
fontSize:'14'
|
||||
},
|
||||
yAxis:90 // 警戒线的标注值，可以有多个yAxis,多条警示线 或者采用 {type : 'average', name: '平均值'}，type值有 max min average，分为最大，最小，平均值
|
||||
}]
|
||||
name:'',
|
||||
yAxis:99 // 警戒线的标注值，可以有多个yAxis,多条警示线 或者采用 {type : 'average', name: '平均值'}，type值有 max min average，分为最大，最小，平均值
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '及时率',
|
||||
name: '单位单位目标',
|
||||
type: 'bar',
|
||||
barWidth:10,
|
||||
data: [95, 92, 96, 90, 91, 98]
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top'
|
||||
},
|
||||
data: []
|
||||
},
|
||||
{
|
||||
name: '集团单位目标',
|
||||
type: 'line',
|
||||
data: []
|
||||
}
|
||||
],
|
||||
};
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(option);
|
||||
myChart2.setOption(option);
|
||||
myChart3.setOption(option);
|
||||
myChart4.setOption(option);
|
||||
|
||||
},
|
||||
methods: {
|
||||
handlePrint() {
|
||||
this.$PRINT('#myReport');
|
||||
},
|
||||
setOption(){
|
||||
this.barChart1 = echarts.init(document.getElementById('main'));
|
||||
this.barChart2 = echarts.init(document.getElementById('main2'));
|
||||
this.barChart3 = echarts.init(document.getElementById('main3'));
|
||||
this.barChart4 = echarts.init(document.getElementById('main4'));
|
||||
},
|
||||
checkPermission,
|
||||
getGroup() {
|
||||
if (this.checkPermission(["record_confirm"])) {
|
||||
getOrgList({ can_supervision: true }).then((res) => {
|
||||
let data = res.data,xaxis = [];
|
||||
let arr = data.filter(item=>{
|
||||
return item.type==26||item.type==28
|
||||
})
|
||||
arr.forEach(item=>{
|
||||
xaxis.push(item.name)
|
||||
})
|
||||
this.orgData = arr;
|
||||
this.xaxis = xaxis;
|
||||
this.setOption();
|
||||
});
|
||||
} else {
|
||||
getSubOrgList().then((res) => {
|
||||
let data = res.data,xaxis = [];
|
||||
let arr = data.filter(item=>{
|
||||
return item.type==26||item.type==28
|
||||
})
|
||||
arr.forEach(item=>{
|
||||
xaxis.push(item.name)
|
||||
})
|
||||
this.orgData = arr;
|
||||
this.xaxis = xaxis;
|
||||
this.setOption();
|
||||
});
|
||||
handleFilter(){
|
||||
let that = this;
|
||||
function compare(property) {
|
||||
return function (a, b) {
|
||||
return b[property]-a[property];
|
||||
}
|
||||
}
|
||||
},
|
||||
taskAnalyse(that.listQuery).then(res=>{
|
||||
console.log(res)
|
||||
let data = res.data;
|
||||
let xaxis1 = [''],data1 = [],data12=[],
|
||||
xaxis2 = [''],data2 = [],data22=[],
|
||||
xaxis3 = [''],data3 = [],data32=[],
|
||||
xaxis4 = [''],data4 = [],data42=[];
|
||||
let minNumber1=0,minNumber2=0,minNumber3=0,minNumber4=0;
|
||||
let markLine1 = 0,markLine2=0,markLine3=0,markLine4=0;
|
||||
let sortedArr1 = data.sort(compare("报告证书合格率"));
|
||||
sortedArr1.forEach(item1=>{
|
||||
xaxis1.push(item1.单位)
|
||||
data1.push(item1.报告证书合格率)
|
||||
data12.push(item1.报告证书合格率设定值)
|
||||
})
|
||||
markLine1 = sortedArr1[0].报告证书合格率基础值;
|
||||
let sortedArr2 = data.sort(compare("报告证书及时率"));
|
||||
sortedArr2.forEach(item2=>{
|
||||
xaxis2.push(item2.单位)
|
||||
data2.push(item2.报告证书及时率)
|
||||
data22.push(item2.报告证书及时率设定值)
|
||||
})
|
||||
markLine2 = sortedArr2[0].报告证书及时率基础值;
|
||||
let sortedArr3 = data.sort(compare("能力验证满意率"));
|
||||
sortedArr3.forEach(item3=>{
|
||||
xaxis3.push(item3.单位)
|
||||
data3.push(item3.能力验证满意率)
|
||||
data32.push(item3.能力验证满意率设定值)
|
||||
})
|
||||
markLine3 = sortedArr3[0].能力验证满意率基础值;
|
||||
let sortedArr4 = data.sort(compare("客户投诉处理满意率"));
|
||||
sortedArr4.forEach(item4=>{
|
||||
xaxis4.push(item4.单位)
|
||||
data4.push(item4.客户投诉处理满意率)
|
||||
data42.push(item4.客户投诉处理满意率设定值)
|
||||
})
|
||||
minNumber1 =Math.min(...data1)
|
||||
minNumber1 = Math.floor(minNumber1)
|
||||
minNumber2 =Math.min(...data2)
|
||||
minNumber2 = Math.floor(minNumber2)
|
||||
minNumber3 =Math.min(...data3)
|
||||
minNumber3 = Math.floor(minNumber3)
|
||||
minNumber4 =Math.min(...data4)
|
||||
minNumber4 = Math.floor(minNumber4)
|
||||
markLine4 = sortedArr4[0].客户投诉处理满意率基础值;
|
||||
|
||||
function tofixed1(item){
|
||||
if(item!==null){
|
||||
let item1 = item.toFixed(1)
|
||||
return item1
|
||||
}else{
|
||||
return ''
|
||||
}
|
||||
}
|
||||
function tofixed2(item){
|
||||
let item0=item+'';
|
||||
if(item!==null){
|
||||
if(item0.indexOf('.')>-1){
|
||||
let item1 = item.toFixed(2)
|
||||
return item1
|
||||
}else{
|
||||
return item
|
||||
}
|
||||
}else{
|
||||
return ''
|
||||
}
|
||||
}
|
||||
let arr1 = [''],arr2=[''],arr3=[''],arr4=[''],
|
||||
arr12 = [''],arr22=[''],arr32=[''],arr42=[''],
|
||||
markarr1 = ['集团目标'],markarr2=['集团目标'],markarr3=['集团目标'],markarr4=['集团目标'];
|
||||
for(let i=0;i<data1.length;i++){
|
||||
markarr1.push(markLine1.toFixed(1))
|
||||
markarr2.push(markLine2.toFixed(1))
|
||||
markarr3.push(markLine3.toFixed(1))
|
||||
markarr4.push(markLine4.toFixed(1))
|
||||
}
|
||||
let option1 =that.option;
|
||||
let option2 =that.option;
|
||||
let option3=that.option;
|
||||
let option4= that.option;
|
||||
data1.forEach(item=>{
|
||||
let item1 = tofixed2(item)
|
||||
arr12.push(item1)
|
||||
})
|
||||
data12.forEach(item=>{
|
||||
let item2 = tofixed1(item)
|
||||
arr1.push(item2)
|
||||
})
|
||||
let xAxis12 = arr1;xAxis12[0]='单位目标';
|
||||
let xAxis13 = arr12;xAxis13[0]='完成值';
|
||||
option1.yAxis.min = minNumber1;
|
||||
option1.xAxis[0].data = xaxis1;
|
||||
option1.xAxis[1].data =markarr1;//集团单位目标
|
||||
option1.xAxis[2].data = xAxis12;//部门单位目标
|
||||
option1.xAxis[3].data = xAxis13;//部门完成值
|
||||
option1.series[0].data = arr12;//部门完成值
|
||||
option1.series[1].data = arr1;//单位单位目标
|
||||
option1.title.text = '报告/证书合格率';
|
||||
option1.series[0].markLine.data[0].yAxis = markLine1.toFixed(1);
|
||||
that.barChart1.clear();
|
||||
that.barChart1.setOption(option1);
|
||||
data2.forEach(item=>{
|
||||
let item1 = tofixed2(item)
|
||||
arr22.push(item1)
|
||||
})
|
||||
data22.forEach(item=>{
|
||||
let item2 = tofixed1(item)
|
||||
arr2.push(item2)
|
||||
})
|
||||
let xAxis22 = arr2;xAxis22[0]='单位目标';
|
||||
let xAxis23 = arr22;xAxis23[0]='完成值';
|
||||
option2.yAxis.min = minNumber2;
|
||||
option2.xAxis[0].data = xaxis2;
|
||||
option2.xAxis[1].data =markarr2;//集团单位目标
|
||||
option2.xAxis[2].data = xAxis22;//部门单位目标
|
||||
option2.xAxis[3].data = xAxis23;//部门完成值
|
||||
option2.series[0].data = arr22;
|
||||
option2.series[1].data = arr2;
|
||||
option2.title.text = '报告/证书及时率';
|
||||
option2.series[0].markLine.data[0].yAxis = markLine2.toFixed(1);
|
||||
that.barChart2.clear();
|
||||
that.barChart2.setOption(option2);
|
||||
data3.forEach(item=>{
|
||||
let item1 = tofixed2(item)
|
||||
arr32.push(item1)
|
||||
})
|
||||
data32.forEach(item=>{
|
||||
let item2 = tofixed1(item)
|
||||
arr3.push(item2)
|
||||
})
|
||||
let xAxis32 = arr3;xAxis32[0]='单位目标';
|
||||
let xAxis33 = arr32;xAxis33[0]='完成值';
|
||||
option3.yAxis.min = minNumber3;
|
||||
option3.xAxis[0].data = xaxis3;
|
||||
option3.xAxis[1].data =markarr3;//集团单位目标
|
||||
option3.xAxis[2].data = xAxis32;//部门单位目标
|
||||
option3.xAxis[3].data = xAxis33;//部门完成值
|
||||
option3.series[0].data = arr32;
|
||||
option3.series[1].data = arr3;
|
||||
option3.title.text = '能力验证满意率';
|
||||
option3.series[0].markLine.data[0].yAxis = markLine3.toFixed(1);
|
||||
that.barChart3.clear();
|
||||
that.barChart3.setOption(option3);
|
||||
data4.forEach(item=>{
|
||||
let item1 = tofixed2(item)
|
||||
arr42.push(item1)
|
||||
})
|
||||
data42.forEach(item=>{
|
||||
let item2 = tofixed1(item)
|
||||
arr4.push(item2)
|
||||
})
|
||||
let xAxis42 = arr4;xAxis42[0]='单位目标';
|
||||
let xAxis43 = arr42;xAxis43[0]='完成值';
|
||||
option4.yAxis.min = minNumber4;
|
||||
option4.xAxis[0].data = xaxis4;
|
||||
option4.xAxis[1].data =markarr4;//集团单位目标
|
||||
option4.xAxis[2].data = xAxis42;//部门单位目标
|
||||
option4.xAxis[3].data = xAxis43;//部门完成值
|
||||
option4.series[0].data = arr42;
|
||||
option4.series[1].data = arr4;
|
||||
option4.title.text = '客户投诉处理满意率';
|
||||
option4.series[0].markLine.data[0].yAxis = markLine4.toFixed(1);
|
||||
that.barChart4.clear();
|
||||
that.barChart4.setOption(option4);
|
||||
})
|
||||
},
|
||||
exportExcel() {
|
||||
const workbook = new ExcelJS.Workbook(); // 创建工作簿
|
||||
const worksheet = workbook.addWorksheet('Sheet1'); // 添加工作表
|
||||
|
||||
const chart = echarts.getInstanceByDom(this.$refs.chart) // 获取图表实例
|
||||
const base64Image = chart.getDataURL({
|
||||
pixelRatio: 2, // 导出图片的分辨率比例，默认为1，即图片的分辨率为屏幕分辨率的一倍
|
||||
backgroundColor: '#fff' // 导出图片的背景色
|
||||
})
|
||||
let image= workbook.addImage({ // 添加图片
|
||||
base64: base64Image, // 图片的base64编码
|
||||
extension: 'png' // 图片的扩展名
|
||||
});
|
||||
worksheet.addImage(image, 'A1:AB35'); // 将图片添加到工作表中
|
||||
|
||||
const chart2 = echarts.getInstanceByDom(this.$refs.chart2)
|
||||
const base64Image2 = chart2.getDataURL({
|
||||
pixelRatio: 2,
|
||||
backgroundColor: '#fff'
|
||||
})
|
||||
let image2= workbook.addImage({
|
||||
base64: base64Image2,
|
||||
extension: 'png'
|
||||
});
|
||||
worksheet.addImage(image2, 'A36:AB70');
|
||||
|
||||
const chart3 = echarts.getInstanceByDom(this.$refs.chart3)
|
||||
const base64Image3 = chart3.getDataURL({
|
||||
pixelRatio: 2,
|
||||
backgroundColor: '#fff'
|
||||
})
|
||||
let image3= workbook.addImage({
|
||||
base64: base64Image3,
|
||||
extension: 'png'
|
||||
});
|
||||
worksheet.addImage(image3, 'A71:AB105');
|
||||
const chart4 = echarts.getInstanceByDom(this.$refs.chart4)
|
||||
const base64Image4 = chart4.getDataURL({
|
||||
pixelRatio: 2,
|
||||
backgroundColor: '#fff'
|
||||
})
|
||||
let image4= workbook.addImage({
|
||||
base64: base64Image4,
|
||||
extension: 'png'
|
||||
});
|
||||
worksheet.addImage(image4, 'A106:AB140');
|
||||
workbook.xlsx.writeBuffer().then(function (buffer) { // 生成excel文件的二进制数据
|
||||
saveAs.saveAs(new Blob([buffer], { // 生成Blob对象
|
||||
type: 'application/octet-stream' // 指定文件的MIME类型
|
||||
}), 'xchart.xlsx'); // 指定文件名
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.printContainer{
|
||||
.printContainers{
|
||||
/* width: 1075px; */
|
||||
}
|
||||
#numTable,#echartsContainer{
|
||||
|
|
@ -374,10 +546,10 @@
|
|||
#echartsContainer{
|
||||
margin-top: 30px;
|
||||
}
|
||||
.chartsWrap{
|
||||
/* margin-top: 30px; */
|
||||
/* padding-top: 50px; */
|
||||
width: 100%;
|
||||
.chartsWraps{
|
||||
width: 99%;
|
||||
height: fit-content;
|
||||
overflow-y: hidden;
|
||||
overflow-x: scroll;
|
||||
border-top: 1px solid #eeeeee;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -623,7 +623,25 @@ export default {
|
|||
getPgoalDeptList(this.listQuery)
|
||||
.then((res) => {
|
||||
this.listLoading2 = false;
|
||||
this.recordList = res.data.results;
|
||||
let data = res.data.results;
|
||||
for(let i=0;i<data.length;i++){
|
||||
if(data[i].goal_key!=="pgoal_1"){
|
||||
let value_a = data[i].goal_value_a+'';
|
||||
let value_b = data[i].goal_value_b+'';
|
||||
if(value_a!=='null'){
|
||||
data[i].goal_value_a=value_a.indexOf('.')>-1?value_a:value_a+'.0';
|
||||
}else{
|
||||
data[i].goal_value_a=''
|
||||
}
|
||||
if(value_b!='null'){
|
||||
data[i].goal_value_b=value_b.indexOf('.')>-1?value_b:value_b+'.0';
|
||||
}else{
|
||||
data[i].goal_value_b='';
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
this.recordList = data;
|
||||
})
|
||||
.catch((e) => {
|
||||
this.listLoading2 = false;
|
||||
|
|
|
|||
Loading…
Reference in New Issue