Merge branch 'master' of http://39.106.78.171:3000/shaojiahao/ShangHai-YuAn

src/app/app.module.ts

@@ -21,6 +21,7 @@ import { MTokenK1Component } from './m-token-k1/m-token-k1.component' //K1秘钥
 import { CountdownModule } from 'ngx-countdown'; //倒计时插件
 import { GISManagementModule } from './gis-management/gis-management.module';
 
+
 @NgModule({
   declarations: [
     AppComponent,

src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.html

@@ -0,0 +1 @@
+<p>building-type-one works!</p>

src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BuildingTypeOneComponent } from './building-type-one.component';
+
+describe('BuildingTypeOneComponent', () => {
+  let component: BuildingTypeOneComponent;
+  let fixture: ComponentFixture<BuildingTypeOneComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ BuildingTypeOneComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BuildingTypeOneComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-building-type-one',
+  templateUrl: './building-type-one.component.html',
+  styleUrls: ['./building-type-one.component.scss']
+})
+export class BuildingTypeOneComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/statistic-analysis/deleteUnit/delete-four/delete-four.component.html

@@ -0,0 +1 @@
+<p>delete-four works!</p>

src/app/statistic-analysis/deleteUnit/delete-four/delete-four.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteFourComponent } from './delete-four.component';
+
+describe('DeleteFourComponent', () => {
+  let component: DeleteFourComponent;
+  let fixture: ComponentFixture<DeleteFourComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ DeleteFourComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeleteFourComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/statistic-analysis/deleteUnit/delete-four/delete-four.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-delete-four',
+  templateUrl: './delete-four.component.html',
+  styleUrls: ['./delete-four.component.scss']
+})
+export class DeleteFourComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/statistic-analysis/deleteUnit/delete-one/delete-one.component.html

@@ -0,0 +1,9 @@
+<!--
+ * @Descripttion: 
+ * @version: 
+ * @Author: sueRimn
+ * @Date: 2020-09-02 16:15:53
+ * @LastEditors: sueRimn
+ * @LastEditTime: 2020-09-02 16:27:59
+-->
+<div id="indexBzt" style="width: 100%;height: 100%;"></div>

src/app/statistic-analysis/deleteUnit/delete-one/delete-one.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteOneComponent } from './delete-one.component';
+
+describe('DeleteOneComponent', () => {
+  let component: DeleteOneComponent;
+  let fixture: ComponentFixture<DeleteOneComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ DeleteOneComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeleteOneComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/statistic-analysis/deleteUnit/delete-one/delete-one.component.ts

@@ -0,0 +1,23 @@
+/*
+ * @Descripttion: 
+ * @version: 
+ * @Author: sueRimn
+ * @Date: 2020-09-02 16:15:53
+ * @LastEditors: sueRimn
+ * @LastEditTime: 2020-09-02 16:44:32
+ */
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-delete-one',
+  templateUrl: './delete-one.component.html',
+  styleUrls: ['./delete-one.component.scss']
+})
+export class DeleteOneComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/statistic-analysis/deleteUnit/delete-there/delete-there.component.html

@@ -0,0 +1 @@
+<p>delete-there works!</p>

src/app/statistic-analysis/deleteUnit/delete-there/delete-there.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteThereComponent } from './delete-there.component';
+
+describe('DeleteThereComponent', () => {
+  let component: DeleteThereComponent;
+  let fixture: ComponentFixture<DeleteThereComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ DeleteThereComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeleteThereComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/statistic-analysis/deleteUnit/delete-there/delete-there.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-delete-there',
+  templateUrl: './delete-there.component.html',
+  styleUrls: ['./delete-there.component.scss']
+})
+export class DeleteThereComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/statistic-analysis/deleteUnit/delete-two/delete-two.component.html

@@ -0,0 +1 @@
+<p>delete-two works!</p>

src/app/statistic-analysis/deleteUnit/delete-two/delete-two.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteTwoComponent } from './delete-two.component';
+
+describe('DeleteTwoComponent', () => {
+  let component: DeleteTwoComponent;
+  let fixture: ComponentFixture<DeleteTwoComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ DeleteTwoComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeleteTwoComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/statistic-analysis/deleteUnit/delete-two/delete-two.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-delete-two',
+  templateUrl: './delete-two.component.html',
+  styleUrls: ['./delete-two.component.scss']
+})
+export class DeleteTwoComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/statistic-analysis/state/page-one/page-one.component.ts

@@ -47,14 +47,14 @@ export class PageOneComponent implements OnInit {
       },
       tooltip: {
           trigger: 'item',
-           formatter:  (params)=>{
+          formatter:  (params)=>{
-             //console.log(params)
+            return this.biaogeTishi(params.name)
-              return this.biaogeTishi(params.name)
           } ,
           backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
           borderWidth:'1',
           borderRadius :'0'
-          
+
+
       },
       legend: {
           orient: 'vertical',
@@ -101,9 +101,7 @@ export class PageOneComponent implements OnInit {
       ]
     };
     indexBzt.on('click', (params) => {
-      console.log(999)
       this.router.navigateByUrl('/statisticanalysis/statePageTwo_time');
-      // this.router.navigate(["/statisticanalysis/statePageTwo_time"])
     });
   indexBzt.setOption(options);
   }
@@ -125,24 +123,24 @@ export class PageOneComponent implements OnInit {
     shuju+='{"name":"金山支队","number":"65","zhanbi":"0.4%"},{"name":"崇明支队","number":"55","zhanbi":"0.3%"}]'
     var jsonObj =  JSON.parse(shuju);
     var 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:#000000;font-size:30px;text-align: center;display:block;">'+biaotou+'</span></div>'
-               res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px; background:#FFFFFF; color:#000000;border-collapse:collapse;"cellspacing="0"; >';
+        res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px; background:#FFFFFF; color:#000000;border-collapse:collapse;"cellspacing="0"; >';
-               res+='<thead><tr>';
+        res+='<thead><tr>';
-               res+='<td style="text-align:center;width:30%;border:1px solid #000000">名称</td>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">名称</td>';
-               res+='<td style="text-align:center;width:30%;border:1px solid #000000">数量</td>'
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">数量</td>'
-               res+='<td style="text-align:center;width:30%;border:1px solid #000000">总占比</td>'
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">总占比</td>'
-               res+='</tr></thead>'
+        res+='</tr></thead>'
-               res+='<tbody>';
+        res+='<tbody>';
-               for(var i=0;i<jsonObj.length;i++){
+        for(var i=0;i<jsonObj.length;i++){
-                 res+='<tr>'
+          res+='<tr>'
-                 res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].name+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].name+'</td>'
-                 res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].number+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].number+'</td>'
-                 res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].zhanbi+'</td></tr>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].zhanbi+'</td></tr>'
-               }
+        }
-               
+        
-               res+='</tbody>'
+        res+='</tbody>'
-               res+='<tfoot><td style="text-align:center;border:1px solid #000000">总计</td><td style="text-align:center;border:1px solid #000000">1356</td><td style="text-align:center;border:1px solid #000000">19%</td></tfoot>'
+        res+='<tfoot><td style="text-align:center;border:1px solid #000000">总计</td><td style="text-align:center;border:1px solid #000000">1356</td><td style="text-align:center;border:1px solid #000000">19%</td></tfoot>'
-               res+='</table></div></div>'
+        res+='</table></div></div>'
-               return res
+        return res
   }
 
 }

src/app/statistic-analysis/state/page-two-name/page-two-name.component.ts

@@ -78,6 +78,7 @@ export class PageTwoNameComponent implements OnInit {
           fontSize: 23
         }
       },
+      
       xAxis: {
           type: 'category',
           data: this.zhiNameData,
@@ -86,6 +87,15 @@ export class PageTwoNameComponent implements OnInit {
       yAxis: {
           type: 'value'
       },
+      tooltip: {
+        trigger: 'item',
+        formatter:  (params)=>{
+          return this.tableTooltip2(params.name)
+        },
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0'
+      },
       series: [{
           data: this.zhiNumData,
           type: 'bar',
@@ -124,6 +134,15 @@ export class PageTwoNameComponent implements OnInit {
       yAxis: {
           type: 'value'
       },
+      tooltip: {
+        trigger: 'item',
+        formatter:  (params)=>{
+          return this.tableTooltip2(params.name)
+        },
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0'
+      },
       series: [{
           data: this.zhiNumData,
           type: 'bar',
@@ -163,6 +182,15 @@ export class PageTwoNameComponent implements OnInit {
       yAxis: {
           type: 'value'
       },
+      tooltip: {
+        trigger: 'item',
+        formatter:  (params)=>{
+          return this.tableTooltip2(params.name)
+        },
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0'
+      },
       series: [{
           data: this.zhiNumData,
           type: 'bar',
@@ -202,6 +230,15 @@ export class PageTwoNameComponent implements OnInit {
       yAxis: {
           type: 'value'
       },
+      tooltip: {
+        trigger: 'item',
+        formatter:  (params)=>{
+          return this.tableTooltip2(params.name)
+        },
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0'
+      },
       series: [{
           data: this.zhiNumData,
           type: 'bar',
@@ -241,6 +278,15 @@ export class PageTwoNameComponent implements OnInit {
       yAxis: {
           type: 'value'
       },
+      tooltip: {
+        trigger: 'item',
+        formatter:  (params)=>{
+          return this.tableTooltip2(params.name)
+        },
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0'
+      },
       series: [{
           data: this.zhiNumData,
           type: 'bar',
@@ -258,6 +304,7 @@ export class PageTwoNameComponent implements OnInit {
       _this.data.statefulInspectionToggle = false
     });
   }
+  
   //预案状态统计
   planState(){
     var shuju='[{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"}]';
@@ -274,27 +321,46 @@ export class PageTwoNameComponent implements OnInit {
       },
       tooltip: {
         trigger: 'item',
-        formatter: function (params){
+        formatter:  (params)=>{
-             var res = '<div class="tishi" style="background:#FFFFFF"><span style="color:#000000;font-size:25px;padding:10px 10px">预案补充</span>'
+          return this.tableTooltip(params.name)
-             res+='</br><table style="width:100% background:#FFFFFF; color:#000000;border-collapse:collapse;"cellspacing="0" >';
+        },
-             res+='<thead><tr>';
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
-             res+='<td style="border:1px solid #000000">名称</td>';
+        borderWidth:'1',
-             res+='<td style="border:1px solid #000000">数量</td>'
+        borderRadius :'0',
-             res+='<td style="border:1px solid #000000">总占比</td>'
+        position: function (point, params, dom, rect, size) {
-             res+='</tr></thead>'
+          // 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
-             res+='<tbody>';
+          // 提示框位置
-            //  console.log(jsonObj)
+          var x = 0; // x坐标位置
-             for(var i=0;i<jsonObj.length;i++){
+          var y = 0; // y坐标位置
-               res+='<tr>'
+         
-               res+='<td style="border:1px solid #000000">'+jsonObj[i].name+'</td>'
+          // 当前鼠标位置
-               res+='<td style="border:1px solid #000000">'+jsonObj[i].number+'</td>'
+          var pointX = point[0];
-               res+='<td style="border:1px solid #000000">'+jsonObj[i].zhanbi+'</td></tr>'
+          var pointY = point[1];
-             }
+         
-             res+='</tbody>'
+          // 外层div大小
-             res+='</table></div>'
+          // var viewWidth = size.viewSize[0];
-             return res
+          // var viewHeight = size.viewSize[1];
+         
+          // 提示框大小
+          var boxWidth = size.contentSize[0];
+          var boxHeight = size.contentSize[1];
+         
+          // boxWidth > pointX 说明鼠标左边放不下提示框
+          if (boxWidth > pointX) {
+            x = 35;
+          } else { // 左边放的下
+            x = pointX + 80;
+          }
+         
+          // boxHeight > pointY 说明鼠标上边放不下提示框
+          if (boxHeight > pointY) {
+            y = 65;
+          } else { // 上边放得下
+            y = pointY - boxHeight;
+          }
+         
+          return [pointX, pointY];
         }
-
       },
       legend: {
           orient: 'vertical',
@@ -335,4 +401,66 @@ export class PageTwoNameComponent implements OnInit {
     }
     passPlanEchart.setOption(option);
   }
+
+  tableTooltip(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 = '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#000000;font-size:30px;text-align: center;display:block;">'+biaotou+'</span></div>'
+        res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px; background:#FFFFFF; color:#000000;border-collapse:collapse;"cellspacing="0"; >';
+        res+='<thead><tr>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">名称</td>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">数量</td>'
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">总占比</td>'
+        res+='</tr></thead>'
+        res+='<tbody>';
+        for(var i=0;i<jsonObj.length;i++){
+          res+='<tr>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].name+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].number+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].zhanbi+'</td></tr>'
+        }
+        
+        res+='</tbody>'
+        res+='<tfoot><td style="text-align:center;border:1px solid #000000">总计</td><td style="text-align:center;border:1px solid #000000">1356</td><td style="text-align:center;border:1px solid #000000">19%</td></tfoot>'
+        res+='</table></div></div>'
+        return res
+  }
+
+  tableTooltip2(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 = '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#000000;font-size:30px;text-align: center;display:block;">'+biaotou+'</span></div>'
+        res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px; background:#FFFFFF; color:#000000;border-collapse:collapse;"cellspacing="0"; >';
+        res+='<thead><tr>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">名称</td>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">数量</td>'
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">总占比</td>'
+        res+='</tr></thead>'
+        res+='<tbody>';
+        for(var i=0;i<jsonObj.length;i++){
+          res+='<tr>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].name+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].number+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+jsonObj[i].zhanbi+'</td></tr>'
+        }
+        
+        res+='</tbody>'
+        res+='<tfoot><td style="text-align:center;border:1px solid #000000">总计</td><td style="text-align:center;border:1px solid #000000">1356</td><td style="text-align:center;border:1px solid #000000">19%</td></tfoot>'
+        res+='</table></div></div>'
+        return res
+  }
 }

src/app/statistic-analysis/state/page-zhong-dui-details/page-zhong-dui-details.component.ts

@@ -38,6 +38,16 @@ export class PageZhongDuiDetailsComponent implements OnInit {
       yAxis: {
           type: 'value'
       },
+      tooltip: {
+        trigger: 'item',
+        formatter:  (params)=>{
+          console.log(666,params)
+          return this.tableTooltip(params)
+        },
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0'
+      },
       series: [{
           data: this.zhongNumData,
           type: 'bar',
@@ -50,4 +60,29 @@ export class PageZhongDuiDetailsComponent implements OnInit {
     detailPlanEchart.setOption(option);
   }
 
+ 
+  tableTooltip(params:any){
+    var data = [
+      {name:params.name,number:params.value,zhanbi:(params.value/1340 * 100).toFixed(2) + "%"}
+    ]
+    var 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:#000000;font-size:30px;text-align: center;display:block;">'+params.name+'</span></div>'
+        res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px; background:#FFFFFF; color:#000000;border-collapse:collapse;"cellspacing="0"; >';
+        res+='<thead><tr>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">名称</td>';
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">数量</td>'
+        res+='<td style="text-align:center;width:30%;border:1px solid #000000">总占比</td>'
+        res+='</tr></thead>'
+        res+='<tbody>';
+        for(var i=0;i<data.length;i++){
+          res+='<tr>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+data[i].name+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+data[i].number+'</td>'
+          res+='<td style="text-align:center;border:1px solid #000000">'+data[i].zhanbi+'</td></tr>'
+        }
+        
+        res+='</tbody>'
+        // res+='<tfoot><td style="text-align:center;border:1px solid #000000">总计</td><td style="text-align:center;border:1px solid #000000">1356</td><td style="text-align:center;border:1px solid #000000">19%</td></tfoot>'
+        res+='</table></div></div>'
+        return res
+  }
 }

src/app/statistic-analysis/statistic-analysis-routing.module.ts

@@ -4,12 +4,20 @@ import { PageOneComponent } from './state/page-one/page-one.component';
 import { PageTwoNameComponent } from './state/page-two-name/page-two-name.component';
 import { PageTwoTimeComponent } from './state/page-two-time/page-two-time.component';
 import { PageZhongDuiDetailsComponent } from './state/page-zhong-dui-details/page-zhong-dui-details.component';
+import { DeleteOneComponent } from './deleteUnit/delete-one/delete-one.component';
+import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component';
+import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
+import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
+import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
 
 const routes: Routes = [
   { path: 'statePageOne', component: PageOneComponent},
   { path: 'statePageTwo_time', component: PageTwoTimeComponent},
-  { path: 'statePageTwo_name', component: PageTwoNameComponent},
+  { path: 'delete_one', component: DeleteOneComponent},
-  { path: 'statePageTwo_details', component: PageZhongDuiDetailsComponent}
+  { path: 'delete_two', component: DeleteTwoComponent},
+  { path: 'delete_there', component: DeleteThereComponent},
+  { path: 'delete_four', component: DeleteFourComponent},
+  { path: 'buildingType_one', component: BuildingTypeOneComponent}
 ];
 
 @NgModule({

src/app/statistic-analysis/statistic-analysis.module.ts

@@ -47,10 +47,15 @@ import {MatToolbarModule} from '@angular/material/toolbar';
 import {MatTooltipModule} from '@angular/material/tooltip';
 import {MatTreeModule} from '@angular/material/tree';
 import { PageZhongDuiDetailsComponent } from './state/page-zhong-dui-details/page-zhong-dui-details.component';
+import { DeleteOneComponent } from './deleteUnit/delete-one/delete-one.component';
+import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component';
+import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
+import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
+import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
 
 
 @NgModule({
-  declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent],
+  declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent],
   imports: [
     CommonModule,
     StatisticAnalysisRoutingModule,