|
|
@ -16,7 +16,49 @@ |
|
|
|
<img (click)="isEchartsShow()" class="packup" src="../../../assets/images/packup.png" alt=""> |
|
|
|
<img (click)="isEchartsShow()" class="packup" src="../../../assets/images/packup.png" alt=""> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="search" [hidden]="!isEcharts"> |
|
|
|
<div class="chartsbox" [hidden]="!isEcharts"> |
|
|
|
|
|
|
|
<div class="chart"> |
|
|
|
|
|
|
|
<div class="leftbox" style="position: relative;"> |
|
|
|
|
|
|
|
<span class="chartname"> |
|
|
|
|
|
|
|
<img src="../../../assets/images/flower.png" alt=""> |
|
|
|
|
|
|
|
预警类别统计 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<div class="centerContent"> |
|
|
|
|
|
|
|
<div class="numname">预警事件总数</div> |
|
|
|
|
|
|
|
<div class="num">{{num}}</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="piechart" id="piechart"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<nz-spin *ngIf="chartsSpin" nzSimple class="nzspin"></nz-spin> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="rightbox" style="position: relative;"> |
|
|
|
|
|
|
|
<span class="chartname"> |
|
|
|
|
|
|
|
<img src="../../../assets/images/flower.png" alt=""> |
|
|
|
|
|
|
|
近一个月预警统计 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<div class="btnbox"> |
|
|
|
|
|
|
|
<div class="btn" (click)="echartClick('分布')" [ngClass]="{'selectedbtn': selectedType == '分布'}">统计</div> |
|
|
|
|
|
|
|
<div class="rankingBtnbox" (mouseenter)="mouseEnter()" (mouseleave)="mouseleave()"> |
|
|
|
|
|
|
|
<div class="btn" |
|
|
|
|
|
|
|
[ngClass]="{'selectedbtn': (selectedRankingType == '站点排名' || selectedRankingType == '事件排名')}">排名</div> |
|
|
|
|
|
|
|
<div class="btn rankingBtn" *ngIf="isMouseEnter" (click)="echartClick2('站点排名')" |
|
|
|
|
|
|
|
[ngClass]="{'selectedbtn': selectedRankingType == '站点排名'}">油站</div> |
|
|
|
|
|
|
|
<div class="btn rankingBtn" *ngIf="isMouseEnter" (click)="echartClick2('事件排名')" |
|
|
|
|
|
|
|
[ngClass]="{'selectedbtn': selectedRankingType == '事件排名'}">事件</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="barchart" id="barchart"> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<nz-spin *ngIf="chartsSpin" nzSimple class="nzspin"></nz-spin> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="title"> |
|
|
|
|
|
|
|
<app-title [name]="'预警类型统计'"></app-title> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="search"> |
|
|
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
|
|
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
|
|
|
<nz-form-item class="searchParams"> |
|
|
|
<nz-form-item class="searchParams"> |
|
|
|
<nz-form-control> |
|
|
|
<nz-form-control> |
|
|
@ -116,50 +158,6 @@ |
|
|
|
</nz-form-item> |
|
|
|
</nz-form-item> |
|
|
|
</form> |
|
|
|
</form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="chartsbox" [hidden]="!isEcharts"> |
|
|
|
|
|
|
|
<div class="chart"> |
|
|
|
|
|
|
|
<div class="leftbox" style="position: relative;"> |
|
|
|
|
|
|
|
<span class="chartname"> |
|
|
|
|
|
|
|
<img src="../../../assets/images/flower.png" alt=""> |
|
|
|
|
|
|
|
预警类别统计 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<div class="centerContent"> |
|
|
|
|
|
|
|
<div class="numname">预警事件总数</div> |
|
|
|
|
|
|
|
<div class="num">{{num}}</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="piechart" id="piechart"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<nz-spin *ngIf="chartsSpin" nzSimple class="nzspin"></nz-spin> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="rightbox" style="position: relative;"> |
|
|
|
|
|
|
|
<span class="chartname"> |
|
|
|
|
|
|
|
<img src="../../../assets/images/flower.png" alt=""> |
|
|
|
|
|
|
|
近一个月预警统计 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<div class="btnbox"> |
|
|
|
|
|
|
|
<div class="btn" (click)="echartClick('分布')" [ngClass]="{'selectedbtn': selectedType == '分布'}">统计</div> |
|
|
|
|
|
|
|
<div class="rankingBtnbox" (mouseenter)="mouseEnter()" (mouseleave)="mouseleave()"> |
|
|
|
|
|
|
|
<div class="btn" |
|
|
|
|
|
|
|
[ngClass]="{'selectedbtn': (selectedRankingType == '站点排名' || selectedRankingType == '事件排名')}">排名</div> |
|
|
|
|
|
|
|
<div class="btn rankingBtn" *ngIf="isMouseEnter" (click)="echartClick2('站点排名')" |
|
|
|
|
|
|
|
[ngClass]="{'selectedbtn': selectedRankingType == '站点排名'}">油站</div> |
|
|
|
|
|
|
|
<div class="btn rankingBtn" *ngIf="isMouseEnter" (click)="echartClick2('事件排名')" |
|
|
|
|
|
|
|
[ngClass]="{'selectedbtn': selectedRankingType == '事件排名'}">事件</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="barchart" id="barchart"> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<nz-spin *ngIf="chartsSpin" nzSimple class="nzspin"></nz-spin> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="title"> |
|
|
|
|
|
|
|
<app-title [name]="'预警类型统计'"></app-title> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="tablebox"> |
|
|
|
<div class="tablebox"> |
|
|
|
<div class="table"> |
|
|
|
<div class="table"> |
|
|
|
<div nz-row class="th"> |
|
|
|
<div nz-row class="th"> |
|
|
|