Skip to content

S
smart
Commit 60d6f195 authored by wangqinghua's avatar wangqinghua
Browse files
Options

workService

parent a9ed6126
Show whitespace changes
Inline Side-by-side
Showing with 303 additions and 134 deletions
src/main/webapp/app/analysis/operation-work/analysis-deal/analysis-deal.component.html
View file @ 60d6f195
<!--处理人统计-->
<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
View file @ 60d6f195
<!--事件分类统计-->
<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
View file @ 60d6f195
<!--解决状态统计-->
<!--处理人统计-->
<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
View file @ 60d6f195
......@@ -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-alarm/resource-alarm.component.ts
View file @ 60d6f195
import { Component, OnInit } from '@angular/core';
import {Component, OnInit} from '@angular/core';
import {AnalysisService} from '../analysis.service';
import {NzMessageService} from 'ng-zorro-antd';
import {DatePipe} from '@angular/common';
......@@ -16,30 +16,39 @@ export class ResourceAlarmComponent implements OnInit {
startTime;
endTime;
groupList;
title;
isVisiable = false;
isLoading = false;
obj = {
priority:"",
groupid:"",
startTime:"",
endTime:"",
priority: null,
groupid: null,
startTime: '',
endTime: '',
};
chartOption;
chartTopOption;
charTrendOption;
commonList
reportList;
pageCount = pageSize;
pageNum = 1;
inList = [];
outList = [];
warnList = [];
constructor(private analysisSer:AnalysisService,private message:NzMessageService,
private datePipe:DatePipe,private overAllSer:OverAllService) { }
constructor(private analysisSer: AnalysisService, private message: NzMessageService,
private datePipe: DatePipe, private overAllSer: OverAllService) {
}
ngOnInit() {
const today = new Date().getTime();
this.obj.startTime = this.datePipe.transform(today, 'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(today, 'yyyy-MM-dd') + ' 23:59:59';
this.getGroup();
}
getData(){
getData() {
this.getAlarmTopEchart();
this.getAlarmTrend();
this.getCommonTop();
......@@ -58,111 +67,202 @@ export class ResourceAlarmComponent implements OnInit {
}
//告警总数TOP10
getAlarmTopEchart(){
getAlarmTopEchart() {
const data = {
groupid:this.obj.groupid,
startTime:this.obj.startTime,
endTime:this.obj.endTime,
priority:this.obj.priority,
groupid: this.obj.groupid,
startTime: this.obj.startTime,
endTime: this.obj.endTime,
priority: this.obj.priority,
};
this.analysisSer.waringCountTop(data).subscribe(
(res)=>{
(res) => {
const data = res.data;
this.setTopEcharts(data);
}
)
);
}
//设置告警总数TOP10 echarts
setTopEcharts(data){
this.chartTopOption = {
xAxis: {
type: 'category',
data: data.map(e=>{
return e.name;
})
},
yAxis: {
type: 'value'
},
series: [{
data: data.map(e=>{
return e.size;
}),
type: 'bar'
}]
};
}
//告警总数趋势
getAlarmTrend(){
getAlarmTrend() {
const data = {
groupid:this.obj.groupid,
startTime:this.obj.startTime,
endTime:this.obj.endTime,
priority:this.obj.priority,
groupid: this.obj.groupid,
startTime: this.obj.startTime,
endTime: this.obj.endTime,
priority: this.obj.priority,
};
this.analysisSer.waringTrend(data).subscribe(
(res)=>{
(res) => {
const data = res.data;
this.setAlarmTrend(data);
}
);
}
//设置告警趋势echarts图表
setAlarmTrend(data) {
this.charTrendOption = {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
legend: {
data:['严重','告警']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: data.map((e) => {
return e.date;
})
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '严重',
type: 'bar',
stack: '严重',
data: data.map(e=>{
return e.errorcount;
})
},
{
name: '告警',
type: 'bar',
stack: '告警',
data: data.map(e=>{
return e.waringcount;
})
}
)
]
};
}
//常发问题TOP10
getCommonTop(){
getCommonTop() {
const data = {
groupid:this.obj.groupid,
startTime:this.obj.startTime,
endTime:this.obj.endTime,
priorityName:this.obj.priority,
groupid: this.obj.groupid,
startTime: this.obj.startTime,
endTime: this.obj.endTime,
priorityName: this.obj.priority,
};
this.analysisSer.commonProblemTop(data).subscribe(
(res)=>{
(res) => {
this.commonList = res.data;
}
)
);
}
//统计报告
getAnalysis(){
getAnalysis() {
const data = {
pageCount:this.pageCount,
pageNum:this.pageNum,
obj:{
startTime:this.obj.startTime,
endTime:this.obj.endTime,
priorityName:this.obj.priority,
pageCount: this.pageCount,
pageNum: this.pageNum,
obj: {
startTime: this.obj.startTime,
endTime: this.obj.endTime,
priorityName: this.obj.priority,
}
};
this.analysisSer.statisticalReport(data).subscribe(
(res)=>{
(res) => {
this.reportList = res.data;
}
)
);
}
//时间改变
changeType(){
changeType() {
const nowDate = new Date().getTime();
let day1,day2;
switch (this.timeType){
case'1':{
this.obj.startTime = this.datePipe.transform(nowDate,'yyyy-MM-dd') +' 00:00:00';
this.obj.endTime = this.datePipe.transform(nowDate,'yyyy-MM-dd') +' 23:59:59';
let day1, day2;
switch (this.timeType) {
case'1': {
this.obj.startTime = this.datePipe.transform(nowDate, 'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(nowDate, 'yyyy-MM-dd') + ' 23:59:59';
break;
}
case'2':{
day1 = nowDate - 1*24*60*60*1000;
this.obj.startTime = this.datePipe.transform(day1,'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(day1,'yyyy-MM-dd') + ' 23:59:59';
case'2': {
day1 = nowDate - 1 * 24 * 60 * 60 * 1000;
this.obj.startTime = this.datePipe.transform(day1, 'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(day1, 'yyyy-MM-dd') + ' 23:59:59';
break;
}
case'3':{
day1 = nowDate - 3*24*60*60*1000;
day2 = nowDate - 1*24*60*60*1000;
this.obj.startTime = this.datePipe.transform(day1,'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(day2,'yyyy-MM-dd') + ' 23:59:59';
case'3': {
day1 = nowDate - 3 * 24 * 60 * 60 * 1000;
day2 = nowDate - 1 * 24 * 60 * 60 * 1000;
this.obj.startTime = this.datePipe.transform(day1, 'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(day2, 'yyyy-MM-dd') + ' 23:59:59';
break;
}
case'4':{
day1 = nowDate - 7*24*60*60*1000;
day2 = nowDate - 1*24*60*60*1000;
this.obj.startTime = this.datePipe.transform(day1,'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(day2,'yyyy-MM-dd') + ' 23:59:59';
case'4': {
day1 = nowDate - 7 * 24 * 60 * 60 * 1000;
day2 = nowDate - 1 * 24 * 60 * 60 * 1000;
this.obj.startTime = this.datePipe.transform(day1, 'yyyy-MM-dd') + ' 00:00:00';
this.obj.endTime = this.datePipe.transform(day2, 'yyyy-MM-dd') + ' 23:59:59';
break;
}
case'5':{
case'5': {
break;
}
}
}
//搜索
search(){
if(this.timeType == '5'){
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');
search() {
if (this.timeType == '5') {
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.getData();
}
//告警弹窗
showWarnModal(){
this.title = '告警明细';
this.isVisiable = true;
}
//严重弹窗
showErrorModal(){
this.title = '严重告警明细';
this.isVisiable = true;
}
handleCancel(){
this.isVisiable = false;
}
}
src/main/webapp/app/analysis/resource-usabil/resource-usabil.component.html
View file @ 60d6f195
......@@ -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
View file @ 60d6f195
......@@ -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
View file @ 60d6f195
......@@ -180,7 +180,7 @@ import {AnalysisStatusComponent} from './analysis/operation-work/analysis-status
LinkInventoryComponent,
AnalysisDealComponent,
AnalysisEventComponent,
AnalysisStatusComponent
AnalysisStatusComponent,
],
providers:[
OverAllService,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment