workService

src/main/webapp/app/analysis/operation-work/analysis-deal/analysis-deal.component.html

 <!--处理人统计-->
-<nz-spin [nzSpinning]="isLoading">
+<nz-spin>
   <div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
 </nz-spin>
 

src/main/webapp/app/analysis/operation-work/analysis-event/analysis-event.component.html

 <!--事件分类统计-->
-<nz-spin [nzSpinning]="isLoading">
+<nz-spin>
     <div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
 </nz-spin>
 

src/main/webapp/app/analysis/operation-work/analysis-status/analysis-status.component.html

 <!--解决状态统计-->
 <!--处理人统计-->
-<nz-spin [nzSpinning]="isLoading">
+<nz-spin>
   <div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
 </nz-spin>
 

src/main/webapp/app/analysis/resource-alarm/resource-alarm.component.html

@@ -56,12 +56,20 @@
         ></nz-date-picker>
     </div>
 </div>
-<nz-spin [nzSpinning]="isLoading">
-    <div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
-</nz-spin>
+<div nz-row nzGutter="4">
+    <div nz-col nzSpan="12">
+        <nz-spin [nzSpinning]="isLoading">
+            <div echarts [options]="chartTopOption" style="height: 400px;width: 100%"></div>
+        </nz-spin>
+    </div>
+    <div nz-col nzSpan="12">
+        <nz-spin [nzSpinning]="isLoading">
+            <div echarts [options]="charTrendOption" style="height: 400px;width: 100%"></div>
+        </nz-spin>
+    </div>
+</div>
 <h2>常见问题TOP10</h2>
-<nz-table #nzTable [nzData]="inList" [nzLoading]="inLoading" [nzFrontPagination]="false" [nzTotal]="inTotalNum"
-          [nzPageIndex]="inPageNum" [nzPageSize]="inPageCount" (nzPageIndexChange)="inChnagePage($event)">
+<nz-table #nzTable [nzData]="commonList">
     <thead>
     <tr>
         <th nzWidth="20%">资源名称</th>
@@ -72,20 +80,19 @@
     </tr>
     </thead>
     <tbody>
-    <ng-container *ngFor="let item of inList">
-        <tr (click)="getEcharts(item.itemid)">
-            <td>{{item.itemName}}</td>
-            <td>{{item.max | toUtil}}</td>
-            <td>{{item.min | toUtil}}</td>
-            <td>{{item.avg | toUtil}}</td>
-            <td>{{item.avg | toUtil}}</td>
+    <ng-container *ngFor="let item of commonList">
+        <tr>
+            <td>{{item.hostname}}</td>
+            <td>{{item.groupname}}</td>
+            <td>{{item.description}}</td>
+            <td>{{item.priority}}</td>
+            <td>{{item.count}}</td>
         </tr>
     </ng-container>
     </tbody>
 </nz-table>
 <h2>统计报告</h2>
-<nz-table #nzTable1 [nzData]="outList" [nzLoading]="outLoading" [nzFrontPagination]="false" [nzTotal]="outTotalNum"
-          [nzPageIndex]="outPageNum" [nzPageSize]="outPageCount" (nzPageIndexChange)="outChnagePage($event)">
+<nz-table #nzTable1 [nzData]="reportList">
     <thead>
     <tr>
         <th nzWidth="20%">时间</th>
@@ -95,15 +102,37 @@
     </tr>
     </thead>
     <tbody>
-    <ng-container *ngFor="let data of outList">
-        <tr class="cursor" (click)="getEcharts(data.itemid)">
-            <td>{{data.itemName}}</td>
-            <td>{{data.max | toUtil}}</td>
-            <td>{{data.min | toUtil}}</td>
-            <td>{{data.avg | toUtil}}</td>
+    <ng-container *ngFor="let data of reportList">
+        <tr >
+            <td>{{data.dateTime}}</td>
+            <td>{{data.countNumber}}</td>
+            <td>
+                <span class="cursor" (click)="showWarnModal()">{{data.waring}}</span>
+            </td>
+            <td>
+                <span class="cursor" (click)="showErrorModal()"> {{data.error}}</span>
+             </td>
         </tr>
     </ng-container>
     </tbody>
 </nz-table>
+<nz-modal [(nzVisible)]="isVisiable" [nzTitle]="title" [nzFooter]="null" (nzOnCancel)="handleCancel()">
+    <nz-table #nzTable [nzData]="warnList">
+        <thead>
+        <tr>
+            <th nzShowSort>告警名称</th>
+            <th>告警时间</th>
+            <th>告警设备</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr *ngFor="let data of warnList">
+            <td>{{data.hostname}}</td>
+            <td>{{data.description}}</td>
+            <td>{{data.equipmentType}}</td>
+        </tr>
+        </tbody>
+    </nz-table>
+</nz-modal>
 
 

src/main/webapp/app/analysis/resource-usabil/resource-usabil.component.html

@@ -21,19 +21,12 @@
 </div>
 <div nz-row [nzGutter]="4" class="search-form">
   <div nz-col nzSpan="3">
-    <nz-select style="width: 100%;"   nzPlaceHolder="选择分组" [(ngModel)]="obj.groupid" (ngModelChange)="getList()">
+    <nz-select style="width: 100%;"   nzPlaceHolder="选择分组" [(ngModel)]="obj.groupid">
       <ng-container *ngFor="let item of groupList">
         <nz-option nzLabel="{{item.name}}" nzValue="{{item.groupid}}"></nz-option>
       </ng-container>
     </nz-select>
   </div>
-  <div nz-col nzSpan="3">
-    <nz-select style="width: 100%;"   nzPlaceHolder="选择主机资源" [(ngModel)]="obj.hostid" (ngModelChange)="getListIO()">
-      <ng-container *ngFor="let item of hostList;">
-        <nz-option nzLabel="{{item.name}}" nzValue="{{item.hostid}}"></nz-option>
-      </ng-container>
-    </nz-select>
-  </div>
   <div nz-col nzSpan="7">
     <nz-radio-group style="width: 100%;" [(ngModel)]="timeType" (ngModelChange)="changeType()" [nzButtonStyle]="'solid'">
       <label nz-radio-button nzValue="1">今天</label>
@@ -57,28 +50,15 @@
     ></nz-date-picker>
   </div>
 </div>
-<nz-spin [nzSpinning]="isLoading">
-  <div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
-</nz-spin>
-<nz-table #nzTable [nzData]="eventList" [nzLoading]="isLoading">
-  <thead>
-  <tr>
-    <th nzWidth="20%">资源名称</th>
-    <th>所在分组</th>
-    <th>告警名称</th>
-    <th>严重性</th>
-    <th>时间段内发生次数</th>
-  </tr>
-  </thead>
-  <tbody>
-  <ng-container *ngFor="let item of eventList">
-    <tr (click)="getEcharts(item.itemid)">
-      <td>{{item.itemName}}</td>
-      <td>{{item.max | toUtil}}</td>
-      <td>{{item.min | toUtil}}</td>
-      <td>{{item.avg | toUtil}}</td>
-      <td>{{item.avg | toUtil}}</td>
-    </tr>
-  </ng-container>
-  </tbody>
-</nz-table>
\ No newline at end of file
+<div nz-row nzGutter="4">
+  <div nz-col nzSpan="12">
+    <nz-spin>
+      <div echarts [options]="chartTopOption" style="height: 400px;width: 100%"></div>
+    </nz-spin>
+  </div>
+  <div nz-col nzSpan="12">
+    <nz-spin>
+      <div echarts [options]="chartLastOption" style="height: 400px;width: 100%"></div>
+    </nz-spin>
+  </div>
+</div>

src/main/webapp/app/analysis/resource-usabil/resource-usabil.component.ts

@@ -15,8 +15,11 @@ export class ResourceUsabilComponent implements OnInit {
     endTime;
     timeType;
 
-    chartOption;
-    eventList;
+    chartTopOption;
+    topList;
+
+    chartLastOption;
+    lastList;
 
     obj = {
         type: '',
@@ -46,24 +49,81 @@ export class ResourceUsabilComponent implements OnInit {
                 if (res.errCode == 10000) {
                     this.groupList = res.data;
                     this.obj.groupid = this.groupList[0].groupid + '';
-                    this.getEcharts();
+                    this.getTopEcharts();
+                    this.getLastEcharts();
                 }
             }
         );
     }
 
-    //获取图表
-    getEcharts() {
+    //获取Top图表
+    getTopEcharts() {
         this.obj.type = 'top';
         this.analysisSer.findFailureRate(this.obj).subscribe(
             (res) => {
                 if(res.errCode == 10000){
-                    this.eventList = res.data;
+                    this.topList = res.data;
+                    this.setTopEcharts();
                 }
             }
         );
     }
 
+    //设置top图表
+    setTopEcharts(){
+        this.chartTopOption = {
+            xAxis: {
+                type: 'category',
+                data: this.topList.map(e=>{
+                    return e.operateStatusName;
+                })
+            },
+            yAxis: {
+                type: 'value'
+            },
+            series: [{
+                data: this.topList.map(e=>{
+                    return e.num;
+                }),
+                type: 'bar'
+            }]
+        };
+    }
+
+    //获取last图表
+    getLastEcharts() {
+        this.obj.type = 'last';
+        this.analysisSer.findFailureRate(this.obj).subscribe(
+            (res) => {
+                if(res.errCode == 10000){
+                    this.lastList = res.data;
+                    this.setLastEcharts();
+                }
+            }
+        );
+    }
+
+    //设置last图表
+    setLastEcharts(){
+        this.chartLastOption = {
+            xAxis: {
+                type: 'category',
+                data: this.lastList.map(e=>{
+                    return e.operateStatusName;
+                })
+            },
+            yAxis: {
+                type: 'value'
+            },
+            series: [{
+                data: this.lastList.map(e=>{
+                    return e.num;
+                }),
+                type: 'bar'
+            }]
+        };
+    }
+
     //时间改变
     changeType() {
         const nowDate = new Date().getTime();
@@ -106,7 +166,8 @@ export class ResourceUsabilComponent implements OnInit {
             this.obj.startTime = this.datePipe.transform(this.startTime, 'yyyy-MM-dd HH:mm:ss');
             this.obj.endTime = this.datePipe.transform(this.endTime, 'yyyy-MM-dd HH:mm:ss');
         }
-        this.getEcharts();
+        this.getLastEcharts();
+        this.getTopEcharts();
     }
 
 }

src/main/webapp/app/app.main.module.ts

@@ -180,7 +180,7 @@ import {AnalysisStatusComponent} from './analysis/operation-work/analysis-status
         LinkInventoryComponent,
         AnalysisDealComponent,
         AnalysisEventComponent,
-        AnalysisStatusComponent
+        AnalysisStatusComponent,
     ],
     providers:[
         OverAllService,