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>