2 * ============LICENSE_START=======================================================
4 * ================================================================================
5 * Copyright (C) 2021 Nordix Foundation. All rights reserved.
6 * ================================================================================
7 * Licensed under the Apache License, Version 2.0 (the "License");
8 * you may not use this file except in compliance with the License.
9 * You may obtain a copy of the License at
11 * http://www.apache.org/licenses/LICENSE-2.0
13 * Unless required by applicable law or agreed to in writing, software
14 * distributed under the License is distributed on an "AS IS" BASIS,
15 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 * See the License for the specific language governing permissions and
17 * limitations under the License.
18 * ============LICENSE_END=========================================================
21 <div class="operation-handler">
22 <loader [display]="isLoading" [size]="'large'" [relative]="true"></loader>
24 <form class="w-sdc-form">
26 <div class="side-by-side">
27 <div class="form-item">
29 label="{{ 'OPERATION_INTERFACE_TYPE' | translate }}"
31 [testId]="'interface-name'"
32 [selectedOption]="selectedInterfaceType"
33 [placeHolder]="'Select...'"
34 [disabled]="isViewOnly || isEdit"
35 (changed)="onSelectInterface($event)"
36 [options]="interfaceTypeOptions">
40 <div class="form-item">
42 #interfaceOperationDropDown
43 label="{{ 'OPERATION_NAME' | translate }}"
45 [testId]="'operation-name'"
46 [selectedOption]="selectedInterfaceOperation"
47 [placeHolder]="'Select...'"
48 [disabled]="isViewOnly || isEdit"
49 (changed)="onSelectOperation($event)"
50 [options]="interfaceOperationOptions">
55 <div class="form-item">
57 label="{{'OPERATION_DESCRIPTION' | translate}}"
58 [(value)]="operationToUpdate.description"
59 testId="interface-operation-description"
60 (valueChange)="onDescriptionChange($event)"
61 [disabled]=isViewOnly>
65 <div class="group-with-border content-row">
66 <label class="occurrences-label"> {{ 'INTERFACE_OPERATION_IMPLEMENTATION' | translate}}</label>
67 <div class="form-item">
69 label="{{'INTERFACE_OPERATION_IMPLEMENTATION_ARTIFACT_URI' | translate}}"
70 testId="interface-operation-implementation-name"
71 [(value)]="artifactName"
72 (valueChange)="onURIChange($event)"
73 [disabled]=isViewOnly>
77 <div class="form-item">
78 <checkbox [label]="'ADD_ARTIFACT_DETAILS' | translate"
79 [(checked)]="enableAddArtifactImplementation"
80 (checkedChange)="onMarkToAddArtifactToImplementation($event)"
81 [disabled]=isViewOnly>
84 <div class="form-item" *ngIf="toscaArtifactTypes && enableAddArtifactImplementation">
87 label="{{ 'TOSCA_ARTIFACT_TYPE' | translate }}"
88 testId="selectToscaArtifactType"
90 [selectedOption]="toscaArtifactTypeSelected"
91 placeHolder="{{toscaArtifactTypeSelected != undefined ? toscaArtifactTypeSelected : 'Select...'}}"
92 (changed)="onSelectToscaArtifactType($event)"
93 [options]="toscaArtifactTypes"
94 [disabled]=isViewOnly>
97 <div class="form-item" *ngIf="enableAddArtifactImplementation">
99 label="{{ 'ARTIFACT_VERSION' | translate }}"
100 data-tests-id="artifactVersion"
101 [(value)]="artifactVersion"
102 (valueChange)="onArtifactVersionChange($event)"
103 [disabled]=isViewOnly>
106 <div class="form-item" *ngIf="toscaArtifactTypeSelected && enableAddArtifactImplementation">
109 *ngIf="artifactTypeProperties && dataTypeMap"
110 [title]="'ARTIFACT_PROPERTY_LIST_TITLE' | translate"
111 [emptyMessage]="'ARTIFACT_PROPERTY_LIST_EMPTY' | translate"
112 [inputs]="artifactTypeProperties"
113 [dataTypeMap]="dataTypeMap"
114 [isViewOnly]="isViewOnly"
115 [showToscaFunctionOption]="true"
116 [componentInstanceMap]="componentInstanceMap"
117 [allowDeletion]="false"
118 [customToscaFunctions]="customToscaFunctions"
119 (onInputsValidityChange)="implementationPropsValidityChange($event)"
120 (onValueChange)="onArtifactPropertyValueChange($event)"
125 <div class="group-with-border content-row" *ngIf="dataTypeMap">
127 [title]="'INPUT_LIST_TITLE' | translate"
128 [emptyMessage]="'INPUT_LIST_EMPTY' | translate"
130 [dataTypeMap]="dataTypeMap"
131 [isViewOnly]="isViewOnly"
132 [allowDeletion]="true"
133 [componentInstanceMap]="componentInstanceMap"
134 [showToscaFunctionOption]="true"
135 (onValueChange)="onInputValueChange($event)"
136 (onInputsValidityChange)="implementationPropsValidityChange($event)"
137 (onDelete)="onInputDelete($event)"
141 <div class="group-with-border content-row">
143 [dataTypeMap]="dataTypeMap$"
144 [isView]="isViewOnly"
145 [existingInputNames]="collectInputNames()"
146 (onAddInput)="onAddInput($event)"
150 <div class="group-with-border content-row">
151 <label class="sdc-timeout-label">Timeout : </label>
152 <input class="sdc-timeout" type="number" [formControl]="timeoutValue" oninput="this.value = this.valueAsNumber" [ngClass]="{'disabled':isViewOnly}" (change)="timeoutConversion()"/>
153 <select class="sdc-timeout-select" [formControl]="timeoutType" (change)="timeoutConversion()" [ngClass]="{'disabled':isViewOnly}">
154 <option value="sec">Seconds</option>
155 <option value="hour">Hours</option>
156 <option value="day">Days</option>
160 <div class="group-with-border content-row">
161 <label class="sub-operations-label"> Sub operations </label>
162 <tabs tabStyle="basic-tabs" [hideIndicationOnTabChange]="true" (tabChanged)="tabChanged($event)">
163 <div *ngFor="let milestone of milestones">
164 <tab tabTitle="{{milestone}}" [active]="isActiveTab(milestone)" [highlight]="isInvalidActivity(milestone)">
166 [customToscaFunctions]="customToscaFunctions"
167 [activitiesExist]="getExistingActivities(milestone) ? true : false"
168 [isViewOnly]="isViewOnly"
169 [componentInstanceMap]="componentInstanceMap"
170 [existingFilters]="getExistingFilters(milestone)"
171 (filtersChangeEvent)="filtersChangeEvent($event, milestone)">
174 [isViewOnly]="isViewOnly"
175 [dataTypeMap]="dataTypeMap"
176 [dataTypeMap$]="dataTypeMap$"
177 [componentInstanceMap]="componentInstanceMap"
178 [existingActivities]="getExistingActivities(milestone)"
179 (activitiesChangeEvent)="activitiesChangeEvent($event, milestone)">