</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">
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',
export class ParamRowComponent {
@Input() param: OperationParameter;
@Input() inputProps: Array<InputBEModel>;
+ @Input() operationOutputs: Array<OperationModel>;
@Input() onRemoveParam: Function;
@Input() isAssociateWorkflow: boolean;
@Input() readonly: boolean;
@Input() validityChanged: Function;
propTypeEnum: Array<string> = [];
+ operationOutputCats: Array<{ operationName: string, outputs: Array<DropdownValueType> }> = [];
filteredInputProps: Array<DropdownValue> = [];
constructor(private dataTypeService: DataTypeService) {}
prop => prop.type
)
);
+
this.onChangeType();
this.validityChanged();
}
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;
}
}
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;
}
if (!this.param.name) {
- this.param.name = newProp.name;
+ this.param.name = newProp.name || newProp.label;
}
this.validityChanged();
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' ||