ShangHaiYuan-AnXin/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts

import { Component, OnInit,ViewChild } from '@angular/core';
import { Router } from '@angular/router';
import { ActivatedRoute } from '@angular/router';
import {EchartsDataService} from '../echarts-data.service'
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
declare var echarts: any;

//首页图形查询
@Component({
  selector: 'app-scheduled-updates',
  templateUrl: './scheduled-updates.component.html',
  styleUrls: ['./scheduled-updates.component.scss']
})
export class ScheduledUpdatesComponent implements OnInit {

  constructor(private router: Router,public snackBar: MatSnackBar,public echartsData:EchartsDataService) { }

  ngOnInit(): void {
    window.setTimeout(()=>{
      this.getechartsdata()
      
    })
  }

  ngOnDestroy () {
    this.example.clear()
    this.example.dispose()
  }

  example:any;
  buildingShow:boolean=false  //控制查询条件的显隐
  selectedBtn="tu" //两个查询按钮颜色控制
  chaxun:string=""
  //图形查询点击事件
  tuClick(){
    this.buildingShow=false
    this.selectedBtn="tu"
  }
  //条件查询
  tiaojianClick(){
    this.buildingShow=true
    this.selectedBtn="tiaojian"
  }
  //查询按钮点击事件
  findClick(){
    const config = new MatSnackBarConfig();
    config.verticalPosition = 'top';
    config.duration = 3000
    if(this.chaxun==""){this.snackBar.open('未选择单位','确定',config)}
    else{
      this.echartsData.buildingName=this.chaxun
      this.echartsData.tableShow=true
    }
  }
  //获取后端数据
  async getechartsdata(){
    if(this.dwOryuan=='danwei'){
      await this.echartsData.getData(null,`/api/StatisticsAnalysis/Companies/Maintained`)
      this.tabledata1=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata1)
      this.initCharts("pie")
      await this.echartsData.getData(null,`/api/StatisticsAnalysis/Companies/Maintenance`)
      this.tabledata2=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata2)
      this.initCharts("pieTwo")
    }else{
      await this.echartsData.getData(null,`/api/StatisticsAnalysis/Plans/Maintained`)
      this.tabledata1=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata1)
      this.initCharts("pie")
      await this.echartsData.getData(null,`/api/StatisticsAnalysis/Plans/Maintenance`)
      this.tabledata2=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata2)
      this.initCharts("pieTwo")
    }
    
    
    
  }
   /* 首页饼状图 */
   tabledata1
   tabledata2
   initCharts(pieid){
   this.example= echarts.init(document.getElementById(pieid),'walden');
    var options={
      title: {
        text: pieid=="pie"?`已维护统计（${this.tabledata1[0].totalCount}家）`:`计划维护统计（${this.tabledata2[0].totalCount}家）`,
        top: "3%",
        left: 'center',
        textStyle:{
          fontSize:28
        }
      },
      tooltip: {
        trigger: 'item',
        formatter:  (params)=>{
          return this.weihu(params.data)
          //return this.echartsData.tableTooltip(this.selectedBtn=="tu"?this.echartsData.tableDataZhi:this.echartsData.buildingType,params.name)
        },
        position:this.echartsData.tableTooltipNoShow2
      },
      legend: {
        orient: 'vertical',
        right: 150,
        top:80,
        // itemWidth:60,
        // itemHeight:25,
        textStyle:{
        fontSize:18,
        color:"#000000"
         },
        data:pieid=="pie"? ['维护无需修改', '维护修改', '维护删除']:['未维护', '维护通过审核', '维护中']
      },
      series: [{ 
        name: '访问来源',
        type: 'pie',
        radius: '60%',
        center: ['50%', '60%'],
        label:{
          normal:{
          show:true,
          // position: 'inner',
          fontSize:16,
          formatter:'{b} {c}家\n{d|({d}%)}',
          rich: {
            d: {
              align: 'center',
              fontSize:18
            }
          },
        }},
        data:pieid=="pie"? [
          {value: this.tabledata1[0].preservedCount.totalCount, name: '维护无需修改'},
          {value: this.tabledata1[0].updatedCount.totalCount, name: '维护修改',itemStyle:{color:'#02A7F0'}},
          {value: this.tabledata1[0].deletedCount.totalCount, name: '维护删除',itemStyle:{color:'#87cebb'}},
          ]:[
            {value: this.tabledata2[0].unMaintainCount.totalCount, name: '未维护'},
            {value: this.tabledata2[0].maintainedCount.totalCount, name: '维护通过审核',itemStyle:{color:'#02A7F0'}},
            {value: this.tabledata2[0].maintainingCount.totalCount, name: '维护中',itemStyle:{color:'#87cebb'}},
            ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }

      }]
    };
    this.example.setOption(options);
    this.example.on('click', (params) => {
      this.echartsData.findShow=true
        //if(params.name=="维护删除"){this.router.navigateByUrl(`/statisticanalysis/delete_one/delete_two?dwOryuan=${this.dwOryuan}&type=3`);}
        
          if(pieid=="pie"){
            this.echartsData.scheduledUpdatesToggle = 1
            //this.echartsData.zhuXname=["平均值","维护无需修改","维护修改","维护删除"]
            this.router.navigateByUrl(`/statisticanalysis/scheduledUpdates/PublicEcharts?type=${params.data.name=='维护修改'?2:params.data.name=='维护无需修改'?1:3}&dwOryuan=${this.dwOryuan}&pieid=pie`);
            
          }else{
            //this.echartsData.zhuXname=["平均值","维护中","维护通过审核","未维护"]
            //this.router.navigateByUrl('/statisticanalysis/scheduledUpdates/PublicEcharts');
            /* if(this.echartsData.level=='0'){
              this.echartsData.scheduledUpdatesToggle = 2
              this.router.navigateByUrl('/statisticanalysis/scheduledUpdates/PublicEcharts');
              this.echartsData.findShow=false
            }else if(this.echartsData.level=='1'){
              this.echartsData.scheduledUpdatesToggle = 3
              this.echartsData.findShow=false
              this.router.navigateByUrl('/statisticanalysis/scheduledUpdates/PublicEcharts');
            } */
              this.echartsData.zhiorBuinding='zhi'
              this.echartsData.scheduledUpdatesToggle = 2
              this.router.navigateByUrl(`/statisticanalysis/scheduledUpdates/PublicEcharts?pieid=pieTwo&type=${params.data.name=='维护通过审核'?2:params.data.name=='未维护'?1:3}&dwOryuan=${this.dwOryuan}`);
              this.echartsData.findShow=false
              
        }
        
        
        //console.log(this.echartsData.scheduledUpdatesToggle)  
    });
  }
  dwOryuan='danwei'
  //点击单位按钮
  danweiClick(){
    this.dwOryuan='danwei'
    this.example.clear()
    this.example.dispose()
    this.getechartsdata()
  }
  //点击预案按钮
  yuanClick(){
    this.dwOryuan='yuan'
    this.example.clear()
    this.example.dispose()
    this.getechartsdata()
  }
  //维护更新提示框
  tishiData
  res
  weihu(datas){
    if(datas.name=='维护删除'){
      this.tishiData=this.tabledata1[0].deletedCount.organizationCounts
    }else if(datas.name=='维护无需修改'){
      this.tishiData=this.tabledata1[0].preservedCount.organizationCounts
    }else if(datas.name=='维护修改'){
      this.tishiData=this.tabledata1[0].updatedCount.organizationCounts
    }else if(datas.name=='维护中'){
      this.tishiData=this.tabledata2[0].maintainingCount.organizationCounts
    }else if(datas.name=='未维护'){
      this.tishiData=this.tabledata2[0].unMaintainCount.organizationCounts
    }else if(datas.name=='维护通过审核'){
      this.tishiData=this.tabledata2[0].maintainedCount.organizationCounts
    }
    
    var countall=0//总计
    var countbi=0//站比
    var allCountbi=0//总站比
      for(var i=0;i<this.tishiData.length;i++){
        countall+=this.tishiData[i].count
      }
      this.res= '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:27px;text-align: center;display:block;">'+datas.name+'</span></div>'
      this.res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:14px;  color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
      this.res+='<thead style="font-size:18px;"><tr>';
      this.res+='<td style="text-align:center;width:30%;">名称</td>';
      this.res+='<td style="text-align:center;width:30%;">数量</td>'
      this.res+='<td style="text-align:center;width:30%;">总占比</td>'
      this.res+='</tr></thead>'
      this.res+='<tbody>';
      for(var i=0;i<this.tishiData.length;i++){
        countbi=Math.round(this.tishiData[i].count/countall* 10000)/ 100.00
        allCountbi=allCountbi+countbi
       this.res+='<tr>'
       this.res+='<td style="text-align:center;">'+this.tishiData[i].organizationName+'</td>'
       this.res+='<td style="text-align:center;">'+this.tishiData[i].count+'</td>'
       this.res+='<td style="text-align:center;">'+countbi+'%</td></tr>'
      }
      this.res+='</tbody>'
      this.res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">'+countall+'</td><td style="text-align:center;">100%</td></tfoot>'
      this.res+='</table></div></div>'
      return this.res
    
  }

}
//首页条件查询
@Component({
  selector: 'app-indexCondition',
  templateUrl: './indexCondition.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class indexConditionComponent implements OnInit {

  constructor(public router: ActivatedRoute,public echartsData:EchartsDataService,public route:Router) { }

  ngOnInit(): void {
    window.setTimeout(()=>{
      
    },0)
  }

  ngOnDestroy () {
    /* this.oneEcharts.dispose()
    this.oneEcharts.clear() */
  }

  oneEcharts:any;
  displayedColumns: string[] = ['name', 'weight', 'symbol'];
  //点击支队名称跳转事件
  zhiClick(item){
    this.route.navigate(['/statisticanalysis/delete_one/delete_four'],{queryParams:{'level':item+this.echartsData.buildingName}});
  }

}

//所有页面头部
@Component({
  selector: 'app-publicEcharts',
  templateUrl: './publicEcharts.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class publicEchartsComponent implements OnInit {

  constructor(private router: Router,public echartsData:EchartsDataService,public dialog: MatDialog,public snackBar: MatSnackBar) { }

  @ViewChild('verified')verifieds :verifiedComponent; //父组件中获得子组件的引用
  ngOnInit(): void {
    //this.echartsData.scheduledUpdatesToggle = 1
    this.dateInit()
  }

  isToggle:boolean = true; // 已核查/未核查
  selectType:string = 'year'; //选择当前的 查询类型 按月/年
  //查询数据
  years:any = []
  selectMonth:any = [1,2,3,4,5,6,7,8,9,10,11,12]

  //日期初始化
  dateInit () {
    let date = (new Date()).getFullYear()
    for (let i=date; i>=date-10;i--) {
      this.years.unshift(i)
    }
  }

  selectOneYear:any = (new Date()).getFullYear()-2 //开始年份
  selectTwoYear:any = (new Date()).getFullYear() //结束年份
  selectStartMonth:any = 1 //开始月份
  selectEndMonth:any = (new Date()).getMonth()+2 //结束月份
  //点击月或年
  changeTime(e){
    console.log(e)
      //this.echartsData.selectType=0
      this.verifieds.changeTime(e.value,this.selectOneYear,this.selectStartMonth,this.selectTwoYear,this.selectEndMonth)
  }
  //按月查询
  monthSubmit (e) {
    console.log(this.echartsData.dateYear)
    if (e.selectTwoYear > e.selectOneYear) {
      let startTime = e.selectOneYear + '-' + e.selectStartMonth  + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
      let endTime = e.selectTwoYear + '-' + e.selectEndMonth  + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
      this.verifieds.getechartsdata(this.echartsData.dateYear,e.selectStartMonth,this.echartsData.dateYear,e.selectEndMonth)
    } else if (e.selectTwoYear === e.selectOneYear) {
      if(e.selectEndMonth >= e.selectStartMonth) {
        let startTime = e.selectOneYear + '-' + e.selectStartMonth  + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
        let endTime = e.selectTwoYear + '-' + e.selectEndMonth  + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
        // console.log(startTime)
        // console.log(endTime)
        this.verifieds.getechartsdata(this.echartsData.dateYear,e.selectStartMonth,this.echartsData.dateYear,e.selectEndMonth)
      } else {
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('请选择正确时间区段','确定',config);
      }
    }else {
      const config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('请选择正确时间区段','确定',config);
    }
  }
  selectStartYear:any = (new Date()).getFullYear()-2 //开始年份
  selectEndYear:any = (new Date()).getFullYear() //结束年份
  
  //按年查询
  yearSubmit (e) {
    console.log(e)
    if (e.selectEndYear >= e.selectStartYear) {
      let startTime = e.selectStartYear + '-' + 1  + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
      let endTime = e.selectEndYear + '-' + 12  + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
      e.selectStartYear+='-01'
      e.selectEndYear+='-12'
      this.verifieds.getechartsdata(e.selectStartYear,e.selectStartMonth,e.selectEndYear,e.selectEndMonth)
    } else {
      const config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('请选择正确时间区段','确定',config);
    }
  }

  //已核查
  verified () {
    this.isToggle = true
    this.echartsData.level=='1'? this.echartsData.findShow=true:this.echartsData.findShow=false
    this.echartsData.scheduledUpdatesToggle =1
    //this.echartsData.scheduledUpdatesToggle ="one"
    //this.echartsData.level=='0'? this.echartsData.scheduledUpdatesToggle =1:this.echartsData.level=='1'?this.echartsData.scheduledUpdatesToggle =3:''
  }

  //未核查
  notVerified () {
    this.isToggle = false
    //this.echartsData.scheduledUpdatesToggle = "three"
    this.echartsData.scheduledUpdatesToggle =1
    this.echartsData.findShow=false
  }

  //返回
  goBack () {
    /* if(this.echartsData.scheduledUpdatesToggle==1||this.echartsData.scheduledUpdatesToggle==-3){
      this.router.navigateByUrl('/statisticanalysis/scheduledUpdates');
    }else{
      this.echartsData.scheduledUpdatesToggle--
    if(this.echartsData.scheduledUpdatesToggle==1||this.echartsData.scheduledUpdatesToggle==-3){
      this.echartsData.findShow=true
      //this.router.navigateByUrl('/statisticanalysis/scheduledUpdates');
    }
    } */
    if(this.verifieds.pieid=='pie'&& this.echartsData.scheduledUpdatesToggle>1){
      this.echartsData.scheduledUpdatesToggle--
    }else{
      this.router.navigateByUrl('/statisticanalysis/scheduledUpdates');
      //window.history.go(-1)
    }
    
  }

  //更多 窗口
  moreOpen () {
    let dialogRef = this.dialog.open(moreTableComponent);
  }

  //支队查询
  zhiFind(){
    this.verifieds.oneEcharts.clear()
    this.verifieds.oneEcharts.dispose()
    this.echartsData.zhiorBuinding="zhi"
    this.verifieds.getechartsdata(this.echartsData.dateYear-2+"-"+'01','1',this.echartsData.dateYear+'-'+'12','12')
  }
  //建筑类型查询
  buildingFind(){
    this.verifieds.oneEcharts.clear()
    this.verifieds.oneEcharts.dispose()
    this.echartsData.zhiorBuinding="building"
    this.verifieds.getechartsdata(this.echartsData.dateYear-2+"-"+'01','1',this.echartsData.dateYear+'-'+'12','12')
  }



}



//已核查组件
@Component({
  selector: 'app-verified',
  templateUrl: './verified.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class verifiedComponent implements OnInit {

  constructor(private router: Router,public echartsData:EchartsDataService,public snackBar: MatSnackBar, private route: ActivatedRoute) { }

  ngOnInit(): void {
    window.setTimeout(()=>{
      if(this.echartsData.scheduledUpdatesToggle==1){
        this.getechartsdata(this.echartsData.dateYear-2+"-"+'01','1',this.echartsData.dateYear+'-'+'12','12')
      }
      
    },0)
    console.log(this.echartsData.scheduledUpdatesToggle)
    this.pieid=this.route.snapshot.queryParams.pieid
  }

  ngOnDestroy () {
    //this.oneEcharts.dispose()
    //this.oneEcharts.clear()
  }
  pieid=this.route.snapshot.queryParams.pieid
  //TimeType=0//按月查询还是按年查询
  async changeTime (e,selectOneYear,nselectStartMoth,selectTwoYear,selectEndMonth){
    console.log(e)
    this.oneEcharts.clear()
    this.oneEcharts.dispose()
    this.qipaotishi=''
    if(e=='year'){
      this.echartsData.TimeType=1
      this.qipaotishi=this.echartsData.qipao(this.qipaotishi,this.ydatayue,this.xdatayue)
      selectOneYear=selectOneYear+'-01'
      selectTwoYear+='-12'
      this.getechartsdata(selectOneYear,nselectStartMoth,selectTwoYear,selectEndMonth)
    }else{
      this.echartsData.TimeType=0
      this.qipaotishi=this.echartsData.qipao(this.qipaotishi,this.ydatayue,this.xdatayue)
      this.getechartsdata(selectOneYear,nselectStartMoth,selectTwoYear,selectEndMonth)
    }
  }

  oneEcharts:any;
  qipaotishi
  xdatayue=['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月','10月','11月','12月']
  ydatayue=[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
  xdataYear=['2020','2021']
  ydataYear=['0','0']
  //获取后端数据
  tabledata
  async getechartsdata(selectStartYear,selectStartMonth,selectEndYear,selectEndMonth){
    let Parameters={
      MaintainedState:this.route.snapshot.queryParams.type,
      TimeType:this.echartsData.TimeType,
      TimeStart:this.echartsData.TimeType==1?selectStartYear:this.echartsData.dateYear+'-'+'01',
      TimeEnd:this.echartsData.TimeType==1?selectEndYear:this.echartsData.dateYear+'-'+'12',
      //OrganizationId
    }
    console.log(this.echartsData.zhiorBuinding)
    if(this.echartsData.zhiorBuinding=="zhi"){
      await this.echartsData.getData(Parameters,this.route.snapshot.queryParams.dwOryuan=='danwei'? 
      `/api/StatisticsAnalysis/Companies/Maintained/OrganizationTrend`:`/api/StatisticsAnalysis/Plans/Maintained/OrganizationTrend`)
      this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata)
      this.xdatayue=[]
      this.ydatayue=[]
      this.tabledata[0].items.forEach(element => {
      this.xdatayue.push(element.date)
      this.ydatayue.push(element.count)
    });
    }else{
      await this.echartsData.getData(Parameters,this.route.snapshot.queryParams.dwOryuan=='danwei'?
       `/api/StatisticsAnalysis/Companies/Maintained/BuildingTypeTrend`:`/api/StatisticsAnalysis/Plans/Maintained/BuildingTypeTrend`)
      this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata)
      this.xdatayue=[]
      this.ydatayue=[]
      this.tabledata[0].items.forEach(element => {
      this.xdatayue.push(element.date)
      this.ydatayue.push(element.count)
    });
    }
    
    this.oneInit(this.xdatayue,this.ydatayue)
  }
  //提示框表格
  tishiData
  res
  tableTooltip(datas){
    this.tishiData=this.tabledata[0].items[0].organizations
    var countall=0//总计
    var countbi=0//站比
    var allCountbi=0//总站比
      for(var i=0;i<this.tishiData.length;i++){
        countall+=this.tishiData[i].count
      }
      this.res= '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:27px;text-align: center;display:block;">'+datas[0].axisValue+'</span></div>'
      this.res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:16px;  color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
      this.res+='<thead style="font-size:18px;"><tr>';
      this.res+='<td style="text-align:center;width:30%;">名称</td>';
      this.res+='<td style="text-align:center;width:30%;">数量</td>'
      this.res+='<td style="text-align:center;width:30%;">总占比</td>'
      this.res+='</tr></thead>'
      this.res+='<tbody>';
      for(var i=0;i<this.tishiData.length;i++){
        countbi=Math.round(this.tishiData[i].count/countall* 10000)/ 100.00
        allCountbi=allCountbi+countbi
       this.res+='<tr>'
       if(this.echartsData.zhiorBuinding=='zhi'){
        this.res+='<td style="text-align:center;">'+ this.tishiData[i].organizationName+'</td>'
       }else{
        this.res+='<td style="text-align:center;">'+ this.tishiData[i].buildingTypeName+'</td>'
       }
       this.res+='<td style="text-align:center;">'+this.tishiData[i].count+'</td>'
       this.res+='<td style="text-align:center;">'+countbi+'%</td></tr>'
      }
      this.res+='</tbody>'
      this.res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">'+countall+'</td><td style="text-align:center;">100%</td></tfoot>'
      this.res+='</table></div></div>'
      return this.res
  }
  //图形数据
  oneInit (xdata,ydata) {
    this.oneEcharts = echarts.init(document.getElementById('center'),'walden');
    var option = {
      grid: {
        top: 100,
        left:40,
        right: 20,
        //bottom: 20,
      },
      // 标题
      title: {
        text: `已核查 总数：(${this.tabledata[0].totalCount})`,
        top: -4,
        left: 'center',
        textStyle:{
          //文字颜色
          color:'#000',
          fontSize: 32,
        }
      },
      //提示框
      tooltip: {
        trigger: 'axis',
        /* backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
        borderWidth:'1',
        borderRadius :'0', */
        formatter:  (params)=>{
          return this.tableTooltip(params)
          //return this.echartsData.zhiorBuinding=="zhi"?this.echartsData.tableTooltip(this.echartsData.tableDataZhi,params[0].name):this.echartsData.tableTooltip(this.echartsData.buildingType,params[0].name)
        },
        position:this.echartsData.tableTooltipNoShow2
      },
      // x轴
      xAxis: {
        type: 'category',
        boundaryGap:true,
        data:xdata,
        axisLabel:{
          textStyle:{
            fontSize :18,
            color:'#000000'
          }
          
        },
        //设置坐标轴字体颜色和宽度
        axisLine: {    
          lineStyle: {
            color: "#000",
          },
        },
        splitLine: {//分割线配置
          show:true,
          lineStyle: {
            color: '#999',
          }
        }
      },
      // y轴
      yAxis: {
        type: 'value',
        axisLabel: {
          fontSize :18,
          color: "#000" //刻度线标签颜色
        },
         //设置坐标轴字体颜色和宽度
         axisLine: {
          lineStyle: {
            color: "#000",
          }
        }
      },
      // 数据
      series: [{
          name: '单位预案编制数量',
          type: 'line',
          markPoint: {
            
            symbolSize:[65, 65],
            data: this.qipaotishi
        },
          data:ydata,
          clickable:false,
        }
      ],
    };
    this.oneEcharts.getZr().on('click', (params) => {
      if(this.echartsData.scheduledUpdatesToggle == 1){
        /* const pointInPixel= [params.offsetX, params.offsetY];
      if (this.oneEcharts.containPixel('grid',pointInPixel)) {
        let xIndex=this.oneEcharts.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
          this.router.navigate(['/statisticanalysis/scheduledUpdates/yueDate'],{queryParams:{'level':option.xAxis.data[xIndex]}});
      } */
      //let xIndex=this.items[index].echart.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
      const pointInPixel= [params.offsetX, params.offsetY];
      if (this.oneEcharts.containPixel('grid',pointInPixel)) {
        let xIndex=this.oneEcharts.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
        /*事件处理代码书写位置*/
        this.echartsData.scheduledUpdatesType = 0
        this.echartsData.scheduledUpdatesToggle = 2
        //this.echartsData.scheduledUpdatesName = "ff"
        //this.echartsData.zhiorBuinding!="zhi"?this.echartsData.scheduledUpdatesToggle = -2:this.echartsData.level=='0'? this.echartsData.scheduledUpdatesToggle = 2:this.echartsData.level=='1'?this.echartsData.scheduledUpdatesToggle = 3:''
        if(this.echartsData.zhiorBuinding!="zhi"){
          this.echartsData.findShow=false
          //this.echartsData.scheduledUpdatesToggle = -2
          
          if(this.echartsData.level=='0'&&this.tabledata[0].items[xIndex].organizations.length>=1){
            this.echartsData.scheduledUpdatesToggle = 2
            //this.echartsData.time=xIndex
            //this.router.navigateByUrl(`/statisticanalysis/scheduledUpdates/PublicEcharts?type=${this.route.snapshot.queryParams.type}&TimeType=${this.TimeType}`);
          }else if(this.echartsData.level=='1' &&this.tabledata[0].items[xIndex].organizations.length>=1){
            this.echartsData.scheduledUpdatesToggle = 2//原来是3
          }
        }else{
          this.echartsData.findShow=true
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          if(this.echartsData.level=='2'){
            this.snackBar.open('已经是最后一层!','确定',config);
          }
          
        }
        //this.echartsData.scheduledUpdatesToggle = 2
        this.echartsData.scheduledUpdatesXName=option.xAxis.data[xIndex]
        
      }
      }
        
        
    });
    this.oneEcharts.setOption(option);

  }

  months:any = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
  echartIds:any = ['one','two','three','four','five','six','seven','eight','nine','ten','eleven','twelve']
  items:any = [{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null}]


}



//未核查组件
@Component({
  selector: 'app-notVerified',
  templateUrl: './notVerified.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class notVerifiedComponent implements OnInit {

  constructor(private router: Router,public echartsData:EchartsDataService) { }

  ngOnInit(): void {
    window.setTimeout(()=>{
      this.oneInit()
    },0)
  }

  ngOnDestroy () {
    this.oneEcharts.dispose()
    this.oneEcharts.clear()
  }

  oneEcharts:any;
  oneInit () {
    this.oneEcharts = echarts.init(document.getElementById('center'), 'skinUpp');
    var option = {
      grid: {
        left:70
      },
      title: {
        text: '未核查',
        subtext: '总数剩余 0',
        left: 'center',
        textStyle:{
          color:'#000',
          fontSize: 30,
        },
        subtextStyle: {color:'#999',fontSize: 15} 
      },
      tooltip: {
        trigger: 'axis',
        formatter:  (params)=>{
          return this.echartsData.tableTooltip(this.echartsData.tableDataZhong,'未核查')
        },
        position:this.echartsData.tableTooltipNoShow2
      },
      legend: {
        data: ['剩余未核查','总数'],
        textStyle: { color: '#000',fontSize: 18}
      },
      xAxis: {
        type: 'value',
        boundaryGap: [0, 0.01],
        axisLabel: {
          textStyle:{
            fontSize :15,
            color:'#000000'
          },
          color: "#000", //刻度线标签颜色
        },
        //设置坐标轴字体颜色和宽度
        axisLine: {    
          lineStyle: {color: "#000",}
        },
      },
      yAxis: {
        type: 'category',
        //设置坐标轴字体颜色和宽度
        axisLine: {    
          lineStyle: {color: "#000"},
        },
        axisLabel: {
          textStyle:{
            fontSize :15,
            color:'#000000'
          },
          color: "#000", //刻度线标签颜色
          formatter: '{value}'
        },
        data: this.echartsData.level=='0'? ['浦东支队','黄浦支队','徐汇支队','长宁支队','静安支队','普陀支队','虹口支队','杨浦支队','闵行支队','宝山支队','嘉定支队','崇明支队','金山支队']
        :['浦东中队','黄浦中队','徐汇中队','长宁中队','静安中队','普陀中队','虹口中队','杨浦中队','闵行中队','宝山中队','嘉定中队','崇明中队','金山中队'],
      },
      series: [
        {
          name: '剩余未核查',
          type: 'bar',
          stack: '差值',
          data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
          itemStyle:{color:'#C80000'},
          label: {
            show: true,
            position: 'insideRight',
            color: '#fff'
          },
        },
        {
          name: '总数',
          type: 'bar',
          stack: '差值',
          data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
          itemStyle:{color:'#999'},
          label: {
            show: true,
            position: 'insideRight',
            color: '#fff'
          },
        },
      ]
    };
    this.oneEcharts.setOption(option);
    this.oneEcharts.on('click', (params) => {
      /* this.echartsData.scheduledUpdatesType = 1
      this.echartsData.scheduledUpdatesName = params.name
      this.echartsData.scheduledUpdatesToggle = 3 */
      /* option.yAxis.data=['浦东中队','黄浦中队','徐汇中队','长宁中队','静安中队','普陀中队','虹口支队','杨浦支队','闵行支队','宝山支队','嘉定支队','崇明支队','金山支队']
      this.oneEcharts.setOption(option); */
    });
  }



}
//支队核查具体月份组件
@Component({
  selector: 'app-yueDate',
  templateUrl: './yueDate.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class yueDateComponent implements OnInit {

  constructor(public router: ActivatedRoute,public echartsData:EchartsDataService,public route:Router) { }

  level:string;
  ngOnInit(): void {
    //console.log(this.echartsData.scheduledUpdatesToggle)
    this.router.queryParams.subscribe(param=>{
      this.level=param.level
     }); 
     
    window.setTimeout(()=>{
      this.getechartsdata()
      
    },0)
  }

  ngOnDestroy () {
    this.oneEcharts.dispose()
    this.oneEcharts.clear()
  }
  zhiNameData = []
  //buildingData=["高层","地下","轨道交通","化工生产","储罐类","厂房","古建筑","商市场","医院","学校","宾馆","娱乐场所","餐饮业","影剧院","展览建筑","隧道"]

  //获取后端数据
  tabledata
  organizationId=[]
  ynum=[]
  OrganizationIds=''//点击的组织
  async getechartsdata(){
    if(this.router.snapshot.queryParams.pieid!='pieTwo'){
      let Parameters={
        MaintainedState:this.router.snapshot.queryParams.type,
        TimeType:this.echartsData.TimeType,
        TimeStart:this.echartsData.scheduledUpdatesXName+'-01',
        TimeEnd:this.echartsData.scheduledUpdatesXName+'-12',
        OrganizationId:this.OrganizationIds
      }
      //console.log(this.echartsData.zhiorBuinding)
        await this.echartsData.getData(Parameters,this.echartsData.zhiorBuinding=='zhi'? `/api/StatisticsAnalysis/Companies/Maintained/OrganizationTrend`:`/api/StatisticsAnalysis/Companies/Maintained/BuildingTypeTrend`)
        this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate))
        console.log(this.tabledata)
        this.zhiNameData=[]
        this.ynum=[]
        this.organizationId=[]
        this.tabledata[0].items[0].organizations.forEach(element => {
          this.zhiNameData.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationName:element.buildingTypeName)
          this.ynum.push(element.count)
          this.organizationId.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationId:element.buildingTypeId)
          //this.ydatayue.push(element.count)
        });
      this.tiaoshiPao=this.echartsData.qipao(this.tiaoshiPao,this.ynum,this.zhiNameData)
      this.twoInit()
    }else{
      let Parameters={
        MaintenanceState:this.router.snapshot.queryParams.type,
        //TimeEnd:this.echartsData.TimeType==0?selectEndYear+'-'+selectEndMonth:selectEndYear,
        OrganizationId:this.OrganizationIds
      }
      await this.echartsData.getData(Parameters,this.echartsData.zhiorBuinding=='zhi'? `/api/StatisticsAnalysis/Companies/Maintenance`:`/api/StatisticsAnalysis/Plans/Maintenance`)
        this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate))
        console.log(this.tabledata)
        this.zhiNameData=[]
        this.ynum=[]
        this.organizationId=[]
        if(this.router.snapshot.queryParams.type=='1'){
          this.tabledata[0].unMaintainCount.organizationCounts.forEach(element => {
            this.zhiNameData.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationName:element.buildingTypeName)
            this.ynum.push(element.count)
            this.organizationId.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationId:element.buildingTypeId)
            //this.ydatayue.push(element.count)
          });
        }else if(this.router.snapshot.queryParams.type=='2'){
          this.tabledata[0].maintainedCount.organizationCounts.forEach(element => {
            this.zhiNameData.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationName:element.buildingTypeName)
            this.ynum.push(element.count)
            this.organizationId.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationId:element.buildingTypeId)
            //this.ydatayue.push(element.count)
          });
        }else if(this.router.snapshot.queryParams.type=='3'){
          this.tabledata[0].maintainingCount.organizationCounts.forEach(element => {
            this.zhiNameData.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationName:element.buildingTypeName)
            this.ynum.push(element.count)
            this.organizationId.push(this.echartsData.zhiorBuinding=='zhi'? element.organizationId:element.buildingTypeId)
            //this.ydatayue.push(element.count)
          });
        }
        
      this.tiaoshiPao=this.echartsData.qipao(this.tiaoshiPao,this.ynum,this.zhiNameData)
      this.twoInit()
    }
    
  }
  tiaoshiPao:any
  //气泡提示数据获取
  bianli(){
    var arrshuzu='[';
    for(var i=0;i<this.ynum.length;i++){
      arrshuzu+='{"value":'+this.ynum[i]+',"coord":['+i+','+this.ynum[i]+'],"name":'+'"'+this.zhiNameData[i]+'"'+'},'
    }
    
    arrshuzu=arrshuzu.substring(0,arrshuzu.length-1)
    arrshuzu+=']'
    this.tiaoshiPao=JSON.parse(arrshuzu)
    //return tishiPao
  }
  
  oneEcharts:any;
  twoInit () {
      this.oneEcharts = echarts.init(document.getElementById("center"), 'skinUpp');
      var option = {
        title: {
          text:this.router.snapshot.queryParams.pieid=='pieTwo'?'': this.echartsData.scheduledUpdatesXName+`已核查总数:(${this.tabledata[0].totalCount})`,
          top: -4,
          left: '35%',
          textStyle:{
            color:'#000',
            fontSize: 30,
          }
        },
        
        grid: {
          containLabel:true,
          top:80,
         // top: 10
      },
        //提示框
        tooltip: {
          trigger: 'axis',
          textStyle:{
            fontSize :18
          },
          formatter:  (params)=>{
            console.log(params)
            if(params[0].axisValue.indexOf('救援站')==-1){
              if(this.router.snapshot.queryParams.pieid=='pieTwo'){
                return this.echartsData.zhiorBuinding=='zhi'? this.echartsData.weihuTooltipRight(params,this.router.snapshot.queryParams.type):''
              }else{
                return this.echartsData.zhiorBuinding=='zhi'? this.echartsData.weihuTooltip(params):''
              }
            }
            
            
            //return this.echartsData.zhiorBuinding=="zhi"?this.echartsData.tableTooltip(this.echartsData.tableDataZhi,params[0].name):this.echartsData.tableTooltip(this.echartsData.buildingType,params[0].name)
          },
          position:this.echartsData.tableTooltipNoShow2
        },
        legend: {
          right:10,
          data: this.echartsData.zhuXname,
          textStyle: { fontSize :16,color: '#000' }
        },
        xAxis: {
          id:this.organizationId,
          axisLabel: {
            textStyle:{
              fontSize :15,
              color:'#000000'
            },
            color: "#000", //刻度线标签颜色
            interval: 0,
            rotate:28,
          },
          //设置坐标轴字体颜色和宽度
          axisLine: {    
            lineStyle: {color: "#000",}
          },
          type: 'category',
          data:this.zhiNameData,
          axisPointer: {type: 'shadow'}
        },
        yAxis: 
          {
            //设置坐标轴字体颜色和宽度
            axisLine: {    
              lineStyle:{
                color:'#000000'
              }
            },
            type: 'value',
            axisLabel: {
              textStyle:{
                fontSize :18,
                color:'#000000'
              },
              color: "#000", //刻度线标签颜色
              formatter: '{value}'
            }
          },
          // {
          //   //设置坐标轴字体颜色和宽度
          //   axisLine: {    
          //     lineStyle: {color: "#000"},
          //   },
          //   type: 'value',
          //   name: '个',
          //   axisLabel: {
          //     color: "#000", //刻度线标签颜色
          //     formatter: '{value}'
          //   }
          // }
        
        series: [
          {
            //name: this.echartsData.zhuXname[1],
            type: 'bar',
            //stack: '总数',
            data: this.ynum,
            barWidth :'38',
            backgroundStyle: {
              color: 'rgba(220, 220, 220, 0.8)'
          },
          markPoint: {
            data: this.tiaoshiPao
        },
          },
          
          
        ]
      };
      this.oneEcharts.setOption(option);
      /* this.items[index].echart.on('click', (params) => {
        let xIndex=this.items[index].echart.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
        this.echartsData.scheduledUpdatesType = 0
        this.echartsData.scheduledUpdatesName = this.months[index]
        this.echartsData.scheduledUpdatesToggle = false
        this.echartsData.scheduledUpdatesXName=params.name
        console.log(this.echartsData.scheduledUpdatesXName)
      }); */
      this.oneEcharts.getZr().on('click', (params) => {

        const pointInPixel= [params.offsetX, params.offsetY];
      if (this.oneEcharts.containPixel('grid',pointInPixel)) {
        let xIndex=this.oneEcharts.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
        /*事件处理代码书写位置*/
        if(this.echartsData.zhiorBuinding=='zhi'&&this.router.snapshot.queryParams.pieid=='pie'){
          this.OrganizationIds=option.xAxis.id[xIndex]
          this.getechartsdata()
          if(this.tabledata[0].items.length>=1){
            this.oneEcharts.dispose()
            this.oneEcharts.clear()
            //this.getechartsdata()
          }

          /* this.echartsData.scheduledUpdatesType = 0
          this.echartsData.scheduledUpdatesName = option.xAxis.data[xIndex]
          this.echartsData.scheduledUpdatesToggle = 3
          console.log(option.xAxis.id[xIndex]) */
        }else if(this.echartsData.zhiorBuinding=='zhi'&&this.router.snapshot.queryParams.pieid=='pieTwo'){
          this.OrganizationIds=option.xAxis.id[xIndex]
          //console.log(xIndex,option.xAxis.id[xIndex],this.organizationId)
           this.getechartsdata()
           if((this.router.snapshot.queryParams.type=='1'&&this.tabledata[0].unMaintainCount.organizationCounts.length>=1)
           ||(this.router.snapshot.queryParams.type=='2'&&this.tabledata[0].maintainedCount.organizationCounts.length>=1)
           ||(this.router.snapshot.queryParams.type=='3'&&this.tabledata[0].maintainingCount.organizationCounts.length>=1)){
           this.oneEcharts.dispose()
           this.oneEcharts.clear()
          //this.getechartsdata()
        }
           
        }
        
      }
        
      });
      
    
  }



}

//建筑类型核查具体月份组件
@Component({
  selector: 'app-yuebuildingDate',
  templateUrl: './yuebuildingDate.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class yuebuildingDateComponent implements OnInit {

  constructor(public router: ActivatedRoute,public echartsData:EchartsDataService,public route:Router) { }

  level:string;
  ngOnInit(): void {
    this.router.queryParams.subscribe(param=>{
      this.level=param.level
     }); 
     
    window.setTimeout(()=>{
      this.twoInit()
    },0)
  }

  ngOnDestroy () {
    this.oneEcharts.dispose()
    this.oneEcharts.clear()
  }
  zhiNameData = ["浦东支队","黄浦支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"]
  buildingData=["高层","地下","轨道交通","化工生产","储罐类","厂房","古建筑","商市场","医院","学校","宾馆","娱乐场所","餐饮业","影剧院","展览建筑","隧道"]

  //获取后端数据
  tabledata
  async getechartsdata(selectStartYear,selectStartMonth,selectEndYear,selectEndMonth){
    let Parameters={
      MaintainedState:this.router.snapshot.queryParams.type,
      TimeType:this.echartsData.TimeType,
      TimeStart:this.echartsData.scheduledUpdatesXName,
      //TimeEnd:this.echartsData.TimeType==0?selectEndYear+'-'+selectEndMonth:selectEndYear,
      //OrganizationId
    }
    console.log(this.echartsData.zhiorBuinding)
    if(this.echartsData.zhiorBuinding=="zhi"){
      await this.echartsData.getData(Parameters,`/api/StatisticsAnalysis/Companies/Maintained/OrganizationTrend`)
      this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata)
      this.zhiNameData=[]
      /* this.ydatayue=[]
      this.tabledata[0].items.forEach(element => {
      this.zhiNameData.push(element.date)
      this.ydatayue.push(element.count)
    }); */
    }else{
      await this.echartsData.getData(Parameters,`/api/StatisticsAnalysis/Companies/Maintained/BuildingTypeTrend`)
      this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate))
      console.log(this.tabledata)
      /* this.xdatayue=[]
      this.ydatayue=[]
      this.tabledata[0].items.forEach(element => {
      this.xdatayue.push(element.date)
      this.ydatayue.push(element.count)
    }); */
    }
    
    //this.oneInit(this.xdatayue,this.ydatayue)
  }
  oneEcharts:any;
  twoInit () {
      this.oneEcharts = echarts.init(document.getElementById("center"), 'skinUpp');
      var option = {
        title: {
          text: this.echartsData.scheduledUpdatesXName+'已核查总数:(0)',
          top: -4,
          left: '35%',
          textStyle:{
            color:'#000',
            fontSize: 30,
          }
        },
        //提示框
        tooltip: {
          trigger: 'axis',
          textStyle:{
            fontSize :18
          }
        },
        legend: {
          data: this.echartsData.zhuXname,
          textStyle: { fontSize :16,color: '#000' }
        },
        xAxis: [{
          axisLabel: {
            textStyle:{
              fontSize :18,
              color:'#000000'
            },
            color: "#000", //刻度线标签颜色
            interval: 0
          },
          //设置坐标轴字体颜色和宽度
          axisLine: {    
            lineStyle: {color: "#000",}
          },
          type: 'category',
          data:this.buildingData,
          axisPointer: {type: 'shadow'}
        }],
        yAxis: [
          {
            //设置坐标轴字体颜色和宽度
            axisLine: {    
              lineStyle:{
                color:'#000000'
              }
            },
            type: 'value',
            axisLabel: {
              interval:0, //坐标刻度之间的显示间隔，默认就可以了（默认是不重叠）
              rotate:38 ,  //调整数值改变倾斜的幅度（范围-90到90）
              textStyle:{
                fontSize :18,
                color:'#000000'
              },
              color: "#000", //刻度线标签颜色
              formatter: '{value}'
            }
          },
          // {
          //   //设置坐标轴字体颜色和宽度
          //   axisLine: {    
          //     lineStyle: {color: "#000"},
          //   },
          //   type: 'value',
          //   name: '个',
          //   axisLabel: {
          //     color: "#000", //刻度线标签颜色
          //     formatter: '{value}'
          //   }
          // }
        ],
        
        series: [
          {
            name: this.echartsData.zhuXname[1],
            type: 'bar',
            stack: '总数',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            barWidth :'38',
          },
          {
            name: this.echartsData.zhuXname[2],
            type: 'bar',
            stack: '总数',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,0,0,0],
            itemStyle:{color: '#626c91'}
          },
          {
            name: this.echartsData.zhuXname[3],
            type: 'bar',
            stack: '总数',
            data:[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,0,0,0],
            itemStyle:{color:'#c4ebad'}
          },
          {
            name: this.echartsData.zhuXname[0],
            type: 'line',
            // yAxisIndex: 1,
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,0,0,0],
            itemStyle:{color: '#FFDC35'}
          },
          /* {
            name: '平均值2倍',
            type: 'line',
            // yAxisIndex: 1,
            data: [98, 90, 106, 94, 98, 86, 96, 82, 76, 78, 82, 86, 74],
            itemStyle:{color: '#6be6c1'}
          },
          {
            name: '平均值3倍',
            type: 'line',
            // yAxisIndex: 1,
            data: [143, 135, 159, 143, 127, 144, 144, 123, 114, 117, 124, 129, 111],
            itemStyle:{color: '#999'}
          }, */
        ]
      };
      this.oneEcharts.setOption(option);
      /* this.items[index].echart.on('click', (params) => {
        let xIndex=this.items[index].echart.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
        this.echartsData.scheduledUpdatesType = 0
        this.echartsData.scheduledUpdatesName = this.months[index]
        this.echartsData.scheduledUpdatesToggle = false
        this.echartsData.scheduledUpdatesXName=params.name
        console.log(this.echartsData.scheduledUpdatesXName)
      }); */
      this.oneEcharts.getZr().on('click', (params) => {

        const pointInPixel= [params.offsetX, params.offsetY];
      if (this.oneEcharts.containPixel('grid',pointInPixel)) {
        let xIndex=this.oneEcharts.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
        /*事件处理代码书写位置*/
        this.echartsData.scheduledUpdatesType = 0
        //console.log(option.xAxis[0].data[xIndex])
        this.echartsData.scheduledUpdatesXName+= option.xAxis[0].data[xIndex]
        
        if(this.echartsData.level=='0'){
          this.echartsData.scheduledUpdatesToggle = 2
        }else if(this.echartsData.level=='1'){
          this.echartsData.scheduledUpdatesToggle = 3
        }
        //this.echartsData.scheduledUpdatesXName=option.xAxis.data[xIndex]
      }
        
      });
      
    
  }



}

//echarts详情组件
@Component({
  selector: 'app-detailedInformation',
  templateUrl: './detailedInformation.html',
  styleUrls: ['../state/page-two-time/page-two-time.component.scss']
})
export class detailedInformationComponent implements OnInit {

  constructor(private router: Router,public echartsData:EchartsDataService) { }

  ngOnInit(): void {
    window.setTimeout(()=>{
      this.oneInit()
    },0)
  }

  ngOnDestroy () {
    this.example.dispose()
    this.example.clear()
  }
  zhiNameData = ["浦东支队","黄浦支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"]
  buildingData=["高层","地下","轨道交通","化工生产","储罐类","厂房","古建筑","商市场","医院","学校","宾馆","娱乐场所","餐饮业","影剧院","展览建筑","隧道"]

  example:any;
  oneInit () {
    this.example = echarts.init(document.getElementById('center'), 'skinUpp');
    if (this.echartsData.scheduledUpdatesType ===0) { //已核查
      var option = {
        title: {
          text: `总数（0）`,//${this.echartsData.scheduledUpdatesName}${this.echartsData.scheduledUpdatesXName}
          top: -2,
          right: 655,
          textStyle:{
            color:'#000',
            fontSize: 30,
          }
        },
        //提示框
        tooltip: {
          trigger: 'axis',
          textStyle:{
            fontSize :18
          }
        },
        legend: {
          //data: ['平均值','维护无需修改', '维护修改', '维护通过审核'],
          data:this.echartsData.zhuXname,
          textStyle: { color: '#000',fontSize: 16 },
          right:20
        },
        xAxis: [{
          axisLabel: {
            textStyle:{
              fontSize :18,
              color:'#000000'
            },
            color: "#000", //刻度线标签颜色
          },
          //设置坐标轴字体颜色和宽度
          axisLine: {    
            lineStyle: {color: "#000",}
          },
          type: 'category',
          data: ['浦东中队','黄浦中队','徐汇中队','长宁中队','静安中队','普陀中队','虹口中队','杨浦中队','闵行中队','宝山中队','嘉定中队','崇明中队','金山中队'],
          axisPointer: {type: 'shadow'}
        }],
        yAxis: [
          {
            //设置坐标轴字体颜色和宽度
            axisLine: {    
              lineStyle: {color: "#000"},
            },
            type: 'value',
            axisLabel: {
              textStyle:{
                fontSize :18,
                color:'#000000'
              },
              color: "#000", //刻度线标签颜色
              formatter: '{value}'
            }
          },
        ],
        series: [
          {
            name: this.echartsData.zhuXname[1],
            type: 'bar',
            stack: '总数',
            barWidth :'38',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
          },
          {
            name: this.echartsData.zhuXname[2],
            type: 'bar',
            stack: '总数',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            itemStyle:{color: '#626c91'}
          },
          {
            name: this.echartsData.zhuXname[3],
            type: 'bar',
            stack: '总数',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            itemStyle:{color:'#c4ebad'}
          },
          {
            name: this.echartsData.zhuXname[0],
            type: 'line',
            // yAxisIndex: 1,
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            itemStyle:{color: '#FFDC35'}
          },
          {
            //name: '与上个月环比',
            type: 'line',
            // yAxisIndex: 1,
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0,0, 0, 0, 0],
            //itemStyle:{color: '#6be6c1'},
            
          },
          /* {
               //name: '警报',
               type: 'effectScatter',
               //coordinateSystem: 'cartesian2d',
               data: [[0,0],[0,0],[0,0]], //2d坐标系
               symbolSize:30,
               itemStyle: {
                normal: {
                    color: 'red',
                    shadowBlur: 10,
                    shadowColor: '#333'
                }
            },
               
          }, */
          /* {
            name: '平均值2倍',
            type: 'line',
            // yAxisIndex: 1,
            data: [98, 90, 106, 94, 98, 86, 96, 82, 76, 78, 82, 86, 74],
            itemStyle:{color: '#6be6c1'}
          },
          {
            name: '平均值3倍',
            type: 'line',
            // yAxisIndex: 1,
            data: [143, 135, 159, 143, 127, 144, 144, 123, 114, 117, 124, 129, 111],
            itemStyle:{color: '#999'}
          }, */
        ]
      };
      this.example.setOption(option);
    } else { //未核查
      var options = {
        grid: {
          left:90
        },
        title: {
          text: this.echartsData.scheduledUpdatesName,
          left: 'center',
          textStyle:{
            color:'#000',
            fontSize: 30,
          },
        },
        tooltip: {
          trigger: 'axis',
          textStyle:{
            fontSize: 18
          },
          axisPointer: {
              type: 'shadow'
          }
        },
        legend: {
          data: ['剩余未核查','总数'],
          textStyle: { color: '#000',fontSize: 16 }
        },
        xAxis: {
          type: 'value',
          boundaryGap: [0, 0.01],
          axisLabel: {
            textStyle:{
              fontSize :18,
              color:'#000000'
            },
            color: "#000", //刻度线标签颜色
          },
          //设置坐标轴字体颜色和宽度
          axisLine: {    
            lineStyle: {color: "#000",}
          },
        },
        yAxis: {
          type: 'category',
          //设置坐标轴字体颜色和宽度
          axisLine: {    
            lineStyle: {color: "#000"},
          },
          axisLabel: {
            textStyle:{
              fontSize :18,
              color:'#000000'
            },
            color: "#000", //刻度线标签颜色
            formatter: '{value}'
          },
          data:  ['浦东中队','黄浦中队','徐汇中队','长宁中队','静安中队','普陀中队','虹口中队','杨浦中队','闵行中队','宝山中队','嘉定中队','崇明中队','金山中队'],
        },
        series: [
          {
            name: '剩余未核查',
            type: 'bar',
            stack: '差值',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            itemStyle:{color:'#C80000'},
            label: {
              show: true,
              position: 'insideRight',
              color: '#fff'
            },
          },
          {
            name: '总数',
            type: 'bar',
            stack: '差值',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            itemStyle:{color:'#999'},
            label: {
              show: true,
              position: 'insideRight',
              color: '#fff'
            },
          },
        ]
      };
      this.example.setOption(options);
    }
  }



}



//更多资讯组件
@Component({
  selector: 'app-moreTable',
  templateUrl: './moreTable.html',
  styleUrls: ['./scheduled-updates.component.scss']
})
export class moreTableComponent implements OnInit {

  constructor(private router: Router,public echartsData:EchartsDataService) { }

  ngOnInit(): void {

  }

  displayedColumns: string[]=['team','header','time'];
  dataSource:any = [
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-07',team: '金山支队'},
    {content: '1月份已核查案件 高于平均值', time: '2020-02-07',team: '崇明支队'},
    {content: '1月份已核查案件 高于平均值', time: '2020-02-07',team: '嘉定支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-07',team: '宝山支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-07',team: '闵行支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-07',team: '杨浦支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-05',team: '虹口支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-05',team: '静安支队'},
    {content: '1月份已核查案件 高于平均值', time: '2020-02-05',team: '长宁支队'},
    {content: '1月份已核查案件 高于平均值', time: '2020-02-05',team: '黄浦支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-05',team: '普陀支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-05',team: '徐汇支队'},
    {content: '1月份已核查案件 高于平均值2倍', time: '2020-02-03',team: '浦东支队'}
  ]



}