Scale out use case

Change-Id: If0d42935185d3e4393a2607916c3046b4ebe41c6
Issue-ID: VID-188
Signed-off-by: Sonsino, Ofir (os0695) <os0695@intl.att.com>

6 files changed, 258 insertions, 8 deletions

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js b/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
index a59da0580..a9278c36d 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
@@ -220,7 +220,8 @@ appDS2
     	vnfConfigUpdate: "VNF Config Update",
 		vnfInPlace: "VNF In Place Software Update",
 		update: "update",
-		replace: "replace"
+		replace: "replace",
+		vnfScaleOut: "VNF Scale Out"
 	}
 
     };
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js b/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js
index 0b69ed556..716a99c00 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js
@@ -107,6 +107,8 @@ appDS2.constant("VIDCONFIGURATION", (function() {
 

 	var SCHEDULER_PORTAL_URL = "";

 

+	var SCALE_OUT_CONTROLLERS = ["", "SDN-C", "APP-C"];

+	

     return {

     	ASDC_MODEL_STATUS : ASDC_MODEL_STATUS,

     	MSO_MAX_POLLS : MSO_MAX_POLLS,

@@ -119,6 +121,7 @@ appDS2.constant("VIDCONFIGURATION", (function() {
     	MACRO_SERVICES : MACRO_SERVICES,

     	COMPONENT_LIST_NAMED_QUERY_ID : COMPONENT_LIST_NAMED_QUERY_ID,

         SCHEDULER_CALLBACK_URL: SCHEDULER_CALLBACK_URL,

-        SCHEDULER_PORTAL_URL: SCHEDULER_PORTAL_URL

+        SCHEDULER_PORTAL_URL: SCHEDULER_PORTAL_URL,

+		SCALE_OUT_CONTROLLERS: SCALE_OUT_CONTROLLERS

     };

 })())

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
index 2444646fe..e337a5271 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
@@ -9,6 +9,16 @@
         var vm = this;
         vm.configUpdatePatternError = "Invalid file type. Please select a file with a CSV extension.";
         vm.configUpdateContentError = "Invalid file structure.";
+        vm.controllers = VIDCONFIGURATION.SCALE_OUT_CONTROLLERS;
+        vm.wizardStep = 1;
+        vm.nextStep = function(){
+            vm.wizardStep++;
+            $(".modal-dialog").animate({"width":"1000px"},400,'linear');
+        };
+        vm.prevStep = function(){
+            vm.wizardStep--;
+            $(".modal-dialog").animate({"width":"6000px"},400,'linear');
+        };
 
         vm.softwareVersionRegex = "[-a-zA-Z0-9\.]+";
 
@@ -49,6 +59,7 @@
                                     _.each(response.data.vnfs, function (vnf) {
                                         if (newVNFName["invariant-id"] === vnf.invariantUuid) {
                                             availableVersions.push(extractVNFModel(vnf, response.data.service, newVNFName));
+                                            newVNFName.vfModules = vnf.vfModules;
                                         }
                                     });
                                     var versions = _.uniqBy(availableVersions, 'modelInfo.modelVersion');
@@ -132,7 +143,7 @@
         };
 
 
-		/***converting objects to scheduler format (taken from IST)***/
+		/***converting objects to scheduler format (taken from IST) - was altered for Scale out support ***/
 		function extractChangeManagementCallbackDataStr(changeManagement) {
 			console.log(changeManagement);
 			var result = {};
@@ -173,7 +184,13 @@
 						requestParametersData = {
 							payload: changeManagement.configUpdateFile
 						}
-					}
+                    }else if(workflowType=="VNF Scale Out"){
+                        requestParametersData = {
+                            controllerType: changeManagement.controllerType
+                            //userParams: { ..json.. }
+                            //usePreload: false
+                        }
+                    }
 					$log.info('SchedulerWidgetCtrl:extractChangeManagementCallbackDataStr info:: workflowType '+ workflowType);
 					$log.info('SchedulerWidgetCtrl:extractChangeManagementCallbackDataStr info:: requestParametersData '+ requestParametersData);
 
@@ -266,7 +283,8 @@
 			} else {
 				//no scheduling support
 				var dataToSo = extractChangeManagementCallbackDataStr(vm.changeManagement);
-				var vnfName = vm.changeManagement.vnfNames[0].name;
+				//TODO: foreach
+                var vnfName = vm.changeManagement.vnfNames[0].name;
 				changeManagementService.postChangeManagementNow(dataToSo, vnfName);
 			}
         };
@@ -525,6 +543,10 @@
         vm.isConfigUpdate = function () {
             return vm.changeManagement.workflow === COMPONENT.WORKFLOWS.vnfConfigUpdate;
         }
+		
+        vm.isScaleOut = function () {
+            return vm.changeManagement.workflow === COMPONENT.WORKFLOWS.vnfScaleOut;
+        }
 
         vm.shouldShowVnfInPlaceFields = function () {
             return vm.changeManagement.workflow === COMPONENT.WORKFLOWS.vnfInPlace;
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.css
new file mode 100644
index 000000000..4dc2d399a
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.css
@@ -0,0 +1,171 @@
+.scale-out-modules .table-row {
+    border: 1px solid #D2D2D2;
+    display: flex;
+}
+.scale-out-modules .table-row > div {
+    text-indent: 12px;
+    color: #5A5A5A;
+    font-size: 13px;
+    border-right: 1px solid #D2D2D2;
+    line-height: 30px;
+}
+.scale-out-modules .table-row > div:last-child {
+    border-right: none;
+}
+.scale-out-modules .table-row > div:nth-child(1) {
+    flex: 40px 0 0;
+}
+.scale-out-modules .table-row > div:nth-child(2) {
+    flex: 363px 1 0;
+}
+.scale-out-modules .table-row > div:nth-child(3) {
+    flex: 90px 0 0;
+}
+.scale-out-modules .table-row > div:nth-child(4), .scale-out-modules .table-row > div:nth-child(5) {
+    flex: 150px 0 0;
+}
+.scale-out-modules .table-row > div:nth-child(6), .scale-out-modules .table-row > div:nth-child(7) {
+    flex: 120px 0 0;
+}
+.scale-out-modules .table-header {
+    border-bottom: none;
+}
+.scale-out-modules .table-header > div {
+    background-color: #F2F2F2;""
+    color: black;
+    font-size: 12px;
+}
+.scale-out-modules .modules-table:not(.open) + .table-row {
+    border-top: none;
+}
+.scale-out-modules .modules-table {
+    display: none;
+    margin-top: 10px;
+    margin-bottom: 15px;
+}
+.scale-out-modules .modules-table .table-row {
+    margin-left: 60px;
+}
+.scale-out-modules .modules-table .table-row  > div:nth-child(1) {
+    flex: 539px 0 0;
+}
+.scale-out-modules .modules-table .table-row  > div:nth-child(2) {
+    flex: 90px 0 0;
+}
+.scale-out-modules .modules-table .table-row  > div:nth-child(3) {
+    flex: 90px 0 0;
+}
+.scale-out-modules .modules-table .table-row  > div:nth-child(4) {
+    flex: 180px 0 0;
+}
+.scale-out-modules .modules-table .table-row  > div:nth-child(5) {
+    flex: 110px 0 0;
+}
+.scale-out-modules .modules-table.open {
+    display: block;
+}
+
+
+/*LESS*/
+/*
+
+.scale-out-modules{
+
+	.table-row{
+		border: 1px solid #D2D2D2;
+		display:flex;
+
+        > div {
+			text-indent:12px;
+			color: #5A5A5A;
+			font-size:13px;
+			border-right:1px solid #D2D2D2;
+			line-height:30px;
+
+			&:last-child {
+				border-right:none;
+			}
+
+			&:nth-child(1){
+				flex:40px 0 0;
+			}
+			&:nth-child(2){
+				flex:363px 1 0;
+			}
+			&:nth-child(3){
+				flex:90px 0 0;
+			}
+			&:nth-child(4), &:nth-child(5){
+				flex:150px 0 0;
+			}
+			&:nth-child(6), &:nth-child(7){
+				flex:120px 0 0;
+			}
+		}
+
+		&.open > div {
+			line-height:29px;
+			border-top: 1px #009FDB solid;
+			border-bottom: 1px #009FDB solid;
+			&:last-child{
+				box-shadow: 0px 0px 0px 0px red, 1px 0px 0px 0px #009FDB;
+			}
+			//box-sizing: border-box;
+			&:nth-child(1){
+			 border-color: green;
+			}
+			&:nth-child(2){
+				color:#009FDB;
+			}
+		}
+    }
+
+	.table-header{
+		border-bottom:none;
+
+        > div {
+			background-color:#F2F2F2;
+			color: black;
+			font-size:12px;
+		}
+    }
+
+	.modules-table:not(.open) + .table-row {
+		border-top:none;
+	}
+
+	.modules-table{
+		display:none;
+		margin-top:10px;
+		margin-bottom:15px;
+
+		.table-row {
+			margin-left:60px;
+			& > div{
+
+				&:nth-child(1){
+					flex:539px 0 0;
+				}
+				&:nth-child(2){
+					flex:90px 0 0;
+				}
+				&:nth-child(3){
+					flex:90px 0 0;
+				}
+				&:nth-child(4){
+					flex:180px 0 0;
+				}
+				&:nth-child(5){
+					flex:110px 0 0;
+				}
+			}
+		}
+
+		&.open{
+			display:block;
+		}
+	}
+
+}
+
+*/
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
index 4473ee3b8..e14af86d4 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
@@ -4,7 +4,7 @@
     <span ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">&times;</span>
 </div>
 <form class="form-create" name="newChangeManagement" ng-submit="vm.openModal();vm.close();" novalidate>
-    <div class="modal-body">
+    <div class="modal-body step1" ng-show="vm.wizardStep === 1" >
         <div class="form-group">
             <label class="control-label">Subscriber</label>
             <select class="form-control" ng-model="vm.changeManagement.subscriberId" ng-change="vm.loadServiceTypes()" name="subscriber" id="subscriber" data-tests-id="subscriberName" required>
@@ -84,10 +84,63 @@
             </div>
 
         </div>
+        <div ng-if="vm.isScaleOut()">
+            <div class="form-group">
+                <label class="control-label">Controller Type</label>
+                <select class="form-control" ng-model="vm.changeManagement.controllerType" name="controllerType" id="controllerType"
+                        ng-options="o as o for o in vm.controllers">
+                </select>
+            </div>
+        </div>
     </div>
+
+    <div class="modal-body step2 scale-out-modules" ng-if="vm.wizardStep === 2">
+
+        <div class="table-header table-row">
+            <div></div>
+            <div>VNF instance name</div>
+            <div>Model V</div>
+            <div>Category</div>
+            <div>Sub Category</div>
+            <div>UUID</div>
+            <div>Invariant UUID</div>
+        </div>
+
+        <div class="table-row" ng-repeat-start="vnf in vm.changeManagement.vnfNames" ng-if="vnf['prov-status'] === 'PROV'">
+            <div></div>
+            <div>{{vnf.name}} service instance name: {{vnf['service-instance-node'].properties['service-instance-name']}}</div>
+            <div>2</div>
+            <div>Category</div>
+            <div>Sub Category</div>
+            <div>{{vnf.modelVersionId}}</div>
+            <div>{{vnf['invariant-id']}}</div>
+        </div>
+        <div class="modules-table open" ng-repeat-end="">
+            <div class="table-header table-row">
+                <div>VF Module</div>
+                <div>In Service</div>
+                <div>Scale</div>
+                <div>Module UID</div>
+                <div>File</div>
+            </div>
+
+            <div class="table-row" ng-repeat="(key, module) in vnf.vfModules">
+                <div>{{module.modelCustomizationName}}</div>
+                <div>{{module.properties.minCountInstances}} - {{module.properties.maxCountInstances}}</div>
+                <div>Category</div>
+                <div>{{module.uuid}}</div>
+                <div>
+                    <input type="file" ng-model="module.file" accept="application/json" />
+                </div>
+            </div>
+        </div>
+
+    </div>
+
     <div class="modal-footer">
         <div class="pull-right">
-            <button type="submit" id="submit" name="submit" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">Schedule</button>
+            <button ng-if="!vm.isScaleOut() || (vm.isScaleOut() && vm.wizardStep === 2)" type="submit" id="submit" name="submit" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">Schedule</button>
+            <button ng-if="vm.isScaleOut() && vm.wizardStep === 1" ng-click="vm.nextStep();" type="button" id="next" name="next" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">Next</button>
             <button type="button" id="cancel" name="cancel" class="btn btn-white" ng-click="vm.close()">Cancel</button>
         </div>
     </div>
diff --git a/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css b/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css
index 1a293c049..7d8af00b9 100644
--- a/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css
+++ b/vid-app-common/src/main/webapp/app/vid/styles/modal-create-new.css
@@ -1,5 +1,5 @@
 .modal-dialog {
-    width: 587px;
+    /*width: 587px;*/
     border-radius: 8px;
 }