diff options
Diffstat (limited to 'catalog-ui/src/app/ng2')
10 files changed, 75 insertions, 16 deletions
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html index 4553bcbd01..2431a70536 100644 --- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html +++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html @@ -43,9 +43,10 @@ <!-- RIGHT CELL OR FULL WIDTH CELL--> <ng-container *ngIf="propType == derivedPropertyTypes.SIMPLE || property.isDeclared || property.isToscaFunction() || (property.isChildOfListOrMap && propType == derivedPropertyTypes.MAP && property.schema.property.isSimpleType)"> <div class="table-cell"> + <checkbox class="inline-checkBox" *ngIf="(nestedLevel == 1 && property.isChildOfListOrMap && propType == derivedPropertyTypes.MAP && property.schema.property.isSimpleType)" [(checked)]="property.isSelected" [disabled]="property.isDisabled || readonly || property.mapKey == ''" (checkedChange)="toggleTosca.emit(property)" ></checkbox> <dynamic-element class="value-input" pattern="validationUtils.getValidationPattern(property.type)" - [value]="property.isDeclared || property.isToscaFunction() ? property.value : property.valueObj" + [value]="(property.isDeclared || property.isToscaFunction()) ? property.value : property.valueObj" [type]="property.isDeclared || property.isToscaFunction() ? 'string' : property.type" [name]="property.name" [path]="property.propertiesName" @@ -65,7 +66,7 @@ <div class="table-cell empty"></div> </ng-container> <!-- ICONS: add, delete, and expand --> - <ng-container *ngIf="!property.isDeclared && !property.isToscaFunction()"> + <ng-container *ngIf="(!property.isDeclared && !property.isToscaFunction()) || (property.isToscaFunction() && property.isChildOfListOrMap && propType == derivedPropertyTypes.MAP && property.schema.property.isSimpleType)"> <a *ngIf="(propType == derivedPropertyTypes.LIST) && (!property.isChildOfListOrMap || property.mapInlist)" class="property-icon add-item" (click)="createNewChildProperty();" [ngClass]="{'disabled':readonly || preventInsertItem(property)}" [attr.data-tests-id]="'add-to-list-' + propertyTestsId">Add value to list</a> <a *ngIf="(propType == derivedPropertyTypes.MAP) && (!property.isChildOfListOrMap || property.mapInlist)" class="property-icon add-item" (click)="createNewChildProperty();" [ngClass]="{'disabled':readonly || preventInsertItem(property)}" [attr.data-tests-id]="'add-to-list-' + propertyTestsId">Add value to map</a> <span *ngIf="property.isChildOfListOrMap" (click)="deleteItem.emit(property);" class="property-icon sprite-new delete-item-icon" [ngClass]="{'disabled':readonly}" [attr.data-tests-id]="'delete-from-list-' + propertyTestsId"></span> @@ -93,6 +94,7 @@ (clickOnPropertyRow)="onClickPropertyRow($event)" (checkProperty)="checkedChange($event)" (addChildPropsToParent)="addChildProps($event, prop.propertiesName)" + (toggleTosca)="toggleToscaFunction($event)" > </dynamic-property> </ng-container> diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.less b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.less index 1007292854..4d2cc89dfe 100644 --- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.less +++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.less @@ -81,4 +81,9 @@ outline: none; box-sizing: border-box; } - +.inline-checkBox { + float: left; + width: 7%; + margin-left: -5px; + margin-top: 4px; +} diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts index 6b018c160a..360cfac6a0 100644 --- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts +++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts @@ -27,6 +27,7 @@ import { trigger, state, style, transition, animate } from '@angular/animations' import {PropertiesUtils} from "../../../../pages/properties-assignment/services/properties.utils"; import {IUiElementChangeEvent} from "../../../ui/form-components/ui-element-base.component"; import {DynamicElementComponent} from "../../../ui/dynamic-element/dynamic-element.component"; +import {SubPropertyToscaFunction} from "app/models/sub-property-tosca-function"; @Component({ selector: 'dynamic-property', @@ -57,6 +58,7 @@ export class DynamicPropertyComponent { @Output('propertyChanged') emitter: EventEmitter<void> = new EventEmitter<void>(); @Output() expandChild: EventEmitter<string> = new EventEmitter<string>(); @Output() checkProperty: EventEmitter<string> = new EventEmitter<string>(); + @Output() toggleTosca: EventEmitter<DerivedFEProperty> = new EventEmitter<DerivedFEProperty>(); @Output() deleteItem: EventEmitter<string> = new EventEmitter<string>(); @Output() clickOnPropertyRow: EventEmitter<PropertyFEModel | DerivedFEProperty> = new EventEmitter<PropertyFEModel | DerivedFEProperty>(); @Output() mapKeyChanged: EventEmitter<string> = new EventEmitter<string>(); @@ -131,6 +133,10 @@ export class DynamicPropertyComponent { this.checkProperty.emit(propName); } + toggleToscaFunction = (prop: DerivedFEProperty) => { + this.toggleTosca.emit(prop); + } + getHasChildren = (property:DerivedFEProperty): boolean => {// enter to this function only from base property (PropertyFEModel) and check for child property if it has children return _.filter((<PropertyFEModel>this.property).flattenedChildren,(prop:DerivedFEProperty)=>{ return _.startsWith(prop.propertiesName + '#', property.propertiesName); @@ -222,6 +228,15 @@ export class DynamicPropertyComponent { delete itemParent.valueObjValidation[oldKey]; itemParent.valueObjIsValid = itemParent.calculateValueObjIsValid(); } + if (this.property.subPropertyToscaFunctions !== null) { + let tempSubToscaFunction: SubPropertyToscaFunction[] = []; + this.property.subPropertyToscaFunctions.forEach((item : SubPropertyToscaFunction, index) => { + if(item.subPropertyPath[0] != oldKey){ + tempSubToscaFunction.push(item); + } + }); + this.property.subPropertyToscaFunctions = tempSubToscaFunction; + } this.property.childPropMapKeyUpdated(item, null); // remove map key } else { const itemIndex: number = this.property.flattenedChildren.filter(prop => prop.parentName == item.parentName).map(prop => prop.propertiesName).indexOf(item.propertiesName); @@ -241,7 +256,15 @@ export class DynamicPropertyComponent { updateChildKeyInParent(childProp: DerivedFEProperty, newMapKey: string) { if (this.property instanceof PropertyFEModel) { + let oldKey = childProp.getActualMapKey(); this.property.childPropMapKeyUpdated(childProp, newMapKey); + if (this.property.subPropertyToscaFunctions != null) { + this.property.subPropertyToscaFunctions.forEach((item : SubPropertyToscaFunction) => { + if(item.subPropertyPath[0] === oldKey){ + item.subPropertyPath = [newMapKey]; + } + }); + } this.emitter.emit(); } } diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html index 2d8fa7705d..6e4edddeb4 100644 --- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html +++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html @@ -89,7 +89,7 @@ (expandChild)="property.updateExpandedChildPropertyId($event)" (clickOnPropertyRow)="onClickPropertyInnerRow($event, instanceId)" (checkProperty)="propertyChecked(property, $event)" - + (toggleTosca)="toggleToscaFunction($event)" > </dynamic-property> diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts index f78728695c..a0b401386b 100644 --- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts +++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts @@ -47,6 +47,7 @@ export class PropertiesTableComponent implements OnChanges { @Output() selectPropertyRow: EventEmitter<PropertyRowSelectedEvent> = new EventEmitter<PropertyRowSelectedEvent>(); @Output() updateCheckedPropertyCount: EventEmitter<boolean> = new EventEmitter<boolean>(); // only for hasDeclareOption @Output() updateCheckedChildPropertyCount: EventEmitter<boolean> = new EventEmitter<boolean>();//only for hasDeclareListOption + @Output() togggleToscaBtn: EventEmitter<boolean> = new EventEmitter<boolean>(); @Output() deleteProperty: EventEmitter<PropertyFEModel> = new EventEmitter<PropertyFEModel>(); private selectedPropertyToDelete: PropertyFEModel; @@ -108,6 +109,10 @@ export class PropertiesTableComponent implements OnChanges { } } + toggleToscaFunction = (prop: DerivedFEProperty) => { + this.togggleToscaBtn.emit(prop.isSelected); + }; + onDeleteProperty = () => { this.deleteProperty.emit(this.selectedPropertyToDelete); this.modalService.closeCurrentModal(); diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html index c01cf95b8b..1be3495510 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html @@ -36,6 +36,7 @@ (selectChildProperty)="selectChildProperty($event)" (updateCheckedPropertyCount)="updateCheckedPropertyCount($event)" (updateCheckedChildPropertyCount)="updateCheckedChildPropertyCount($event)" + (togggleToscaBtn)="togggleToscaBtn($event)" (selectInstanceRow)="selectInstanceRow($event)" (deleteProperty)="deleteProperty($event)"> </properties-table> @@ -77,7 +78,7 @@ </div> <button (click)="selectToscaFunctionAndValues()" *ngIf="isPropertiesTabSelected && !isSelf()" - [disabled]="checkedPropertiesCount != 1 || isReadonly || hasChangedData" + [disabled]="(checkedPropertiesCount != 1 || isReadonly || hasChangedData) && !enableToscaFunction" class="tlv-btn blue declare-button" data-tests-id="declare-button select-tosca-function">{{'TOSCA_FUNCTION_LABEL' | translate}}</button> <button class="tlv-btn blue declare-button" [disabled]="!checkedPropertiesCount || isReadonly || hasChangedData" (click)="declareProperties()" data-tests-id="declare-button declare-input">Declare Input</button> diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts index c3babc1e03..767acb41a7 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts @@ -96,6 +96,8 @@ export class PropertiesAssignmentComponent { selectedInstanceData: ComponentInstance | GroupInstance | PolicyInstance = null; checkedPropertiesCount: number = 0; checkedChildPropertiesCount: number = 0; + enableToscaFunction: boolean = false; + checkedToscaCount: number = 0; hierarchyPropertiesDisplayOptions: HierarchyDisplayOptions = new HierarchyDisplayOptions('path', 'name', 'childrens'); hierarchyInstancesDisplayOptions: HierarchyDisplayOptions = new HierarchyDisplayOptions('uniqueId', 'name', 'archived', null, 'iconClass'); @@ -578,16 +580,23 @@ export class PropertiesAssignmentComponent { private clearCheckedInstancePropertyValue() { const checkedInstanceProperty: PropertyBEModel = this.buildCheckedInstanceProperty(); + let currentValue = checkedInstanceProperty.value; checkedInstanceProperty.getInputValues = null; checkedInstanceProperty.value = null; checkedInstanceProperty.toscaFunction = null; if (checkedInstanceProperty instanceof PropertyDeclareAPIModel && (<PropertyDeclareAPIModel>checkedInstanceProperty).propertiesName){ const propertiesNameArray = (<PropertyDeclareAPIModel>checkedInstanceProperty).propertiesName; const parts = propertiesNameArray.split("#"); + const currentKey = checkedInstanceProperty.type === PROPERTY_TYPES.MAP ? (<DerivedFEProperty>checkedInstanceProperty.input).mapKey : null; if (propertiesNameArray.length > 1){ - const index = checkedInstanceProperty.subPropertyToscaFunctions.findIndex(existingSubPropertyToscaFunction => this.areEqual(existingSubPropertyToscaFunction.subPropertyPath, parts.slice(1))); + const index = checkedInstanceProperty.subPropertyToscaFunctions.findIndex(existingSubPropertyToscaFunction => this.areEqual(existingSubPropertyToscaFunction.subPropertyPath, currentKey != null ? [currentKey] : parts.slice(1))); checkedInstanceProperty.subPropertyToscaFunctions.splice(index, 1); } + if(currentValue !== null && currentKey !== null){ + let valueJson = JSON.parse(currentValue); + delete valueJson[currentKey]; + checkedInstanceProperty.value = JSON.stringify(valueJson); + } } if (this.selectedInstanceData instanceof ComponentInstance) { this.updateInstanceProperty(checkedInstanceProperty); @@ -603,18 +612,18 @@ export class PropertiesAssignmentComponent { if (checkedProperty instanceof PropertyDeclareAPIModel && (<PropertyDeclareAPIModel>checkedProperty).propertiesName){ const propertiesName = (<PropertyDeclareAPIModel>checkedProperty).propertiesName; const parts = propertiesName.split("#"); - + const currentKey = checkedProperty.type === PROPERTY_TYPES.MAP ? (<DerivedFEProperty>checkedProperty.input).mapKey : null; if (checkedProperty.subPropertyToscaFunctions == null){ checkedProperty.subPropertyToscaFunctions = []; } - let subPropertyToscaFunction = checkedProperty.subPropertyToscaFunctions.find(existingSubPropertyToscaFunction => this.areEqual(existingSubPropertyToscaFunction.subPropertyPath, parts.slice(1))); + let subPropertyToscaFunction = checkedProperty.subPropertyToscaFunctions.find(existingSubPropertyToscaFunction => this.areEqual(existingSubPropertyToscaFunction.subPropertyPath, currentKey != null ? [currentKey] : parts.slice(1))); if (!subPropertyToscaFunction){ subPropertyToscaFunction = new SubPropertyToscaFunction(); checkedProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction); } subPropertyToscaFunction.toscaFunction = toscaFunction; - subPropertyToscaFunction.subPropertyPath = parts.slice(1); - + subPropertyToscaFunction.subPropertyPath = currentKey != null ? [currentKey] : parts.slice(1); + } else { checkedProperty.subPropertyToscaFunctions = null; checkedProperty.toscaFunction = toscaFunction; @@ -634,6 +643,8 @@ export class PropertiesAssignmentComponent { updateInstanceProperty(instanceProperty: PropertyBEModel) { this.loadingProperties = true; + this.enableToscaFunction = false; + this.checkedToscaCount = 0; this.componentInstanceServiceNg2.updateInstanceProperties(this.component.componentType, this.component.uniqueId, this.selectedInstanceData.uniqueId, [instanceProperty]) .subscribe(() => { @@ -1154,6 +1165,15 @@ export class PropertiesAssignmentComponent { this.checkedChildPropertiesCount += (increment) ? 1 : -1; }; + togggleToscaBtn = (toscaFlag: boolean) : void => { + this.checkedToscaCount += toscaFlag ? 1 : -1; + if(this.checkedToscaCount == 1){ + this.enableToscaFunction = true; + }else{ + this.enableToscaFunction = false; + } + }; + setInputTabIndication = (numInputs: number): void => { this.propertyInputTabs.setTabIndication('Inputs', numInputs); }; diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts index 747de7c00f..876fc8e5fa 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts @@ -202,7 +202,7 @@ export class PropertiesUtils { } else if (prop.derivedDataType == DerivedPropertyType.LIST) { prop.valueObj = (prop.valueObj === null || typeof prop.valueObj != 'object') ? JSON.parse(prop.valueObj || '[]') : prop.valueObj; } else if (prop.derivedDataType == DerivedPropertyType.MAP) { - if (!prop.isChildOfListOrMap || !prop.schema.property.isSimpleType) { + if (!prop.isChildOfListOrMap) { prop.valueObj = (prop.valueObj === null || typeof prop.valueObj != 'object') ? JSON.parse(prop.valueObj || '{}') : prop.valueObj; } } diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts index e40a4d6e1e..bc73796672 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts @@ -18,7 +18,7 @@ */ import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from '@angular/core'; -import {ComponentMetadata, PropertyBEModel, PropertyDeclareAPIModel} from 'app/models'; +import {ComponentMetadata, PropertyBEModel, PropertyDeclareAPIModel, DerivedFEProperty} from 'app/models'; import {TopologyTemplateService} from "../../../services/component-services/topology-template.service"; import {WorkspaceService} from "../../workspace/workspace.service"; import {ToscaGetFunctionType} from "../../../../models/tosca-get-function-type"; @@ -101,8 +101,8 @@ export class ToscaFunctionComponent implements OnInit, OnChanges { if (this.property instanceof PropertyDeclareAPIModel && this.property.subPropertyToscaFunctions && (<PropertyDeclareAPIModel> this.property).propertiesName){ let propertiesPath = (<PropertyDeclareAPIModel> this.property).propertiesName.split("#"); if (propertiesPath.length > 1){ - propertiesPath = propertiesPath.slice(1); - let subPropertyToscaFunction = this.property.subPropertyToscaFunctions.find(subPropertyToscaFunction => this.areEqual(subPropertyToscaFunction.subPropertyPath, propertiesPath)); + let keyToFind = this.property.type === PROPERTY_TYPES.MAP ? [(<DerivedFEProperty>this.property.input).mapKey] : propertiesPath.slice(1); + let subPropertyToscaFunction = this.property.subPropertyToscaFunctions.find(subPropertyToscaFunction => this.areEqual(subPropertyToscaFunction.subPropertyPath, keyToFind !== null ? keyToFind : propertiesPath.slice(1))); if (subPropertyToscaFunction){ this.toscaFunction = subPropertyToscaFunction.toscaFunction; diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.ts index a32a4d0e45..0757e3d361 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.ts @@ -18,7 +18,7 @@ */ import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from '@angular/core'; -import {AttributeBEModel, ComponentMetadata, DataTypeModel, PropertyBEModel, PropertyModel, PropertyDeclareAPIModel} from 'app/models'; +import {AttributeBEModel, ComponentMetadata, DataTypeModel, PropertyBEModel, PropertyModel, PropertyDeclareAPIModel, DerivedFEProperty} from 'app/models'; import {TopologyTemplateService} from "../../../../services/component-services/topology-template.service"; import {WorkspaceService} from "../../../workspace/workspace.service"; import {PropertiesService} from "../../../../services/properties.service"; @@ -261,7 +261,7 @@ export class ToscaGetFunctionComponent implements OnInit, OnChanges { } private propertyTypeToString() { - if (this.isSubProperty()){ + if (this.isSubProperty() && this.property.type != PROPERTY_TYPES.MAP){ return this.getType((<PropertyDeclareAPIModel>this.property).propertiesName.split("#").slice(1), this.property.type); } if (this.property.schemaType) { @@ -367,6 +367,9 @@ export class ToscaGetFunctionComponent implements OnInit, OnChanges { private hasSameType(property: PropertyBEModel | AttributeBEModel): boolean { if (this.typeHasSchema(this.property.type)) { + if(this.property.type === PROPERTY_TYPES.MAP && this.property instanceof PropertyDeclareAPIModel && (<PropertyDeclareAPIModel> this.property).input instanceof DerivedFEProperty){ + return property.type === this.property.schema.property.type; + } if (!property.schema || !property.schema.property) { return false; } |