Skip to content

S
smart
Commit 3b7b3b38 authored by wangqinghua's avatar wangqinghua
Browse files
Options

update

parent ac336ff4
Hide whitespace changes
Inline Side-by-side
Showing with 390 additions and 109 deletions
src/main/webapp/app/modal/website/website.component.html
View file @ 3b7b3b38
<nz-modal [nzWidth]="1080" [(nzVisible)]="isVisible" nzTitle="{{title}}" [nzFooter]="null" (nzOnCancel)="handleCancel()"
(nzOnOk)="handleOk()">
<nz-modal [nzWidth]="1080" [(nzVisible)]="isVisible" nzTitle="{{title}}" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" [nzOkLoading]="isOkLoading">
<nz-tabset [nzSelectedIndex]="tabNum" (nzSelectedIndexChange)="tabsChange($event)" style="padding-bottom: 25px;min-height: 500px">
<nz-tab nzTitle="1.场景">
<div nz-form class="ant-advanced-search-form form-select">
<form nz-form class="ant-advanced-search-form">
<nz-collapse>
<nz-collapse-panel nzHeader="基本属性" [nzActive]="true">
<nz-collapse-panel nzHeader="基本属性" [nzActive]="false">
<div nz-row [nzGutter]="24">
<div nz-col [nzSpan]="12">
<nz-form-item nzFlex>
......@@ -51,7 +50,7 @@
</div>
</nz-collapse-panel>
<nz-collapse-panel nzHeader="高级属性" [nzActive]="true">
<nz-collapse-panel nzHeader="高级属性" [nzActive]="false">
<div nz-row [nzGutter]="24">
<div nz-col [nzSpan]="2">
变量
......@@ -109,27 +108,22 @@
</form>
</div>
<div class="modal-footer-btn">
<button nz-button (click)="handleCancel()" nzType="primary">取消</button>
<button nz-button (click)="tabsChange(1)" nzType="primary">下一步</button>
</div>
</nz-tab>
<nz-tab nzTitle="2.步骤">
<button (click)="addStep()" nz-button nzType="default">添加步骤</button>
<button class="margin-left-5" (click)="addStep()" nz-button nzType="default">添加步骤</button>
<div style="padding: 10px;">
<div nz-row [nzGutter]="24">
<div nz-col [nzSpan]="1">
<div nz-col [nzSpan]="1" class="text-center">
No
</div>
<div nz-col [nzSpan]="3">
<div nz-col [nzSpan]="4">
<span class="color-red">*</span>步骤名称
</div>
<div nz-col [nzSpan]="3">
<div nz-col [nzSpan]="2">
<span class="color-red">*</span>超时
</div>
<div nz-col [nzSpan]="3">
<div nz-col [nzSpan]="5">
<span class="color-red">*</span>URL
</div>
<div nz-col [nzSpan]="3">
......@@ -141,46 +135,124 @@
<div nz-col [nzSpan]="3">
<span class="color-red">*</span>跟随跳转
</div>
<div nz-col [nzSpan]="1">
</div>
<div nz-col [nzSpan]="1"></div>
<div nz-col [nzSpan]="2"></div>
</div>
<div nz-row [nzGutter]="12" *ngFor="let item of steps;let i = index;">
<div nz-col [nzSpan]="1">
{{i +1}}
<ng-container *ngFor="let item of steps;let i = index;">
<div nz-row [nzGutter]="12">
<div nz-col [nzSpan]="1" class="text-center middle">
{{i +1}}
</div>
<nz-form-control nz-col [nzSpan]="4">
<input nz-input placeholder="名称" [(ngModel)]="item.name">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="2">
<input nz-input placeholder="15" [(ngModel)]="item.timeout">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<input nz-input placeholder="" [(ngModel)]="item.url">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="" [(ngModel)]="item.posts">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="200" [(ngModel)]="item.status_codes">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<nz-select style="width: 100%" name="equipmentType" nzPlaceHolder="是否跟随跳转" [(ngModel)]="item.follow_redirects">
<nz-option nzValue="1" nzLabel="是"></nz-option>
<nz-option nzValue="0" nzLabel="否"></nz-option>
</nz-select>
</nz-form-control>
<div nz-col [nzSpan]="1" class="middle">
<span (click)="deleteStep(i)" class="cursor main-color">X</span>
</div>
<div nz-col [nzSpan]="2" (click)="showCon(i)" class="middle main-color cursor">阈值</div>
</div>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="名称" [(ngModel)]="item.name">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="15" [(ngModel)]="item.timeout">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="" [(ngModel)]="item.url">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="" [(ngModel)]="item.posts">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<input nz-input placeholder="200" [(ngModel)]="item.status_codes">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="3">
<nz-select name="equipmentType" nzPlaceHolder="是否跟随跳转" [(ngModel)]="item.follow_redirects">
<nz-option nzValue="1" nzLabel="是"></nz-option>
<nz-option nzValue="0" nzLabel="否"></nz-option>
</nz-select>
</nz-form-control>
<div nz-col [nzSpan]="1">
<span (click)="deleteStep(index)" class="cursor">X</span>
<div class="trigger-class" *ngIf="item.show">
<nz-form-item class="form-select">
<nz-form-control class="form-select">
<div nz-row [nzGutter]="12">
<nz-form-control nz-col [nzPush]="1" [nzSpan]="6">
<button nz-button nzType="primary" nzSize="small" (click)="addcondition(i)">添加条件</button>
<span>危险阈值</span>
</nz-form-control>
</div>
<div nz-row [nzGutter]="12" *ngFor="let fault of item.conditionList;let i1 = index;">
<nz-form-control nz-col [nzSpan]="1"></nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<nz-select name="interfaces_main" nzPlaceHolder="选择接口类型" [(ngModel)]="fault.and" *ngIf="i1 > 0">
<nz-option nzValue=" and " nzLabel="并且"></nz-option>
<nz-option nzValue=" or " nzLabel="或"></nz-option>
</nz-select>
</nz-form-control>
<nz-form-control nz-col [nzSpan]="4">
<nz-select name="interfaces_main" [(ngModel)]="fault.time">
<nz-option nzValue="0" nzLabel="响应时间"></nz-option>
<nz-option nzValue="1" nzLabel="响应代码"></nz-option>
</nz-select>
</nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<nz-select name="interfaces_main" nzPlaceHolder="选择接口类型" [(ngModel)]="fault.equal">
<nz-option nzValue="=" nzLabel="="></nz-option>
<nz-option nzValue=">" nzLabel=">"></nz-option>
<nz-option nzValue="<" nzLabel="<"></nz-option>
</nz-select>
</nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<input type="text" nz-input name="value" [(ngModel)]="fault.value">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="2">
<button nz-button nzType="primary" (click)="deleteCondition(i,i1)"><i style="color: #fff" class="anticon anticon-close-circle-o"></i></button>
</nz-form-control>
</div>
</nz-form-control>
</nz-form-item>
<nz-form-item class="form-select">
<nz-form-control class="form-select">
<div nz-row [nzGutter]="12">
<nz-form-control nz-col [nzPush]="1" [nzSpan]="6">
<button nz-button nzType="primary" nzSize="small" (click)="addFault(i)">添加条件</button>
<span>故障阈值</span>
</nz-form-control>
</div>
<div nz-row [nzGutter]="12" *ngFor="let fault of item.faultConditionList;let i2 = index;">
<nz-form-control nz-col [nzSpan]="1"></nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<nz-select name="interfaces_main" [(ngModel)]="fault.and" *ngIf="i2 > 0">
<nz-option nzValue=" and " nzLabel="并且"></nz-option>
<nz-option nzValue=" or " nzLabel="或"></nz-option>
</nz-select>
</nz-form-control>
<nz-form-control nz-col [nzSpan]="4">
<nz-select name="interfaces_main" [(ngModel)]="fault.time">
<nz-option nzValue="0" nzLabel="响应时间"></nz-option>
<nz-option nzValue="1" nzLabel="响应代码"></nz-option>
</nz-select>
</nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<nz-select name="interfaces_main" nzPlaceHolder="选择接口类型" [(ngModel)]="fault.equal">
<nz-option nzValue="=" nzLabel="="></nz-option>
<nz-option nzValue=">" nzLabel=">"></nz-option>
<nz-option nzValue="<" nzLabel="<"></nz-option>
</nz-select>
</nz-form-control>
<nz-form-control nz-col [nzSpan]="5">
<input type="text" nz-input name="value" [(ngModel)]="fault.value">
</nz-form-control>
<nz-form-control nz-col [nzSpan]="2">
<button nz-button nzType="primary" (click)="deleteFault(i,i2)"><i style="color: #fff" class="anticon anticon-close-circle-o"></i></button>
</nz-form-control>
</div>
</nz-form-control>
</nz-form-item>
<div class="modal-footer-btn">
<button nz-button (click)="closeCon(i,false)" nzType="primary">取消</button>
<button nz-button (click)="closeCon(i,true)" nzType="primary">保存</button>
</div>
</div>
</div>
</ng-container>
</div>
<div class="modal-footer-btn">
<button nz-button (click)="handleCancel()" nzType="primary">取消</button>
<button nz-button (click)="tabsChange(0)" nzType="primary">上一步</button>
<button nz-button (click)="tabsChange(2)" nzType="primary">下一步</button>
</div>
</nz-tab>
<nz-tab nzTitle="3.认证">
......@@ -244,11 +316,6 @@
</div>
</div>
</form>
<div class="modal-footer-btn">
<button nz-button (click)="handleCancel()" nzType="primary">取消</button>
<button nz-button (click)="tabsChange(1)" nzType="primary">上一步</button>
<button nz-button (click)="handleOk()" nzType="primary">完成</button>
</div>
</nz-tab>
</nz-tabset>
</nz-modal>
\ No newline at end of file
src/main/webapp/app/modal/website/website.component.ts
View file @ 3b7b3b38
......@@ -5,12 +5,31 @@ import {NzMessageService} from 'ng-zorro-antd';
@Component({
selector: 'smart-website',
templateUrl: './website.component.html',
styles: []
styles: [
`
.middle {
height: 39px;
line-height: 39px;
}
.modal-footer-btn {
margin: 10px 0;
text-align: center;
}
.trigger-class {
border: 1px solid #ddd;
padding: 10px;
margin: 10px;
}
`
]
})
export class WebsiteComponent implements OnInit {
@Output() done = new EventEmitter<any>();
isVisible = false;
isOkLoading = false;
title;
tabNum = 0;
indexNo = 1;
......@@ -18,7 +37,7 @@ export class WebsiteComponent implements OnInit {
validateForm;
steps = [];
constructor(private overAllSer:OverAllService,private message:NzMessageService) {
constructor(private overAllSer: OverAllService, private message: NzMessageService) {
}
ngOnInit() {
......@@ -29,25 +48,28 @@ export class WebsiteComponent implements OnInit {
this.tabNum = 0;
this.steps = [
{
name:'',
url:'',
status_codes:200,
posts:'',
no:this.indexNo,
timeout:'15',
follow_redirects:'1',
condition:'',
faultCondition:'',
name: '',
url: '',
status_codes: 200,
posts: '',
no: this.indexNo,
timeout: '15',
follow_redirects: '1',
conditionList: [],
condition: '',
faultConditionList: [],
faultCondition: '',
show: false
}
];
this.validateForm = {
name: '',
delay:'',
retries:'',
http_proxy:'',
ssl_cert_file:'',
ssl_key_file:'',
ssl_key_password:'',
delay: '',
retries: '',
http_proxy: '',
ssl_cert_file: '',
ssl_key_file: '',
ssl_key_password: '',
steps: this.steps,
};
}
......@@ -61,62 +83,154 @@ export class WebsiteComponent implements OnInit {
this.title = '编辑网站监测';
this.isVisible = true;
this.overAllSer.findWeb(id).subscribe(
(res)=>{
if(res.errCode == 10000){
(res) => {
if (res.errCode == 10000) {
res.data.steps.forEach(e => {
e.follow_redirects += '';
});
this.validateForm = res.data;
this.steps = res.data.steps;
this.viewtrigger();
}
}
)
);
}
//回显阈值
viewtrigger() {
this.steps.forEach(e => {
if (e.condition) {
e.condition = ' and ' + e.condition;
let strCon = e.condition.split(' ');
let arrCon = [];
let andArrCon = [];
strCon.forEach((value) => {
if (value.length > 0) {
if (value == 'and' || value == 'or') {
andArrCon.push(value);
} else {
const index = value.indexOf('}');
if (value.indexOf('0.0.0.0:web.test.time') > -1) { //响应时间
const obj1 = {
time: '0',
equal: value[index + 1],
value: value.substr(index + 2, value.length),
};
arrCon.push(obj1);
}
if (value.indexOf('0.0.0.0:web.test.rspcode') > -1) { //响应代码
const obj2 = {
time: '1',
equal: value[index + 1],
value: value.substr(index + 2, value.length),
};
arrCon.push(obj2);
}
}
}
});
arrCon.forEach((value, index) => {
value.and = ' ' + andArrCon[index] + ' ';
});
e.conditionList = arrCon;
}else{
e.condition = '';
e.conditionList = [];
}
if (e.faultCondition) {
e.faultCondition = ' and ' +e.faultCondition;
let strFau = e.faultCondition.split(' ');
let arrFau = [];
let andArrFau = [];
strFau.forEach((value) => {
if (value.length > 0) {
if (value == 'and' || value == 'or') {
andArrFau.push(value);
} else {
const index = value.indexOf('}');
if (value.indexOf('0.0.0.0:web.test.time') > -1) { //响应时间
const obj1 = {
time: '0',
equal: value[index + 1],
value: value.substr(index + 2, value.length),
};
arrFau.push(obj1);
}
if (value.indexOf('0.0.0.0:web.test.rspcode') > -1) { //响应代码
const obj2 = {
time: '1',
equal: value[index + 1],
value: value.substr(index + 2, value.length),
};
arrFau.push(obj2);
}
}
}
});
arrFau.forEach((value, index) => {
value.and = ' ' + andArrFau[index] + ' ';
});
e.faultConditionList = arrFau;
}else{
e.faultCondition = '';
e.faultConditionList = [];
}
});
console.log(this.steps);
}
handleOk() {
if(!this.validateForm.name){
this.message.error("请输入网站名称");
if (!this.validateForm.name) {
this.message.error('请输入网站名称');
return false;
}
if(!this.validateForm.delay){
this.message.error("请输入更新间隔");
if (!this.validateForm.delay) {
this.message.error('请输入更新间隔');
return false;
}
if(this.title == '添加网站监测'){
this.isOkLoading = true;
this.getCondition();
if (this.title == '添加网站监测') {
this.create();
}else{
} else {
this.update();
}
}
//创建
create(){
const data = {};
create() {
this.overAllSer.createWebscenario(this.validateForm).subscribe(
(res)=>{
if(res.errCode == 10000){
(res) => {
if (res.errCode == 10000) {
this.message.success('添加成功');
this.isVisible = false;
this.done.emit();
this.initForm();
}else{
} else {
this.message.error(res.errMsg);
}
this.isOkLoading = false;
}
)
);
}
//更新
update(){
update() {
this.overAllSer.updateWebscenario(this.validateForm).subscribe(
(res)=>{
if(res.errCode == 10000){
(res) => {
if (res.errCode == 10000) {
this.message.success('保存成功');
this.isVisible = false;
this.done.emit();
this.initForm();
}else{
} else {
this.message.error(res.errMsg);
}
this.isOkLoading = false;
}
)
);
}
handleCancel() {
......@@ -128,25 +242,116 @@ export class WebsiteComponent implements OnInit {
this.tabNum = index;
}
// 合成阈值
getCondition() {
this.validateForm.steps.forEach(e => { //步骤列表
if(e.conditionList){
e.condition = '';
e.conditionList.forEach(e1 => { //危险阈值列表
if (e1.time == '0') { //响应时间
e.condition += e1.and + '{0.0.0.0:web.test.time[' + this.validateForm.name + ',' + e.name + ',resp].last()}' + e1.equal + e1.value;
}
if (e1.time == '1') { //响应代码
e.condition += e1.and + '{0.0.0.0:web.test.rspcode[' + this.validateForm.name + ',' + e.name + '].last()}' + e1.equal + e1.value;
}
});
}
if(e.faultConditionList){
e.faultCondition = '';
e.faultConditionList.forEach(e2 => { //故障阈值列表
if (e2.time == '0') { //响应时间
e.faultCondition += e2.and + '{0.0.0.0:web.test.time[' + this.validateForm.name + ',' + e.name + ',resp].last()}' + e2.equal + e2.value;
}
if (e2.time == '1') { //响应代码
e.faultCondition += e2.and + '{0.0.0.0:web.test.rspcode[' + this.validateForm.name + ',' + e.name + '].last()}' + e2.equal + e2.value;
}
});
}
});
console.log(this.validateForm.steps);
}
//添加步骤
addStep(){
addStep() {
this.indexNo += 1;
const data =
{
name:'',
url:'',
status_codes:200,
posts:'',
no:this.indexNo,
timeout:'15',
follow_redirects:'1',
condition:'',
faultCondition:'',
};
{
name: '',
url: '',
status_codes: 200,
posts: '',
no: this.indexNo,
timeout: '15',
follow_redirects: '1',
condition: '',
conditionList: [],
faultCondition: '',
faultConditionList: [],
show: false,
};
this.steps.push(data);
}
deleteStep(index){
this.steps.splice(index,1);
showCon(i) {
this.steps[i].show = true;
}
closeCon(i, bool) {
if (!bool) {
this.steps[i].conditionList = [];
this.steps[i].faultConditionList = [];
}
this.steps[i].show = false;
}
//删除步骤
deleteStep(index) {
this.steps.splice(index, 1);
}
/**
* 故障阈值添加
* @param i 步骤下标
*/
addFault(i) {
const demo = {
time: '0',
and: ' and ',
equal: '=',
value: '',
};
this.steps[i].faultConditionList.push(demo);
}
/**
* 危险阈值增加
* @param i 步骤下标
*/
addcondition(i) {
const demo = {
time: '0',
and: ' and ',
equal: '=',
value: '',
};
this.steps[i].conditionList.push(demo);
}
/**
* 删除故障阈值
* @param i 步骤下标
* @param index 故障下标
*/
deleteFault(i, index) {
this.steps[i].faultConditionList.splice(index, 1);
}
/**
* 删除危险阈值
* @param i 步骤下标
* @param index 故障下标
*/
deleteCondition(i, index) {
this.steps[i].conditionList.splice(index, 1);
}
}
src/main/webapp/app/overAll/basic/basic.component.html
View file @ 3b7b3b38
......@@ -209,7 +209,7 @@
<td></td>
<td [nzIndentSize]="item.level*20" nzShowExpand [nzExpand]='item.expand'
(nzExpandChange)="getChildren(item)">
<span>{{item.name}} <span style="color: #1b6b5bcc; margin-left: 10px">主机数量：{{item.hostcount}}</span> </span>
<span>{{item.name}} <span style="color: #439d68; margin-left: 10px">主机数量：{{item.hostcount}}</span> </span>
</td>
</ng-container>
<!--子集-->
......
src/main/webapp/app/system/modal/group-modal/group-modal.component.html
View file @ 3b7b3b38
<nz-modal [(nzVisible)]="isVisible" nzTitle="{{title}}" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
<nz-modal [(nzVisible)]="isVisible" nzTitle="{{title}}" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" [nzOkLoading]="isOkLoading">
<form [formGroup]="validateForm" nz-form >
<nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="groupName">部门名称</nz-form-label>
......
src/main/webapp/app/system/modal/group-modal/group-modal.component.ts
View file @ 3b7b3b38
......@@ -13,6 +13,7 @@ export class GroupModalComponent implements OnInit {
title;
isVisible = false;
isOkLoading = false;
validateForm:FormGroup;
groupList:any[];
orgId;
......@@ -26,6 +27,7 @@ export class GroupModalComponent implements OnInit {
}
initForm(){
this.isOkLoading = false;
this.validateForm = this.fb.group({
name:[null,[Validators.required,Validators.maxLength(15)]],
parentId:[null],
......@@ -64,6 +66,7 @@ export class GroupModalComponent implements OnInit {
if(this.validateForm.invalid){
return false;
}
this.isOkLoading = true;
if(this.title == "新增部门"){
this.create();
}
......
src/main/webapp/content/css/documentation.css
View file @ 3b7b3b38
......@@ -178,4 +178,10 @@
}
.margin-right-10{
margin-right: 5px;
}
.margin-left-5{
margin-left: 5px;
}
.margin-left-10{
margin-left: 10px;
}
\ No newline at end of file
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