blame | history | patch | commit | commitdiff
rsanchez
2017-03-19 280daa7f3f858ecfef9c91ffd5dea1007f021048 
 securis/src/main/webapp/src/app/forms/license.form.html
....@@ -1,75 +1,124 @@
1
-<form #packForm="ngForm" class="inset" (keyup.enter)="save()">
2
-	<md-card>
3
-		<md-card-title>
4
-			{{form_title}}
5
-		</md-card-title>
6
-		<md-card-subtitle>
7
-			{{form_subtitle}}
8
-		</md-card-subtitle>
9
-<md-divider></md-divider>
10
-		<md-card-content>
11
-	<div layout="column" layout-align="start center" layout-fill>
12
-		<div layout="row" layout-fill layout-padding>
13
-			<div layout="column" layout-fill  flex="50">
14
-			<md-input-container>
15
-				<input mdInput maxLength="50" type="text" [(ngModel)]="data.code" name="code" required />
16
-				<md-placeholder>
17
-          			<span i18n>Code</span>
18
-        		</md-placeholder>
19
-			</md-input-container>
20
-			{{log(packForm.controls)}}
21
-			<div *ngIf="packForm.controls.code?.touched && packForm.controls.code.invalid" layout="column">
22
-				<span *ngIf="packForm.controls.code.errors.required" align="end">Code is required</span>
23
-				<span align="end">Code is ok</span>
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>{{form_title}}</span>
7
+		<span flex></span>
8
+		<button md-icon-button (click)="save()"><md-icon>save</md-icon></button>
9
+		<md-toolbar-row class="inner-padding" *ngIf="!!pack" >
10
+			<div>
11
+				<span i18n>Pack</span>: {{pack.code}}
2412 			</div>
13
+			<div class="inner-padding" flex="70" style="margin-left: 10px;" layout-align="start center" layout="row">
14
+				<md-chip selected [mdTooltip]="$L.get('field.application_name')" color="primary">{{pack.application_name}} </md-chip>
15
+				<md-chip selected [mdTooltip]="$L.get('field.organization_id')" color="accent">{{pack.organization_name}} </md-chip>
16
+				<md-chip selected [mdTooltip]="$L.get('field.license_type_id')" color="accent">{{pack.licensetype_code}} </md-chip>
2517 			</div>
26
-	<!-- TODO: <div class="alert inline-alert alert-warning" ng-show="packForm.code.$invalid">
27
-		<span class="glyphicon glyphicon-warning-sign"></span> 
28
-		<span ng-show="packForm.code.$error.maxlength" ng-bind="maxLengthErrorMsg('Code', maxlength.code)" 
29
-		class="ng-binding ng-hide">Code length is too long (max: 50).</span> 
30
-		<span ng-show="packForm.code.$error.required" ng-bind="mandatoryFieldErrorMsg('Code')" class="ng-binding">'Code' is required.</span>
31
-	</div> -->
32
-			<md-input-container flex="50">
33
-				<input mdInput type="number" type="text" [(ngModel)]="data.num_licenses" name="num_licenses" required />
34
-				<md-placeholder>
35
-          			<span i18n>Num. licenses</span>
36
-        		</md-placeholder>
37
-			</md-input-container>
38
-		</div>
39
-		<div layout="row" layout-align="start center" layout-fill layout-padding>
40
-			<md-input-container flex>
41
-				<input mdInput type="date" type="text" [(ngModel)]="data.init_valid_date" name="init_valid_date" required />
42
-				<md-placeholder>
43
-          			<span i18n>Initial date</span>
44
-        		</md-placeholder>
45
-				<md-hint align="end">YYYY-MM-DD</md-hint>
46
-			</md-input-container>
47
-			<md-input-container flex>
48
-				<input mdInput type="date" type="text" [(ngModel)]="data.end_valid_date" name="end_valid_date" required />
49
-				<md-placeholder>
50
-          			<span i18n>End date</span>
51
-        		</md-placeholder>
52
-				<md-hint align="end">YYYY-MM-DD</md-hint>
53
-			</md-input-container>
54
-		</div>
55
-		<div layout="row" layout-fill layout-padding>
56
-			<md-select flex placeholder="Organization" [(ngModel)]="data.organization_id" name="organization_id">
57
-				<md-option *ngFor="let org of organizations" [value]="org.id">
58
-					{{org.label}}
59
-				</md-option>
60
-			</md-select>
61
-			<md-select flex placeholder="License type" [(ngModel)]="data.license_type_id" name="license_type_id">
62
-				<md-option *ngFor="let lt of licensetypes" [value]="lt.id">
63
-					{{lt.label}}
64
-				</md-option>
65
-			</md-select>
66
-		</div>
18
+			<span flex></span>
19
+			<md-chip-list>
20
+				<md-chip [mdTooltip]="$L.get('field.num_available')" color="secondary" [class.bgc-red-A100]="pack.num_available <= 0">
21
+					<span i18n="field.num_available"></span>: {{pack.num_available}} </md-chip>
22
+			</md-chip-list>
23
+		</md-toolbar-row>
24
+	</md-toolbar>
25
+	<div class="margin" layout-align-gt-xs="center start" layout-fill="" layout-gt-xs="row">
26
+			<md-card  flex="70">
27
+				<md-card-title>
28
+					{{form_subtitle}}
29
+				</md-card-title>
30
+				<md-divider></md-divider>
31
+				<md-card-content>
32
+					<form #licenseForm="ngForm" class="inset" (keyup.enter)="save()">
33
+						<div layout="column" layout-align="start center">
34
+							<div layout="row" layout-fill layout-padding>
35
+								<field-readonly [value]="data.id" label="field.id" flex="20" *ngIf="!isNew"></field-readonly>
36
+								<field-readonly [value]="data.code" label="field.code" flex></field-readonly>
37
+							</div>
38
+							<div layout="row" layout-fill layout-padding>
39
+								<field-readonly [value]="data.activation_code" label="field.activation_code" flex></field-readonly>
40
+							</div>
41
+							<div layout="row" layout-fill layout-padding *ngIf="!isNew">
42
+								<field-readonly [value]="data.expiration_date | date: 'dateMedium'" label="field.expiration_date" flex></field-readonly>
43
+								<field-readonly [value]="licenses.getStatusName(data.status)" label="field.status" flex></field-readonly>
44
+							</div>
45
+							<div layout="row" layout-fill layout-padding>
46
+								<div layout="column" layout-fill flex>
47
+									<md-input-container flex>
48
+										<input mdInput type="text" [(ngModel)]="data.full_name" name="full_name" required maxlength="200" />
49
+										<md-placeholder>
50
+											<span i18n="field.full_name"></span>
51
+										</md-placeholder>
52
+									</md-input-container>
53
+									<error-checker [fieldName]="$L.get('field.full_name')" [formField]="licenseForm.controls.full_name"></error-checker>
54
+								</div>
55
+								<div layout="column" layout-fill flex>
56
+									<md-input-container flex>
57
+										<input mdInput type="email" [(ngModel)]="data.email" name="email" required maxlength="200" />
58
+										<md-placeholder>
59
+											<span i18n="field.email"></span>
60
+										</md-placeholder>
61
+									</md-input-container>
62
+									<error-checker [fieldName]="$L.get('field.full_name')" [formField]="licenseForm.controls.email"></error-checker>
63
+								</div>
64
+							</div>
65
+							<div layout="row" layout-fill layout-padding>
66
+								<div layout="column" layout-fill flex>
67
+									<md-input-container flex>
68
+										<textarea mdInput type="text" type="text" [(ngModel)]="data.request_data" name="request_data" maxlength="2048"></textarea>
69
+										<md-placeholder>
70
+											<span i18n="field.request_data"></span>
71
+										</md-placeholder>
72
+										<md-hint align="end">(max 2048)</md-hint>
73
+									</md-input-container>
74
+								</div>
75
+								<td-file-input #requestFileUploader (select)="requestFileSelected($event)" accept=".req,.txt,.json">
76
+									<md-icon>attachment</md-icon>
77
+								</td-file-input>
78
+							</div>
79
+							<div layout="row" layout-fill layout-padding>
80
+								<div layout="column" layout-fill flex>
81
+									<md-input-container flex>
82
+										<textarea mdInput type="text" type="text" [(ngModel)]="data.comments" name="comments" maxlength="1024"></textarea>
83
+										<md-placeholder>
84
+											<span i18n="field.comments"></span>
85
+										</md-placeholder>
86
+										<md-hint align="end">(max 1024)</md-hint>
87
+									</md-input-container>
88
+								</div>
89
+							</div>
90
+							<div layout="row" layout-fill layout-padding *ngIf="!isNew">
91
+								<field-readonly [value]="data.created_by_id" label="field.created_by" flex></field-readonly>
92
+								<field-readonly [value]="data.creation_date | date: 'medium'" label="field.creation_date" flex></field-readonly>
93
+							</div>
94
+							<div layout="column" layout-fill>
95
+								<span class="md-title" i18n>License metadata</span>
96
+								<div layout="row" layout-fill layout-padding *ngFor="let pair of pack?.metadata">
97
+									<md-input-container flex="40">
98
+										<input mdInput type="text" [ngModelOptions]="{standalone: true}" [(ngModel)]="pair.key" readonly />
99
+										<md-placeholder>
100
+											<span i18n="field.key"></span>
101
+										</md-placeholder>
102
+									</md-input-container>
103
+									<md-input-container flex>
104
+										<input mdInput type="text" [ngModelOptions]="{standalone: true}" [(ngModel)]="pair.value" readonly />
105
+										<md-placeholder>
106
+											<span i18n="field.value"></span>
107
+										</md-placeholder>
108
+									</md-input-container>
109
+								</div>
110
+							</div>
111
+						</div>
112
+					</form>
113
+				</md-card-content>
114
+				<md-divider></md-divider>
115
+				<md-card-actions>
116
+					<div layout="row" layout-align="start center" class="margin">
117
+						<span flex></span>
118
+						<button [disabled]="!licenseForm.form.valid" md-raised-button color="primary" (click)="save()">Save</button>
119
+						<button md-button (click)="goBack()">Cancel</button>
120
+					</div>
121
+				</md-card-actions>
122
+			</md-card>
67123 	</div>
68
-</md-card-content>
69
-<md-divider></md-divider>
70
-<md-card-actions>
71
-	<button [disabled]="!packForm.form.valid" md-raised-button color="primary" (click)="save()">Save</button>
72
-	<button md-button md-dialog-close>Cancel</button>
73
-</md-card-actions>
74
-</md-card>
75
-</form>	
124
+</td-layout-card-over>