catalog-ui/src/app/ng2/pages/properties-assignment/constraints/constraints.component.html

   1 <!--
   2   ~ -
   3   ~  ============LICENSE_START=======================================================
   4   ~  Copyright (C) 2022 Nordix Foundation.
   5   ~  ================================================================================
   6   ~  Licensed under the Apache License, Version 2.0 (the "License");
   7   ~  you may not use this file except in compliance with the License.
   8   ~  You may obtain a copy of the License at
   9   ~
  10   ~       http://www.apache.org/licenses/LICENSE-2.0
  11   ~
  12   ~  Unless required by applicable law or agreed to in writing, software
  13   ~  distributed under the License is distributed on an "AS IS" BASIS,
  14   ~  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15   ~  See the License for the specific language governing permissions and
  16   ~  limitations under the License.
  17   ~
  18   ~  SPDX-License-Identifier: Apache-2.0
  19   ~  ============LICENSE_END=========================================================
  20   -->
  21
  22 <div class="app-constraints">
  23   <form novalidate class="w-sdc-form two-columns">
  24     <div class="w-sdc-form-columns-wrapper" *ngFor="let constraint of constraints; let constraintIndex = index">
  25         <div class="w-sdc-form-column-small">
  26             <select class="i-sdc-form-select"
  27                     data-tests-id="constraints"
  28                     [disabled]="isViewOnly"
  29                     (change)="onChangeConstraintType(constraintIndex, $event.target.value)">
  30               <option *ngIf="constraint" [value]="constraint.type"
  31                       hidden selected>
  32                 {{ConstraintTypesMapping[constraint.type]}}
  33               </option>
  34               <option *ngFor="let constraintType of constraintTypes" [value]="constraintType">
  35                 {{ConstraintTypesMapping[constraintType]}}
  36               </option>
  37             </select>
  38         </div>
  39
  40
  41         <div class="w-sdc-form-columns-wrapper">
  42
  43           <div class="w-sdc-form-column">
  44             <div class="w-sdc-form-columns-wrapper" *ngIf="constraint.type == 'inRange'">
  45               <div class="w-sdc-form-column">
  46                 <input type="text" class="i-sdc-form-input myClass"
  47                       (change)="onChangeConstrainValueIndex(constraintIndex, $event.target.value, 0)"
  48                       [disabled]="isViewOnly"
  49                       [value]="getInRangeValue(constraintIndex, 0)"/>
  50               </div>
  51               <div class="w-sdc-form-column">
  52                 <input type="text" class="i-sdc-form-input myClass"
  53                       (change)="onChangeConstrainValueIndex(constraintIndex, $event.target.value, 1)"
  54                       [disabled]="isViewOnly"
  55                       [value]="getInRangeValue(constraintIndex, 1)"/>
  56               </div>
  57             </div>
  58
  59             <div *ngIf="constraint.type == 'validValues'">
  60               <div class="w-sdc-form-columns-wrapper-block">
  61                 <div class="add-btn add-list-item w-sdc-form-column-block"
  62                     [ngClass]="{'disabled': isViewOnly}"
  63                     (click)="addToList(constraintIndex)">Add to List</div>
  64               </div>
  65               <div class="w-sdc-form-columns-wrapper" *ngFor="let value of constraint.value; let valueIndex = index">
  66                 <div class="w-sdc-form-column">
  67                   <input type="text" class="i-sdc-form-input" [value]="value"
  68                         [disabled]="isViewOnly"
  69                         (change)="onChangeConstrainValueIndex(constraintIndex, $event.target.value, valueIndex)"/>
  70                 </div>
  71                 <div class="w-sdc-form-column">
  72                   <span class="sprite-new delete-btn" [ngClass]="{'disabled': isViewOnly}" (click)="removeFromList(constraintIndex, valueIndex)"></span>
  73                 </div>
  74               </div>
  75             </div>
  76
  77             <div *ngIf="constraint.type != 'inRange' && constraint.type != 'validValues'">
  78               <input type="text" class="i-sdc-form-input myClass"
  79                     (change)="onChangeConstraintValue(constraintIndex, $event.target.value)"
  80                     [value]="constraint.value"/>
  81             </div>
  82           </div>
  83
  84           <div class="w-sdc-form-column-vsmall">
  85               <span class="sprite-new delete-btn" [ngClass]="{'disabled': isViewOnly}" (click)="removeConstraint(constraintIndex)"></span>
  86           </div>
  87         </div>
  88
  89
  90     </div>
  91     <div class="w-sdc-form-columns-wrapper-small" *ngIf="!isViewOnly">
  92       <div class="add-btn add-list-item w-sdc-form-column-small" *ngIf="!isViewOnly" [ngClass]="{'disabled': isViewOnly}"
  93       (click)="addConstraint()"> Add Constraint </div>
  94   </div>
  95
  96   </form>
  97 </div>