diff options
author | andre.schmid <andre.schmid@est.tech> | 2022-05-12 17:37:43 +0100 |
---|---|---|
committer | Michael Morris <michael.morris@est.tech> | 2022-05-17 08:23:38 +0000 |
commit | 61e8668899051e1df738093d1700564fbc22a428 (patch) | |
tree | 0076471bed9a3fee8e5a565ed63c6027a5c76b30 /catalog-ui/src/app/directives/property-types/type-list | |
parent | 69bc5bdb7d464fa38705191f1495fb09474277a8 (diff) |
Support list of map properties in composition
Supports editing list<map<string, string> properties in the
edit properties dialog in the composition screen.
Fixes entry schema of type map not being shown.
Change-Id: Iea1732f51148ae88dedd2242b3b19d19c4548eb4
Issue-ID: SDC-4001
Signed-off-by: andre.schmid <andre.schmid@est.tech>
Diffstat (limited to 'catalog-ui/src/app/directives/property-types/type-list')
3 files changed, 45 insertions, 16 deletions
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 661514f799..48e441599f 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 @@ -17,7 +17,8 @@ <div> <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)}"> + <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'"> <input class="i-sdc-form-input" data-tests-id="listNewItem{{fieldsPrefixName}}" ng-if="!constraints && !((schemaProperty.simpleType||schemaProperty.type) == 'boolean')" @@ -66,12 +67,27 @@ </div> </div> <div class="add-btn add-list-item" data-tests-id="add-list-item{{fieldsPrefixName}}" - data-ng-class="{'disabled': readOnly || !schemaProperty.type || parentFormObj['listNewItem'+fieldsPrefixName].$invalid || !listNewItem.value}" data-ng-click="addListItem()">Add</div> + data-ng-class="{'disabled': readOnly || !schemaProperty.type || parentFormObj['listNewItem'+fieldsPrefixName].$invalid || (!listNewItem.value && schemaProperty.type !== 'map')}" data-ng-click="addListItem()">Add</div> <div class="list-value-items"> - <span class="list-value-item" data-ng-repeat="value in valueObjRef track by $index"> - {{value}} - <span ng-if="!readOnly" class="delete-list-item sprite-new small-x-button" data-ng-click="deleteListItem($index)"></span> - </span> + <span class="list-value-item" data-ng-repeat="value in valueObjRef track by $index"> + <span ng-if="!readOnly" class="delete-list-item sprite-new small-x-button" data-ng-click="deleteListItem($index)" + title="{{'PROPERTY_EDIT_LIST_DELETE_ITEM' | translate}}"></span> + <div ng-if="schemaProperty.type === 'map'"> + <type-map value-obj-ref="value" + schema-property="stringSchema" + parent-form-obj="parentFormObj" + fields-prefix-name="fieldsPrefixName+''+$index" + read-only="readOnly" + default-value="{{undefined}}" + max-length="maxLength" + show-add-btn="true" + constraints="constraints"> + </type-map> + </div> + <div ng-if="schemaProperty.type !== 'map'"> + {{value}} + </div> + </span> </div> </div> <div data-ng-if="isSchemaTypeDataType"> diff --git a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.less b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.less index 71263f2642..99d8005fb1 100644 --- a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.less +++ b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.less @@ -21,7 +21,6 @@ display: inline-block; background-color: @tlv_color_v; margin: 10px 0 0 10px; - padding: 0 8px; .delete-list-item{ margin: 0 0 0 2px; .hand; 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 997e28dabc..76810040e6 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 @@ -37,21 +37,29 @@ export interface ITypeListScope extends ng.IScope { listDefaultValue:any; listNewItem:any; maxLength:number; - + stringSchema: SchemaProperty; + constraints:string[]; getValidationPattern(type:string):RegExp; validateIntRange(value:string):boolean; addListItem():void; - deleteListItem(listItemIndex:number):void + deleteListItem(listItemIndex:number):void; + getStringSchemaProperty():SchemaProperty; } export class TypeListDirective implements ng.IDirective { + private readonly stringSchema: SchemaProperty; + constructor(private DataTypesService:DataTypesService, private PropertyNameValidationPattern:RegExp, - private ValidationUtils:ValidationUtils) { + private ValidationUtils:ValidationUtils) { + this.stringSchema = new SchemaProperty(); + this.stringSchema.type = PROPERTY_TYPES.STRING; + this.stringSchema.isSimpleType = true; + this.stringSchema.isDataType = false; } scope = { @@ -73,6 +81,7 @@ export class TypeListDirective implements ng.IDirective { link = (scope:ITypeListScope, element:any, $attr:any) => { scope.propertyNameValidationPattern = this.PropertyNameValidationPattern; + scope.stringSchema = this.stringSchema; //reset valueObjRef when schema type is changed scope.$watchCollection('schemaProperty.type', (newData:any):void => { @@ -103,17 +112,22 @@ export class TypeListDirective implements ng.IDirective { scope.addListItem = ():void => { scope.valueObjRef = scope.valueObjRef || []; - let newVal = ((scope.schemaProperty.simpleType || scope.schemaProperty.type) == PROPERTY_TYPES.STRING ? scope.listNewItem.value : JSON.parse(scope.listNewItem.value)); + let newVal; + if (scope.schemaProperty.type === PROPERTY_TYPES.MAP) { + newVal = {"": ""}; + } else if ((scope.schemaProperty.simpleType || scope.schemaProperty.type) == PROPERTY_TYPES.STRING) { + newVal = scope.listNewItem.value; + } else { + newVal = JSON.parse(scope.listNewItem.value); + } scope.valueObjRef.push(newVal); scope.listNewItem.value = ""; }; - scope.deleteListItem = (listItemIndex:number):void => { + scope.deleteListItem = (listItemIndex: number): void => { scope.valueObjRef.splice(listItemIndex, 1); - if (!scope.valueObjRef.length) { - if (scope.listDefaultValue) { - angular.copy(scope.listDefaultValue, scope.valueObjRef); - } + if (!scope.valueObjRef.length && scope.listDefaultValue) { + angular.copy(scope.listDefaultValue, scope.valueObjRef); } }; }; |