Support instance count on node template

Issue-ID: SDC-3887
Signed-off-by: JvD_Ericsson <jeff.van.dam@est.tech>
Change-Id: I45593ee2e0e3eea358ae9344d7432e37e1467915

2 files changed, 44 insertions, 6 deletions

diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.html b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.html
index 358c910c2b..f7cc937ffe 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.html
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.html
@@ -148,7 +148,20 @@
                             </div>
                         </div>
                     </div>
-                    <div *ngIf="!isViewOnly && isOccurrencesEnabled" class="i-sdc-designer-sidebar-section-content-item-property-and-attribute">
+                    <div *ngIf="isOccurrencesEnabled" class="i-sdc-designer-sidebar-section-content-item-property-and-attribute">
+                        <div class="sdc-input">
+                            <span class="i-sdc-designer-sidebar-section-content-item-property-and-attribute-label">Instance Count</span>
+                            <div class="instance-count-value">
+                                <ui-element-dropdown
+                                    [testId]="'instanceCount'"
+                                    class="cell link-selector"
+                                    [values]="selectInputs"
+                                    [(value)]="component.instanceCount">
+                                </ui-element-dropdown>
+                            </div>
+                        </div>
+                    </div>
+                    <div *ngIf="!isViewOnly" class="i-sdc-designer-sidebar-section-content-item-property-and-attribute">
                         <button class="tlv-btn blue" (click)="saveOccurrences()" [disabled]="!isOccurrencesFormValid(component)">Save</button>
                     </div>
                 </div>
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.ts
index 99bd5e882d..b6999e61a9 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/properties-tab/properties-tab.component.ts
@@ -8,14 +8,18 @@ import {
     ComponentMetadata,
     FullComponentInstance,
     PropertiesGroup,
-    PropertyModel
+    PropertyModel,
+    InputsGroup,
+    InputModel
 } from 'app/models';
+import {ToscaGetFunctionType} from "app/models/tosca-get-function-type.enum";
 import { CompositionService } from 'app/ng2/pages/composition/composition.service';
 import { WorkspaceService } from 'app/ng2/pages/workspace/workspace.service';
 import { GroupByPipe } from 'app/ng2/pipes/groupBy.pipe';
 import { ResourceNamePipe } from 'app/ng2/pipes/resource-name.pipe';
 import { TopologyTemplateService } from 'app/ng2/services/component-services/topology-template.service';
 import { ComponentInstanceServiceNg2 } from "app/ng2/services/component-instance-services/component-instance.service";
+import { DropdownValue } from 'app/ng2/components/ui/form-components/dropdown/ui-element-dropdown.component';
 import { ComponentGenericResponse } from 'app/ng2/services/responses/component-generic-response';
 import { TranslateService } from 'app/ng2/shared/translator/translate.service';
 import { ModalsHandler } from 'app/utils';
@@ -37,6 +41,8 @@ export class PropertiesTabComponent implements OnInit {
     objectKeys = Object.keys;
     isUnboundedChecked: boolean;
     isOccurrencesEnabled: boolean = false;
+    inputs: InputsGroup;
+    selectInputs: DropdownValue[] = [];
     isLoading: boolean;
 
     @Input() isViewOnly: boolean;
@@ -118,12 +124,13 @@ export class PropertiesTabComponent implements OnInit {
     }
 
     private getComponentInstancesPropertiesAndAttributes = () => {
-        this.topologyTemplateService.getComponentInstanceAttributesAndProperties(
+        this.topologyTemplateService.getComponentInstanceAttributesAndPropertiesAndInputs(
             this.workspaceService.metadata.uniqueId,
             this.workspaceService.metadata.componentType)
             .subscribe((genericResponse: ComponentGenericResponse) => {
                 this.compositionService.componentInstancesAttributes = genericResponse.componentInstancesAttributes || new AttributesGroup();
                 this.compositionService.componentInstancesProperties = genericResponse.componentInstancesProperties;
+                this.inputs = genericResponse.inputs;
                 this.initPropertiesAndAttributes();
             });
     }
@@ -188,6 +195,19 @@ export class PropertiesTabComponent implements OnInit {
                 this.isOccurrencesEnabled = true;
             }
             this.isUnboundedChecked = this.component.maxOccurrences == "UNBOUNDED" ? true: false;
+
+            if(!this.component.instanceCount){
+                this.component.instanceCount = "";
+            }
+
+            _.forEach(this.inputs, (input: InputModel) => {
+                if(input.type === "integer"){
+                    this.selectInputs.push(new DropdownValue('{' + ToscaGetFunctionType.GET_INPUT.toLowerCase + ":" + input.name + '}', input.name));
+                    console.log('{' + ToscaGetFunctionType.GET_INPUT.toLowerCase + ":" + input.name + '}', input.name);
+                }
+            });
+
+            this.selectInputs.unshift(new DropdownValue('', 'Select Input...'));
         }
     }
 
@@ -240,6 +260,7 @@ export class PropertiesTabComponent implements OnInit {
             component = new ComponentInstance(updatedComponentInstance);
             this.compositionService.getComponentInstances().find((item) => item.uniqueId === component.uniqueId).maxOccurrences = component.maxOccurrences;
             this.compositionService.getComponentInstances().find((item) => item.uniqueId === component.uniqueId).minOccurrences = component.minOccurrences;
+            this.compositionService.getComponentInstances().find((item) => item.uniqueId === component.uniqueId).instanceCount = component.instanceCount;
             this.store.dispatch(new TogglePanelLoadingAction({isLoading: false}));
         }, (error:any) => {
             this.store.dispatch(new TogglePanelLoadingAction({isLoading: false}));
@@ -253,18 +274,21 @@ export class PropertiesTabComponent implements OnInit {
             if(!this.isOccurrencesEnabled){
                 this.component.minOccurrences = null;
                 this.component.maxOccurrences = null;
+                this.component.instanceCount = null;
             } else {
                 this.component.minOccurrences = "1";
                 this.component.maxOccurrences = "1";
+                this.component.instanceCount = "";
             }
-            this.updateComponentInstance(this.component);
         }
     }
 
     private isOccurrencesFormValid(component: FullComponentInstance) {
         if(
-            component.minOccurrences && parseInt(component.minOccurrences) >= 0 &&
-            component.maxOccurrences && (parseInt(component.maxOccurrences) >= parseInt(component.minOccurrences) || component.maxOccurrences === "UNBOUNDED")
+            (component.minOccurrences === null && component.maxOccurrences === null && !component.instanceCount) ||
+            (component.minOccurrences && parseInt(component.minOccurrences) >= 0 && component.maxOccurrences &&
+            (parseInt(component.maxOccurrences) >= parseInt(component.minOccurrences) || component.maxOccurrences === "UNBOUNDED") &&
+            component.instanceCount)
         ) {
             return true;
         } else {
@@ -274,6 +298,7 @@ export class PropertiesTabComponent implements OnInit {
 
     private saveOccurrences = () => {
         if(this.component instanceof FullComponentInstance && this.isOccurrencesFormValid(this.component)) {
+            console.log("this.component.instanceCount: " + this.component.instanceCount);
             this.updateComponentInstance(this.component);
         }
     }