[删除]新增按年查询页面并实现跳转

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

@@ -4,7 +4,7 @@
  * @Author: sueRimn
  * @Date: 2020-09-02 16:22:58
  * @LastEditors: sueRimn
- * @LastEditTime: 2020-09-07 08:50:58
+ * @LastEditTime: 2020-09-07 13:33:44
  */
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
@@ -28,7 +28,7 @@ export class DeleteFourComponent implements OnInit {
     
     this.route.queryParams.subscribe(param=>{
      this.level=param.level
-      console.log(this.level)
+      //console.log(this.level)
     }); 
     window.setTimeout(()=>{
       this.detailEcharts(this.level)

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

@@ -0,0 +1,24 @@
+<div class="box">
+  <div class="header">
+    <div class="queryField">
+      <form #form="ngForm" (ngSubmit)="Submit(form.value)">
+        <span>查询年份:</span>
+        <mat-form-field>
+          <mat-select [(ngModel)]="selectOneYear" name='selectOneYear'>
+            <mat-option *ngFor="let item of years" [value]="item">{{item}}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <button type="submit" mat-raised-button color="primary">查询</button>
+      </form>
+    </div>
+
+    <div class="btnbox">
+      <button mat-stroked-button (click)="backBtn()">返回</button>
+    </div>
+  </div>
+  <div class="echartsbox">
+    <div id="barEchart">
+    
+    </div>
+  </div>
+</div>

src/app/statistic-analysis/deleteUnit/delete-there-line-details/delete-there-line-details.component.scss

@@ -0,0 +1,76 @@
+.box{
+    width: 100%;
+    height: 92%;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    position: relative;
+    .echartsbox{
+        width: 100%;
+        height: 100%;
+        overflow: auto;
+    }
+    #Line{
+        width: 50%;
+        height: 420px;
+        margin: 50px auto;
+    }
+}
+.publicCss{
+    height: 350px;
+    width: 50%;
+    display: inline-block;
+    box-sizing: border-box;
+    padding: 20px;
+}
+
+//头部搜索栏
+.header {
+    border-bottom: 1px solid #999;
+    height: 80px;
+    min-height: 81px;;
+    box-sizing: border-box;
+    // padding: 0 15px;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items:center;
+    justify-content:center;
+    .queryField {
+      margin: 0 10px;
+      font-size: 14px;
+      .mat-form-field {
+        width: 130px;
+        max-height: 50px;;
+        margin: 0 15px 0 10px;
+      }
+    }
+    .btnbox{
+        height: 80px;
+        display: flex;
+        flex-direction:column;
+        justify-content: space-around;
+        position: fixed;
+        top: 64px;
+        right: 4%;
+        width: 88px;
+        button{
+            width: 88px;
+            height: 36px;
+        }
+
+    }
+  }
+  .echartsbox{
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    #barEchart{
+        width: 60%;
+        height: 350px;
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%,-50%);
+    }
+}

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

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

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

@@ -0,0 +1,197 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
+import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
+import { ActivatedRoute } from '@angular/router';
+import { EchartsDataService } from '../../echarts-data.service';
+declare var echarts: any;
+
+@Component({
+  selector: 'app-delete-there-line-details',
+  templateUrl: './delete-there-line-details.component.html',
+  styleUrls: ['./delete-there-line-details.component.scss']
+})
+export class DeleteThereLineDetailsComponent implements OnInit {
+
+  constructor(private router: Router,public dialog: MatDialog,public snackBar: MatSnackBar,private serviceData: EchartsDataService,public route: ActivatedRoute) { }
+
+  year:String
+  buildingTypeName:String
+  level:String
+  setTimeoutObj//延时器需要清除
+  ngOnInit(): void {
+    this.dateInit ()
+    this.route.queryParams.subscribe(params => {
+      this.year = params['level'];
+      this.buildingTypeName = params['headtext'];
+    });
+    this.setTimeoutObj = window.setTimeout(()=>{
+      this.detailEcharts()
+    })
+  }
+
+  ngOnDestroy(){
+    window.clearTimeout(this.setTimeoutObj);
+    this.detailPlanEchart.clear()
+    this.detailPlanEchart.dispose()
+  }
+
+  selectType:string = 'month'; //选择当前的 查询类型 按月/年
+
+  //查询数据
+  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() //开始年份
+  selectStartMonth:any = 1 //开始月份
+  Submit (e) {
+    
+  }
+  selectStartYear:any = (new Date()).getFullYear() //开始年份
+
+  topTextlabel = {
+    show: true, // 开启显示
+    position: 'top', // 在上方显示
+    distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+    verticalAlign: 'middle',
+    textStyle: { // 数值样式
+      color: 'black',
+      fontSize: 12
+    }
+  }//柱状图数值顶部显示
+  zhongNameData = ["浦东中队","黄埔中队","徐汇中队","长宁中队","静安中队","普陀中队","虹口中队","杨浦中队","闵行中队","宝山中队","嘉定中队"]
+  zhongNumData = [200,190,180,170,160,150,140,130,120,110,100]
+
+  zhiNameData = ["浦东支队","黄埔支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队"]
+  zhiNumData = [300,290,280,270,260,250,240,230,220,210,200]
+
+
+  detailPlanEchart
+  option
+  date = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月']
+  dateNum = [270, 253, 244, 199, 189, 173, 160, 198,200]
+
+  detailEcharts(){
+    this.detailPlanEchart = echarts.init(document.getElementById('barEchart'), 'skinUpp');  
+    this.option = {
+      grid: {
+        top: 50,
+        left:40,
+        right: 20,
+        bottom: 20,
+      },
+      // 标题
+      title: {
+        text: this.buildingTypeName + '(' + this.year + ')',
+        top: -4,
+        left: 'center',
+        textStyle:{
+          //文字颜色
+          color:'#000',
+        }
+      },
+      //提示框
+      tooltip: {
+        trigger: 'axis',
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0',
+        formatter:  (params)=>{
+          if(params[0].seriesName == "year"){
+            return this.serviceData.tableTooltip(this.serviceData.monthTooltip,params[0].name)
+          }else{
+            return this.serviceData.tableTooltip(this.serviceData.tableDataZhi,params[0].name)
+          }
+        },
+        position:this.serviceData.tableTooltipNoShow2
+      },
+      // x轴
+      xAxis: {
+        type: 'category',
+        data: this.date,
+        axisLabel: {
+          color: "#000", //刻度线标签颜色
+        },
+        //设置坐标轴字体颜色和宽度
+        axisLine: {    
+          lineStyle: {
+            color: "#000",
+          },
+        },
+        splitLine: {//分割线配置
+          show:true,
+          lineStyle: {
+            color: '#999',
+          }
+        }
+      },
+      // y轴
+      yAxis: {
+        type: 'value',
+        name: '个',
+        axisLabel: {
+          color: "#000" //刻度线标签颜色
+        },
+         //设置坐标轴字体颜色和宽度
+         axisLine: {
+          lineStyle: {
+            color: "#000",
+          }
+        }
+      },
+      // 数据
+      series: [{
+          name: 'xxx',
+          type: 'line',
+          data: this.dateNum,
+        }
+      ],
+    };
+    this.detailPlanEchart.setOption(this.option);
+    this.detailPlanEchart.getZr().on('click',params=>{
+      const pointInPixel= [params.offsetX, params.offsetY];
+      if (this.detailPlanEchart.containPixel('grid',pointInPixel)) {
+        let xIndex=this.detailPlanEchart.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
+        /*事件处理代码书写位置*/
+        this.router.navigate(['/statisticanalysis/delete_one/delete_there'],{queryParams:{'level':this.option.xAxis.data[xIndex],'headtext':this.buildingTypeName}});
+      }
+    });
+  }
+  //返回按钮
+  backBtn(){
+      window.history.go(-1)
+  } 
+  
+  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/deleteUnit/delete-there/delete-there.component.html

@@ -4,9 +4,9 @@
  * @Author: sueRimn
  * @Date: 2020-09-02 16:22:35
  * @LastEditors: sueRimn
- * @LastEditTime: 2020-09-07 08:41:54
+ * @LastEditTime: 2020-09-07 10:41:43
 -->
-<div class="head">
+<!-- <div class="head">
     <select style="width: 80px;height: 30px; margin-left: 600px;margin-top: 20px;">
         <option value ="2020">2020</option>
       </select>
@@ -25,6 +25,29 @@
       <button type="submit" mat-raised-button color="primary" style="margin-left: 50px;">查询</button>
       <button mat-raised-button (click)='goBack()' style="float: right; margin-top: 20px;margin-right: 50px;">返回</button>
       
+</div> -->
+<div class="header">
+  <div class="queryField">
+    <form #form="ngForm" (ngSubmit)="Submit(form.value)">
+      <span>查询年份:</span>
+      <mat-form-field>
+        <mat-select [(ngModel)]="selectOneYear" name='selectOneYear'>
+          <mat-option *ngFor="let item of years" [value]="item">{{item}}</mat-option>
+        </mat-select>
+      </mat-form-field>
+      <span>查询月份:</span>
+      <mat-form-field>
+        <mat-select [(ngModel)]="selectStartMonth" name='selectStartMonth'>
+          <mat-option *ngFor="let item of selectMonth" [value]="item">{{item}}</mat-option>
+        </mat-select>
+      </mat-form-field>
+      <button type="submit" mat-raised-button color="primary">查询</button>
+    </form>
+  </div>
+
+  <div class="btnbox">
+    <button mat-stroked-button (click)="goBack ()">返回</button>
+  </div>
 </div>
 <div class="zhu">
   <div id="zhidui" ></div>

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

@@ -1,10 +1,47 @@
-.head{
+/* .head{
     //display: flex;
     border-bottom:2px solid #d4dde4;
     width: 100%;
     height: 68px;
     background-color:white ;
-}
+} */
+//头部搜索栏
+.header {
+    border-bottom: 1px solid #999;
+    height: 80px;
+    min-height: 81px;;
+    box-sizing: border-box;
+    // padding: 0 15px;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items:center;
+    justify-content:center;
+    .queryField {
+      margin: 0 10px;
+      font-size: 14px;
+      .mat-form-field {
+        width: 130px;
+        max-height: 50px;;
+        margin: 0 15px 0 10px;
+      }
+    }
+    .btnbox{
+        height: 80px;
+        display: flex;
+        flex-direction:column;
+        justify-content: space-around;
+        position: fixed;
+        top: 64px;
+        right: 4%;
+        width: 88px;
+        button{
+            width: 88px;
+            height: 36px;
+        }
+
+    }
+  }
 .chaxun{
      margin-left: 20px;
      padding: 15px 32px;

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

@@ -4,7 +4,7 @@
  * @Author: sueRimn
  * @Date: 2020-09-02 16:22:35
  * @LastEditors: sueRimn
- * @LastEditTime: 2020-09-05 17:33:47
+ * @LastEditTime: 2020-09-07 13:33:00
  */
 import { Component, OnInit } from '@angular/core';
 import { Router,ActivatedRoute } from '@angular/router';
@@ -23,12 +23,16 @@ export class DeleteThereComponent implements OnInit {
   constructor(private router: Router,private activatedRoute: ActivatedRoute,public echartsData:EchartsDataService,public snackBar: MatSnackBar,private adapter: DateAdapter<any>) { }
   zhutu//echarts实例
   option
+  time:String
+  buildingTypeName:String
+  setTimeoutObj//延时器需要清除
   ngOnDestroy():void{
     this.zhutu.clear()
     this.zhutu.dispose()
   }
 
   ngOnInit(): void {
+    this.dateInit();
     let headtext:string;
     let datayuex:string;
     let headName:string;
@@ -38,14 +42,50 @@ export class DeleteThereComponent implements OnInit {
       headtext=param.headtext
       datayuex=param.level
       headName=headtext+''+datayuex;
-      console.log(headName)
+      //console.log(headName)
     }); 
     window.setTimeout(()=>{
       this.zhuzhuangtu(headName)
     },0)
   }
+  selectType:string = 'month'; //选择当前的 查询类型 按月/年
+  
+
+  //查询数据
+  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)
+    }
+    console.log(this.years)
+  }
+  
+  selectOneYear:any = (new Date()).getFullYear() //开始年份
+  selectStartMonth:any = 1 //开始月份
+  Submit (e) {
+    
+  }
+  selectStartYear:any = (new Date()).getFullYear() //开始年份
+
+
+  topTextlabel = {
+    show: true, // 开启显示
+    position: 'top', // 在上方显示
+    distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+    verticalAlign: 'middle',
+    textStyle: { // 数值样式
+      color: 'black',
+      fontSize: 12
+    }
+  }//柱状图数值顶部显示
   zhiNameData = ["浦东支队","黄埔支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"]
   zhiNumData = [200,190,180,170,160,150,140,130,120,110,100,90,80,70]
+  date = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月','九月']
+  dateNum = [270, 253, 244, 199, 189, 173, 160, 198,200]
   //返回
   goBack () {
     history.go(-1)
@@ -138,6 +178,94 @@ export class DeleteThereComponent implements OnInit {
     }); */
     this.zhutu.setOption(this.option);
   }
+  
+  /*折线图  */
+  detailEcharts(headName:string){
+    this.zhutu = echarts.init(document.getElementById('zhidui'), 'skinUpp');  
+    this.option = {
+      grid: {
+        top: 50,
+        left:40,
+        right: 20,
+        bottom: 20,
+      },
+      // 标题
+      title: {
+        text: `${headName}`,
+        top: -4,
+        left: 'center',
+        textStyle:{
+          //文字颜色
+          color:'#000',
+        }
+      },
+      //提示框
+      tooltip: {
+        trigger: 'axis',
+        backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+        borderWidth:'1',
+        borderRadius :'0',
+        formatter:  (params)=>{
+          /* if(params[0].seriesName == "year"){
+            return this.serviceData.tableTooltip(this.serviceData.monthTooltip,params[0].name)
+          }else{
+            return this.serviceData.tableTooltip(this.serviceData.tableDataZhi,params[0].name)
+          } */
+        },
+       // position:this.serviceData.tableTooltipNoShow2
+      },
+      // x轴
+      xAxis: {
+        type: 'category',
+        data: this.date,
+        axisLabel: {
+          color: "#000", //刻度线标签颜色
+        },
+        //设置坐标轴字体颜色和宽度
+        axisLine: {    
+          lineStyle: {
+            color: "#000",
+          },
+        },
+        splitLine: {//分割线配置
+          show:true,
+          lineStyle: {
+            color: '#999',
+          }
+        }
+      },
+      // y轴
+      yAxis: {
+        type: 'value',
+        name: '个',
+        axisLabel: {
+          color: "#000" //刻度线标签颜色
+        },
+         //设置坐标轴字体颜色和宽度
+         axisLine: {
+          lineStyle: {
+            color: "#000",
+          }
+        }
+      },
+      // 数据
+      series: [{
+          name: 'xxx',
+          type: 'line',
+          data: this.dateNum,
+        }
+      ],
+    };
+    this.zhutu.setOption(this.option);
+    this.zhutu.getZr().on('click',params=>{
+      const pointInPixel= [params.offsetX, params.offsetY];
+      if (this.zhutu.containPixel('grid',pointInPixel)) {
+        let xIndex=this.zhutu.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
+        /*事件处理代码书写位置*/
+        this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_time/three_barDetails'],{queryParams:{'level':'zhidui','time':this.option.xAxis.data[xIndex],'buildingTpye':this.buildingTypeName}});
+      }
+    });
+  }
 
    /* 鼠标悬停提示 */
   tableTooltip2(biaotou:string){

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

@@ -4,7 +4,7 @@
  * @Author: sueRimn
  * @Date: 2020-09-02 16:21:18
  * @LastEditors: sueRimn
- * @LastEditTime: 2020-09-07 09:30:24
+ * @LastEditTime: 2020-09-07 11:31:41
  */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { Router } from '@angular/router';
@@ -281,8 +281,13 @@ export class DeleteTwoComponent implements OnInit {
         const pointInPixel= [params.offsetX, params.offsetY];
       if (this.headZx.containPixel('grid',pointInPixel)) {
         let xIndex=this.headZx.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
-        /*事件处理代码书写位置*/
+        if(this.options.xAxis.data[xIndex]=='2019'||this.options.xAxis.data[xIndex]=='2020'){
-        this.router.navigate(['/statisticanalysis/delete_one/delete_there'],{queryParams:{'level':this.options.xAxis.data[xIndex],'headtext':headtext}});
+          this.router.navigate(['/statisticanalysis/delete_thereLineDetails'],{queryParams:{'level':this.options.xAxis.data[xIndex],'headtext':headtext}});
+        }else{
+          /*事件处理代码书写位置*/
+          this.router.navigate(['/statisticanalysis/delete_one/delete_there'],{queryParams:{'level':this.options.xAxis.data[xIndex],'headtext':headtext}});
+        }
+        
       }
       }
     });

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

@@ -4,7 +4,7 @@
  * @Author: sueRimn
  * @Date: 2020-09-02 16:57:00
  * @LastEditors: sueRimn
- * @LastEditTime: 2020-09-05 13:51:54
+ * @LastEditTime: 2020-09-07 11:19:15
  */
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
@@ -15,6 +15,7 @@ import { PageZhongDuiDetailsComponent } from './state/page-zhong-dui-details/pag
 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 { DeleteThereLineDetailsComponent } from './deleteUnit/delete-there-line-details/delete-there-line-details.component';
 import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
 import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
 import {ScheduledUpdatesComponent,publicEchartsComponent} from './scheduled-updates/scheduled-updates.component'
@@ -40,6 +41,7 @@ const routes: Routes = [
   { path: 'buildingType_one', component: BuildingTypeOneComponent},
   { path: 'delete_two', component: DeleteTwoComponent},
   { path: 'delete_there', component: DeleteThereComponent},
+  { path: 'delete_thereLineDetails', component: DeleteThereLineDetailsComponent},
   { path: 'delete_four', component: DeleteFourComponent},
   { path: 'buildingType_one', component: BuildingTypeOneComponent},
   { path: 'buildingType_one/buildingType_two_forward', component: BuildingTypeTwoForwardComponent},

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

@@ -50,6 +50,7 @@ import { PageZhongDuiDetailsComponent } from './state/page-zhong-dui-details/pag
 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 { DeleteThereLineDetailsComponent } from './deleteUnit/delete-there-line-details/delete-there-line-details.component';
 import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
 import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
 import { ScheduledUpdatesComponent,publicEchartsComponent,verifiedComponent,notVerifiedComponent,detailedInformationComponent,moreTableComponent } from './scheduled-updates/scheduled-updates.component';
@@ -63,11 +64,12 @@ import { AddUnitTwoTimeComponent } from './addUnit/add-unit-two-time/add-unit-tw
 import { AddUnitThreeLineDetailsComponent } from './addUnit/add-unit-three-line-details/add-unit-three-line-details.component';
 import { AddUnitThreeBarDetailsComponent } from './addUnit/add-unit-three-bar-details/add-unit-three-bar-details.component';
 import { HomeComponent } from './home/home.component';
+import { DeleteThereLineDetailsComponent } from './deleteUnit/delete-there-line-details/delete-there-line-details.component';
 
 
 
 @NgModule({
-  declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent, ScheduledUpdatesComponent,publicEchartsComponent,verifiedComponent,notVerifiedComponent,detailedInformationComponent,moreTableComponent, BuildingTypeTwoForwardComponent, BuildingTypeTwoReverseComponent, BuildingTypeThreeDetailsComponent, AddUnitOneComponent, AddUnitTwoTypeStatisticsComponent, AddUnitTwoTypeDetailsComponent, AddUnitTwoTimeComponent,AddUnitThreeLineDetailsComponent,AddUnitThreeBarDetailsComponent, HomeComponent],
+  declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent, ScheduledUpdatesComponent,publicEchartsComponent,verifiedComponent,notVerifiedComponent,detailedInformationComponent,moreTableComponent, BuildingTypeTwoForwardComponent, BuildingTypeTwoReverseComponent, BuildingTypeThreeDetailsComponent, AddUnitOneComponent, AddUnitTwoTypeStatisticsComponent, AddUnitTwoTypeDetailsComponent, AddUnitTwoTimeComponent,AddUnitThreeLineDetailsComponent,AddUnitThreeBarDetailsComponent, HomeComponent, DeleteThereLineDetailsComponent],
   imports: [
     CommonModule,
     StatisticAnalysisRoutingModule,