721423c05c344219f814371298b4d7ae92305da3
[working/Evergreen.git] / Open-ILS / src / eg2 / src / app / share / fm-editor / fm-editor.component.html
1 <ng-template #dialogContent>
2   <div class="modal-header bg-info">
3     <h4 class="modal-title" i18n>Record Editor: {{recordLabel}}</h4>
4     <button type="button" class="close" 
5       i18n-aria-label aria-label="Close" 
6       (click)="dismiss('cross_click')">
7       <span aria-hidden="true">&times;</span>
8     </button>
9   </div>
10   <div class="modal-body">
11     <form #fmEditForm="ngForm" role="form" class="form-validated common-form striped-odd">
12       <div class="form-group row" *ngFor="let field of fields">
13         <div class="col-lg-3 offset-lg-1">
14           <label for="rec-{{field.name}}">{{field.label}}</label>
15         </div>
16         <div class="col-lg-7">
17
18           <span *ngIf="field.template">
19             <ng-container
20               *ngTemplateOutlet="field.template; context:customTemplateFieldContext(field)">
21             </ng-container> 
22           </span>
23
24           <span *ngIf="!field.template">
25
26             <span *ngIf="field.datatype == 'id' && !pkeyIsEditable">
27               {{record[field.name]()}}
28             </span>
29   
30             <input *ngIf="field.datatype == 'id' && pkeyIsEditable"
31               class="form-control"
32               name="{{field.name}}"
33               placeholder="{{field.label}}..."
34               i18n-placeholder
35               [readonly]="field.readOnly"
36               [required]="field.isRequired()"
37               [ngModel]="record[field.name]()"
38               (ngModelChange)="record[field.name]($event)"/>
39   
40             <input *ngIf="field.datatype == 'text' || field.datatype == 'interval'"
41               class="form-control"
42               name="{{field.name}}"
43               placeholder="{{field.label}}..."
44               i18n-placeholder
45               [readonly]="field.readOnly"
46               [required]="field.isRequired()"
47               [ngModel]="record[field.name]()"
48               (ngModelChange)="record[field.name]($event)"/>
49
50             <span *ngIf="field.datatype == 'timestamp'">
51               <eg-date-select
52                 (onChangeAsIso)="record[field.name]($event)"
53                 initialIso="{{record[field.name]()}}">
54               </eg-date-select>
55             </span>
56
57             <input *ngIf="field.datatype == 'int'"
58               class="form-control"
59               type="number"
60               name="{{field.name}}"
61               placeholder="{{field.label}}..."
62               i18n-placeholder
63               [readonly]="field.readOnly"
64               [required]="field.isRequired()"
65               [ngModel]="record[field.name]()"
66               (ngModelChange)="record[field.name]($event)"/>
67   
68             <input *ngIf="field.datatype == 'float'"
69               class="form-control"
70               type="number" step="0.1"
71               name="{{field.name}}"
72               placeholder="{{field.label}}..."
73               i18n-placeholder
74               [readonly]="field.readOnly"
75               [required]="field.isRequired()"
76               [ngModel]="record[field.name]()"
77               (ngModelChange)="record[field.name]($event)"/>
78   
79             <span *ngIf="field.datatype == 'money'">
80               <!-- in read-only mode display the local-aware currency -->
81               <input *ngIf="field.readOnly"
82                 class="form-control"
83                 type="number" step="0.1"
84                 name="{{field.name}}"
85                 [readonly]="field.readOnly"
86                 [required]="field.isRequired()"
87                 [ngModel]="record[field.name]() | currency"/>
88   
89               <input *ngIf="!field.readOnly"
90                 class="form-control"
91                 type="number" step="0.1"
92                 name="{{field.name}}"
93                 placeholder="{{field.label}}..."
94                 i18n-placeholder
95                 [readonly]="field.readOnly"
96                 [required]="field.isRequired()"
97                 [ngModel]="record[field.name]()"
98                 (ngModelChange)="record[field.name]($event)"/>
99             </span>
100   
101             <input *ngIf="field.datatype == 'bool'"
102               class="form-check-input"
103               type="checkbox"
104               name="{{field.name}}"
105               [readonly]="field.readOnly"
106               [ngModel]="record[field.name]()"
107               (ngModelChange)="record[field.name]($event)"/>
108   
109             <span *ngIf="field.datatype == 'link'"
110               [ngClass]="{nullable : !field.isRequired()}">
111               <select
112                 class="form-control"
113                 name="{{field.name}}"
114                 [disabled]="field.readOnly"
115                 [required]="field.isRequired()"
116                 [ngModel]="record[field.name]()"
117                 (ngModelChange)="record[field.name]($event)">
118                 <option *ngFor="let item of field.linkedValues" 
119                   [value]="item.id">{{item.name}}</option>
120               </select>
121             </span>
122   
123             <eg-org-select *ngIf="field.datatype == 'org_unit'"
124               placeholder="{{field.label}}..."
125               i18n-placeholder
126               [limitPerms]="modePerms[mode]"
127               [applyDefault]="field.orgDefaultAllowed"
128               [initialOrgId]="record[field.name]()"
129               (onChange)="record[field.name]($event)">
130             </eg-org-select>
131
132           </span>
133         </div>
134       </div>
135     </form>
136   </div>
137   <div class="modal-footer">
138     <button type="button" class="btn btn-success" *ngIf="mode == 'view'"
139       (click)="close()" i18n>Close</button>
140     <button type="button" class="btn btn-info" 
141       [disabled]="fmEditForm.invalid" *ngIf="mode != 'view'"
142       (click)="save()" i18n>Save</button>
143     <button type="button" class="btn btn-warning ml-2" *ngIf="mode != 'view'"
144       (click)="cancel()" i18n>Cancel</button>
145   </div>
146 </ng-template>