diff options
author | aribeiro <anderson.ribeiro@est.tech> | 2021-10-01 11:30:49 +0100 |
---|---|---|
committer | Andr� Schmid <andre.schmid@est.tech> | 2021-11-05 17:14:06 +0000 |
commit | 1de1692115d1df5b4e07c1feb21d098899a6604b (patch) | |
tree | 1e26079e5cc5dc708eb666611f98dd0fc0af571d /catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html | |
parent | 2b55a906b7115ff2b156b35a4ff66811157111ee (diff) |
Add UI support for adding tosca artifact types
UI support for adding artifacts to an interface operation implementation
Issue-ID: SDC-3768
Signed-off-by: aribeiro <anderson.ribeiro@est.tech>
Change-Id: I71b3e49a160521e35a45515ad7adef836f901e78
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html')
-rw-r--r-- | catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html | 75 |
1 files changed, 68 insertions, 7 deletions
diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html index f71102053a..428c4cd5ed 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.html @@ -41,7 +41,7 @@ </div> </div> - <div class="i-sdc-form-item"> + <div class="form-item"> <sdc-input label="{{'OPERATION_DESCRIPTION' | translate}}" [(value)]="operationToUpdate.description" @@ -50,12 +50,73 @@ </sdc-input> </div> - <div class="i-sdc-form-item"> - <sdc-input - label="{{'IMPLEMENTATION_NAME' | translate}}" - testId="interface-operation-implementation-name" - [(value)]="operationToUpdate.implementation.artifactName"> - </sdc-input> + <div class="group-with-border content-row"> + <label class="occurrences-label"> {{ 'INTERFACE_OPERATION_IMPLEMENTATION' | translate}}</label> + <div class="form-item"> + <checkbox [label]="'Add Artifact To Implementation'" + [(checked)]="enableAddArtifactImplementation" + (checkedChange)="onMarkToAddArtifactToImplementation($event)"> + </checkbox> + </div> + <div class="form-item" *ngIf="!enableAddArtifactImplementation"> + <sdc-input + label="{{'INTERFACE_OPERATION_IMPLEMENTATION_NAME' | translate}}" + testId="interface-operation-implementation-name" + [(value)]="artifactName" + (valueChange)="onImplementationNameChange($event)"> + </sdc-input> + </div> + + <div class="side-by-side" *ngIf="enableAddArtifactImplementation"> + <div class="form-item" *ngIf="toscaArtifactTypes"> + <sdc-dropdown + label="{{ 'TOSCA_ARTIFACT_TYPE' | translate }}" + testId="selectToscaArtifactType" + [required]="true" + [selectedOption]="toscaArtifactTypeSelected" + placeHolder="{{toscaArtifactTypeSelected != undefined ? toscaArtifactTypeSelected : 'Select...'}}" + (changed)="onSelectToscaArtifactType($event)" + [options]="toscaArtifactTypes"> + </sdc-dropdown> + </div> + <div class="form-item" *ngIf="toscaArtifactTypeSelected && enableAddArtifactImplementation"> + <sdc-input + label="{{ 'INTERFACE_OPERATION_IMPLEMENTATION_FILE' | translate }}" + data-tests-id="artifactFile" + [(value)]="artifactName" + [required]="true" + (valueChange)="onArtifactFileChange($event)"> + </sdc-input> + </div> + <div class="form-item"> + <sdc-input + label="{{ 'ARTIFACT_VERSION' | translate }}" + data-tests-id="artifactVersion" + [(value)]="artifactVersion" + (valueChange)="onArtifactVersionChange($event)"> + </sdc-input> + </div> + </div> + <div class="form-item" *ngIf="toscaArtifactTypeSelected && enableAddArtifactImplementation"> + <label class="sdc-input__label">{{ 'ENTITY_VIEWER_PROPERTIES_TAB' | translate }}</label> + <div class="generic-table"> + <div class="header-row table-row"> + <span class="cell header-cell field-input-name">{{ 'IMPLEMENTATION_ARTIFACT_PROPERTY_NAME' | translate }}</span> + <span class="cell header-cell field-input-type">{{ 'IMPLEMENTATION_ARTIFACT_PROPERTY_TYPE' | translate }}</span> + <span class="cell header-cell field-input-value">{{ 'IMPLEMENTATION_ARTIFACT_PROPERTY_VALUE' | translate }}</span> + </div> + + <div class="empty-msg data-row" *ngIf="!toscaArtifactTypeProperties.length"> + <div>{{ 'EMPTY_PARAM_TABLE_HEADER' | translate }}</div> + </div> + <property-param-row + *ngFor="let property of toscaArtifactTypeProperties" + class="data-row" + [artifactProperty]="property" + [isPropertyValueValid]="propertyValueValidation"> + </property-param-row> + </div> + </div> </div> <div class="separator-buttons"> |