diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/interface-operation/operation-creator')
5 files changed, 89 insertions, 18 deletions
diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html index 4acf424993..5848b585e9 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html @@ -157,6 +157,7 @@ [isAssociateWorkflow]="isUsingExistingWF()" [param]="param" [inputProps]="inputProperties" + [operationOutputs]="operationOutputs" [onRemoveParam]="onRemoveParam" [readonly]="readonly" [validityChanged]="validityChanged"> diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts index e746c6d6fe..fd9e1cf5a8 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts @@ -73,6 +73,7 @@ export class OperationCreatorComponent { assignOutputParameters: { [key: string]: { [key: string]: Array<OperationParameter>; }; } = {}; tableParameters: Array<OperationParameter> = []; + operationOutputs: Array<OperationModel> = []; associationOptions: Array<DropdownValue> = []; workflowAssociationType: string; @@ -134,6 +135,17 @@ export class OperationCreatorComponent { this.onSelectInterface(new DropDownOption(this.operation.interfaceType)); this.validityChanged(); + this.operationOutputs = _.reduce( + this.interfaces, + (acc: Array<OperationModel>, interf) => [ + ...acc, + ..._.filter( + interf.operations, + op => op.uniqueId !== this.operation.uniqueId + ), + ], + []); + if (this.enableWorkflowAssociation) { this.isLoading = true; this.workflowServiceNg2.getWorkflows().subscribe(workflows => { diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html index d23783715c..aa4277c004 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html @@ -38,14 +38,27 @@ </div> <div class="cell field-property" *ngIf="isInputParam"> - <ui-element-dropdown + <select *ngIf="filteredInputProps.length || !isAssociateWorkflow" - [testId]="'param-property-' + (param.name || 'unnamed')" - [values]="filteredInputProps" - [(value)]="param.inputId" - (valueChange)="onChangeProperty($event)" - [readonly]="readonly"> - </ui-element-dropdown> + [(ngModel)]="param.inputId" + (change)="onChangeProperty($event)" + [ngClass]="{'disabled': readonly}" + [attr.data-tests-id]="'value-param-property-' + (param.name || 'unnamed')"> + <option + *ngFor="let prop of filteredInputProps" + [ngValue]="prop.value"> + {{prop.label}} + </option> + <optgroup + *ngFor="let operation of operationOutputCats" + label="{{operation.operationName}}"> + <option + *ngFor="let output of operation.outputs" + [ngValue]="output.value"> + {{output.label}} + </option> + </optgroup> + </select> <span *ngIf="!filteredInputProps.length && isAssociateWorkflow" class="no-properties-error"> diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less index 99a54bb65c..f6cda17777 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less @@ -35,6 +35,10 @@ padding-left: 10px; } + select { + width: 100%; + } + &.field-property { &:last-child { flex: 1; diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts index 89aa251252..bfa2b11b1c 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts @@ -1,9 +1,20 @@ import {Component, Input} from '@angular/core'; import {DataTypeService} from "app/ng2/services/data-type.service"; -import {OperationParameter, InputBEModel} from 'app/models'; +import {OperationModel, OperationParameter, InputBEModel} from 'app/models'; import {DropDownOption} from "../operation-creator.component"; import {DropdownValue} from "app/ng2/components/ui/form-components/dropdown/ui-element-dropdown.component"; +class DropdownValueType extends DropdownValue { + type: String; + + constructor(value: string, label: string, type?: String) { + super(value, label); + if (type) { + this.type = type; + } + } +} + @Component({ selector: 'param-row', templateUrl: './param-row.component.html', @@ -13,6 +24,7 @@ import {DropdownValue} from "app/ng2/components/ui/form-components/dropdown/ui-e export class ParamRowComponent { @Input() param: OperationParameter; @Input() inputProps: Array<InputBEModel>; + @Input() operationOutputs: Array<OperationModel>; @Input() onRemoveParam: Function; @Input() isAssociateWorkflow: boolean; @Input() readonly: boolean; @@ -20,6 +32,7 @@ export class ParamRowComponent { @Input() validityChanged: Function; propTypeEnum: Array<string> = []; + operationOutputCats: Array<{ operationName: string, outputs: Array<DropdownValueType> }> = []; filteredInputProps: Array<DropdownValue> = []; constructor(private dataTypeService: DataTypeService) {} @@ -31,6 +44,7 @@ export class ParamRowComponent { prop => prop.type ) ); + this.onChangeType(); this.validityChanged(); } @@ -48,14 +62,31 @@ export class ParamRowComponent { prop => new DropdownValue(prop.uniqueId, prop.name) ); + this.operationOutputCats = _.filter( + _.map( + this.operationOutputs, + op => { + return { + operationName: `${op.displayType()}.${op.name}`, + outputs: _.map( + _.filter(op.outputs.listToscaDataDefinition, output => !this.param.type || output.type === this.param.type), + output => new DropdownValueType( + `${op.interfaceType}.${op.name}.${output.name}`, + output.name, + output.type + ) + ) + }; + } + ), + category => category.outputs.length > 0 + ); + if (this.param.inputId) { - const selProp = _.find( - this.getPrimitiveSubtypes(), - prop => prop.uniqueId === this.param.inputId - ); + const selProp = this.getSelectedProp(); if (selProp && selProp.type === this.param.type) { this.param.inputId = '-1'; - setTimeout(() => this.param.inputId = selProp.uniqueId, 100); + setTimeout(() => this.param.inputId = selProp.uniqueId || selProp.value, 0); } else { this.param.inputId = null; } @@ -65,10 +96,7 @@ export class ParamRowComponent { } onChangeProperty() { - const newProp = _.find( - this.getPrimitiveSubtypes(), - prop => this.param.inputId === prop.uniqueId - ); + const newProp = this.getSelectedProp(); if (!this.param.type) { this.param.type = newProp.type; @@ -76,7 +104,7 @@ export class ParamRowComponent { } if (!this.param.name) { - this.param.name = newProp.name; + this.param.name = newProp.name || newProp.label; } this.validityChanged(); @@ -108,6 +136,19 @@ export class ParamRowComponent { return flattenedProps; } + getSelectedProp() { + return _.find( + this.getPrimitiveSubtypes(), + prop => this.param.inputId === prop.uniqueId + ) || _.find( + _.reduce( + this.operationOutputCats, + (acc, cat) => [...acc, ...cat.outputs], + []), + (out: DropdownValueType) => this.param.inputId === out.value + ); + } + isTypePrimitive(type): boolean { return ( type === 'string' || |