diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row')
3 files changed, 52 insertions, 13 deletions
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 9a5c101e87..1128d60e04 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 @@ -19,6 +19,7 @@ *ngIf="!isAssociateWorkflow" data-tests-id="paramName" [(value)]="param.name" + (valueChange)="onChangeName()" [readonly]="readonly"> </ui-element-input> <span *ngIf="isAssociateWorkflow">{{param.name}}</span> @@ -41,13 +42,14 @@ *ngIf="filteredInputProps.length || !isAssociateWorkflow" data-tests-id="paramProperty" [values]="filteredInputProps" - [(value)]="param.property" + value="paramId" + (valueChange)="onChangeProperty($event)" [readonly]="readonly"> </ui-element-dropdown> <span *ngIf="!filteredInputProps.length && isAssociateWorkflow" class="no-properties-error"> - No available properties of this type. + {{ 'PARAM_NONE_OF_TYPE' | translate }} </span> </div> @@ -55,15 +57,18 @@ <checkbox *ngIf="!isAssociateWorkflow" data-tests-id="paramMandatory" - [(checked)]="param.mandatory" + [(checked)]="param.required" [ngClass]="{'disabled':readonly}"> </checkbox> </div> <div class="cell remove" *ngIf="!isAssociateWorkflow && !readonly"> - <span - class="sprite-new delete-item-icon" - data-tests-id="removeInputParam" - (click)="onRemoveParam(param)"> - </span> + <svg-icon + name="trash-o" + mode="info" + size="small" + testId="removeInputParam" + (click)="onRemoveParam(param)" + [clickable]="true"> + </svg-icon> </div> 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 2c2625d778..99a54bb65c 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 @@ -5,7 +5,10 @@ align-items: center; justify-content: center; - .delete-item-icon { + svg-icon { + position: relative; + right: -3px; + &:hover { cursor: pointer; } 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 a12425d6e9..8837a17bd9 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,6 +1,7 @@ import {Component, Input} from '@angular/core'; import {DataTypeService} from "app/ng2/services/data-type.service"; import {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"; @Component({ @@ -16,8 +17,10 @@ export class ParamRowComponent { @Input() isAssociateWorkflow: boolean; @Input() readonly: boolean; @Input() isInputParam: boolean; + @Input() validityChanged: Function; - propTypeEnum: Array<String> = []; + paramId: string; + propTypeEnum: Array<DropDownOption> = []; filteredInputProps: Array<DropdownValue> = []; constructor(private dataTypeService: DataTypeService) {} @@ -26,20 +29,48 @@ export class ParamRowComponent { this.propTypeEnum = _.uniq( _.map( this.getPrimitiveSubtypes(), - prop => prop.type + prop => new DropDownOption(prop.type) ) ); this.onChangeType(); + this.validityChanged(); } - onChangeType() { + onChangeName() { + this.validityChanged(); + } + + onChangeType(paramId?: string) { this.filteredInputProps = _.map( _.filter( this.getPrimitiveSubtypes(), - prop => prop.type === this.param.type + prop => !this.param.type || prop.type === this.param.type ), prop => new DropdownValue(prop.uniqueId, prop.name) ); + if (paramId) { + this.paramId = paramId; + } + } + + onChangeProperty(paramId: string) { + this.param.inputId = paramId; + const newProp = _.find( + this.getPrimitiveSubtypes(), + prop => this.param.inputId === prop.uniqueId + ); + + if (!this.param.type) { + this.param.type = newProp.type; + this.onChangeType(paramId); + } else { + this.paramId = paramId; + } + + if (!this.param.name) { + this.param.name = newProp.name; + } + this.validityChanged(); } getPrimitiveSubtypes(): Array<InputBEModel> { |