告警模块

src/main/webapp/app/alarm/alarm-list/alarm-list.component.html

@@ -18,29 +18,53 @@
     <button nz-button nzType="primary"><i class="anticon anticon-arrows-alt"></i></button>
   </div>
 </div>
-
-<div style="margin-bottom: 20px">
-  <nz-select style="width: 200px;" nzShowSearch nzAllowClear nzPlaceHolder="选择级别" [(ngModel)]="selectedValue" (ngModelChange)="select()">
-    <nz-option nzLabel="告警" nzValue="type"></nz-option>
-    <nz-option nzLabel="严重" nzValue="group"></nz-option>
-  </nz-select>
-  <nz-select style="width: 200px;" nzShowSearch nzAllowClear nzPlaceHolder="选择分组" [(ngModel)]="selectedValue" (ngModelChange)="select()">
-    <ng-container *ngFor="let item of groupList;">
-      <nz-option nzLabel="{{item.name}}" nzValue="{{item.id}}"></nz-option>
-    </ng-container>
-  </nz-select>
-  <nz-select style="width: 200px;" nzShowSearch nzAllowClear nzPlaceHolder="选择资源类型" [(ngModel)]="selectedValue" (ngModelChange)="select()">
-    <ng-container *ngFor="let item of warnCountList;">
-      <nz-option nzLabel="{{item.name}}" nzValue="{{item.id}}"></nz-option>
-    </ng-container>
-  </nz-select>
-  <nz-radio-group [(ngModel)]="itemTypeValue" (ngModelChange)="changeType()" [nzButtonStyle]="'solid'">
-    <label nz-radio-button nzValue="1">今天</label>
-    <label nz-radio-button nzValue="2">昨天</label>
-    <label nz-radio-button nzValue="3">三天</label>
-    <label nz-radio-button nzValue="4">一周</label>
-    <label nz-radio-button nzValue="5">自定义</label>
-  </nz-radio-group>
+<div nz-row [nzGutter]="4" class="search-form">
+  <div nz-col nzSpan="3">
+    <nz-select style="width: 100%;" nzShowSearch nzAllowClear nzPlaceHolder="选择级别" [(ngModel)]="obj.priorityName">
+      <nz-option nzLabel="告警" nzValue="告警"></nz-option>
+      <nz-option nzLabel="严重" nzValue="严重"></nz-option>
+    </nz-select>
+  </div>
+  <div nz-col nzSpan="3">
+    <nz-select style="width: 100%;" nzShowSearch nzAllowClear 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%;" nzShowSearch nzAllowClear nzPlaceHolder="选择资源类型" [(ngModel)]="obj.equipmentType" >
+      <ng-container *ngFor="let item of warnCountList;">
+        <nz-option nzLabel="{{item.name}}" nzValue="{{item.name}}"></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>
+      <label nz-radio-button nzValue="2">昨天</label>
+      <label nz-radio-button nzValue="3">三天</label>
+      <label nz-radio-button nzValue="4">一周</label>
+      <label nz-radio-button nzValue="5">自定义</label>
+    </nz-radio-group>
+  </div>
+  <div nz-col nzSpan="8" *ngIf="timeType == '5'">
+    <nz-date-picker
+            nzShowTime
+            [(ngModel)]="obj.startTime"
+            nzPlaceHolder="开始时间"
+    ></nz-date-picker>
+    <nz-date-picker
+            nzShowTime
+            nzFormat="yyyy-MM-dd HH:mm:ss"
+            [(ngModel)]="obj.endTime"
+            nzPlaceHolder="结束时间"
+    ></nz-date-picker>
+  </div>
+</div>
+<div nz-row class="search-form" style="border-top: none;padding: 0 0 15px 0;">
+  <input [(ngModel)]="obj.name" nz-input placeholder="搜索">
+  <button (click)="searchValue()" nz-button nzType="default"><i class="anticon anticon-search"></i>搜索</button>
 </div>
 
 <smart-warn-list #warnList></smart-warn-list>
\ No newline at end of file

src/main/webapp/app/alarm/alarm-list/alarm-list.component.ts

@@ -4,6 +4,7 @@ import {pageSize} from '../../app.constants';
 import {WarnListComponent} from '../../modal/warn-list/warn-list.component';
 import {OverAllService} from '../../overAll/overAll.service';
 import {NzMessageService} from 'ng-zorro-antd';
+import {DatePipe} from '@angular/common';
 
 @Component({
     selector: 'smart-alarm-list',
@@ -33,7 +34,19 @@ export class AlarmListComponent implements OnInit {
     pageNum = 1;
     pageCount = pageSize;
 
-    constructor(public alarmSer: AlarmService,public overAllSer:OverAllService,public message:NzMessageService) {
+    //条件
+    timeType;
+    obj = {
+        priorityName:null,
+        groupid:null,
+        equipmentType:null,
+        startTime:'',
+        endTime:'',
+        name:''
+    };
+
+    constructor(public alarmSer: AlarmService,public overAllSer:OverAllService,public message:NzMessageService,
+                public datePipe:DatePipe) {
     }
 
     ngOnInit() {
@@ -43,8 +56,9 @@ export class AlarmListComponent implements OnInit {
         this.warnList.getList(obj);
     }
 
+    //获取分组
     getWarnGroup(){
-        this.overAllSer.findWarnAll().subscribe(
+        this.overAllSer.findGroup().subscribe(
             (res)=>{
                 if(res.errCode == 10000){
                     this.groupList = res.data;
@@ -53,6 +67,7 @@ export class AlarmListComponent implements OnInit {
         )
     }
 
+    //获取资源类型
     getType(){
         this.overAllSer.findHostWarningCount().subscribe(
             (res)=>{
@@ -65,4 +80,47 @@ export class AlarmListComponent implements OnInit {
         )
     }
 
+    //时间改变
+    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';
+               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';
+                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';
+                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';
+                break;
+            };
+            case'5':{
+                break;
+            };
+        }
+    }
+
+    //查询
+    searchValue(){
+        this.obj.startTime = this.datePipe.transform(this.obj.startTime,'yyyy-MM-dd HH:mm:ss');
+        this.obj.endTime = this.datePipe.transform(this.obj.endTime,'yyyy-MM-dd HH:mm:ss');
+        console.log(this.obj);
+        this.warnList.getList(this.obj);
+    }
 }