Fix issue on list and map property entries in composition view

[sdc.git] / catalog-ui / src / app / directives / property-types / type-map / type-map-directive.html

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 aa03cec..f53f5cf 100644 (file)
--- 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
@@ -13,10 +13,10 @@
   ~ See the License for the specific language governing permissions and
   ~ limitations under the License.
   -->
- 
- 
-<div>
-    <div data-ng-repeat="i in getNumber(mapKeys.length) track by $index" class="map-item" data-ng-class="{'primitive-value-map':!isSchemaTypeDataType}">
+
+
+<div class="type-map">
+    <div  ng-if="mapKeys.length > 0" data-ng-repeat="i in getNumber(mapKeys.length) track by $index" class="map-item" data-ng-class="{'primitive-value-map':!isSchemaTypeDataType}">
         <div class="i-sdc-form-item map-item-field" data-ng-class="{error:(parentFormObj['mapKey'+fieldsPrefixName+$index].$dirty && parentFormObj['mapKey'+fieldsPrefixName+$index].$invalid)}">
             <label class="i-sdc-form-label required">Key</label>
             <input class="i-sdc-form-input"
@@ -41,8 +41,14 @@
         </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">
+                <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"/>
+                {{'TOSCA_FUNCTION_LABEL' | translate}}
+            </form>
             <input class="i-sdc-form-input"
-                   ng-if="!((schemaProperty.simpleType||schemaProperty.type) == 'boolean')"
+                   ng-if="!constraints && !((schemaProperty.simpleType||schemaProperty.type) == 'boolean') && showToscaFunction[$index] == false"
                    data-ng-readonly="readOnly"
                    data-ng-model="valueObjRef[mapKeys[$index]]"
                    type="text"
@@ -57,7 +63,7 @@
                    autofocus />
             <select class="i-sdc-form-select"
                     data-tests-id="mapValue{{fieldsPrefixName}}{{$index}}"
-                    ng-if="(schemaProperty.simpleType||schemaProperty.type) == 'boolean'"
+                    ng-if="!constraints && (schemaProperty.simpleType||schemaProperty.type) == 'boolean' && showToscaFunction[$index] == false"
                     data-ng-disabled="readOnly"
                     name="mapValue{{fieldsPrefixName}}{{$index}}"
                     data-ng-model="valueObjRef[mapKeys[$index]]"
@@ -65,6 +71,34 @@
                 <option value="true">true</option>
                 <option value="false">false</option>
             </select>
+            <div data-ng-if="showToscaFunction[$index]" class="div-tosca-function">
+                <tosca-function [property]="parentProperty"
+                                [component-instance-map]="componentInstanceMap"
+                                [allow-clear]="false"
+                                [composition-map]="true"
+                                [composition-map-key]="mapKeys[$index]"
+                                (on-valid-function)="onGetToscaFunction($event,mapKeys[$index])"
+                >
+                </tosca-function>
+            </div>
+
+
+            <select class="i-sdc-form-select"
+                data-tests-id="constraints"
+                ng-if="constraints"
+                data-ng-disabled="readOnly"
+                data-ng-model="valueObjRef[mapKeys[$index]]">
+
+                <!-- Get the saved value for the relevant key -->
+                <option ng-if = "valueObjRef[mapKeys[$index]]" value = "{{valueObjRef[mapKeys[$index]]}}" name = "{{valueObjRef[mapKeys[$index]]}}" hidden selected>
+                        {{valueObjRef[mapKeys[$index]]}}
+                </option>
+                <!-- add all constratint to Select list -->
+                <option ng-repeat='value in constraints' value="{{value}}" name="{{value}}">
+                    {{value}}
+                </option>
+            </select>
+
             <div class="input-error" data-ng-show="parentFormObj['mapValue'+fieldsPrefixName+$index].$dirty && parentFormObj['mapValue'+fieldsPrefixName+$index].$invalid">
                 <span ng-show="parentFormObj['mapValue'+fieldsPrefixName+$index].$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Value' }"></span>
                 <span ng-show="parentFormObj['mapValue'+fieldsPrefixName+$index].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span>
@@ -77,14 +111,17 @@
                               type-name="schemaProperty.type"
                               parent-form-obj="parentFormObj"
                               fields-prefix-name="'mapValue'+fieldsPrefixName+''+$index"
+                              types="types"
                               read-only="readOnly"
             ></fields-structure>
         </div>
-        <span ng-click="deleteMapItem($index)" class="delete-map-item" data-tests-id="delete-map-item{{fieldsPrefixName}}{{$index}}" data-ng-class="{'disabled': readOnly}"></span>
+        <span ng-click="deleteMapItem($index)" class="delete-map-item" data-tests-id="delete-map-item{{fieldsPrefixName}}{{$index}}"
+              data-ng-class="{'disabled': readOnly}" title="{{'PROPERTY_EDIT_MAP_DELETE_ITEM' | translate}}"></span>
     </div>
-    <div class="add-map-item" data-ng-class="{'schema-data-type':isSchemaTypeDataType}">
+    <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-click="addMapItemFields()">Add</div>
+             data-ng-class="{'disabled': readOnly || !schemaProperty.type || mapKeys.indexOf('')>-1 || !isMapKeysUnique}"
+             data-ng-click="addMapItemFields()" title="{{'PROPERTY_EDIT_MAP_ADD_ITEM' | translate}}">Add</div>
     </div>
 </div>