From e5488e5e3623646125802b8ab7e12b7159a2c0d3 Mon Sep 17 00:00:00 2001 From: "andre.schmid" Date: Mon, 7 Mar 2022 18:48:09 +0000 Subject: Support complex types in artifact properties Adds support to complex types in artifact properties of an interface operation implementation. Change-Id: I7a82a3652541b35230fe4ce87bf703a1dbe72d50 Issue-ID: SDC-3899 Signed-off-by: andre.schmid --- .../input-list-item/input-list-item.component.ts | 3 +- .../input-list/input-list.component.html | 6 +++- .../input-list/input-list.component.spec.ts | 1 + .../input-list/input-list.component.ts | 5 +++- .../interface-operation-handler.component.html | 35 ++++++++++------------ .../interface-operation-handler.component.less | 7 +++++ .../interface-operation-handler.component.ts | 31 +++++++++++++++++++ 7 files changed, 66 insertions(+), 22 deletions(-) (limited to 'catalog-ui/src/app/ng2') diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts index cd75fe87e6..7c0465f62a 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts @@ -42,6 +42,7 @@ export class InputListItemComponent implements OnInit { @Input() isMapChild: boolean = false; @Input() listIndex: number; @Input() isViewOnly: boolean; + @Input() allowDeletion: boolean = false; @Output('onValueChange') onValueChangeEvent: EventEmitter = new EventEmitter(); @Output('onDelete') onDeleteEvent: EventEmitter = new EventEmitter(); @Output('onChildListItemDelete') onChildListItemDeleteEvent: EventEmitter = new EventEmitter(); @@ -145,7 +146,7 @@ export class InputListItemComponent implements OnInit { } showInputDelete(): boolean { - return !this.isViewOnly && (this.isRoot() || this.isMapChild); + return this.allowDeletion && !this.isViewOnly && (this.isRoot() || this.isMapChild); } resolveType(): string { diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.html b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.html index 802bd63838..273fc7eac1 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.html +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.html @@ -19,8 +19,11 @@ ~ ============LICENSE_END========================================================= --> - +
+
+ {{emptyMessage}} +
    diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.spec.ts b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.spec.ts index b07a4bb55f..99cfd21566 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.spec.ts +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.spec.ts @@ -34,6 +34,7 @@ class InputListItemStubComponent { @Input() dataTypeMap: any; @Input() valueObjRef: any; @Input() schema: any; + @Input() allowDeletion: any; @Input() isViewOnly: boolean; } diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.ts b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.ts index 72812d810d..832a40e841 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.ts +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list.component.ts @@ -45,10 +45,13 @@ export class InputListComponent { } @Input() dataTypeMap: Map; @Input() isViewOnly: boolean; + @Input() title: string; + @Input() emptyMessage: string; + @Input() allowDeletion: boolean = false; @Output('onValueChange') inputValueChangeEvent: EventEmitter = new EventEmitter(); @Output('onDelete') inputDeleteEvent: EventEmitter = new EventEmitter(); - _inputs: Array; + _inputs: Array = []; getDataType(type: string): DataTypeModel { return this.dataTypeMap.get(type); 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 46db3b94a9..ce4738a780 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 @@ -104,30 +104,27 @@
- -
-
- {{ 'IMPLEMENTATION_ARTIFACT_PROPERTY_NAME' | translate }} - {{ 'IMPLEMENTATION_ARTIFACT_PROPERTY_TYPE' | translate }} - {{ 'IMPLEMENTATION_ARTIFACT_PROPERTY_VALUE' | translate }} -
- -
-
{{ 'EMPTY_PARAM_TABLE_HEADER' | translate }}
-
- - -
+ +
diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less index cb47c8d167..5edf97f33c 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less @@ -22,6 +22,9 @@ @import '../../../../../../assets/styles/override.less'; .operation-handler { + overflow: scroll; + max-height: 700px; + max-width: 100%; font-family: @font-opensans-regular; user-select: none; padding-top: 12px; @@ -221,3 +224,7 @@ } } + +.operation-handler::-webkit-scrollbar-track { + border: 0; +} diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.ts b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.ts index ed295e867c..f357ddfc54 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.ts +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.ts @@ -66,6 +66,7 @@ export class InterfaceOperationHandlerComponent { toscaArtifactTypeSelected: string; toscaArtifactTypeProperties: Array = []; + artifactTypeProperties: Array = []; toscaArtifactTypes: Array = []; @@ -112,6 +113,7 @@ export class InterfaceOperationHandlerComponent { this.artifactVersion = this.operationToUpdate.implementation.artifactVersion; this.artifactName = this.operationToUpdate.implementation.artifactName; this.toscaArtifactTypeProperties = this.operationToUpdate.implementation.properties; + this.artifactTypeProperties = this.convertArtifactsPropertiesToInput(); this.getArtifactTypesSelected(); } @@ -142,6 +144,7 @@ export class InterfaceOperationHandlerComponent { this.artifactName = undefined; } this.toscaArtifactTypeProperties = undefined; + this.artifactTypeProperties = undefined; } else { this.getArtifactTypesSelected(); } @@ -158,6 +161,7 @@ export class InterfaceOperationHandlerComponent { artifact.artifactType = toscaArtifactType.type; artifact.properties = toscaArtifactType.properties; this.toscaArtifactTypeProperties = artifact.properties; + this.artifactTypeProperties = this.convertArtifactsPropertiesToInput(); this.toscaArtifactTypeSelected = artifact.artifactType; this.operationToUpdate.implementation = artifact; this.getArtifactTypesSelected(); @@ -225,6 +229,7 @@ export class InterfaceOperationHandlerComponent { this.toscaArtifactTypeSelected = this.operationToUpdate.implementation.artifactType; this.artifactVersion = this.operationToUpdate.implementation.artifactVersion; this.toscaArtifactTypeProperties = this.operationToUpdate.implementation.properties; + this.artifactTypeProperties = this.convertArtifactsPropertiesToInput(); this.enableAddArtifactImplementation = true; } this.validateRequiredField(); @@ -272,6 +277,15 @@ export class InterfaceOperationHandlerComponent { inputOperationParameter.value = changedInput.value; } + onArtifactPropertyValueChange(changedProperty: InputOperationParameter) { + if (changedProperty.value instanceof Object) { + changedProperty.value = JSON.stringify(changedProperty.value); + } + this.toscaArtifactTypeProperties.find(artifactProperty => artifactProperty.name == changedProperty.name); + const property = this.toscaArtifactTypeProperties.find(artifactProperty => artifactProperty.name == changedProperty.name); + property.value = changedProperty.value; + } + /** * Handles the add input event. * @param input the input to add @@ -304,4 +318,21 @@ export class InterfaceOperationHandlerComponent { currentInputs.splice(currentInputs.indexOf(input1), 1); this.inputs = Array.from(currentInputs); } + + private convertArtifactsPropertiesToInput(): Array { + if (!this.toscaArtifactTypeProperties) { + return []; + } + const inputList: Array = []; + this.toscaArtifactTypeProperties.forEach(property => { + const input = new InputOperationParameter(); + input.name = property.name; + input.type = property.type; + input.schema = property.schema; + input.toscaDefaultValue = property.defaultValue; + input.value = property.value; + inputList.push(input); + }); + return inputList; + } } -- cgit 1.2.3-korg