Feature 10911-Vertical scaling of VM instances from OSM

	*Added NG-UI support for Vertical scaling
	*In NS Instances page. Click "Vertical Scaling" in the VIM action menu.
        *Then a new pop-up page will be opened.
        *In the popup there will be fields containing membervnfIndex, vduid, count index mandatory fields with Virtual Memory, size of storage and vcpu count field to vertically scale
        *When the fields are selected then Click Apply button.
        *The pop-up window is closed and the page is directed to "History of operations" page

Change-Id: I6d898c8637b361af69dc7e516e46834a346cda82
Signed-off-by: SANDHYA.JS <sandhya.j@tataelxsi.co.in>
diff --git a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html
index db3311a..f84fcff 100644
--- a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html
+++ b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html
@@ -45,6 +45,10 @@
                 data-container="body" ngbTooltip="{{'REBUILD' | translate}}">
                 <i class="fas fa-arrows-alt"></i> {{'REBUILD' | translate}}
             </button>
+            <button type="button" class="btn btn-primary dropdown-item" (click)="openVerticalScaling()" placement="left" 
+                data-container="body" ngbTooltip="{{'VERTICALSCALING' | translate}}">
+                <i class="fas fa-grip-vertical"></i> {{'VERTICALSCALING' | translate}}
+            </button>
         </div>
     </div>
     <div class="btn-group" placement="bottom-right" ngbDropdown display="dynamic" container="body">
diff --git a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
index 1c3f1f2..751389b 100644
--- a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
+++ b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
@@ -37,6 +37,7 @@
 import { ShowInfoComponent } from 'ShowInfoComponent';
 import { StartStopRebuildComponent } from 'StartStopRebuildComponent';
 import { isNullOrUndefined } from 'util';
+import { VerticalScalingComponent } from 'VerticalScalingComponent';
 import { VmMigrationComponent } from 'VmMigrationComponent';
 import { DF, VDU, VNFD } from 'VNFDModel';
 /**
@@ -306,6 +307,19 @@
     }).catch();
   }
 
+  /** To open the vertical Scaling pop-up */
+  public openVerticalScaling(): void {
+    const modalRef: NgbModalRef = this.modalService.open(VerticalScalingComponent, { backdrop: 'static' });
+    modalRef.componentInstance.params = {
+      id: this.instanceID
+    };
+    modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
+      if (result) {
+        this.sharedService.callData();
+      }
+    }).catch();
+  }
+
   /**
    * Check any changes in the child component @public
    */