aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.html
blob: 0449da7d0508ffdefc5c06ba2287ac67a21c8d99 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!--
  ~ -
  ~  ============LICENSE_START=======================================================
  ~  Copyright (C) 2022 Nordix Foundation.
  ~  ================================================================================
  ~  Licensed under the Apache License, Version 2.0 (the "License");
  ~  you may not use this file except in compliance with the License.
  ~  You may obtain a copy of the License at
  ~
  ~       http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~  Unless required by applicable law or agreed to in writing, software
  ~  distributed under the License is distributed on an "AS IS" BASIS,
  ~  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~  See the License for the specific language governing permissions and
  ~  limitations under the License.
  ~
  ~  SPDX-License-Identifier: Apache-2.0
  ~  ============LICENSE_END=========================================================
  -->

<li [class.root]="isRoot()">
  <span class="input-info">
    <em class="sprite-new round-expand-icon" [class.open]="isExpanded" (click)="expandAndCollapse()"></em>
    <label class="input-label">{{name}}:</label> <em data-tests-id="input-type">{{resolveType()}}</em>
    <span class="sprite-new delete-btn" *ngIf="showInputDelete()" (click)="onInputDelete()"></span>
    <span class="sprite-new delete-btn" *ngIf="showListItemDelete()" (click)="onChildListItemDelete()"></span>
  </span>
  <ng-container *ngIf="isTypeSimple(type.name)">
    <ul *ngIf="isExpanded">
      <li class="input-value">
        <ng-container *ngIf="isViewOnly">
          {{valueObjRef}}<em class="empty-value" *ngIf="!valueObjRef">empty</em>
        </ng-container>
        <input *ngIf="!isViewOnly" [type]="getSimpleValueInputType()" name="value"
               [(ngModel)]="valueObjRef"
               (ngModelChange)="onValueChange($event)"
        />
      </li>
    </ul>
  </ng-container>
  <ng-container *ngIf="isTypeComplex(type.name)" >
      <ul *ngIf="isExpanded">
        <ng-container *ngFor="let property of this.type.properties">
          <app-input-list-item
              [name]="property.name"
              [type]="getDataType(property.type)"
              [dataTypeMap]="dataTypeMap"
              [valueObjRef]="valueObjRef[property.name]"
              [schema]="property.schema"
              [nestingLevel]="nestingLevel + 1"
              [isViewOnly]="isViewOnly"
              (onValueChange)="onPropertyValueChange($event)">
          </app-input-list-item>
        </ng-container>
      </ul>
  </ng-container>
  <ng-container *ngIf="isTypeList(type.name)">
    <ul *ngIf="isExpanded">
      <ng-container *ngFor="let value1 of valueObjRef; index as i; trackBy: trackByIndex">
        <li class="input-value" *ngIf="isTypeSimple(schema.property.type)">
          <ng-container *ngIf="isViewOnly">
            {{valueObjRef[i]}}
          </ng-container>
          <input type="text" *ngIf="!isViewOnly"
                 [(ngModel)]="valueObjRef[i]" (ngModelChange)="onListValueChange()" />
          <span class="sprite-new delete-btn" *ngIf="!isViewOnly" (click)="onListItemDelete(i)"></span>
        </li>
        <app-input-list-item *ngIf="!isTypeSimple(schema.property.type)"
            [name]="i+''"
            [type]="getDataType(schema.property.type)"
            [dataTypeMap]="dataTypeMap"
            [valueObjRef]="valueObjRef[i]"
            [schema]="schema"
            [nestingLevel]="nestingLevel + 1"
            [listIndex]="i"
            [isListChild]="true"
            [isViewOnly]="isViewOnly"
            (onValueChange)="onPropertyValueChange($event)"
            (onChildListItemDelete)="onListItemDelete($event)">
        </app-input-list-item>
      </ng-container>
      <li class="input-value" *ngIf="!isViewOnly">
        <a class="add-btn" (click)="addListElement()">{{'INPUT_LIST_ADD_LIST_ENTRY' | translate}}</a>
      </li>
    </ul>
  </ng-container>
  <ng-container *ngIf="isTypeMap(type.name)">
    <ul *ngIf="isExpanded">
      <ng-container *ngFor="let key of getObjectEntries(valueObjRef); index as i">
        <li class="input-value" *ngIf="isTypeSimple(schema.property.type)">
          <label class="input-label">{{key}}:</label>
          <ng-container *ngIf="isViewOnly">
            {{valueObjRef[key]}}
          </ng-container>
          <input type="text" *ngIf="!isViewOnly" [(ngModel)]="valueObjRef[key]" (ngModelChange)="onMapValueChange()"/>
          <span class="sprite-new delete-btn" *ngIf="!isViewOnly" (click)="onMapKeyDelete(key)"></span>
        </li>
        <app-input-list-item
            *ngIf="!isTypeSimple(schema.property.type)"
            [name]="key"
            [type]="getDataType(schema.property.type)"
            [dataTypeMap]="dataTypeMap"
            [valueObjRef]="valueObjRef[key]"
            [schema]="schema"
            [isMapChild]="true"
            [nestingLevel]="nestingLevel + 1"
            [isViewOnly]="isViewOnly"
            (onValueChange)="onPropertyValueChange($event)"
            (onDelete)="onMapKeyDelete($event)">
        </app-input-list-item>
      </ng-container>
      <li class="input-value" *ngIf="!isViewOnly">
        <input type="text" [(ngModel)]="mapEntryName" placeholder="{{ 'INPUT_LIST_MAP_KEY_PLACEHOLDER' | translate }}"/>
        <a class="add-btn" (click)="addMapEntry()">{{ 'INPUT_LIST_ADD_MAP_ENTRY' | translate }}</a>
      </li>
    </ul>
  </ng-container>
</li>