Skip to content

Commit 3e50b96

Browse files
authored
Fixed failure of monitoring form validation (#2258)
1 parent 9cf0e6f commit 3e50b96

File tree

10 files changed

+392
-362
lines changed

10 files changed

+392
-362
lines changed

web-app/src/app/routes/alert/alert-setting/alert-setting.component.html

100755100644
Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -495,16 +495,20 @@
495495
</nz-collapse>
496496
</nz-form-control>
497497
</nz-form-item>
498-
<app-form-item
499-
[item]="{
500-
field: 'tags',
501-
type: 'tags-selection',
502-
name: 'tag.bind' | i18n,
503-
tooltip: 'tag.bind.tip' | i18n
504-
}"
505-
[extra]="{ tag_mode: 'closeable' }"
506-
[(value)]="define.tags"
507-
/>
498+
<nz-form-item>
499+
<nz-form-label nzSpan="7" [nzFor]="'tags'" [nzTooltipTitle]="'tag.bind.tip' | i18n">{{ 'tag.bind' | i18n }} </nz-form-label>
500+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
501+
<app-form-field
502+
[item]="{
503+
field: 'tags',
504+
type: 'tags-selection'
505+
}"
506+
[extra]="{ tag_mode: 'closeable' }"
507+
[name]="'tags'"
508+
[(ngModel)]="define.tags"
509+
/>
510+
</nz-form-control>
511+
</nz-form-item>
508512
<nz-form-item>
509513
<nz-form-label nzSpan="7" nzFor="preset" [nzTooltipTitle]="'alert.setting.default.tip' | i18n">
510514
{{ 'alert.setting.default' | i18n }}

web-app/src/app/routes/monitor/monitor-form/monitor-form.component.html

Lines changed: 116 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -20,42 +20,57 @@
2020
<nz-spin [nzSpinning]="loading" [nzTip]="loadingTip" nzSize="large">
2121
<div class="-inner-content">
2222
<form nz-form #form="ngForm">
23-
<app-form-item
24-
[item]="{
25-
field: 'host',
26-
type: 'text',
27-
name: hostName ? hostName : ('monitor.host' | i18n),
28-
required: true,
29-
placeholder: 'monitor.host.tip' | i18n
30-
}"
31-
[(value)]="monitor.host"
32-
(valueChange)="onHostChange($event)"
33-
/>
23+
<nz-form-item>
24+
<nz-form-label nzSpan="7" [nzRequired]="true" [nzFor]="'host'">{{ hostName ? hostName : ('monitor.host' | i18n) }} </nz-form-label>
25+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
26+
<app-form-field
27+
[item]="{
28+
field: 'host',
29+
type: 'text',
30+
required: true,
31+
placeholder: 'monitor.host.tip' | i18n
32+
}"
33+
[name]="'host'"
34+
[(ngModel)]="monitor.host"
35+
(ngModelChange)="onHostChange($event)"
36+
/>
37+
</nz-form-control>
38+
</nz-form-item>
3439

35-
<app-form-item
36-
[item]="{
37-
field: 'name',
38-
type: 'text',
39-
name: 'monitor.name' | i18n,
40-
required: true,
41-
placeholder: 'monitor.name.tip' | i18n
42-
}"
43-
[(value)]="monitor.name"
44-
/>
40+
<nz-form-item>
41+
<nz-form-label nzSpan="7" [nzRequired]="true" [nzFor]="'name'">{{ 'monitor.name' | i18n }} </nz-form-label>
42+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
43+
<app-form-field
44+
[item]="{
45+
field: 'name',
46+
type: 'text',
47+
required: true,
48+
placeholder: 'monitor.name.tip' | i18n
49+
}"
50+
[name]="'name'"
51+
[(ngModel)]="monitor.name"
52+
/>
53+
</nz-form-control>
54+
</nz-form-item>
4555

4656
<ng-container *ngFor="let paramDefine of paramDefines; let i = index">
47-
<app-form-item
48-
*ngIf="params[i].display !== false && paramDefine.field !== 'host'"
49-
[item]="paramDefine"
50-
[(value)]="params[i].paramValue"
51-
(valueChange)="
52-
paramDefine.type === 'boolean'
53-
? onParamBooleanChanged($event, paramDefine.field)
54-
: paramDefine.type === 'radio'
55-
? onDependChanged($event, paramDefine.field)
56-
: null
57-
"
58-
/>
57+
<nz-form-item *ngIf="params[i].display !== false && paramDefine.field !== 'host'">
58+
<nz-form-label nzSpan="7" [nzRequired]="paramDefine.required" [nzFor]="paramDefine.field">{{ paramDefine.name }} </nz-form-label>
59+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
60+
<app-form-field
61+
[item]="paramDefine"
62+
[name]="paramDefine.field"
63+
[(ngModel)]="params[i].paramValue"
64+
(ngModelChange)="
65+
paramDefine.type === 'boolean'
66+
? onParamBooleanChanged($event, paramDefine.field)
67+
: paramDefine.type === 'radio'
68+
? onDependChanged($event, paramDefine.field)
69+
: null
70+
"
71+
/>
72+
</nz-form-control>
73+
</nz-form-item>
5974
</ng-container>
6075

6176
<nz-collapse *ngIf="hasAdvancedParams" [nzGhost]="true" style="background: ghostwhite; margin-bottom: 24px">
@@ -67,56 +82,81 @@
6782
</ng-template>
6883
<nz-collapse-panel [nzHeader]="extraColHeader" [nzShowArrow]="false">
6984
<ng-container *ngFor="let paramDefine of advancedParamDefines; let i = index">
70-
<app-form-item
71-
*ngIf="advancedParams[i].display && paramDefine.field !== 'host'"
72-
[item]="paramDefine"
73-
[(value)]="advancedParams[i].paramValue"
74-
/>
85+
<nz-form-item *ngIf="advancedParams[i].display !== false && paramDefine.field !== 'host'">
86+
<nz-form-label nzSpan="7" [nzRequired]="paramDefine.required" [nzFor]="paramDefine.field"
87+
>{{ paramDefine.name }}
88+
</nz-form-label>
89+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
90+
<app-form-field [item]="paramDefine" [name]="paramDefine.field" [(ngModel)]="advancedParams[i].paramValue" />
91+
</nz-form-control>
92+
</nz-form-item>
7593
</ng-container>
7694
</nz-collapse-panel>
7795
</nz-collapse>
7896

79-
<app-form-item
80-
[item]="{
81-
field: 'collector',
82-
type: 'collectors-selection',
83-
name: 'monitor.collector' | i18n,
84-
tooltip: 'monitor.collector.tip' | i18n
85-
}"
86-
[extra]="{collectors}"
87-
[(value)]="collector"
88-
/>
97+
<nz-form-item>
98+
<nz-form-label nzSpan="7" [nzFor]="'collector'" [nzTooltipTitle]="'monitor.collector.tip' | i18n"
99+
>{{ 'monitor.collector' | i18n }}
100+
</nz-form-label>
101+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
102+
<app-form-field
103+
[item]="{
104+
field: 'collector',
105+
type: 'collectors-selection'
106+
}"
107+
[extra]="{collectors}"
108+
[name]="'collector'"
109+
[(ngModel)]="collector"
110+
/>
111+
</nz-form-control>
112+
</nz-form-item>
89113

90-
<app-form-item
91-
[item]="{
92-
field: 'intervals',
93-
type: 'intervals',
94-
name: 'monitor.intervals' | i18n,
95-
tooltip: 'monitor.intervals.tip' | i18n
96-
}"
97-
[extra]="{ interval_type: monitor.app }"
98-
[(value)]="monitor.intervals"
99-
/>
114+
<nz-form-item>
115+
<nz-form-label nzSpan="7" [nzFor]="'intervals'" [nzTooltipTitle]="'monitor.intervals.tip' | i18n"
116+
>{{ 'monitor.intervals' | i18n }}
117+
</nz-form-label>
118+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
119+
<app-form-field
120+
[item]="{
121+
field: 'intervals',
122+
type: 'intervals'
123+
}"
124+
[extra]="{ interval_type: monitor.app }"
125+
[name]="'intervals'"
126+
[(ngModel)]="monitor.intervals"
127+
/>
128+
</nz-form-control>
129+
</nz-form-item>
100130

101-
<app-form-item
102-
[item]="{
103-
field: 'tags',
104-
type: 'tags-selection',
105-
name: 'tag.bind' | i18n,
106-
tooltip: 'tag.bind.tip' | i18n
107-
}"
108-
[(value)]="monitor.tags"
109-
/>
131+
<nz-form-item>
132+
<nz-form-label nzSpan="7" [nzFor]="'tags'" [nzTooltipTitle]="'tag.bind.tip' | i18n">{{ 'tag.bind' | i18n }} </nz-form-label>
133+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
134+
<app-form-field
135+
[item]="{
136+
field: 'tags',
137+
type: 'tags-selection'
138+
}"
139+
[name]="'tags'"
140+
[(ngModel)]="monitor.tags"
141+
/>
142+
</nz-form-control>
143+
</nz-form-item>
110144

111-
<app-form-item
112-
[item]="{
113-
field: 'description',
114-
type: 'textarea-limit',
115-
name: 'monitor.description' | i18n,
116-
tooltip: 'monitor.description.tip' | i18n
117-
}"
118-
[(value)]="monitor.description"
119-
/>
145+
<nz-form-item>
146+
<nz-form-label nzSpan="7" [nzFor]="'description'" [nzTooltipTitle]="'monitor.description.tip' | i18n"
147+
>{{ 'monitor.description' | i18n }}
148+
</nz-form-label>
149+
<nz-form-control nzSpan="8" [nzErrorTip]="'validation.required' | i18n">
150+
<app-form-field
151+
[item]="{
152+
field: 'description',
153+
type: 'textarea-limit'
154+
}"
155+
[name]="'description'"
156+
[(ngModel)]="monitor.description"
157+
/>
158+
</nz-form-control>
159+
</nz-form-item>
120160

121161
<div nz-row>
122162
<div nz-col [nzXs]="{ span: 24 }" [nzLg]="{ span: 8, offset: 7 }" style="text-align: center">

web-app/src/app/routes/monitor/monitor-form/monitor-form.component.less

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
:host {
22
::ng-deep {
33
.ant-collapse-content-box {
4-
:last-child {
5-
.ant-form-item {
6-
margin-bottom: 0!important;
7-
}
4+
.ant-form-item:last-child {
5+
margin-bottom: 0!important;
86
}
97
}
108
}

0 commit comments

Comments
 (0)