Commit 4f6f6ce6 authored by wangqinghua's avatar wangqinghua

网站监测

parent 5650d831
......@@ -77,7 +77,7 @@
</thead>
<tbody>
<tr *ngFor="let data of logList">
<td class="round-tag">
<td class="round-tag tag-form">
<nz-tag [nzColor]="'#fc0d1b'"></nz-tag>
{{data.subject}}
</td>
......
......@@ -53,7 +53,7 @@
</thead>
<tbody>
<tr *ngFor="let data of setList">
<td class="round-tag">
<td class="round-tag tag-form">
<nz-tag [nzColor]="'#fc0d1b'"></nz-tag>
{{data.name}}
</td>
......
......@@ -24,7 +24,7 @@
<span>当前告警数:120</span>
</div>
</div>
<div class="tag-warn">
<div class="tag-warn tag-form">
<span *ngFor="let item of warnCountList">
<nz-tag *ngIf="item.level == 4 || item.level == 5" [nzColor]="'#fc0d1b'"></nz-tag>
<nz-tag *ngIf="item.level == 2 || item.level == 3" [nzColor]="'#fd9827'"></nz-tag>
......
......@@ -34,7 +34,7 @@
</thead>
<tbody>
<tr *ngFor="let data of sendList">
<td class="round-tag">
<td class="round-tag tag-form">
<nz-tag [nzColor]="'#fc0d1b'"></nz-tag>
{{data.description}}
</td>
......
......@@ -18,7 +18,7 @@
<td class="table-timeline">
<nz-timeline-item>{{data.clock | date:'yyyy-MM-dd HH:MM:ss'}}</nz-timeline-item>
</td>
<td class="round-tag">
<td class="round-tag tag-form">
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" [nzColor]="'#fc0d1b'"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" [nzColor]="'#fd9827'"></nz-tag>
</td>
......
import {Component, OnInit} from '@angular/core';
import {OverAllService} from '../../overAll/overAll.service';
import {NzMessageService} from 'ng-zorro-antd';
@Component({
selector: 'smart-website',
......@@ -14,28 +16,28 @@ export class WebsiteComponent implements OnInit {
validateForm;
steps = [];
constructor() {
constructor(private overAllSer:OverAllService,private message:NzMessageService) {
}
ngOnInit() {
this.initForm();
}
initForm(){
initForm() {
this.steps = [];
this.validateForm = {
name:'',
hostid:null,
applicationid:null,
delay:'',
retries:null,
variables:'',
http_proxy:'',
ssl_cert_file:'',
ssl_key_file:'',
ssl_key_password:'',
steps:this.steps,
}
name: '',
hostid: null,
applicationid: null,
delay: '',
retries: null,
variables: '',
http_proxy: '',
ssl_cert_file: '',
ssl_key_file: '',
ssl_key_password: '',
steps: this.steps,
};
}
showAddModal() {
......@@ -48,14 +50,39 @@ export class WebsiteComponent implements OnInit {
}
handleOk() {
this.isVisible = false;
// this.isVisible = false;
if(this.title == '添加网站监测'){
this.create();
}else{
this.update();
}
}
//创建
create(){
const data = {};
this.overAllSer.createWebscenario(this.validateForm).subscribe(
(res)=>{
if(res.errCode == 10000){
this.message.info('添加成功');
this.initForm();
}else{
this.message.info(res.errMsg);
}
}
)
}
//更新
update(){
}
handleCancel() {
this.isVisible = false;
}
tabsChange(index){
tabsChange(index) {
this.tabNum = index;
}
......
......@@ -9,7 +9,7 @@
<a>综合监控</a>
</nz-breadcrumb-item>
<nz-breadcrumb-item>
基础资源监控
<a routerLink="../basic">基础资源监控</a>
</nz-breadcrumb-item>
<nz-breadcrumb-item>
资源名称
......
......@@ -348,7 +348,7 @@ export class BasicComponent implements OnInit {
nzOkType: 'danger',
nzOnOk: () => {
const data = {params: []};
data.params.push(item.id);
data.params.push(item.groupid);
this.overAllSer.deleteGroup(data).subscribe(
(res) => {
if (res.errCode == 10000) {
......
......@@ -37,10 +37,10 @@
<div nz-col nzSpan="12" class="text-right">
<button nz-button nzType="default" (click)="showAddmodal()"><i class="anticon anticon-plus"></i>添加网站
</button>
<button (click)="openBatchHost(1,'关闭')" nz-button nzType="default"><i
<button (click)="openBatchHost(1,'禁用')" nz-button nzType="default"><i
class="anticon anticon-pause-circle-o"></i>停止监控
</button>
<button (click)="openBatchHost(0,'开启')" nz-button nzType="default"><i class="anticon anticon-play-circle-o"></i>开启监控
<button (click)="openBatchHost(0,'启用')" nz-button nzType="default"><i class="anticon anticon-play-circle-o"></i>开启监控
</button>
<button (click)="batchDeleteConfirm()" nz-button nzType="default"><i class="anticon anticon-close-circle"></i>删除网站
</button>
......@@ -65,7 +65,6 @@
<!--资源分组-->
<ng-container *ngFor="let item of dataSet">
<tr>
<!--子集-->
<td nzShowCheckbox (nzCheckedChange)="selectChecked($event,item)"></td>
<td class="cursor">
<span (click)="goDetail(item)">{{item.name}}</span>
......
......@@ -3,6 +3,7 @@ import {OverAllService} from '../overAll.service';
import {pageSize} from '../../app.constants';
import {WebsiteComponent} from '../../modal/website/website.component';
import {Router} from '@angular/router';
import {NzMessageService, NzModalService} from 'ng-zorro-antd';
@Component({
selector: 'smart-network-check',
......@@ -29,7 +30,10 @@ export class NetworkCheckComponent implements OnInit {
gray: ''
};
constructor(private overAllSer: OverAllService,private router:Router) {
batchSelectList = [];
constructor(private overAllSer: OverAllService,private router:Router,
private modalService:NzModalService,private message:NzMessageService) {
}
ngOnInit() {
......@@ -70,18 +74,82 @@ export class NetworkCheckComponent implements OnInit {
}
//选中
selectChecked(event,item){
if(event){
this.batchSelectList.push(item.httptestid);
}else{
const index = this.batchSelectList.indexOf(item.hostid);
this.batchSelectList.splice(index,1);
}
}
//添加网站
showAddmodal(){
this.smartWebsite.showAddModal();
}
//批量开启or关闭
openBatchHost(status,opreation){
openBatchHost(status,operation){
if(this.batchSelectList.length == 0){
this.message.info('请选择需要'+ operation +'的网站监测');
return false;
}
this.modalService.confirm({
nzTitle: '监控',
nzContent: '确定批量'+operation+'网站监测?',
nzOkText: '确定',
nzCancelText: '取消',
nzOnOk: () => {
const data = {
status:status,
ids:this.batchSelectList
}
this.overAllSer.statusBatch(data).subscribe(
(res) => {
if (res.errCode == 10000) {
this.message.info('修改成功');
this.batchSelectList = [];
this.getwebList();
} else {
this.message.info(res.errMsg);
}
}
);
},
nzOnCancel: () => console.log('Cancel')
});
}
//批量删除
batchDeleteConfirm(){
if(this.batchSelectList.length == 0){
this.message.info('请选择需要删除的网站监测');
return false;
}
this.modalService.confirm({
nzTitle: '删除',
nzContent: '<b style="color: red;">确认要删除所选网站监测吗?</b>',
nzOkText: '确定',
nzOkType: 'danger',
nzOnOk: () => {
const data = {
ids:this.batchSelectList
}
this.overAllSer.deleteBatch(data).subscribe(
(res) => {
if (res.errCode == 10000) {
this.message.info('删除成功');
this.batchSelectList = [];
this.getwebList();
} else {
this.message.info(res.errMsg);
}
}
);
},
nzCancelText: '取消',
nzOnCancel: () => console.log('Cancel')
});
}
}
......@@ -8,8 +8,8 @@
<nz-breadcrumb-item>
<a>综合监控</a>
</nz-breadcrumb-item>
<nz-breadcrumb-item>
网站监测
<nz-breadcrumb-item >
<a routerLink="../networkCheck">网站监测</a>
</nz-breadcrumb-item>
<nz-breadcrumb-item>
网站名称
......@@ -32,56 +32,72 @@
<section>
<div nz-row nzGutter="24">
<div nz-col nzSpan="12">
<div>
<div>
<span>当前状态</span><span>最近一次检查时间</span><span>2013123</span>
</div>
<div nz-row nzGutter="24">
<div nz-col nzSpan="4">状态</div>
<div nz-col nzSpan="4">No.</div>
<div nz-col nzSpan="4">步骤</div>
<div nz-col nzSpan="4">速度</div>
<div nz-col nzSpan="4">响应时间</div>
<div nz-col nzSpan="4">响应代码</div>
</div>
<ng-container *ngFor="let item of nowStatus">
<div nz-row nzGutter="24">
<div nz-col nzSpan="4">{{item.status}}</div>
<div nz-col nzSpan="4">{{item.no}}</div>
<div nz-col nzSpan="4">{{item.name}}</div>
<div nz-col nzSpan="4">{{item.download}}</div>
<div nz-col nzSpan="4">{{item.response}}</div>
<div nz-col nzSpan="4">{{item.response_code}}</div>
</div>
</ng-container>
<div nz-row nzGutter="24">
<div nz-col nzSpan="8">总计</div>
<div nz-col nzSpan="16">No.</div>
</div>
</div>
<nz-card nzTitle="当前状态" [nzExtra]="extraTemplate">
<nz-table #basicTable [nzData]="nowStatus" [nzShowPagination]="false">
<thead>
<tr>
<th>状态</th>
<th>No.</th>
<th>步骤</th>
<th>速度</th>
<th>响应时间</th>
<th>响应代码</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of basicTable.data">
<td>{{data.name}}</td>
<td>{{data.age}}</td>
<td>{{data.address}}</td>
<td>{{data.address}}</td>
<td>{{data.address}}</td>
<td></td>
</tr>
<tr>
<td></td>
<td>总计</td>
<td></td>
<td>68.4ms</td>
<td></td>
<td></td>
</tr>
</tbody>
</nz-table>
</nz-card>
<ng-template #extraTemplate>
<span>最近一次检查时间</span><span>2013123</span>
</ng-template>
</div>
<div nz-col nzSpan="12">
<div>阈值设定</div>
<div nz-row nzGutter="24">
<div nz-col nzSpan="4">级别</div>
<div nz-col nzSpan="4">步骤</div>
<div nz-col nzSpan="4">阈值信息</div>
</div>
<ng-container>
<div nz-row nzGutter="24" *ngFor="let item of triggerList">
<div nz-col nzSpan="4">
<span *ngIf="item.priority ==2 ">故障</span>
<span *ngIf="item.priority ==4 ">危险</span>
</div>
<div nz-col nzSpan="4">{{item.name}}</div>
<div nz-col nzSpan="4">{{item.expression}}</div>
</div>
</ng-container>
<nz-card nzTitle="阈值设定">
<nz-table #basicTable [nzData]="triggerList" [nzShowPagination]="false">
<thead>
<tr>
<th>级别</th>
<th>步骤</th>
<th>阈值信息</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of basicTable.data">
<td>
<span *ngIf="data.priority ==2 ">故障</span>
<span *ngIf="data.priority ==4 ">危险</span>
</td>
<td>{{data.name}}</td>
<td>{{data.expression}}</td>
</tr>
</tbody>
</nz-table>
</nz-card>
</div>
</div>
<div nz-row style="margin: 30px 0;">
<div>
<div style="margin: 30px 0;">
<div nz-row>
<div nz-col [nzSpan]="3">
<span>监测数据图表</span>
</div>
<div nz-col [nzSpan]="8">
<nz-radio-group style="width: 100%;" [nzButtonStyle]="'solid'">
<label nz-radio-button nzValue="1">今天</label>
<label nz-radio-button nzValue="2">昨天</label>
......@@ -90,8 +106,23 @@
<label nz-radio-button nzValue="5">自定义</label>
</nz-radio-group>
</div>
<div>速度</div>
<div>响应时间</div>
</div>
<div nz-row>
<div nz-col [nzSpan]="6">
</div>
<div nz-col [nzSpan]="18">
</div>
</div>
<div nz-row>
<div nz-col [nzSpan]="6">
</div>
<div nz-col [nzSpan]="18">
</div>
</div>
</div>
</section>
</nz-tab>
......
......@@ -237,7 +237,7 @@ export class OverAllService {
//启用禁用网站监测
statusBatch(data): Observable<any>{
return this.http.post(SERVER_API_URL + '/statusBatch' ,data);
return this.http.post(SERVER_API_URL + '/webscenario/statusBatch' ,data);
}
//批量删除网站监测
......
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