git.ipfire.org Git - thirdparty/paperless-ngx.git/blob

   1 <form [formGroup]="objectForm" (ngSubmit)="save()" autocomplete="off">
   2   <div class="modal-header">
   3     <h4 class="modal-title" id="modal-basic-title">{{getTitle()}}</h4>
   4     @if (object?.id) {
   5       <span class="badge bg-primary text-primary-text-contrast ms-2">ID: {{object.id}}</span>
   6     }
   7     <button type="button" [disabled]="!closeEnabled" class="btn-close" aria-label="Close" (click)="cancel()">
   8     </button>
   9   </div>
  10   <div class="modal-body">
  11     <pngx-input-text i18n-title title="Name" formControlName="name" [error]="error?.name" autocomplete="off"></pngx-input-text>
  12     <pngx-input-select i18n-title title="Data type" [items]="getDataTypes()" formControlName="data_type"></pngx-input-select>
  13     @if (typeFieldDisabled) {
  14       <small class="d-block mt-n2" i18n>Data type cannot be changed after a field is created</small>
  15     }
  16     <div [formGroup]="objectForm.controls.extra_data">
  17       @switch (objectForm.get('data_type').value) {
  18         @case (CustomFieldDataType.Select) {
  19           <button type="button" class="btn btn-sm btn-primary my-2" (click)="addSelectOption()">
  20             <span i18n>Add option</span>&nbsp;<i-bs name="plus-circle"></i-bs>
  21           </button>
  22           <div formArrayName="select_options">
  23             @for (option of objectForm.controls.extra_data.controls.select_options.controls; track option; let i = $index) {
  24               <div class="input-group input-group-sm my-2" [formGroup]="objectForm.controls.extra_data.controls.select_options.controls[i]">
  25                 <input #selectOption type="text" class="form-control" formControlName="label" autocomplete="off">
  26                 <input type="hidden" formControlName="id">
  27                 <button type="button" class="btn btn-outline-danger" (click)="removeSelectOption(i)" i18n>Delete</button>
  28               </div>
  29             }
  30           </div>
  31           @if (allSelectOptions.length > SELECT_OPTION_PAGE_SIZE) {
  32             <ngb-pagination
  33               class="d-flex justify-content-end"
  34               [pageSize]="SELECT_OPTION_PAGE_SIZE"
  35               [collectionSize]="allSelectOptions.length"
  36               [(page)]="selectOptionsPage"
  37               [maxSize]="5"
  38               size="sm"
  39             ></ngb-pagination>
  40           }
  41           @if (object?.id) {
  42             <small class="d-block mt-2" i18n>Warning: existing instances of this field will retain their current value index (e.g. option #1, #2, #3) after editing the options here</small>
  43           }
  44         }
  45         @case (CustomFieldDataType.Monetary) {
  46           <div class="my-3">
  47             <pngx-input-text i18n-title title="Default Currency" hint="3-character currency code" i18n-hint formControlName="default_currency" placeholder="Use locale" i18n-placeholder autocomplete="off"></pngx-input-text>
  48           </div>
  49         }
  50       }
  51     </div>
  52   </div>
  53   <div class="modal-footer">
  54     <button type="button" class="btn btn-outline-secondary" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
  55     <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive">Save</button>
  56   </div>
  57 </form>