uoa-repository-manager-service/app/features/administration/forms/template-form/template-form.component.html

<div [formGroup]="templateForm">
  <div class="p-fluid p-formgrid"
       [ngClass]="{'p-grid': !dialogLayout}">

    <div class="p-field"
          *ngIf="!excludedFormControls?.includes('documentClassification')"
          [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="documentClassification">
        Document Classification
      </label>
      <p-dropdown inputId="documentClassification"
                  [options]="documentClassificationsList"
                  optionLabel="classificationName"
                  placeholder="Select"
                  formControlName="documentClassification"
                  (onChange)="documentClassificationSelected($event.value)"
                  [showClear]="true">
      </p-dropdown>
      <app-validation-message [control]="templateForm.get('documentClassification')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

    <div class="p-field"
         *ngIf="!excludedFormControls?.includes('categoryName')"
         [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="categoryName">
        Category Name
      </label>
      <p-autoComplete id="categoryName"
                      formControlName="categoryName"
                      [suggestions]="categoryNameSuggestions"
                      [forceSelection]="true"
                      (completeMethod)="autosuggestCategoryName($event)"
                      (onSelect)="categoryNameSelected($event)">
      </p-autoComplete>
      <app-validation-message [control]="templateForm.get('categoryName')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

    <div class="p-field"
         *ngIf="!excludedFormControls?.includes('categoryName')"
         [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="categoryCode">
        Category Code
      </label>
      <p-autoComplete id="categoryCode"
                      formControlName="categoryCode"
                      [suggestions]="categoryCodeSuggestions"
                      [forceSelection]="true"
                      (completeMethod)="autosuggestCategoryCode($event)"
                      (onSelect)="categoryCodeSelected($event)">
      </p-autoComplete>
      <app-validation-message [control]="templateForm.get('categoryCode')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

    <div class="p-field"
          *ngIf="!excludedFormControls?.includes('iPowerClient')"
          [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="iPowerClientName">
        iPower Client Name
      </label>
      <p-autoComplete id="iPowerClientName"
                      formControlName="iPowerClientName"
                      [suggestions]="iPowerClientNameSuggestions"
                      [forceSelection]="true"
                      (completeMethod)="autosuggestIPowerClientName($event)"
                      (onSelect)="iPowerClientNameSelected($event)">
      </p-autoComplete>
      <app-validation-message [control]="templateForm.get('iPowerClientName')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

    <div class="p-field"
          *ngIf="!excludedFormControls?.includes('iPowerClient')"
          [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="iPowerClientCode">
        iPower Client Code
      </label>
      <p-autoComplete id="iPowerClientCode"
                      formControlName="iPowerClientCode"
                      [suggestions]="iPowerClientCodeSuggestions"
                      [forceSelection]="true"
                      (completeMethod)="autosuggestIPowerClientCode($event)"
                      (onSelect)="iPowerClientCodeSelected($event)">
      </p-autoComplete>
      <app-validation-message [control]="templateForm.get('iPowerClientCode')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

    <div class="p-field"
         *ngIf="!excludedFormControls?.includes('documentSubclassification')"
         [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="documentSubclassification">
        Sub-Category Name
      </label>
      <p-dropdown inputId="documentSubclassification"
                  [options]="availableDocumentSubclassifications"
                  [disabled]="subCategoryCodeDisabled"
                  optionLabel="subclassificationName"
                  placeholder="Select a Document Classification first"
                  formControlName="documentSubclassification">
      </p-dropdown>
      <app-validation-message [control]="templateForm.get('documentSubclassification')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

    <div class="p-field"
         *ngIf="!excludedFormControls?.includes('abbyyTemplateCode')"
         [ngClass]="{'p-col-12 p-lg-4': !dialogLayout}">
      <label for="abbyyTemplateCode"
             >
        ABBYY Template Code
      </label>
      <input id="abbyyTemplateCode"
             type="text"
             pInputText
             formControlName="abbyyTemplateCode">
      <app-validation-message [control]="templateForm.get('abbyyTemplateCode')"
                              [validationMessage]="'This field is required.'"
                              [displayEvenIfPristine]="displayValidationMessagesEvenIfPristine">
      </app-validation-message>
    </div>

  </div>
</div>