|
20 | 20 | <nz-spin [nzSpinning]="loading" [nzTip]="loadingTip" nzSize="large"> |
21 | 21 | <div class="-inner-content"> |
22 | 22 | <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> |
34 | 39 |
|
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> |
45 | 55 |
|
46 | 56 | <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> |
59 | 74 | </ng-container> |
60 | 75 |
|
61 | 76 | <nz-collapse *ngIf="hasAdvancedParams" [nzGhost]="true" style="background: ghostwhite; margin-bottom: 24px"> |
|
67 | 82 | </ng-template> |
68 | 83 | <nz-collapse-panel [nzHeader]="extraColHeader" [nzShowArrow]="false"> |
69 | 84 | <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> |
75 | 93 | </ng-container> |
76 | 94 | </nz-collapse-panel> |
77 | 95 | </nz-collapse> |
78 | 96 |
|
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> |
89 | 113 |
|
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> |
100 | 130 |
|
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> |
110 | 144 |
|
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> |
120 | 160 |
|
121 | 161 | <div nz-row> |
122 | 162 | <div nz-col [nzXs]="{ span: 24 }" [nzLg]="{ span: 8, offset: 7 }" style="text-align: center"> |
|
0 commit comments