[新增]首页对接真实数据

src/app/statistic-analysis/home/home.component.html

@@ -19,18 +19,18 @@
               <div class="progress-item">
                 <div class="progress-name">本年时间进度</div>
                 <div class="progress">
-                  <div class="progress-num">90%</div>
+                  <div class="progress-num">0%</div>
                   <div class="progress-bar">
-                    <div style="width: 90%;" class="progress-bar-inner progress-bar-gradient"></div>
+                    <div style="width: 12%;" class="progress-bar-inner progress-bar-gradient"></div>
                   </div>
                 </div>
               </div>
               <div class="progress-item">
                 <div class="progress-name">年计划完成率</div>
                 <div class="progress">
-                  <div class="progress-num">88%</div>
+                  <div class="progress-num">0%</div>
                   <div class="progress-bar">
-                    <div style="width: 88%;" class="progress-bar-inner progress-bar-gradient"></div>
+                    <div style="width: 12%;" class="progress-bar-inner progress-bar-gradient"></div>
                   </div>
                 </div>
               </div>
@@ -63,10 +63,10 @@
             <div class="item-tit">重点单位总量</div>
             <div class="item-txt" id="number01">{{keyUnitNum}}</div>
           </div>
-          <div class="number-item">
+          <!-- <div class="number-item">
             <div class="item-tit">数据采集总量</div>
             <div class="item-txt" id="number02">{{dataGetNum}}</div>
-          </div>
+          </div> -->
         </div>
         <!-- 图表 -->
         <!-- <div class="panel panel06 mt-mlger">
@@ -92,7 +92,7 @@
                 <div class="total-num">{{twoPlanNum}}</div>
               </div>
               <div class="total-item" (click)="cardPlan()">
-                <div class="total-name">卡片预案总数</div>
+                <div class="total-name">文本预案总数</div>
                 <div class="total-num">{{cardPlanNum}}</div>
               </div>
               <div class="total-item" (click)="otherPlan()">

src/app/statistic-analysis/home/home.component.ts

@@ -15,8 +15,11 @@ export class HomeComponent implements OnInit {
   constructor(private http:HttpClient, private render2: Renderer2,public element: ElementRef,private router: Router,public emitService: EchartsDataService) { }
 
   map:any; //地图
+  yuandata
    ngOnInit() {
-    this.emitService.eventEmit.subscribe((value: any) => {
+    this.level=sessionStorage.getItem("level")
+     this.getechartsdata()
+    /* this.emitService.eventEmit.subscribe((value: any) => {
       if (value == 'echarts') {
         setTimeout(() => {
           this.updateEcharts()
@@ -27,24 +30,49 @@ export class HomeComponent implements OnInit {
       setTimeout(() => {
         this.updateEcharts()
       }, 0);
-    })
+    }) */
 
     window.setTimeout(()=>{
-      this.unitType()
+      /* this.unitType()
       this.unitData()
-      this.keyUnit()
+      this.keyUnit() */
       this.mapInit() //初始化地图
     },0)
   }
 
   //更新echarts视图
-  updateEcharts(){
+  /* updateEcharts(){
     this.planState.resize()
     this.chartDwsjcj.resize()
     this.chartZdgzqy.resize()
 
+  } */
+  //获取数据
+  ordata
+  buildtableData
+  lengthdata=[]//建筑提示数据
+  buildcount=0//建筑总数
+  indexData=[]//建筑所有数据
+  async getechartsdata(){
+    let paramsdata:any = {
+      OrganizationId:this.orid||'',
+      //organizationId:'1'
+    }
+    //获取组织机构数据
+    await this.emitService.getData(paramsdata,`/api/StatisticsAnalysis/Companies`)
+    this.ordata=JSON.parse(JSON.stringify(this.emitService.allDate))
+    console.log(this.ordata)
+    this.keyUnitNum=this.ordata[0].organizationStatistics.totalCount
+    this.unitData()
+    //获取预案状态统计数据
+    await this.emitService.getData(paramsdata,`/api/StatisticsAnalysis/Plans`)
+    this.unitType()
+    //获取建筑类型统计数据
+    await this.emitService.getData(paramsdata,`/api/StatisticsAnalysis/BuildingTypes`)
+    this.keyUnit()
   }
   
+
   threePlan(){
     // this.router.navigate(['/planManagement/entryPlan'])
   }
@@ -64,16 +92,18 @@ export class HomeComponent implements OnInit {
   }
 
   ngOnDestroy(): void {
-    this.planState.clear()
+    /* this.planState.clear()
     this.planState.dispose()
     this.chartDwsjcj.clear()
     this.chartDwsjcj.dispose()
     this.chartZdgzqy.clear()
-    this.chartZdgzqy.dispose()
+    this.chartZdgzqy.dispose() */
     
   }
   //初始化地图
   adcode:any  //行政编码 
+  level//组织级别
+  orid
   mapInit () {
     //创建地图
     this.map = new AMap.Map('chartMap', {
@@ -149,8 +179,19 @@ export class HomeComponent implements OnInit {
           // 更新地图视野以适合区划面
           this.map.setFitView(districtExplorer.getAllFeaturePolygons());
       });
-
+      if(this.level=="0"||this.level=="1"||this.level=="2"){
+        //区域内点击
       districtExplorer.on('featureClick', (e, feature) =>{
+        //console.log(feature)
+        let paramsdata:any ={
+          name:feature.properties.name,
+          level:Number(this.level)+1
+        }
+        this.http.get("/api/Organizations/GetIdByName",{params:paramsdata}).subscribe((data:any)=>{
+          console.log(data)
+          this.orid=data[0]
+          this.getechartsdata()
+        })
         
         let props = feature.properties;
         adcode = props.adcode
@@ -203,20 +244,22 @@ export class HomeComponent implements OnInit {
           this.map.setFitView(districtExplorer.getAllFeaturePolygons());
         });
       
-        this.planState.setOption(this.planStateOptionsZhong);
+        //this.planState.setOption(this.planStateOptionsZhong);
-        this.chartDwsjcj.setOption(this.chartDwsjcjOptionsZhong);
+        //this.chartDwsjcj.setOption(this.chartDwsjcjOptionsZhong);
-        this.chartZdgzqy.setOption(this.chartZdgzqyOptionsZhong);
+        //this.chartZdgzqy.setOption(this.chartZdgzqyOptionsZhong);
-        this.planNum = ["0","0","3","1","6","5"]
+        /* this.planNum = ["0","0","3","1","6","5"]
-        this.keyUnitNum = 666
+        this.keyUnitNum = 666 */
-        this.dataGetNum = 456
+        //this.dataGetNum = 456
 
-        this.threePlanNum = "867"
+        /* this.threePlanNum = "867"
         this.twoPlanNum = "485"
         this.cardPlanNum = "756"
-        this.otherPlanNum = "658"
+        this.otherPlanNum = "658" */
       });
 
       districtExplorer.on('outsideClick', (e) => {
+        this.orid=''
+        this.getechartsdata()
         // console.log('区域外点击');
         let adcode
         if(sessionStorage.getItem("realName") == "上海总队"){
@@ -266,25 +309,27 @@ export class HomeComponent implements OnInit {
           // 更新地图视野以适合区划面
           this.map.setFitView(districtExplorer.getAllFeaturePolygons());
         });
-        this.planState.setOption(this.planStateOptionsZhi);
+        /* this.planState.setOption(this.planStateOptionsZhi);
         this.chartDwsjcj.setOption(this.chartDwsjcjOptionsZhi);
-        this.chartZdgzqy.setOption(this.chartZdgzqyOptionsZhi);
+        this.chartZdgzqy.setOption(this.chartZdgzqyOptionsZhi); */
-        this.planNum = ["0","2","2","6","7","8"]
+        /* this.planNum = ["0","2","2","6","7","8"]
         this.keyUnitNum = 8036
-        this.dataGetNum = 6578
+        this.dataGetNum = 6578 */
 
-        this.threePlanNum = "4374"
+        /* this.threePlanNum = "4374"
         this.twoPlanNum = "9693"
         this.cardPlanNum = "6403"
-        this.otherPlanNum = "2208"
+        this.otherPlanNum = "2208" */
       })
+      }
+      
       
     });
 
 
   }
-  planNum = ["0","2","2","6","7","8"]
+  planNum = []
-  keyUnitNum = 8036
+  keyUnitNum
   dataGetNum = 6578
 
   threePlanNum = "4374"
@@ -302,56 +347,65 @@ export class HomeComponent implements OnInit {
   }
 
   planState
-  planStateOptionsZhi = {
-    title: {
-        text: '预案状态统计（7005份）',
-        left: 'left', 
-        textStyle:{
-          color:'#fff',
-          fontWeight:'normal'
-        }
-    },
-    tooltip: {
-        trigger: 'item',
-        formatter: '{b} : {c} ({d}%)'
-    },
-    series: [
-        {
-          name: '访问来源',
-          type: 'pie',
-          radius: '60%',
-          center: ['50%', '58%'],
-          label:{
-            show:true,
-            //fontSize:10,
-            formatter:'{b}\n{d|{c}份}',
-            rich: {
-              d: {
-                align: 'center',
-              }
-            },
   
-          },
+  
-          data: [
+  //预案状态统计
-              {value: 1585, name: '预案新增'},
+  pagedata
-              {value: 2000, name: '审核通过',itemStyle:{color:'#02A7F0'}},
+  pagedataCount
-              {value: 2600, name: '预案编制'},
+  unitType () {
-              {value: 1500, name: '审核退回'},
+    this.planNum=[]
-              {value: 1800, name: '预案审核中'}
+    this.pagedata=JSON.parse(JSON.stringify(this.emitService.allDate))
-          ],
+    console.log(this.pagedata)
-          emphasis: {
+    this.pagedataCount=String(this.pagedata[0].planStatusStatistics.totalCount)
-              itemStyle: {
+    for(var i=0;i<this.pagedataCount.length;i++){
-                  shadowBlur: 10,
+      this.planNum.push(this.pagedataCount[i])
-                  shadowOffsetX: 0,
+    }
-                  shadowColor: 'rgba(0, 0, 0, 0.5)'
+    //this.planNum.push(this.pagedataCount.split(','))
+    if(this.pagedata[0].planTypeStatistics.planTypes.length<=0){
+      this.threePlanNum='0'
+      this.twoPlanNum='0'
+      this.cardPlanNum='0'
+      this.otherPlanNum='0'
+    }else{
+      this.pagedata[0].planTypeStatistics.planTypes.forEach((value,index,array) => {
+        if(array[index].planTypeName=='Plan2D'){
+          this.twoPlanNum=array[index].count
+        }else if(array[index].planTypeName=='Plan3D'){
+          this.threePlanNum=array[index].count
+        }else if(array[index].planTypeName=='Other'){
+          this.otherPlanNum=array[index].count
+        }else if(array[index].planTypeName=='PlanText'){
+          this.cardPlanNum=array[index].count
         }
+      });
     }
+    if(this.pagedata[0].planCategoryStatistics.planCategories.length<=0){
+      this.aPlan='0'
+      this.bPlan='0'
+      this.cPlan='0'
+      this.dPlan='0'
+      this.ePlan='0'
+    }else{
+      this.pagedata[0].planCategoryStatistics.planCategories.forEach((value,index,array) => {
+        if(array[index].planCategoryName=='LevelOne'){
+          this.aPlan=array[index].count
+        }else if(array[index].planCategoryName=='LevelTwo'){
+          this.bPlan=array[index].count
+        }else if(array[index].planCategoryName=='LevelThree'){
+          this.cPlan=array[index].count
+        }else if(array[index].planCategoryName=='LevelFour'){
+          this.dPlan=array[index].count
+        }else if(array[index].planCategoryName=='LevelFive'){
+          this.ePlan=array[index].count
         }
-    ]
+      });
-  };
+    }
-  planStateOptionsZhong = {
+    
+    
+    /*  */
+    let planStateOptionsZhi = {
       title: {
-        text: '预案状态统计（895份）',
+          text: `预案状态统计（${this.pagedata[0].planStatusStatistics.totalCount}份）`,
           left: 'left', 
           textStyle:{
             color:'#fff',
@@ -370,6 +424,7 @@ export class HomeComponent implements OnInit {
             center: ['50%', '58%'],
             label:{
               show:true,
+              //fontSize:10,
               formatter:'{b}\n{d|{c}份}',
               rich: {
                 d: {
@@ -379,11 +434,11 @@ export class HomeComponent implements OnInit {
               
             },
             data: [
-              {value: 200, name: '预案新增'},
+              {value:this.pagedata[0].planStatusStatistics.planStatuses[0]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[0].count:0, name: '预案新增',type:1,planStatusName:this.pagedata[0].planStatusStatistics.planStatuses[0]!=undefined?this.pagedata[0].planStatusStatistics.planStatuses[0].planStatusName:''},
-              {value: 234, name: '审核通过',itemStyle:{color:'#02A7F0'}},
+              {value:this.pagedata[0].planStatusStatistics.planStatuses[2]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[2].count:0, name: '预案审核通过',type:3,planStatusName:this.pagedata[0].planStatusStatistics.planStatuses[2]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[2].planStatusName:''},
-              {value: 165, name: '预案编制'},
+              {value:this.pagedata[0].planStatusStatistics.planStatuses[4]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[4].count:0, name: '预案编制',type:5,planStatusName:this.pagedata[0].planStatusStatistics.planStatuses[4]!=undefined?this.pagedata[0].planStatusStatistics.planStatuses[4].planStatusName:''},
-              {value: 189, name: '审核退回'},
+              {value:this.pagedata[0].planStatusStatistics.planStatuses[3]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[3].count:0, name: '预案审核退回',type:4,planStatusName:this.pagedata[0].planStatusStatistics.planStatuses[3]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[3].planStatusName:''},
-              {value: 211, name: '预案审核中'}
+              {value:this.pagedata[0].planStatusStatistics.planStatuses[1]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[1].count:0, name: '预案审核中',type:2,planStatusName:this.pagedata[0].planStatusStatistics.planStatuses[1]!=undefined? this.pagedata[0].planStatusStatistics.planStatuses[1].planStatusName:''}
           ],
             emphasis: {
                 itemStyle: {
@@ -395,10 +450,8 @@ export class HomeComponent implements OnInit {
           }
       ]
     };
-  //预案状态统计
-  unitType () {
     this.planState = echarts.init(document.getElementById('chartHynyxf'), 'walden');
-    this.planState.setOption(this.planStateOptionsZhi);
+    this.planState.setOption(planStateOptionsZhi);
     this.planState.on("click",(params) => {
       this.router.navigate(['/statisticanalysis/statePageOne'])
     })
@@ -406,7 +459,11 @@ export class HomeComponent implements OnInit {
 
   //新增、删除单位统计
   chartDwsjcj
-  chartDwsjcjOptionsZhi =  {
+  addtable
+  addxdata=[]
+  addydata=[]
+  chartDwsjcjOptionsZhong =  {
+    // color: ['#FB33C2', '#00CFF0', '#2C3DE0'],
     // 标题
     title: {
       text: '新增、删除单位统计',
@@ -420,7 +477,6 @@ export class HomeComponent implements OnInit {
     grid: {
       left: 30,
       right: 0,
-      bottom:20
     },
     //图例
     legend: {
@@ -436,7 +492,7 @@ export class HomeComponent implements OnInit {
     // x轴
     xAxis: {
       type: 'category',
-      data: ["浦东支队","黄浦支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"],
+      data: ["浦东中队","黄浦中队","徐汇中队","长宁中队","静安中队","普陀中队","虹口中队","杨浦中队","闵行中队","宝山中队","嘉定中队","松江中队","金山中队","崇明中队"],
       axisLabel: {
         interval: 0,
 
@@ -477,7 +533,7 @@ export class HomeComponent implements OnInit {
       {
         name: '新增单位',
         type: 'bar',
-        data: [320, 302, 301, 234, 390, 330, 320, 390, 330, 320, 390, 301, 234, 390 ],
+        data: [88, 45, 95, 105, 75, 89, 69, 110, 96, 90, 80, 78, 94, 102],
         label: {
           show: false,
           position: "top",
@@ -487,7 +543,7 @@ export class HomeComponent implements OnInit {
       }, {
         name: '删除单位',
         type: 'bar',
-        data: [300, 202, 101, 134, 290, 430, 220, 490, 430, 490, 430, 202, 101, 134 ],
+        data: [35, 33, 27, 30, 35, 36, 28, 32, 36, 22, 19, 28, 34, 36],
         label: {
           show: false,
           position: "top",
@@ -497,11 +553,18 @@ export class HomeComponent implements OnInit {
       }
     ],
   };
-  chartDwsjcjOptionsZhong =  {
+  unitData () {
-    // color: ['#FB33C2', '#00CFF0', '#2C3DE0'],
+    this.addxdata=[]
+    this.addydata=[]
+    this.addtable=JSON.parse(JSON.stringify(this.emitService.allDate))
+    this.addtable[0].organizationStatistics.organizations.forEach((value,index,array) => {
+      this.addxdata.push(array[index].organizationName)
+      this.addydata.push(array[index].count)
+    });
+    let chartDwsjcjOptionsZhi =  {
       // 标题
       title: {
-      text: '新增、删除单位统计',
+        text: `新增单位统计(${this.addtable[0].totalCount}家)`,
         left: 0,
         top: 0,
         textStyle:{
@@ -510,16 +573,18 @@ export class HomeComponent implements OnInit {
         },
       },
       grid: {
+        //containLabel:true,
         left: 30,
         right: 0,
+        bottom:30
       },
       //图例
-    legend: {
+      /* legend: {
         top: 0,
-      data: ['新增单位', '删除单位', ],
+        data: ['新增单位' ],
         icon: 'circle',
         itemGap: 20,
-    },
+      }, */
       //提示框
       tooltip: {
         trigger: 'axis',
@@ -527,7 +592,7 @@ export class HomeComponent implements OnInit {
       // x轴
       xAxis: {
         type: 'category',
-      data: ["浦东中队","黄浦中队","徐汇中队","长宁中队","静安中队","普陀中队","虹口中队","杨浦中队","闵行中队","宝山中队","嘉定中队","松江中队","金山中队","崇明中队"],
+        data: this.addxdata,
         axisLabel: {
           interval: 0,
   
@@ -568,42 +633,53 @@ export class HomeComponent implements OnInit {
         {
           name: '新增单位',
           type: 'bar',
-        data: [88, 45, 95, 105, 75, 89, 69, 110, 96, 90, 80, 78, 94, 102],
+          data: this.addydata,
           label: {
             show: false,
             position: "top",
             formatter: '{c}',
             color: "#fff",
+          },
+          barMaxWidth:'20%'
         }
-      }, {
+        /* , {
           name: '删除单位',
           type: 'bar',
-        data: [35, 33, 27, 30, 35, 36, 28, 32, 36, 22, 19, 28, 34, 36],
+          data: [300, 202, 101, 134, 290, 430, 220, 490, 430, 490, 430, 202, 101, 134 ],
           label: {
             show: false,
             position: "top",
             formatter: '{c}',
             color: "#fff",
           }
-      }
+        } */
       ],
     };
-  unitData () {
     this.chartDwsjcj = echarts.init(document.getElementById('chartDwsjcj'),'walden');
-    this.chartDwsjcj.setOption(this.chartDwsjcjOptionsZhi);
+    this.chartDwsjcj.setOption(chartDwsjcjOptionsZhi);
     this.chartDwsjcj.on("click",(params) => {
-      if(params.seriesName == "新增单位"){
       this.router.navigate(['/statisticanalysis/addUnit_one'])
-      }else{
-        this.router.navigate(['/statisticanalysis/delete_one'])
-      }
     })
   }
 
   chartZdgzqy
-  chartZdgzqyOptionsZhi = {
+  
+  
+  //建筑类型统计
+  keyUnit () {
+    this.buildcount=0
+    this.buildtableData=JSON.parse(JSON.stringify(this.emitService.allDate))
+    //console.log(this.buildtableData)
+    for(var i=0;i<this.buildtableData[0].buildingTypes.length;i++){
+      this.lengthdata.push(this.buildtableData[0].buildingTypes[i].buildingTypeName)
+      this.buildcount=this.buildcount+this.buildtableData[0].buildingTypes[i].count
+      this.indexData.push(this.buildtableData[0].buildingTypes[i])
+    }
+    //JSON.parse(JSON.stringify(this.indexData).replace(/buildingTypeName/g, 'name'))
+    this.indexData=this.indexData.map(v=>{return {name: v.buildingTypeName,value:v.count,id:v.buildingTypeId}})
+    let chartZdgzqyOptionsZhi = {
       title: {
-      text: '建筑类型统计（8900家）',
+        text: `建筑类型统计（${this.buildcount}家）`,
         top: -5,
         left: 'left', 
         textStyle:{
@@ -637,24 +713,7 @@ export class HomeComponent implements OnInit {
               }
             },
           },
-        data: [
+          data: this.indexData,
-            {value: 500, name: '高层'},
-            {value: 800, name: '地下'},
-            {value: 900, name: '轨道交通'},
-            {value: 800, name: '化工生产'},
-            {value: 1200, name: '储罐类'},
-            {value: 1500, name: '厂房'},
-            {value: 1400, name: '古建筑'},
-            {value: 600, name: '商市场'},
-            {value: 568, name: '医院'},
-            {value: 888, name: '学校'},
-            {value: 485, name: '宾馆'},
-            {value: 966, name: '娱乐场所'},
-            {value: 789, name: '餐饮业'},
-            {value: 500, name: '影剧院'},
-            {value: 1025, name: '展览建筑'},
-            {value: 600, name: '隧道'}
-        ],
           emphasis: {
             itemStyle: {
               shadowBlur: 10,
@@ -665,78 +724,8 @@ export class HomeComponent implements OnInit {
         }
       ]
     };
-  chartZdgzqyOptionsZhong = {
-    title: {
-      text: '建筑类型统计（1015家）',
-      left: 'left', 
-      textStyle:{
-        color:'#fff',
-        fontWeight:'normal'
-      },
-      top: -3,
-        // textStyle: {
-        //   fontSize:31
-        // }
-    },
-    tooltip: {
-      trigger: 'item',
-      formatter: '{b} : {c}家 ({d}%)'
-    },
-    // legend: {
-    //   orient: 'vertical',
-    //   right: 150,
-    //   top:80,
-    //   data: ['高层', '地下', '轨道交通', '化工生产', '储罐类' , '厂房','古建筑', '商市场', '医院', '学校', '宾馆' , '娱乐场所','餐饮业', '影剧院', '展览建筑' , '隧道']
-    // },
-    series: [
-      {
-        name: '访问来源',
-        type: 'pie',
-        radius: '70%',
-        center: ['50%', '60%'],
-        label:{
-          show:true,
-          // fontSize:13,
-          formatter:'{b}{c}家',
-          rich: {
-            d: {
-              align: 'center',
-            }
-          },
-        },
-        data: [
-            {value: 123, name: '高层'},
-            {value: 105, name: '地下'},
-            {value: 95, name: '轨道交通'},
-            {value: 96, name: '化工生产'},
-            {value: 89, name: '储罐类'},
-            {value: 111, name: '厂房'},
-            {value: 95, name: '古建筑'},
-            {value: 94, name: '商市场'},
-            {value: 85, name: '医院'},
-            {value: 83, name: '学校'},
-            {value: 81, name: '宾馆'},
-            {value: 79, name: '娱乐场所'},
-            {value: 82, name: '餐饮业'},
-            {value: 97, name: '影剧院'},
-            {value: 82, name: '展览建筑'},
-            {value: 72, name: '隧道'}
-        ],
-        emphasis: {
-          itemStyle: {
-            shadowBlur: 10,
-            shadowOffsetX: 0,
-            shadowColor: 'rgba(0, 0, 0, 0.5)'
-          }
-        }
-      }
-    ]
-  };
-  //建筑类型统计
-  keyUnit () {
     this.chartZdgzqy = echarts.init(document.getElementById('chartZdgzqy'), 'walden');
-    
+    this.chartZdgzqy.setOption(chartZdgzqyOptionsZhi);
-    this.chartZdgzqy.setOption(this.chartZdgzqyOptionsZhi);
     this.chartZdgzqy.on("click",(params) => {
       this.router.navigate(['/statisticanalysis/buildingType_one'])
     })