catalog-ui/src/app/ng2/components/ui/form-components/range-input/ui-element-range-input.component.html

   1 <!--
   2 *  ============LICENSE_START=======================================================
   3 *  Copyright (C) 2023 Nordix Foundation.
   4 *  ================================================================================
   5 *  Licensed under the Apache License, Version 2.0 (the "License");
   6 *  you may not use this file except in compliance with the License.
   7 *  You may obtain a copy of the License at
   8 *
   9 *       http://www.apache.org/licenses/LICENSE-2.0
  10 *
  11 *  Unless required by applicable law or agreed to in writing, software
  12 *  distributed under the License is distributed on an "AS IS" BASIS,
  13 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14 *  See the License for the specific language governing permissions and
  15 *  limitations under the License.
  16 *
  17 *  SPDX-License-Identifier: Apache-2.0
  18 *  ============LICENSE_END=========================================================
  19  -->
  20 <div class="w-sdc-form-columns-wrapper">
  21     <div class="w-sdc-form-column">
  22
  23             <input *ngIf="isFloatType()"
  24                 class="value-input"
  25                 [ngClass]="{'error': control.invalid, 'disabled':readonly}"
  26                 type="number"
  27                 step="0.01"
  28                 [name]="name"
  29                 [(ngModel)]="lowerBound"
  30                 [value]="getInRangeValue(0)"
  31                 (input)="onChangeMin()"
  32                 [attr.maxlength]="validation.propertyValue.max"
  33                 [attr.minlength]="validation.propertyValue.min"
  34                 [formControl]="control"
  35                 [attr.data-tests-id]="'valueMin-' + testId"
  36                 />
  37         <input *ngIf="isIntegerType()"
  38                class="value-input"
  39                [ngClass]="{'error': control.invalid, 'disabled':readonly}"
  40                type="number"
  41                [name]="name"
  42                [(ngModel)]="lowerBound"
  43                [value]="getInRangeValue(0)"
  44                (input)="onChangeMin()"
  45                [attr.maxlength]="validation.propertyValue.max"
  46                [attr.minlength]="validation.propertyValue.min"
  47                [formControl]="control"
  48                [attr.data-tests-id]="'valueMin-' + testId"
  49         />
  50         <input *ngIf="isStringType()"
  51                class="value-input"
  52                [ngClass]="{'error': control.invalid, 'disabled':readonly}"
  53                type="text"
  54                [name]="name"
  55                [(ngModel)]="lowerBound"
  56                [value]="getInRangeValue(0)"
  57                (input)="onChangeMin()"
  58                [attr.maxlength]="validation.propertyValue.max"
  59                [attr.minlength]="validation.propertyValue.min"
  60                [formControl]="control"
  61                [attr.data-tests-id]="'valueMin-' + testId"
  62         />
  63     </div>
  64     <div class="w-sdc-form-column">
  65             <input
  66                     class="value-input"
  67                     [ngClass]="{'error': control.invalid, 'disabled':readonly}"
  68                     [type]="isIntegerType() || isFloatType() ? 'number' : 'text'"
  69                     [name]="name"
  70                     [(ngModel)]="upperBound"
  71                     [value]="getInRangeValue(1)"
  72                     (input)="onChangeMax()"
  73                     [attr.maxlength]="validation.propertyValue.max"
  74                     [attr.minlength]="validation.propertyValue.min"
  75
  76                     [formControl]="control"
  77                     [attr.data-tests-id]="'valueMax-' + testId"
  78             />
  79
  80     </div>
  81 </div>