/* * @Descripttion: * @version: * @Author: sueRimn * @Date: 2020-09-01 15:24:39 * @LastEditors: sueRimn * @LastEditTime: 2021-07-07 14:07:26 */ import { Component, OnInit } from '@angular/core'; import { Router } from '@angular/router'; import {EchartsDataService,} from '../../echarts-data.service' declare var echarts: any; declare var CryptoJS @Component({ selector: 'app-page-one', templateUrl: './page-one.component.html', styleUrls: ['./page-one.component.scss'] }) export class PageOneComponent implements OnInit { options:any; constructor(private router: Router,public echartsData:EchartsDataService) { } padHw orid ngOnInit() { if(window.matchMedia("(max-width: 1400px)").matches){ this.padHw=true //this.padjt= }else{ this.padHw=false } if(sessionStorage.getItem('refresh') === 'true') { sessionStorage.removeItem('refresh'); location.reload(); } window.setTimeout(()=>{ this.getechartsdata() }) let jwt = sessionStorage.getItem("token"); let rawJwt = CryptoJS.enc.Base64.parse(jwt.split('.')[1]); let identityJson = CryptoJS.enc.Utf8.stringify(rawJwt); let identityJsonparse=JSON.parse(identityJson) this.orid=identityJsonparse.oid //console.log(identityJsonparse) } ngOnDestroy(): void { this.indexBzt.clear() this.indexBzt.dispose() } async getechartsdata(){ await this.echartsData.getData(null,`/api/StatisticsAnalysis/Plans`) this.initCharts("pieone") this.initCharts("pietwo") } /* 首页饼状图 */ indexBzt tabledata count indexData planCategoriesData=[] planStatusesData=[] initCharts(tid){ this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate)) if(tid=='pieone') { this.tabledata[0].planCategoryStatistics.planCategories.forEach((value,index,array) => { if(array[index].planCategoryName=='LevelOne'){ this.planCategoriesData.push({name:'Ⅰ级预案',value:array[index].count,planStatusName:array[index].planCategoryName,type:1}) }else if(array[index].planCategoryName=='LevelTwo'){ this.planCategoriesData.push({name:'Ⅱ级预案',value:array[index].count,planStatusName:array[index].planCategoryName,type:2}) }else if(array[index].planCategoryName=='LevelThree'){ this.planCategoriesData.push({name:'Ⅲ级预案',value:array[index].count,planStatusName:array[index].planCategoryName,type:3}) }else if(array[index].planCategoryName=='LevelFour'){ this.planCategoriesData.push({name:'Ⅳ级预案',value:array[index].count,planStatusName:array[index].planCategoryName,type:4}) }else if(array[index].planCategoryName=='LevelFive'){ this.planCategoriesData.push({name:'Ⅴ级预案',value:array[index].count,planStatusName:array[index].planCategoryName,type:5}) } }); }else{ this.tabledata[0].planStatusStatistics.planStatuses.forEach((value,index,array) => { if(array[index].planStatusName=='New'){ this.planStatusesData.push({name:'预案新增',value:array[index].count,type:1,planStatusName:array[index].planStatusName}) }else if(array[index].planStatusName=='Auditing'){ this.planStatusesData.push({name:'预案审核通过',value:array[index].count,type:3,planStatusName:array[index].planStatusName}) }else if(array[index].planStatusName=='Approved'){ this.planStatusesData.push({name:'预案编制',value:array[index].count,type:5,planStatusName:array[index].planStatusName}) }else if(array[index].planStatusName=='Rejected'){ this.planStatusesData.push({name:'预案审核退回',value:array[index].count,type:4,planStatusName:array[index].planStatusName}) }else if(array[index].planStatusName=='Editing'){ this.planStatusesData.push({name:'预案审核中',value:array[index].count,type:2,planStatusName:array[index].planStatusName}) } }); } var ec = echarts as any; this.indexBzt = ec.init(document.getElementById(tid),'walden'); var options={ title: { text:tid=='pieone'?`预案级别统计(${this.tabledata[0].planCategoryStatistics.totalCount}份)` :`预案状态统计(${this.tabledata[0].planStatusStatistics.totalCount}份)`, top: "7%", left: 'center', textStyle:{ fontSize:this.padHw?25: 31 } }, tooltip: { trigger: 'item', formatter: (params)=>{ this.echartsData.biaogeTishiyuan(params.data,tid) return this.echartsData.res } }, legend: { bottom: 50, left: 'center', //padding:20, // itemWidth:60, // itemHeight:25, textStyle:{ fontSize:this.padHw?15: 18, color:"#000000" }, data:tid=='pieone'?['Ⅰ级预案', 'Ⅱ级预案', 'Ⅲ级预案', 'Ⅳ级预案', 'Ⅴ级预案'] :['预案新增', '预案审核通过', '预案编制', '预案审核退回', '预案审核中'] }, series: [ { name: '访问来源', type: 'pie', radius: '50%', center: ['50%', '45%'], label:{ normal:{ show:true, // position: 'inner', fontSize:this.padHw?14: 18, formatter:this.padHw?'{b} \n{c}份({d}%)' :'{b} {c}份\n({d}%)', }, rich: { d: { align: 'center', } }, }, data:tid=='pieone'?this.planCategoriesData:this.planStatusesData, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; this.indexBzt.on('click', (params) => { // console.log(params) if(tid=='pieone'){ for(var i=0;i0){ this.tabledata[0].planCategoryStatistics.planCategories[i].organizations.forEach((element,index,array) => { if(array[index].organizationId==this.orid){ array.splice(index,1) } window.setTimeout(()=>{ if(array.length>0){ this.router.navigate(['/statisticanalysis/statePageOne/time'],{queryParams:{'level':params.name,'type':params.data.type,'tid':'pieone'}}); } else{ this.router.navigate(['/statisticanalysis/AllPlan'],{queryParams:{'name':params.name,'id':null,'type':params.data.type,'tid':'pieone'}}); } }) }); } else if(this.echartsData.level=='3'){ //中队跳转 this.router.navigate(['/statisticanalysis/AllPlan'],{queryParams:{'name':params.name,'id':null,'type':params.data.type,'tid':'pieone'}}); } } } }else{ for(var i=0;i0){ this.tabledata[0].planStatusStatistics.planStatuses[i].organizations.forEach((element,index,array) => { if(array[index].organizationId==this.orid){ array.splice(index,1) } window.setTimeout(()=>{ if(array.length>0){ this.router.navigate(['/statisticanalysis/statePageOne/time'],{queryParams:{'level':params.name,'type':params.data.type,'tid':'pietwo'}}); } else{ this.router.navigate(['/statisticanalysis/AllPlan'],{queryParams:{'name':params.name,'id':null,'type':params.data.type,'tid':'pietwo'}}); } }) }); } else if(this.echartsData.level=='3'){ //中队跳转 this.router.navigate(['/statisticanalysis/AllPlan'],{queryParams:{'name':params.name,'id':null,'type':params.data.type,'tid':'pietwo'}}); } } } } }); this.indexBzt.setOption(options); } /** * @name: 表格提示框封装 * @test: test font * @msg: * @param {string(表头)} * @return {type} */ biaogeTishi(biaotou:string){ var shuju='[{"name":"浦东支队","number":"156","zhanbi":"3%"},{"name":"黄浦支队","number":"144","zhanbi":"2.8%"},' shuju+='{"name":"徐汇支队","number":"133","zhanbi":"2.1%"},{"name":"长宁支队","number":"122","zhanbi":"1.6%"},' shuju+='{"name":"静安支队","number":"120","zhanbi":"1.3%"},{"name":"普陀支队","number":"100","zhanbi":"1.1%"},' shuju+='{"name":"虹口支队","number":"95","zhanbi":"1%"},{"name":"杨浦支队","number":"90","zhanbi":"0.9%"},' shuju+='{"name":"闵行支队","number":"88","zhanbi":"0.8%"},{"name":"宝山支队","number":"83","zhanbi":"0.7%"},' shuju+='{"name":"徐汇支队","number":"133","zhanbi":"2.1%"},{"name":"长宁支队","number":"122","zhanbi":"1.6%"},' shuju+='{"name":"嘉定支队","number":"78","zhanbi":"0.6%"},{"name":"松江支队","number":"75","zhanbi":"0.5%"},' shuju+='{"name":"金山支队","number":"65","zhanbi":"0.4%"},{"name":"崇明支队","number":"55","zhanbi":"0.3%"}]' var jsonObj = JSON.parse(shuju); var res = '
'+biaotou+'
' res+='
'; res+=''; res+=''; res+='' res+='' res+='' res+=''; for(var i=0;i' res+='' res+='' } res+='' res+='' res+='
名称数量总占比
'+jsonObj[i].number+''+jsonObj[i].zhanbi+'
总计135619%
' return res } }