#3527 fix - Added applications and some minor refactoring

rsanchez

2017-03-19 280daa7f3f858ecfef9c91ffd5dea1007f021048

 securis/src/main/webapp/src/app/forms/pack.form.html
..
..
@@ -1,189 +1,160 @@
1
-<md-toolbar>
2
-	<span md-dialog-title>{{form_title}}</span>
3
-	<span flex></span>
4
-	<button md-icon-button (click)="save()"><md-icon>save</md-icon></button>
5
-	<button md-icon-button md-dialog-close><md-icon>close</md-icon></button>
6
-</md-toolbar>
7
-<p class="md-subhead">{{form_subtitle}}</p>
8
-<md-divider></md-divider>
9
-<form #packForm="ngForm" class="inset" >
10
-<div layout="column" >
11
-<md-dialog-content>
12
-	<div layout="column" layout-align="start center">
13
-		<div layout="row" layout-fill layout-padding>
14
-			<div layout="column" layout-fill  flex="15" *ngIf="!isNew">
15
-				<md-input-container>
16
-					<input mdInput maxLength="50" type="text" [(ngModel)]="data.id" name="id" required [readonly]="!isNew" />
17
-					<md-placeholder>
18
-						<span i18n="field.id"></span>
19
-					</md-placeholder>
20
-				</md-input-container>
21
-			</div>
22
-			<div layout="column" layout-fill  flex>
23
-				<md-input-container>
24
-					<input mdInput maxLength="50" type="text" [(ngModel)]="data.code" name="code" required [readonly]="!isNew" />
25
-					<md-placeholder>
26
-						<span i18n="field.code"></span>
27
-					</md-placeholder>
28
-				</md-input-container>
29
-				<error-checker [fieldName]="getFieldName('code')" [formField]="packForm.controls.code"></error-checker>
30
-			</div>
31
-			<div layout="column" layout-fill flex>
32
-				<md-input-container>
33
-					<input mdInput type="number"  [(ngModel)]="data.num_licenses" name="num_licenses" required />
34
-					<md-placeholder>
35
-						<span i18n="field.num_licenses"></span>
36
-					</md-placeholder>
37
-				</md-input-container>
38
-				<error-checker [fieldName]="getFieldName('num_licenses')" [formField]="packForm.controls.num_licenses"></error-checker>
39
-			</div>
40
-		</div>
41
-		<div layout="row" layout-fill layout-padding>
42
-			<div layout="column" layout-fill flex>
43
-				<md-checkbox labelPosition="after" [(ngModel)]="data.license_preactivation" name="license_preactivation">
44
-					<span i18n="field.license_preactivation"></span>
45
-				</md-checkbox>
46
-			</div>
47
-			<div layout="column" layout-fill flex *ngIf="!isNew">
48
-				<div layout="column" class="mat-input-container" flex>
49
-					<label class="mat-input-placeholder mat-float">
50
-						<span class="placeholder" i18n="field.status"></span>
51
-					</label>
52
-					<div class="label-value mat-input-element">{{packs.getStatusName(data.status)}}</div>
1
+<td-layout-card-over cardWidth="60">
2
+	<md-toolbar role="toolbar" class="mat-secondary">
3
+		<button md-icon-button (click)="goBack()" color="accent">
4
+			<md-icon>arrow_back</md-icon>
5
+		</button>
6
+		<span class="md-title" i18n>{{form_title}}</span>
7
+		<span flex></span>
8
+		<button md-icon-button (click)="save()"><md-icon>save</md-icon></button>
9
+	</md-toolbar>
10
+	<div class="margin" layout-align-gt-xs="center start" layout-fill="" layout-gt-xs="row">
11
+		<md-card flex="70">
12
+			<md-card-title>
13
+				{{form_subtitle}}
14
+			</md-card-title>
15
+			<md-divider></md-divider>
16
+			<md-card-content>
17
+				<form #packForm="ngForm" class="inset">
18
+					<div layout="column" layout-align="start center">
19
+						<div layout="row" layout-fill layout-padding>
20
+							<field-readonly [value]="data.id" label="field.id" flex="15" *ngIf="!isNew"></field-readonly>
21
+							<div layout="column" layout-fill flex>
22
+								<md-input-container>
23
+									<input mdInput maxLength="50" type="text" [(ngModel)]="data.code" name="code" required [readonly]="!isNew" />
24
+									<md-placeholder>
25
+										<span i18n="field.code"></span>
26
+									</md-placeholder>
27
+								</md-input-container>
28
+								<error-checker [fieldName]="getFieldName('code')" [formField]="packForm.controls.code"></error-checker>
29
+							</div>
30
+							<div layout="column" layout-fill flex>
31
+								<md-input-container>
32
+									<input mdInput type="number" [(ngModel)]="data.num_licenses" name="num_licenses" required />
33
+									<md-placeholder>
34
+										<span i18n="field.num_licenses"></span>
35
+									</md-placeholder>
36
+								</md-input-container>
37
+								<error-checker [fieldName]="getFieldName('num_licenses')" [formField]="packForm.controls.num_licenses"></error-checker>
38
+							</div>
39
+						</div>
40
+						<div layout="row" layout-fill layout-padding>
41
+							<div layout="column" layout-fill flex>
42
+								<md-checkbox labelPosition="after" [(ngModel)]="data.license_preactivation" name="license_preactivation">
43
+									<span i18n="field.license_preactivation"></span>
44
+								</md-checkbox>
45
+							</div>
46
+							<field-readonly [value]="packs.getStatusName(data.status)" label="field.status" flex *ngIf="!isNew"></field-readonly>
47
+						</div>
48
+						<div layout="row" layout-fill layout-padding>
49
+							<div layout="column" layout-fill flex>
50
+								<md-input-container flex>
51
+									<input mdInput type="date" [(ngModel)]="data.init_valid_date" name="init_valid_date" required />
52
+									<md-placeholder>
53
+										<span i18n="field.end_valid_date"></span>
54
+									</md-placeholder>
55
+								</md-input-container>
56
+								<error-checker [fieldName]="getFieldName('init_valid_date')" [formField]="packForm.controls.init_valid_date"></error-checker>
57
+							</div>
58
+							<div layout="column" layout-fill flex>
59
+								<md-input-container flex>
60
+									<input mdInput type="date" [(ngModel)]="data.end_valid_date" name="end_valid_date" required />
61
+									<md-placeholder>
62
+										<span i18n="field.end_valid_date"></span>
63
+									</md-placeholder>
64
+								</md-input-container>
65
+								<error-checker [fieldName]="getFieldName('end_valid_date')" [formField]="packForm.controls.end_valid_date"></error-checker>
66
+							</div>
67
+						</div>
68
+						<div layout="row" layout-fill layout-padding *ngIf="isNew">
69
+							<div layout="column" layout-fill flex>
70
+								<md-select [placeholder]="getFieldName('organization_id')" flex [(ngModel)]="data.organization_id" name="organization_id"
71
+								 (change)="changeOrg($event)">
72
+									<md-option *ngFor="let org of organizations" [value]="org.id">
73
+										{{org.label}}
74
+									</md-option>
75
+								</md-select>
76
+								<error-checker [fieldName]="getFieldName('organization_id')" [formField]="packForm.controls.organization_id"></error-checker>
77
+							</div>
78
+							<div layout="column" layout-fill flex>
79
+								<md-select flex [placeholder]="getFieldName('license_type_id')" [(ngModel)]="data.license_type_id" name="license_type_id"
80
+								 (change)="changeLicType($event)">
81
+									<md-option *ngFor="let lt of licensetypes" [value]="lt.id">
82
+										{{lt.label}}
83
+									</md-option>
84
+								</md-select>
85
+								<error-checker [fieldName]="getFieldName('license_type_id')" [formField]="packForm.controls.license_type_id"></error-checker>
86
+							</div>
87
+						</div>
88
+						<div layout="row" layout-fill layout-padding *ngIf="!isNew">
89
+							<field-readonly [value]="data.organization_name" label="field.organization_id" flex></field-readonly>
90
+							<field-readonly [value]="data.licensetype_code" label="field.license_type_id" flex></field-readonly>
91
+						</div>
92
+						<div layout="row" layout-fill layout-padding>
93
+							<div layout="column" layout-fill flex>
94
+								<md-input-container flex>
95
+									<input mdInput type="number" [(ngModel)]="data.preactivation_valid_period" name="preactivation_valid_period" required />
96
+									<md-placeholder>
97
+										<span i18n="field.preactivation_valid_period"></span>
98
+									</md-placeholder>
99
+									<md-hint align="end">days</md-hint>
100
+								</md-input-container>
101
+								<error-checker [fieldName]="getFieldName('preactivation_valid_period')" [formField]="packForm.controls.preactivation_valid_period"></error-checker>
102
+							</div>
103
+							<div layout="column" layout-fill flex>
104
+								<md-input-container flex>
105
+									<input mdInput type="number" [(ngModel)]="data.renew_valid_period" name="renew_valid_period" required />
106
+									<md-placeholder>
107
+										<span i18n="field.renew_valid_period"></span>
108
+									</md-placeholder>
109
+									<md-hint align="end">days</md-hint>
110
+								</md-input-container>
111
+								<error-checker [fieldName]="getFieldName('renew_valid_period')" [formField]="packForm.controls.renew_valid_period"></error-checker>
112
+							</div>
113
+						</div>
114
+						<div layout="row" layout-fill layout-padding>
115
+							<div layout="column" layout-fill flex>
116
+								<md-input-container flex>
117
+									<textarea mdInput type="text" type="text" [(ngModel)]="data.comments" name="comments" maxlength="1024"></textarea>
118
+									<md-placeholder>
119
+										<span i18n="field.comments"></span>
120
+									</md-placeholder>
121
+									<md-hint align="end">(max 1024)</md-hint>
122
+								</md-input-container>
123
+							</div>
124
+						</div>
125
+						<div layout="row" layout-fill layout-padding *ngIf="!isNew">
126
+							<field-readonly [value]="data.created_by_name" label="field.created_by" flex></field-readonly>
127
+							<field-readonly [value]="data.creation_timestamp | date: 'medium'" label="field.creation_timestamp" flex></field-readonly>
128
+						</div>
129
+						<div layout="column" layout-fill>
130
+							<span class="md-title" i18n>License metadata</span>
131
+							<div layout="row" layout-fill layout-padding *ngFor="let pair of data.metadata">
132
+								<md-input-container flex="40">
133
+									<input mdInput type="text" [ngModelOptions]="{standalone: true}" [(ngModel)]="pair.key" readonly />
134
+									<md-placeholder>
135
+										<span i18n="field.key"></span>
136
+									</md-placeholder>
137
+								</md-input-container>
138
+								<md-input-container flex>
139
+									<input mdInput type="text" [ngModelOptions]="{standalone: true}" [(ngModel)]="pair.value" [readonly]="pair.readonly" [required]="pair.required"
140
+									/>
141
+									<md-placeholder>
142
+										<span i18n="field.value"></span>
143
+									</md-placeholder>
144
+								</md-input-container>
145
+							</div>
146
+						</div>
147
+					</div>
148
+				</form>
149
+			</md-card-content>
150
+			<md-divider></md-divider>
151
+			<md-card-actions>
152
+				<div layout="row" layout-align="start center" class="margin">
153
+					<span flex></span>
154
+					<button [disabled]="!packForm.form.valid" md-raised-button color="primary" (click)="save()">Save</button>
155
+					<button md-button (click)="goBack()">Cancel</button>
53
156
 				</div>
54
-			</div>
55
-		</div>
56
-		<div layout="row" layout-fill layout-padding>
57
-			<div layout="column" layout-fill flex>
58
-				<md-input-container flex>
59
-					<input mdInput type="date" [(ngModel)]="data.init_valid_date" name="init_valid_date" required />
60
-					<md-placeholder>
61
-						<span i18n="field.end_valid_date"></span>
62
-					</md-placeholder>
63
-				</md-input-container>
64
-				<error-checker [fieldName]="getFieldName('init_valid_date')" [formField]="packForm.controls.init_valid_date"></error-checker>
65
-			</div>
66
-			<div layout="column" layout-fill flex>
67
-				<md-input-container flex>
68
-					<input mdInput type="date" [(ngModel)]="data.end_valid_date" name="end_valid_date" required />
69
-					<md-placeholder>
70
-						<span i18n="field.end_valid_date"></span>
71
-					</md-placeholder>
72
-				</md-input-container>
73
-				<error-checker [fieldName]="getFieldName('end_valid_date')" [formField]="packForm.controls.end_valid_date"></error-checker>
74
-			</div>
75
-		</div>
76
-		<div layout="row" layout-fill layout-padding *ngIf="isNew">
77
-			<div layout="column" layout-fill flex>
78
-				<md-select [placeholder]="getFieldName('organization_id')" flex [(ngModel)]="data.organization_id" name="organization_id" (change)="changeOrg($event)">
79
-					<md-option *ngFor="let org of organizations" [value]="org.id">
80
-						{{org.label}}
81
-					</md-option>
82
-				</md-select>
83
-				<error-checker [fieldName]="getFieldName('organization_id')" [formField]="packForm.controls.organization_id"></error-checker>
84
-			</div>
85
-			<div layout="column" layout-fill flex>
86
-				<md-select flex [placeholder]="getFieldName('license_type_id')" [(ngModel)]="data.license_type_id" name="license_type_id" (change)="changeLicType($event)">
87
-					<md-option *ngFor="let lt of licensetypes" [value]="lt.id">
88
-						{{lt.label}}
89
-					</md-option>
90
-				</md-select>
91
-				<error-checker [fieldName]="getFieldName('license_type_id')" [formField]="packForm.controls.license_type_id"></error-checker>
92
-			</div>
93
-		</div>
94
-		<div layout="row" layout-fill layout-padding *ngIf="!isNew">
95
-			<div layout="column" layout-fill flex>
96
-				<div layout="column" class="mat-input-container" flex>
97
-					<label class="mat-input-placeholder mat-float">
98
-						<span class="placeholder" i18n="field.organization_id"></span>
99
-					</label>
100
-					<div class="label-value mat-input-element">{{data.organization_name}}</div>
101
-				</div>
102
-			</div>
103
-			<div layout="column" layout-fill flex>
104
-				<div layout="column" class="mat-input-container" flex>
105
-					<label class="mat-input-placeholder mat-float">
106
-						<span class="placeholder" i18n="field.license_type_id"></span>
107
-					</label>
108
-					<div class="label-value mat-input-element">{{data.licensetype_code}}</div>
109
-				</div>
110
-			</div>
111
-		</div>
112
-		<div layout="row" layout-fill layout-padding >
113
-			<div layout="column" layout-fill flex>
114
-				<md-input-container flex>
115
-					<input mdInput type="number"  [(ngModel)]="data.preactivation_valid_period" name="preactivation_valid_period" required />
116
-					<md-placeholder>
117
-						<span i18n="field.preactivation_valid_period"></span>
118
-					</md-placeholder>
119
-					<md-hint align="end">days</md-hint>
120
-				</md-input-container>
121
-				<error-checker [fieldName]="getFieldName('preactivation_valid_period')" [formField]="packForm.controls.preactivation_valid_period"></error-checker>
122
-			</div>
123
-			<div layout="column" layout-fill flex>
124
-				<md-input-container flex>
125
-					<input mdInput type="number"[(ngModel)]="data.renew_valid_period" name="renew_valid_period" required />
126
-					<md-placeholder>
127
-						<span i18n="field.renew_valid_period"></span>
128
-					</md-placeholder>
129
-					<md-hint align="end">days</md-hint>
130
-				</md-input-container>
131
-				<error-checker [fieldName]="getFieldName('renew_valid_period')" [formField]="packForm.controls.renew_valid_period"></error-checker>
132
-			</div>
133
-		</div>
134
-		<div layout="row" layout-fill layout-padding>
135
-			<div layout="column" layout-fill flex>
136
-				<md-input-container flex>
137
-					<textarea mdInput type="text" type="text" [(ngModel)]="data.comments" name="comments" maxlength="1024" ></textarea>
138
-					<md-placeholder>
139
-						<span i18n="field.comments"></span>
140
-					</md-placeholder>
141
-					<md-hint align="end">(max 1024)</md-hint>
142
-				</md-input-container>
143
-			</div>
144
-		</div>
145
-		<div layout="row" layout-fill layout-padding *ngIf="!isNew">
146
-			<div layout="column" layout-fill flex>
147
-				<div layout="column" class="mat-input-container" flex>
148
-					<label class="mat-input-placeholder mat-float">
149
-						<span class="placeholder" i18n="field.created_by_name"></span>
150
-					</label>
151
-					<div class="label-value mat-input-element">{{data.created_by_name}}</div>
152
-				</div>
153
-			</div>
154
-			<div layout="column" layout-fill flex>
155
-				<div layout="column" class="mat-input-container" flex>
156
-					<label class="mat-input-placeholder mat-float">
157
-						<span class="placeholder" i18n="field.creation_timestamp"></span>
158
-					</label>
159
-					<div class="label-value mat-input-element">{{data.creation_timestamp | date: 'medium'}}</div>
160
-				</div>
161
-			</div>
162
-		</div>
163
-		<div layout="column" layout-fill>
164
-			<span class="md-title" i18n>License metadata</span>
165
-			<div layout="row" layout-fill layout-padding *ngFor="let pair of data.metadata">
166
-				<md-input-container flex="40">
167
-					<input mdInput type="text" [ngModelOptions]="{standalone: true}" [(ngModel)]="pair.key" readonly />
168
-					<md-placeholder>
169
-						<span i18n="field.key"></span>
170
-					</md-placeholder>
171
-				</md-input-container>
172
-				<md-input-container flex>
173
-					<input mdInput type="text" [ngModelOptions]="{standalone: true}" [(ngModel)]="pair.value" [readonly]="pair.readonly" [required]="pair.required" />
174
-					<md-placeholder>
175
-						<span i18n="field.value"></span>
176
-					</md-placeholder>
177
-				</md-input-container>
178
-			</div>
179
-		</div>
157
+			</md-card-actions>
158
+		</md-card>
180
159
 	</div>
181
-</md-dialog-content>
182
-<div flex></div>
183
-<md-divider></md-divider>
184
-<md-dialog-actions layout="row" layout-align="end center">
185
-		<button [disabled]="!packForm.form.valid" md-raised-button color="primary" (click)="save()">Save</button>
186
-		<button md-button md-dialog-close>Cancel</button>
187
-</md-dialog-actions>
188
-</div>
189
-</form>	
160
+</td-layout-card-over>