diff options
Diffstat (limited to 'catalog-ui')
10 files changed, 331 insertions, 157 deletions
diff --git a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html index 78aa7bc7f4..afbd520532 100644 --- a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html +++ b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html @@ -30,93 +30,116 @@ </div> </div> <!--<div class="property-value">--> - <div data-ng-if="dataTypesService.isDataTypeForDataTypePropertyType(property)" class="inner-structure"> - <fields-structure value-obj-ref="(valueObjRef[property.name])" - type-name="property.type" - parent-property="parentProperty" - component-instance-map="componentInstanceMap" - parent-form-obj="parentFormObj" - fields-prefix-name="fieldsPrefixName+property.name" - read-only="readOnly" - is-service="isService" - default-value="{{currentTypeDefaultValue[property.name]}}"> - - </fields-structure> - </div> - <div data-ng-if="!dataTypesService.isDataTypeForDataTypePropertyType(property)" ng-switch="property.type"> - <div ng-switch-when="map"> - <type-map value-obj-ref="valueObjRef[property.name]" - schema-property="property.schema.property" - parent-property="property" - component-instance-map="componentInstanceMap" - parent-form-obj="parentFormObj" - fields-prefix-name="fieldsPrefixName+property.name" - read-only="readOnly" - default-value="{{currentTypeDefaultValue[property.name]}}" - is-service="isService" - types="types"></type-map> + <div class="inner-structure tosca-box tosca-parent"> + <div class="tosca-box" data-ng-if="complexToscapath == null"> + <form class="temp-form" data-ng-if="isService"> + <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}" data-ng-checked="verifyTosca(property.name) == false" data-ng-click="onEnableTosca(false,property.name)"/> + Value + <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}" data-ng-checked="verifyTosca(property.name)" data-ng-click="onEnableTosca(true,property.name)" /> + {{'TOSCA_FUNCTION_LABEL' | translate}} + </form> </div> - <div ng-switch-when="list"> - <type-list value-obj-ref="valueObjRef[property.name]" - schema-property="property.schema.property" - parent-property="parentProperty" - component-instance-map="componentInstanceMap" - parent-form-obj="parentFormObj" - fields-prefix-name="fieldsPrefixName+property.name" - read-only="readOnly" - default-value="{{currentTypeDefaultValue[property.name]}}" - is-service="isService" - types="types"></type-list> + <div data-ng-if="verifyTosca(property.name)" class="div-tosca-function"> + <tosca-function [property]="getSubProperty(property.name)" + [component-instance-map]="componentInstanceMap" + [allow-clear]="false" + [composition-map]="true" + [composition-map-key]="property.name" + (on-valid-function)="onGetToscaFunction($event,property.name)" + > + </tosca-function> + </div> + <div data-ng-if="dataTypesService.isDataTypeForDataTypePropertyType(property) && !verifyTosca(property.name)" class="tosca-box"> + <fields-structure value-obj-ref="(valueObjRef[property.name])" + type-name="property.type" + parent-property="parentProperty" + component-instance-map="componentInstanceMap" + parent-form-obj="parentFormObj" + fields-prefix-name="fieldsPrefixName+property.name" + read-only="readOnly" + is-service="isService" + complex-toscapath="property.name" + default-value="{{currentTypeDefaultValue[property.name]}}"> + + </fields-structure> </div> - <div ng-switch-default class="primitive-value-field"> - <div class="i-sdc-form-item" data-ng-class="{error:(parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid)}"> - <!-- Has Constraints --> + <div data-ng-if="!dataTypesService.isDataTypeForDataTypePropertyType(property) && !verifyTosca(property.name)" ng-switch="property.type" class="tosca-box"> + <div ng-switch-when="map"> + <type-map value-obj-ref="valueObjRef[property.name]" + schema-property="getSubProperty(property.name).schema.property" + parent-property="getSubProperty(property.name)" + component-instance-map="componentInstanceMap" + parent-form-obj="parentFormObj[fieldsPrefixName + property.name]" + fields-prefix-name="fieldsPrefixName+property.name" + read-only="readOnly" + default-value="{{currentTypeDefaultValue[property.name]}}" + is-service="isService" + complex-toscapath="property.name" + types="types"></type-map> + </div> + <div ng-switch-when="list"> + <type-list value-obj-ref="valueObjRef[property.name]" + schema-property="getSubProperty(property.name).schema.property" + parent-property="getSubProperty(property.name)" + component-instance-map="componentInstanceMap" + parent-form-obj="parentFormObj[fieldsPrefixName + property.name]" + fields-prefix-name="fieldsPrefixName+property.name" + read-only="readOnly" + default-value="{{currentTypeDefaultValue[property.name]}}" + is-service="isService" + complex-toscapath="property.name" + types="types"></type-list> + </div> + <div ng-switch-default class="primitive-value-field"> + <div class="i-sdc-form-item" data-ng-class="{error:(parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid)}"> + <!-- Has Constraints --> - <!--<select class="i-sdc-form-select"--> - <!--ng-if="(property.constraints)"--> - <!--data-ng-disabled="readOnly"--> - <!--name="{{fieldsPrefixName+property.name}}"--> - <!--data-ng-change="onValueChange(property.name,'constraintsChange')"--> - <!--data-ng-model="valueObjRef[property.name]"--> - <!-->--> - <!--<!– Get the default value in case exist –>--> - <!--<option value = "{{valueObjRef[property.name]}}" name = "{{valueObjRef[property.name]}}" hidden selected>--> - <!--{{valueObjRef[property.name]}}--> - <!--</option> --> - <!--<!– add all constratint to Select list –>--> - <!--<option ng-repeat='value in property.constraints[0].validValues' value="{{value}}" >--> - <!--{{value}}--> - <!--</option> --> - <!--</select>--> - <!-- Input without constraints --> - <input class="i-sdc-form-input" - data-tests-id="{{fieldsPrefixName+property.name}}" - ng-if="!((property.simpleType||property.type) == 'boolean')" - data-ng-maxlength="100" - data-ng-readonly="readOnly" - maxlength="{{(property.simpleType||property.type) == 'integer'? 10 : 100}}" - data-ng-model="valueObjRef[property.name]" - type="text" - name="{{fieldsPrefixName+property.name}}" - data-ng-pattern="getValidationPattern((property.simpleType||property.type))" - data-ng-model-options="{ debounce: 200 }" - data-ng-change="inputOnValueChange(property)" - autofocus - /> - <select class="i-sdc-form-select" + <!--<select class="i-sdc-form-select"--> + <!--ng-if="(property.constraints)"--> + <!--data-ng-disabled="readOnly"--> + <!--name="{{fieldsPrefixName+property.name}}"--> + <!--data-ng-change="onValueChange(property.name,'constraintsChange')"--> + <!--data-ng-model="valueObjRef[property.name]"--> + <!-->--> + <!--<!– Get the default value in case exist –>--> + <!--<option value = "{{valueObjRef[property.name]}}" name = "{{valueObjRef[property.name]}}" hidden selected>--> + <!--{{valueObjRef[property.name]}}--> + <!--</option> --> + <!--<!– add all constratint to Select list –>--> + <!--<option ng-repeat='value in property.constraints[0].validValues' value="{{value}}" >--> + <!--{{value}}--> + <!--</option> --> + <!--</select>--> + <!-- Input without constraints --> + <input class="i-sdc-form-input" data-tests-id="{{fieldsPrefixName+property.name}}" - ng-if="(property.simpleType||property.type) == 'boolean'" - data-ng-disabled="readOnly" - name="{{fieldsPrefixName+property.name}}" - data-ng-change="onValueChange(property.name,'boolean')" + ng-if="!((property.simpleType||property.type) == 'boolean')" + data-ng-maxlength="100" + data-ng-readonly="readOnly" + maxlength="{{(property.simpleType||property.type) == 'integer'? 10 : 100}}" data-ng-model="valueObjRef[property.name]" - data-ng-options="option.v as option.n for option in [{ n: '', v: undefined }, { n: 'false', v: false }, { n: 'true', v: true }]"> - </select> + type="text" + name="{{fieldsPrefixName+property.name}}" + data-ng-pattern="getValidationPattern((property.simpleType||property.type))" + data-ng-model-options="{ debounce: 200 }" + data-ng-change="inputOnValueChange(property,valueObjRef[property.name])" + autofocus + /> + <select class="i-sdc-form-select" + data-tests-id="{{fieldsPrefixName+property.name}}" + ng-if="(property.simpleType||property.type) == 'boolean'" + data-ng-disabled="readOnly" + name="{{fieldsPrefixName+property.name}}" + data-ng-change="onValueChange(property.name,'boolean')" + data-ng-model="valueObjRef[property.name]" + data-ng-options="option.v as option.n for option in [{ n: '', v: undefined }, { n: 'false', v: false }, { n: 'true', v: true }]"> + </select> - <div class="input-error" data-ng-show="parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid"> - <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '100' }"></span> - <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span> - <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.customValidation" translate="PROPERTY_EDIT_MAP_UNIQUE_KEYS"></span> + <div class="input-error" data-ng-show="parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid"> + <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '100' }"></span> + <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span> + <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.customValidation" translate="PROPERTY_EDIT_MAP_UNIQUE_KEYS"></span> + </div> </div> </div> </div> diff --git a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.less b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.less index abca49d7a3..de1f423fcb 100644 --- a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.less +++ b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.less @@ -92,3 +92,15 @@ } } +.temp-form { + all: unset; + margin-left: 6px !important; +} +.tosca-box { + display: block !important; + all : unset; +} +.tosca-parent { + margin-left: 10px; +} + diff --git a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts index 30c7b06733..37ca36a371 100644 --- a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts +++ b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts @@ -22,11 +22,14 @@ * Created by obarda on 1/27/2016. */ 'use strict'; -import { DataTypesMap, PropertyModel } from 'app/models'; +import { DataTypesMap, DerivedFEProperty, PropertyDeclareAPIModel, PropertyModel } from 'app/models'; import { DataTypePropertyModel } from 'app/models/data-type-properties'; import { DataTypesService } from 'app/services'; import { ValidationUtils } from 'app/utils'; -import {InstanceFeDetails} from "app/models/instance-fe-details"; +import { PropertiesUtils } from "../../../ng2/pages/properties-assignment/services/properties.utils"; +import { InstanceFeDetails } from "app/models/instance-fe-details"; +import { SubPropertyToscaFunction } from 'app/models/sub-property-tosca-function'; +import { ToscaGetFunction } from 'app/models/tosca-get-function'; import * as _ from 'lodash'; export interface IDataTypeFieldsStructureScope extends ng.IScope { @@ -47,12 +50,20 @@ export interface IDataTypeFieldsStructureScope extends ng.IScope { dataTypesService: DataTypesService; constraints: string[]; isService:boolean; + showToscaFunction: Map<string, boolean>; + subpropertyMap: Map<string, PropertyDeclareAPIModel>; + complexToscapath: string; expandAndCollapse(): void; getValidationPattern(type: string): RegExp; validateIntRange(value: string): boolean; onValueChange(propertyName: string, type: string): void; - inputOnValueChange(property: any): void; + inputOnValueChange(property: any, value: any): void; + onEnableTosca(toscaFlag:boolean,propertyName:string); + verifyTosca(propertyName: string) : boolean; + getSubProperty(propertyName: string) : PropertyDeclareAPIModel; + getToscaPathValue(propertyName: string) : Array<string>; + onGetToscaFunction(toscaGetFunction: ToscaGetFunction, propertyName:string); } export class DataTypeFieldsStructureDirective implements ng.IDirective { @@ -70,7 +81,8 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective { defaultValue: '@', types: '=', expandByDefault: '=', - isService: '=' + isService: '=', + complexToscapath: '=' }; restrict = 'E'; @@ -78,13 +90,15 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective { constructor(private DataTypesService: DataTypesService, private PropertyNameValidationPattern: RegExp, - private ValidationUtils: ValidationUtils) { + private ValidationUtils: ValidationUtils, + private PropertiesUtils: PropertiesUtils) { } public static factory = (DataTypesService: DataTypesService, PropertyNameValidationPattern: RegExp, - ValidationUtils: ValidationUtils) => { - return new DataTypeFieldsStructureDirective(DataTypesService, PropertyNameValidationPattern, ValidationUtils); + ValidationUtils: ValidationUtils, + PropertiesUtils: PropertiesUtils) => { + return new DataTypeFieldsStructureDirective(DataTypesService, PropertyNameValidationPattern, ValidationUtils, PropertiesUtils); } template = (): string => { return require('./data-type-fields-structure.html'); @@ -96,7 +110,20 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective { scope.$watchCollection('[typeName,fieldsPrefixName]', (newData: any): void => { this.rerender(scope); }); - + let childProp = this.PropertiesUtils.convertAddPropertyBAToPropertyFE(scope.parentProperty); + scope.subpropertyMap = new Map<string,PropertyDeclareAPIModel>(); + scope.showToscaFunction = new Map<string,boolean>(); + childProp.flattenedChildren.forEach(prop => { + scope.showToscaFunction.set(prop.name,false); + if (scope.parentProperty.subPropertyToscaFunctions != null) { + scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => { + if (SubPropertyToscaFunction.subPropertyPath.toString() == prop.name) { + scope.showToscaFunction.set(prop.name,true); + } + }); + } + scope.subpropertyMap.set(prop.name,new PropertyDeclareAPIModel(childProp, prop)); + }); scope.expandAndCollapse = (): void => { if (!scope.expanded) { this.initDataOnScope(scope, $attr); @@ -130,6 +157,65 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective { || scope.onValueChange(property.name, (property.simpleType || property.type))); return value; }; + + scope.onEnableTosca = (toscaFlag:boolean,key:string):void => { + scope.showToscaFunction.set(key,toscaFlag); + scope.valueObjRef[key] = ""; + if (!toscaFlag) { + if (scope.parentProperty.subPropertyToscaFunctions != null) { + let subToscaFunctionList : Array<SubPropertyToscaFunction> = []; + scope.parentProperty.subPropertyToscaFunctions.forEach((SubPropertyToscaFunction, index) => { + if (SubPropertyToscaFunction.subPropertyPath.toString() != key) { + subToscaFunctionList.push(SubPropertyToscaFunction); + } + }); + scope.parentProperty.subPropertyToscaFunctions = subToscaFunctionList; + } + } + }; + + scope.verifyTosca = (propName:string) : boolean => { + return scope.showToscaFunction.get(propName); + } + + scope.getSubProperty = (propertyName: string) : PropertyDeclareAPIModel => { + return scope.subpropertyMap.get(propertyName); + } + + scope.getToscaPathValue = (propertyName: string) : Array<string> => { + const parentObj : PropertyDeclareAPIModel = scope.subpropertyMap.get(propertyName); + if (parentObj.input instanceof DerivedFEProperty) { + return parentObj.input.toscaPath; + } + return [propertyName]; + } + + scope.onGetToscaFunction = (toscaGetFunction: ToscaGetFunction, key:string): void => { + let toscaPath = key; + scope.valueObjRef[key] = ""; + if (scope.parentProperty.subPropertyToscaFunctions != null) { + let toscaFlag : boolean = true + scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => { + if (SubPropertyToscaFunction.subPropertyPath.toString() == toscaPath) { + SubPropertyToscaFunction.toscaFunction = toscaGetFunction; + toscaFlag = false; + return; + } + }); + if (toscaFlag) { + let subPropertyToscaFunction = new SubPropertyToscaFunction(); + subPropertyToscaFunction.toscaFunction = toscaGetFunction; + subPropertyToscaFunction.subPropertyPath = [toscaPath]; + scope.parentProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction); + } + } else { + let subPropertyToscaFunction = new SubPropertyToscaFunction(); + subPropertyToscaFunction.toscaFunction = toscaGetFunction; + subPropertyToscaFunction.subPropertyPath = [toscaPath]; + scope.parentProperty.subPropertyToscaFunctions = [subPropertyToscaFunction]; + } + } + } // public types=Utils.Constants.PROPERTY_DATA.TYPES; @@ -191,4 +277,4 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective { } } -DataTypeFieldsStructureDirective.factory.$inject = ['Sdc.Services.DataTypesService', 'PropertyNameValidationPattern', 'ValidationUtils']; +DataTypeFieldsStructureDirective.factory.$inject = ['Sdc.Services.DataTypesService', 'PropertyNameValidationPattern', 'ValidationUtils','PropertiesUtils']; diff --git a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html index 1455f2742f..109c9a9ec9 100644 --- a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html +++ b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html @@ -15,12 +15,13 @@ --> <div class="dt-list"> - <div data-ng-repeat="i in getNumber(valueObjRef.length) track by $index" class="dt-list-item"> + <div data-ng-if="valueObjRef.length > 0" data-ng-repeat="i in getNumber(valueObjRef.length) track by $index" class="dt-list-item"> <span class="delete-dt-list-item" data-ng-click="deleteListItem($index)"></span> <div data-ng-if="isSchemaTypeDataType"> <fields-structure value-obj-ref="valueObjRef[$index]" type-name="schemaProperty.type" parent-form-obj="parentFormObj" + parent-property="parentProperty" fields-prefix-name="fieldsPrefixName+''+$index" types="types" read-only="readOnly"></fields-structure> @@ -28,7 +29,7 @@ <div data-ng-if="!isSchemaTypeDataType"> <div class="i-sdc-form-item list-new-item" data-ng-class="{error:(parentFormObj['listNewItem'+fieldsPrefixName].$dirty && parentFormObj['listNewItem'+fieldsPrefixName].$invalid)}" ng-if="schemaProperty.type !== 'map'"> - <form class="temp-form" data-ng-if="isService"> + <form class="temp-form" data-ng-if="isService && complexToscapath == null"> <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}-{{$index}}" data-ng-checked="{{showToscaFunction[$index] == false}}" data-ng-click="onEnableTosca(false,$index)"/> Value <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}-{{$index}}" data-ng-checked="{{showToscaFunction[$index]}}" data-ng-click="onEnableTosca(true,$index)" /> diff --git a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts index 40a29da5fb..18c46b4bac 100644 --- a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts +++ b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts @@ -47,6 +47,7 @@ export interface ITypeListScope extends ng.IScope { constraints:string[]; types:DataTypesMap; isService:boolean; + complexToscapath: string; getValidationPattern(type:string):RegExp; validateIntRange(value:string):boolean; @@ -85,7 +86,8 @@ export class TypeListDirective implements ng.IDirective { maxLength: '=', constraints: '=', types: '=', - isService: '=' + isService: '=', + complexToscapath: '=' }; restrict = 'E'; @@ -123,22 +125,26 @@ export class TypeListDirective implements ng.IDirective { link = (scope:ITypeListScope, element:any, $attr:any) => { scope.propertyNameValidationPattern = this.PropertyNameValidationPattern; scope.stringSchema = this.stringSchema; - if (scope.valueObjRef == null || scope.valueObjRef.length == 0) { + if ((scope.valueObjRef == null || scope.valueObjRef.length == 0) && scope.complexToscapath == null) { scope.valueObjRef = []; scope.valueObjRef.push(""); } - scope.showToscaFunction = new Array(scope.valueObjRef.length); - scope.valueObjRef.forEach((value, index) => { - scope.showToscaFunction[index] = false; - let key : string = index.toString(); - if (scope.parentProperty.subPropertyToscaFunctions != null) { - scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => { - if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) != -1) { - scope.showToscaFunction[index] = true; - } - }); - } - }); + if (scope.valueObjRef != null && scope.valueObjRef.length > 0) { + scope.showToscaFunction = new Array(scope.valueObjRef.length); + scope.valueObjRef.forEach((value, index) => { + scope.showToscaFunction[index] = false; + if (scope.parentProperty.subPropertyToscaFunctions != null) { + let key : string = index.toString(); + scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => { + if (SubPropertyToscaFunction.subPropertyPath.toString() == key) { + scope.showToscaFunction[index] = true; + return; + } + }); + } + }); + } + //reset valueObjRef when schema type is changed scope.$watchCollection('schemaProperty.type', (newData:any):void => { scope.isSchemaTypeDataType = this.DataTypesService.isDataTypeForSchemaType(scope.schemaProperty); @@ -174,6 +180,7 @@ export class TypeListDirective implements ng.IDirective { } } scope.valueObjRef.push(newVal); + scope.showToscaFunction = scope.showToscaFunction || []; scope.showToscaFunction.push(false); scope.listNewItem.value = ""; }; @@ -214,7 +221,7 @@ export class TypeListDirective implements ng.IDirective { if (scope.parentProperty.subPropertyToscaFunctions != null) { let subToscaFunctionList : Array<SubPropertyToscaFunction> = []; scope.parentProperty.subPropertyToscaFunctions.forEach((SubPropertyToscaFunction, index) => { - if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) == -1) { + if (SubPropertyToscaFunction.subPropertyPath.toString() != key) { subToscaFunctionList.push(SubPropertyToscaFunction); } }); @@ -226,21 +233,26 @@ export class TypeListDirective implements ng.IDirective { scope.onGetToscaFunction = (toscaGetFunction: ToscaGetFunction, index:number): void => { let key:string = index.toString(); if (scope.parentProperty.subPropertyToscaFunctions != null) { + let toscaFlag : boolean = true; scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => { - if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) != -1) { + if (SubPropertyToscaFunction.subPropertyPath.toString() == key) { SubPropertyToscaFunction.toscaFunction = toscaGetFunction; + toscaFlag = false; return; } }); - - } - if (scope.parentProperty.subPropertyToscaFunctions == null){ - scope.parentProperty.subPropertyToscaFunctions = []; + if (toscaFlag) { + let subPropertyToscaFunction = new SubPropertyToscaFunction(); + subPropertyToscaFunction.toscaFunction = toscaGetFunction; + subPropertyToscaFunction.subPropertyPath = [key]; + scope.parentProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction); + } + } else { + let subPropertyToscaFunction = new SubPropertyToscaFunction(); + subPropertyToscaFunction.toscaFunction = toscaGetFunction; + subPropertyToscaFunction.subPropertyPath = [key]; + scope.parentProperty.subPropertyToscaFunctions = [subPropertyToscaFunction]; } - let subPropertyToscaFunction = new SubPropertyToscaFunction(); - subPropertyToscaFunction.toscaFunction = toscaGetFunction; - subPropertyToscaFunction.subPropertyPath = [key]; - scope.parentProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction); } }; diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html index f53f5cf205..fad6838d01 100644 --- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html +++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html @@ -41,7 +41,7 @@ </div> <div data-ng-if="!isSchemaTypeDataType" class="i-sdc-form-item map-item-field" data-ng-class="{error:(parentFormObj['mapValue'+fieldsPrefixName+$index].$dirty && parentFormObj['mapValue'+fieldsPrefixName+$index].$invalid)}"> <label class="i-sdc-form-label required">Value</label> - <form class="temp-form" data-ng-if="isService"> + <form class="temp-form" data-ng-if="isService && complexToscapath == null"> <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}-{{$index}}" data-ng-checked="{{showToscaFunction[$index] == false}}" data-ng-click="onEnableTosca(false,$index)"/> Value <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}-{{$index}}" data-ng-checked="{{showToscaFunction[$index]}}" data-ng-click="onEnableTosca(true,$index)" ng-disabled="mapKeys[$index] == '' || mapKeys[$index] == null"/> @@ -120,7 +120,7 @@ </div> <div class="add-map-item" data-ng-class="{'schema-data-type':isSchemaTypeDataType}" data-ng-if="showAddBtn"> <div class="add-btn" data-tests-id="add-map-item" - data-ng-class="{'disabled': readOnly || !schemaProperty.type || mapKeys.indexOf('')>-1 || !isMapKeysUnique}" + data-ng-class="{'disabled': readOnly || !isMapKeysUnique}" data-ng-click="addMapItemFields()" title="{{'PROPERTY_EDIT_MAP_ADD_ITEM' | translate}}">Add</div> </div> </div> diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts index 098b28936b..875a49cbd2 100644 --- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts +++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts @@ -49,6 +49,7 @@ export interface ITypeMapScope extends ng.IScope { showToscaFunction: boolean[]; types: DataTypesMap; isService: boolean; + complexToscapath: string; getValidationPattern(type: string): RegExp; validateIntRange(value: string): boolean; @@ -77,7 +78,8 @@ export class TypeMapDirective implements ng.IDirective { showAddBtn: '=?', parentProperty: '=', types: '=', - isService: '=' + isService: '=', + complexToscapath: '=' }; restrict = 'E'; @@ -182,26 +184,30 @@ export class TypeMapDirective implements ng.IDirective { const currentKey = currentKeySet[index]; const existingKeyIndex = currentKeySet.indexOf(newKey); if (existingKeyIndex > -1 && existingKeyIndex != index) { - scope.parentFormObj[fieldName].$setValidity('keyExist', false); + if (scope.parentFormObj != null) { + scope.parentFormObj[fieldName].$setValidity('keyExist', false); + } scope.isMapKeysUnique = false; return; } - - scope.parentFormObj[fieldName].$setValidity('keyExist', true); - scope.isMapKeysUnique = true; - if (!scope.parentFormObj[fieldName].$invalid) { - // To preserve the order of the keys, delete each one and recreate - const newObj = {}; - angular.copy(scope.valueObjRef, newObj); - angular.forEach(newObj, function(value: any, key: string) { - delete scope.valueObjRef[key]; - if (key == currentKey) { - scope.valueObjRef[newKey] = value; - } else { - scope.valueObjRef[key] = value; - } - }); + if (scope.parentFormObj != null) { + scope.parentFormObj[fieldName].$setValidity('keyExist', true); + if (!scope.parentFormObj[fieldName].$invalid) { + // To preserve the order of the keys, delete each one and recreate + const newObj = {}; + angular.copy(scope.valueObjRef, newObj); + angular.forEach(newObj, function(value: any, key: string) { + delete scope.valueObjRef[key]; + if (key == currentKey) { + scope.valueObjRef[newKey] = value; + } else { + scope.valueObjRef[key] = value; + } + }); + } } + scope.isMapKeysUnique = true; + }; scope.deleteMapItem = (index: number): void => { @@ -233,7 +239,7 @@ export class TypeMapDirective implements ng.IDirective { if (scope.parentProperty.subPropertyToscaFunctions != null) { const subToscaFunctionList: SubPropertyToscaFunction[] = []; scope.parentProperty.subPropertyToscaFunctions.forEach((SubPropertyToscaFunction, index) => { - if (SubPropertyToscaFunction.subPropertyPath.indexOf(scope.mapKeys[flagIndex]) == -1) { + if (SubPropertyToscaFunction.subPropertyPath.toString() != scope.mapKeys[flagIndex]) { subToscaFunctionList.push(SubPropertyToscaFunction); } }); @@ -242,24 +248,30 @@ export class TypeMapDirective implements ng.IDirective { } }; - scope.onGetToscaFunction = (toscaGetFunction: ToscaGetFunction, key: string): void => { + scope.onGetToscaFunction = (toscaGetFunction: ToscaGetFunction, index:string): void => { + let key:string = index; if (scope.parentProperty.subPropertyToscaFunctions != null) { - scope.parentProperty.subPropertyToscaFunctions.forEach((SubPropertyToscaFunction) => { - if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) != -1) { + let toscaFlag : boolean = true; + scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => { + if (SubPropertyToscaFunction.subPropertyPath.toString() == key) { SubPropertyToscaFunction.toscaFunction = toscaGetFunction; + toscaFlag = false; return; } }); - - } - if (scope.parentProperty.subPropertyToscaFunctions == null) { - scope.parentProperty.subPropertyToscaFunctions = []; + if (toscaFlag) { + let subPropertyToscaFunction = new SubPropertyToscaFunction(); + subPropertyToscaFunction.toscaFunction = toscaGetFunction; + subPropertyToscaFunction.subPropertyPath = [key]; + scope.parentProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction); + } + } else { + let subPropertyToscaFunction = new SubPropertyToscaFunction(); + subPropertyToscaFunction.toscaFunction = toscaGetFunction; + subPropertyToscaFunction.subPropertyPath = [key]; + scope.parentProperty.subPropertyToscaFunctions = [subPropertyToscaFunction]; } - const subPropertyToscaFunction = new SubPropertyToscaFunction(); - subPropertyToscaFunction.toscaFunction = toscaGetFunction; - subPropertyToscaFunction.subPropertyPath = [key]; - scope.parentProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction); - }; + } scope.addMapItemFields = (): void => { if (!scope.valueObjRef) { diff --git a/catalog-ui/src/app/modules/service-module.ts b/catalog-ui/src/app/modules/service-module.ts index b9191cc6d1..1450b7f4cb 100644 --- a/catalog-ui/src/app/modules/service-module.ts +++ b/catalog-ui/src/app/modules/service-module.ts @@ -71,6 +71,7 @@ import { FileUtils } from '../utils/file-utils'; import { ValidationUtils } from '../utils/validation-utils'; import {ReqAndCapabilitiesService} from "../ng2/pages/workspace/req-and-capabilities/req-and-capabilities.service"; import {ToscaArtifactService} from "../ng2/services/tosca-artifact.service"; +import { PropertiesUtils } from 'app/ng2/pages/properties-assignment/services/properties.utils'; const moduleName: string = 'Sdc.Services'; const serviceModule: ng.IModule = angular.module(moduleName, []); @@ -133,3 +134,4 @@ serviceModule.service('ElementService', downgradeInjectable(ElementService)); serviceModule.service('ModelService', downgradeInjectable(ModelService)); serviceModule.service('ImportVSPService', downgradeInjectable(ImportVSPService)); serviceModule.service('ToscaArtifactService', downgradeInjectable(ToscaArtifactService)); +serviceModule.service('PropertiesUtils', downgradeInjectable(PropertiesUtils)); 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 34ed9a618d..29290805af 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 @@ -82,7 +82,6 @@ export class ToscaFunctionComponent implements OnInit, OnChanges { if (!this.isInitialized) { return; } - this.emitValidityChange(); if (this.formGroup.valid) { this.onValidFunction.emit(this.toscaFunctionForm.value); } @@ -111,12 +110,23 @@ export class ToscaFunctionComponent implements OnInit, OnChanges { let keyToFind = [this.compositionMapKey]; let subPropertyToscaFunction = this.property.subPropertyToscaFunctions.find(subPropertyToscaFunction => this.areEqual(subPropertyToscaFunction.subPropertyPath, keyToFind)); - if (subPropertyToscaFunction){ - this.toscaFunction = subPropertyToscaFunction.toscaFunction; - this.toscaFunctionForm.setValue(this.toscaFunction); - this.toscaFunctionTypeForm.setValue(this.toscaFunction.type); + if (subPropertyToscaFunction){ + this.toscaFunction = subPropertyToscaFunction.toscaFunction; + this.toscaFunctionForm.setValue(this.toscaFunction); + let type = this.toscaFunction.type; + if (type == ToscaFunctionType.CUSTOM) { + let name = (subPropertyToscaFunction.toscaFunction as ToscaCustomFunction).name; + let customToscaFunc = this.customToscaFunctions.find(custToscFunc => _.isEqual(custToscFunc.name, name)) + if (customToscaFunc) { + this.toscaFunctionTypeForm.setValue(name); + } else { + this.toscaFunctionTypeForm.setValue("other"); + } + } else { + this.toscaFunctionTypeForm.setValue(type); } - return; + } + return; } if (this.property instanceof PropertyDeclareAPIModel && this.property.subPropertyToscaFunctions && (<PropertyDeclareAPIModel> this.property).propertiesName){ let propertiesPath = (<PropertyDeclareAPIModel> this.property).propertiesName.split("#"); @@ -127,7 +137,18 @@ export class ToscaFunctionComponent implements OnInit, OnChanges { if (subPropertyToscaFunction){ this.toscaFunction = subPropertyToscaFunction.toscaFunction; this.toscaFunctionForm.setValue(this.toscaFunction); - this.toscaFunctionTypeForm.setValue(this.toscaFunction.type); + let type = this.toscaFunction.type; + if (type == ToscaFunctionType.CUSTOM) { + let name = (subPropertyToscaFunction.toscaFunction as ToscaCustomFunction).name; + let customToscaFunc = this.customToscaFunctions.find(custToscFunc => _.isEqual(custToscFunc.name, name)) + if (customToscaFunc) { + this.toscaFunctionTypeForm.setValue(name); + } else { + this.toscaFunctionTypeForm.setValue("other"); + } + } else { + this.toscaFunctionTypeForm.setValue(type); + } } return; } @@ -259,6 +280,7 @@ export class ToscaFunctionComponent implements OnInit, OnChanges { } else { this.toscaFunctionForm.setValue(undefined); } + this.emitValidityChange(); } onGetFunctionValidityChange(validationEvent: ToscaGetFunctionValidationEvent): void { @@ -267,6 +289,7 @@ export class ToscaFunctionComponent implements OnInit, OnChanges { } else { this.toscaFunctionForm.setValue(undefined); } + this.emitValidityChange(); } onYamlFunctionValidityChange(validationEvent: YamlFunctionValidationEvent): void { 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 a1ed8aa137..1fe467736d 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 @@ -486,7 +486,7 @@ export class ToscaGetFunctionComponent implements OnInit, OnChanges { if (this.typeHasSchema(this.property.type)) { if ((this.property instanceof PropertyDeclareAPIModel && (<PropertyDeclareAPIModel> this.property).input instanceof DerivedFEProperty) || this.compositionMap) { let childObject : DerivedFEProperty = (<DerivedFEProperty>(<PropertyDeclareAPIModel> this.property).input); - let childSchemaType = this.property.schemaType != null ? this.property.schemaType : childObject.type; + let childSchemaType = (this.property != null && this.property.schemaType != null) ? this.property.schemaType : childObject.type; if(this.isComplexType(childSchemaType) && !this.compositionMap){ if (childObject.type == PROPERTY_TYPES.MAP && childObject.isChildOfListOrMap) { return validPropertyType === PROPERTY_TYPES.STRING; @@ -501,12 +501,15 @@ export class ToscaGetFunctionComponent implements OnInit, OnChanges { } return validPropertyType === this.property.type && this.property.schema.property.type === property.schema.property.type; } - if (this.property.schema.property.isDataType && this.property instanceof PropertyDeclareAPIModel && (<PropertyDeclareAPIModel>this.property).propertiesName){ + if ((this.property.schema.property.isDataType || this.isComplexType(this.property.type)) && this.property instanceof PropertyDeclareAPIModel && (<PropertyDeclareAPIModel>this.property).propertiesName){ let typeToMatch = (<PropertyDeclareAPIModel> this.property).input.type; let childObject : DerivedFEProperty = (<DerivedFEProperty>(<PropertyDeclareAPIModel> this.property).input); if (childObject.type == PROPERTY_TYPES.MAP && childObject.isChildOfListOrMap) { typeToMatch = PROPERTY_TYPES.STRING; } + if ((typeToMatch === PROPERTY_TYPES.LIST || typeToMatch === PROPERTY_TYPES.MAP) && (<PropertyDeclareAPIModel> this.property).input.schema.property.type && this.compositionMap && !isNaN(Number(this.compositionMapKey))) { + typeToMatch = (<PropertyDeclareAPIModel> this.property).input.schema.property.type; + } return validPropertyType === typeToMatch; } |