diff options
Diffstat (limited to 'vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management')
3 files changed, 274 insertions, 126 deletions
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 528d3d552..28b3eea5d 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 @@ -21,31 +21,33 @@ (function () { 'use strict'; - appDS2.controller("newChangeManagementModalController", ["$uibModalInstance", "$uibModal",'$q', "AaiService", "changeManagementService", "Upload", - "$log", "$scope", "_", "COMPONENT", "VIDCONFIGURATION","DataService","featureFlags", newChangeManagementModalController]); + appDS2.controller("newChangeManagementModalController", ["$uibModalInstance", "$uibModal", '$q', "AaiService", "changeManagementService", "Upload", + "$log", "$scope", "_", "COMPONENT", "VIDCONFIGURATION", "DataService", "featureFlags", newChangeManagementModalController]); - function newChangeManagementModalController($uibModalInstance, $uibModal,$q, AaiService, changeManagementService, Upload, $log, $scope, _, COMPONENT, VIDCONFIGURATION, DataService, featureFlags) { + function newChangeManagementModalController($uibModalInstance, $uibModal, $q, AaiService, changeManagementService, Upload, $log, $scope, _, COMPONENT, VIDCONFIGURATION, DataService, featureFlags) { var vm = this; vm.hasScheduler = !!VIDCONFIGURATION.SCHEDULER_PORTAL_URL; - vm.errorMsg=''; + vm.errorMsg = ''; + + vm.isSearchedVNF = false; vm.wizardStep = 1; - vm.nextStep = function(){ + vm.nextStep = function () { vm.wizardStep++; - $(".modal-dialog").animate({"width":"1200px"},400,'linear'); + $(".modal-dialog").animate({"width": "1200px"}, 400, 'linear'); }; - vm.prevStep = function(){ + vm.prevStep = function () { vm.wizardStep--; - $(".modal-dialog").animate({"width":"600px"},400,'linear'); + $(".modal-dialog").animate({"width": "600px"}, 400, 'linear'); }; vm.softwareVersionRegex = "[-a-zA-Z0-9\.]+"; var attuid; - $scope.showReportWindow = function() { + $scope.showReportWindow = function () { const modalWindow = $uibModal.open({ templateUrl: 'app/vid/scripts/modals/report-modal/report-modal.html', controller: 'reportModalController', @@ -59,10 +61,20 @@ }; - $scope.isShowErrorReport = function() { + $scope.isShowErrorReport = function () { return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_CREATE_ERROR_REPORTS); }; + $scope.isNewFilterChangeManagmentEnabled = function () { + return (featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_FLASH_CLOUD_REGION_AND_NF_ROLE_OPTIONAL_SEARCH)); + }; + + vm.isDisabledVNFmodelVersion = function (vnfTypePristine) { + if ($scope.isNewFilterChangeManagmentEnabled()) { + return !vm.isSearchedVNF; + } else return vnfTypePristine; + }; + function fetchAttUid() { var defer = $q.defer(); if (attuid) { @@ -97,7 +109,7 @@ .catch(function (error) { $log.error(error); vm.errorMsg = err; - }); + }); }; var registerVNFNamesWatcher = function () { @@ -121,29 +133,29 @@ availableVersions.push(extractVNFModel(vnf, response.data.service, newVNFName)); //for scale out screen - if(service.uuid === newVNFName["service-instance-node"][0].properties["model-version-id"]) { + if (service.uuid === newVNFName["service-instance-node"][0].properties["model-version-id"]) { newVNFName.vfModules = vnf.vfModules; newVNFName.category = response.data.service.category; newVNFName.groupModules = _.groupBy(newVNFName.vfModules, "customizationUuid"); //list vfmodules ids in AAI that belong to that vnf instance - var modulesAaiIds = _.filter(newVNFName.relatedTo, function(item){ + var modulesAaiIds = _.filter(newVNFName.relatedTo, function (item) { return item["node-type"] === "vf-module"; - }).map(function(item){ + }).map(function (item) { return item.id; }); _.forEach(newVNFName.vfModules, function (mdl, key) { mdl.scale = false; //defaults to not scale unless user changes it - if(mdl.properties && mdl.properties.maxCountInstances) { + if (mdl.properties && mdl.properties.maxCountInstances) { //how many vf modules of the same customizationId belong to that vnf instance - mdl.currentCount = _.filter(vm.vfModules, function(item){ + mdl.currentCount = _.filter(vm.vfModules, function (item) { return modulesAaiIds.indexOf(item.id) > -1 && item.properties["model-customization-id"] === mdl.customizationUuid; }).length; mdl.scalable = mdl.properties.maxCountInstances - mdl.currentCount > 0; - }else{ + } else { mdl.scalable = false; } }); @@ -151,7 +163,7 @@ } }); var versions = _.uniqBy(availableVersions, 'modelInfo.modelVersion'); - newVNFName.availableVersions = _.sortBy(_.uniq(versions, response.data.service, true),"modelInfo.modelVersion"); + newVNFName.availableVersions = _.sortBy(_.uniq(versions, response.data.service, true), "modelInfo.modelVersion"); }).catch(function (error) { $log.error(error); vm.errorMsg = error; @@ -242,74 +254,74 @@ result.requestDetails = []; _.forEach(changeManagement.vnfNames, function (vnf) { - try{ - var requestInfoData ={}; - var requestParametersData ={}; + try { + var requestInfoData = {}; + var requestParametersData = {}; var moduleToScale = _.find(vnf.vfModules, {"scale": true}); - if (vnf.availableVersions && vnf.availableVersions.length!=0){ + if (vnf.availableVersions && vnf.availableVersions.length != 0) { - requestInfoData ={ + requestInfoData = { source: vnf.availableVersions[0].requestInfo.source, suppressRollback: vnf.availableVersions[0].requestInfo.suppressRollback, requestorId: vnf.availableVersions[0].requestInfo.requestorId }; - if(workflowType=='Update'){ + if (workflowType == 'Update') { requestParametersData = { usePreload: vnf.availableVersions[0].requestParameters.usePreload }; - }else if(workflowType=="Replace"){ + } else if (workflowType == "Replace") { requestParametersData = { rebuildVolumeGroups: vnf.availableVersions[0].requestParameters.usePreload }; - }else if(workflowType=="VNF In Place Software Update"){ + } else if (workflowType == "VNF In Place Software Update") { var payloadObj = { - 'existing_software_version':vm.getInternalWorkFlowParameter(workflowType, 'text', 'Existing software version').value, - 'new_software_version':vm.getInternalWorkFlowParameter(workflowType, 'text', 'New software version').value, - 'operations_timeout':vm.getInternalWorkFlowParameter(workflowType, 'text', 'Operations timeout').value + 'existing_software_version': vm.getInternalWorkFlowParameter(workflowType, 'text', 'Existing software version').value, + 'new_software_version': vm.getInternalWorkFlowParameter(workflowType, 'text', 'New software version').value, + 'operations_timeout': vm.getInternalWorkFlowParameter(workflowType, 'text', 'Operations timeout').value }; requestParametersData = { payload: JSON.stringify(payloadObj) }; - }else if(workflowType=="VNF Config Update"){ + } else if (workflowType == "VNF Config Update") { requestParametersData = { payload: vm.getInternalWorkFlowParameter("VNF Config Update", "FILE", "Attach configuration file").value }; - }else if(workflowType=="VNF Scale Out"){ - if(!moduleToScale) return null; + } else if (workflowType == "VNF Scale Out") { + if (!moduleToScale) return null; - if(moduleToScale.userParams) { + if (moduleToScale.userParams) { requestParametersData = { userParams: moduleToScale.userParams //,usePreload: true }; - }else{ + } else { requestParametersData = { userParams: [] //,usePreload: false }; } } - $log.info('SchedulerWidgetCtrl:extractChangeManagementCallbackDataStr info:: workflowType '+ workflowType); - $log.info('SchedulerWidgetCtrl:extractChangeManagementCallbackDataStr info:: requestParametersData '+ requestParametersData); + $log.info('SchedulerWidgetCtrl:extractChangeManagementCallbackDataStr info:: workflowType ' + workflowType); + $log.info('SchedulerWidgetCtrl:extractChangeManagementCallbackDataStr info:: requestParametersData ' + requestParametersData); - }else if(workflowType=="VNF In Place Software Update"){ + } else if (workflowType == "VNF In Place Software Update") { var payloadObj = { - 'existing_software_version':vm.getInternalWorkFlowParameter(workflowType, 'text', 'Existing software version').value, - 'new_software_version':vm.getInternalWorkFlowParameter(workflowType, 'text', 'New software version').value, - 'operations_timeout':vm.getInternalWorkFlowParameter(workflowType, 'text', 'Operations timeout').value + 'existing_software_version': vm.getInternalWorkFlowParameter(workflowType, 'text', 'Existing software version').value, + 'new_software_version': vm.getInternalWorkFlowParameter(workflowType, 'text', 'New software version').value, + 'operations_timeout': vm.getInternalWorkFlowParameter(workflowType, 'text', 'Operations timeout').value }; requestParametersData = { payload: JSON.stringify(payloadObj) }; - }else if(workflowType=="VNF Config Update"){ + } else if (workflowType == "VNF Config Update") { requestParametersData = { payload: vm.getInternalWorkFlowParameter("VNF Config Update", "FILE", "Attach configuration file").value }; } var data; - if(workflowType=="VNF Scale Out") { + if (workflowType == "VNF Scale Out") { data = { vnfName: vnf.name, vnfInstanceId: vnf.id, @@ -325,11 +337,11 @@ cloudConfiguration: vnf.cloudConfiguration, requestInfo: requestInfoData, relatedInstanceList: [], - requestParameters:requestParametersData, + requestParameters: requestParametersData, configurationParameters: JSON.parse(vm.getInternalWorkFlowParameter("VNF Scale Out", "text", "Configuration Parameters").value) }; requestInfoData.instanceName = vnf.name + "_" + (moduleToScale.currentCount + 1); - }else{ + } else { data = { vnfName: vnf.name, vnfInstanceId: vnf.id, @@ -345,18 +357,18 @@ cloudConfiguration: vnf.cloudConfiguration, requestInfo: requestInfoData, relatedInstanceList: [], - requestParameters:requestParametersData + requestParameters: requestParametersData }; } var serviceInstanceId = ''; _.forEach(vnf['service-instance-node'], function (instanceNode) { - if(instanceNode['node-type'] === 'service-instance'){ + if (instanceNode['node-type'] === 'service-instance') { serviceInstanceId = instanceNode.properties['service-instance-id']; } }); - if (vnf.availableVersions && vnf.availableVersions.length!=0){ + if (vnf.availableVersions && vnf.availableVersions.length != 0) { _.forEach(vnf.availableVersions[0].relatedInstanceList, function (related) { var rel = related.relatedInstance; var relatedInstance = { @@ -376,7 +388,7 @@ data.relatedInstanceList.push({relatedInstance: relatedInstance}); }); - if(workflowType=="VNF Scale Out") { + if (workflowType == "VNF Scale Out") { //push vnf to related as well as the service instance var relatedInstance = { instanceId: vnf.id, @@ -393,7 +405,7 @@ data.relatedInstanceList.push({relatedInstance: relatedInstance}); } } - }catch(err){ + } catch (err) { $log.error('SchedulerCtrl::extractChangeManagementCallbackDataStr error: ' + err); vm.errorMsg = err; } @@ -405,23 +417,25 @@ function getWorkflowParametersFromForm() { let workflowParameters = - {requestDetails:{ - cloudConfiguration:{}, - requestParameters:{userParams:[{}]} - }}; + { + requestDetails: { + cloudConfiguration: {}, + requestParameters: {userParams: [{}]} + } + }; workflowParameters.requestDetails.cloudConfiguration = vm.changeManagement.vnfNames[0].cloudConfiguration; let parameters = vm.getRemoteWorkFlowParameters(vm.changeManagement.workflow); - parameters.forEach((parameter)=>{ - let inputField = document.getElementById('so-workflow-parameter-'+parameter.soFieldName); - workflowParameters.requestDetails.requestParameters.userParams[0][parameter.soFieldName]=inputField.value; - }); + parameters.forEach((parameter) => { + let inputField = document.getElementById('so-workflow-parameter-' + parameter.soFieldName); + workflowParameters.requestDetails.requestParameters.userParams[0][parameter.soFieldName] = inputField.value; + }); return workflowParameters; } vm.openModal = function () { - if(vm.hasScheduler) { //scheduling supported + if (vm.hasScheduler) { //scheduling supported vm.scheduleWorkflow(); } else { //no scheduling support @@ -450,13 +464,13 @@ }; vm.executeWorkflow = function () { - if ( vm.localWorkflows && vm.localWorkflows.length > 0 ) { + if (vm.localWorkflows && vm.localWorkflows.length > 0) { vm.triggerLocalWorkflow(); } else { let source = vm.getRemoteWorkflowSource(vm.changeManagement.workflow); - if( source === "NATIVE"){ + if (source === "NATIVE") { vm.triggerLocalWorkflow(); - }else { + } else { vm.triggerRemoteWorkflow(); } } @@ -503,7 +517,13 @@ }); }; - vm.loadVNFTypes = function () { + vm.serviceTypeChanged = function () { + if (!$scope.isNewFilterChangeManagmentEnabled()) { + vm.searchVNFs(); + } + }; + + vm.searchVNFs = function () { vm.vnfTypes = []; vm.vnfTypesTemp = []; vm.serviceInstances = []; @@ -513,11 +533,18 @@ vm.vnfs = []; vm.vfModules = []; + let vnfRole = $scope.isNewFilterChangeManagmentEnabled() ? vm.changeManagement.vnfType : null; + let cloudRegion = null; + AaiService.getVnfsByCustomerIdAndServiceType( vm.changeManagement.subscriberId, - vm.changeManagement.serviceType["service-type"] - ).then(function (response) { + vm.changeManagement.serviceType["service-type"], + vnfRole, + cloudRegion, + ). + then(function (response) { + vm.isSearchedVNF = true; var vnfsData = response.data.results; if (vnfsData) { for (var i = 0; i < vnfsData.length; i++) { @@ -551,7 +578,7 @@ }); _.forEach(filteredVnfs, function (vnf) { - vm.vnfTypes.push(vnf.properties['nf-role']); + vm.vnfTypes.push(vnf.properties['nf-role']) }); } } @@ -632,7 +659,7 @@ }); } - var getVersionNameForId = function(versionId) { + var getVersionNameForId = function (versionId) { var version = _.find(fromVNFVersions, {"key": versionId}); return version.value; }; @@ -656,9 +683,11 @@ var serviceInstancesIds = _.filter(vnf['related-to'], {'node-type': 'service-instance'}) - .map(function (serviceInstance) { return serviceInstance.id }); + .map(function (serviceInstance) { + return serviceInstance.id + }); - var serviceInstances = _.filter(vm.serviceInstances, function(serviceInstance) { + var serviceInstances = _.filter(vm.serviceInstances, function (serviceInstance) { return _.includes(serviceInstancesIds, serviceInstance.id); }); @@ -719,7 +748,7 @@ }).then(function () { vm.loadRemoteWorkFlowsParameters(); }); - }else{ + } else { return vm.loadLocalWorkFlows() .then(vm.loadLocalWorkFlowsParameters) .then(function () { @@ -750,7 +779,7 @@ }; vm.loadLocalWorkFlowsParameters = function () { - vm.localWorkflows.forEach(function(workflow) { + vm.localWorkflows.forEach(function (workflow) { vm.loadLocalWorkFlowParameters(workflow); }); }; @@ -767,8 +796,8 @@ }; vm.loadRemoteWorkFlowsParameters = function () { - vm.remoteWorkflows.forEach(function(workflow) { - if (workflow.source ==='SDC' || workflow.source === 'sdc' ){ + vm.remoteWorkflows.forEach(function (workflow) { + if (workflow.source === 'SDC' || workflow.source === 'sdc') { vm.loadRemoteWorkFlowParameters(workflow); } else { vm.loadLocalWorkFlowParameters(workflow.name); @@ -779,8 +808,8 @@ vm.loadRemoteWorkFlowParameters = function (workflow) { let parameters = []; workflow.workflowInputParameters - .filter( function (param) { - return param.soPayloadLocation === "userParams"; + .filter(function (param) { + return param.soPayloadLocation === "userParams" }) .forEach(function (param) { let workflowParams = vm.repackAttributes(param); @@ -801,7 +830,7 @@ vm.remoteWorkflowsParameters.set(workflow.name, parameters); }; - vm.repackAttributes = function (workflowParam){ + vm.repackAttributes = function (workflowParam) { return { name: workflowParam.label, required: workflowParam.required, @@ -809,38 +838,38 @@ soFieldName: workflowParam.soFieldName, maxLength: '500', pattern: '.*' - }; + } }; vm.getRemoteWorkFlowParameters = function (workflow) { if (workflow && vm.remoteWorkflowsParameters.has(workflow)) { - return vm.remoteWorkflowsParameters.get(workflow); + return vm.remoteWorkflowsParameters.get(workflow) } return []; }; - vm.hasPatternError = function(form, itemName){ + vm.hasPatternError = function (form, itemName) { return form[itemName].$error.pattern; }; - vm.hasAsyncFnError = function(form, itemName){ + vm.hasAsyncFnError = function (form, itemName) { return form[itemName].$error.validateAsyncFn; }; - vm.getIdFor = function(type, id, name){ + vm.getIdFor = function (type, id, name) { return "internal-workflow-parameter-" + type + "-" + id + "-" + (name ? name.split(' ').join('-').toLowerCase() : ""); }; vm.getInternalWorkFlowParameters = function (workflow, type) { - if (workflow && vm.localWorkflowsParameters.has(workflow) && vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type==type) != []) { - return vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type==type); + if (workflow && vm.localWorkflowsParameters.has(workflow) && vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type == type) != []) { + return vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type == type); } return []; }; vm.getInternalWorkFlowParameter = function (workflow, type, parameterName) { - if (workflow && vm.localWorkflowsParameters.has(workflow) && vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type==type) != []) { - return vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type==type).filter(parameter => parameter.name === parameterName)[0] + if (workflow && vm.localWorkflowsParameters.has(workflow) && vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type == type) != []) { + return vm.localWorkflowsParameters.get(workflow).filter(parameter => parameter.type == type).filter(parameter => parameter.name === parameterName)[0] } }; @@ -849,7 +878,7 @@ }; vm.getCachedWorkflowDetails = function (workflow) { - return vm.remoteWorkflows.filter( function (remoteWorkflow) { + return vm.remoteWorkflows.filter(function (remoteWorkflow) { return remoteWorkflow.name === workflow; }); @@ -895,7 +924,7 @@ var file = files[0]; var reader = new FileReader(); - reader.onloadend = function(evt) { + reader.onloadend = function (evt) { if (evt.target.readyState === FileReader.DONE) { $scope.$apply(function () { $scope.moduleArr[0].userParams = JSON.parse(evt.target.result); 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 index 857509320..19b5f2b92 100644 --- 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 @@ -22,6 +22,7 @@ border: 1px solid #D2D2D2; display: flex; } + .scale-out-modules .table-row > div { padding: 0 12px; color: #5A5A5A; @@ -29,82 +30,116 @@ 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; font-size: 22px; } + .scale-out-modules .table-row > div:nth-child(2) { flex: 200px 1 0; } + .scale-out-modules .table-row > div:nth-child(3) { flex: 200px 1 0; } + .scale-out-modules .table-row > div:nth-child(4), .scale-out-modules .table-row > div:nth-child(5) { flex: 110px 0 0; } + .scale-out-modules .table-row > div:nth-child(6), .scale-out-modules .table-row > div:nth-child(7) { flex: 130px 0 0; } + .scale-out-modules .table-row.open > div { line-height: 29px; border-top: 1px #009FDB solid; border-bottom: 1px #009FDB solid; } + .scale-out-modules .table-row.open > div:last-child { box-shadow: 0px 0px 0px 0px red, 1px 0px 0px 0px #009FDB; } + .scale-out-modules .table-row.open > div:nth-child(1) { border-color: green; } + .scale-out-modules .table-row.open > div:nth-child(2) { color: #009FDB; } + .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) { + +.scale-out-modules .modules-table .table-row > div:nth-child(1) { flex: 300px 1 0; font-size: 13px; } -.scale-out-modules .modules-table .table-row > div:nth-child(2) { + +.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) { + +.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(3) input { + +.scale-out-modules .modules-table .table-row > div:nth-child(3) input { width: 60px; margin-top: 10px; } -.scale-out-modules .modules-table .table-row > div:nth-child(4) { + +.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) { + +.scale-out-modules .modules-table .table-row > div:nth-child(5) { flex: 280px 0 0; } + .scale-out-modules .modules-table.open { display: block; } +.search-vnf { + position: absolute; + bottom: 0; +} + +.form-group { + position: relative; +} + +.nf-role-input { + width: 50% +} /*LESS*/ /* 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 de0ec4026..f06d88321 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 @@ -18,56 +18,114 @@ ============LICENSE_END========================================================= --> -<link rel="stylesheet" type="text/css" href="app/vid/styles/modal-create-new.css" /> +<link rel="stylesheet" type="text/css" href="app/vid/styles/modal-create-new.css"/> <div class="modal-header"> <h3 class="modal-title" id="modal-title">New VNF Change</h3> <span ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> <div ng-if="vm.errorMsg!==''"><font color='red'>{{vm.errorMsg.message}}</font></div> </div> -<form class="form-create" data-tests-id="newChangeManagementForm" name="newChangeManagement" ng-submit="vm.openModal();vm.close();" novalidate> - <div class="modal-body step1" ng-show="vm.wizardStep === 1" > +<form class="form-create" data-tests-id="newChangeManagementForm" name="newChangeManagement" + ng-submit="vm.openModal();vm.close();" novalidate> + <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> + <select class="form-control" ng-model="vm.changeManagement.subscriberId" ng-change="vm.loadServiceTypes()" + name="subscriber" id="subscriber" data-tests-id="subscriberName" required> <option value="" disabled>Select subscriber</option> - <option data-tests-id="subscriberNameOption" class="subscriberNameOption" ng-repeat="item in vm.subscribers" ng-value="item['global-customer-id']" ng-disabled="!(item['is-permitted'])">{{item['subscriber-name']}}</option> + <option data-tests-id="subscriberNameOption" class="subscriberNameOption" + ng-repeat="item in vm.subscribers" ng-value="item['global-customer-id']" + ng-disabled="!(item['is-permitted'])">{{item['subscriber-name']}} + </option> </select> </div> + <div class="form-group"> <label class="control-label">Service type</label> - <select class="form-control" ng-model="vm.changeManagement.serviceType" ng-change="vm.loadVNFTypes()" name="serviceType" id="serviceType" ng-options="item['service-type'] disable when !(item['is-permitted']) for item in vm.serviceTypes" required data-ng-disabled="newChangeManagement.subscriber.$pristine" data-tests-id="serviceType"> + <select class="form-control" ng-model="vm.changeManagement.serviceType" + ng-change="vm.serviceTypeChanged()" + name="serviceType" id="serviceType" + ng-options="item['service-type'] disable when !(item['is-permitted']) for item in vm.serviceTypes" + required data-ng-disabled="newChangeManagement.subscriber.$pristine" + data-tests-id="serviceType"> <option value="" disabled>Select service type</option> </select> </div> - <div class="form-group"> - <label class="control-label">NF Role</label> - <select class="form-control" ng-model="vm.changeManagement.vnfType" ng-change="vm.loadVNFVersions()" name="vnfType" id="vnfType" ng-options="item for item in vm.vnfTypes" required data-ng-disabled="newChangeManagement.serviceType.$pristine"> - <option value="" disabled>NF Role</option> - </select> + + + <div ng-if="!isNewFilterChangeManagmentEnabled()"> + + <div class="form-group"> + <label class="control-label">NF Role</label> + <select class="form-control" ng-model="vm.changeManagement.vnfType" ng-change="vm.loadVNFVersions()" + name="vnfType" id="vnfType" ng-options="item for item in vm.vnfTypes" required + data-ng-disabled="newChangeManagement.serviceType.$pristine"> + <option value="" disabled>NF Role</option> + </select> + </div> + + </div> + + + <div ng-if="isNewFilterChangeManagmentEnabled()"> + + <div class="form-group form-row"> + <div class="col nf-role-input"> + <label class="control-label">NF Role</label> + <input class="form-control" ng-model="vm.changeManagement.vnfType" + name="vnfType" id="vnfTypeInput" + data-ng-disabled="newChangeManagement.serviceType.$pristine"> + </div> + + <div class="col"> + <button class="search-vnf" type="button" id="searchVNF" name="searchVNFs" class="btn btn-primary" + ng-click="vm.searchVNFs()" + ng-disabled="newChangeManagement.subscriber.$pristine || newChangeManagement.serviceType.$pristine"> + Search VNFs + </button> + </div> + </div> + </div> + + <div class="form-group"> <label class="control-label">Source VNF Model Version</label> - <select class="form-control" ng-model="vm.changeManagement.fromVNFVersion" ng-change="vm.loadVNFNames()" name="fromVNFVersion" id="fromVNFVersion" ng-options="item.key as item.value for item in vm.fromVNFVersions" required data-ng-disabled="newChangeManagement.vnfType.$pristine"> + <select class="form-control" ng-model="vm.changeManagement.fromVNFVersion" ng-change="vm.loadVNFNames()" + name="fromVNFVersion" id="fromVNFVersion" + ng-options="item.key as item.value for item in vm.fromVNFVersions" required + data-ng-disabled="vm.isDisabledVNFmodelVersion(newChangeManagement.vnfType.$pristine); "> <option value="" disabled>Select VNF Model Version</option> </select> </div> + + <div class="form-group"> <label class="control-label">Available VNF</label> - <multiselect ng-model="vm.changeManagement.vnfNames" ng-change="vm.loadWorkFlows()" name="vnfName" id="vnfName" options="vm.vnfNames" display-prop="name" id-prop="id" required data-ng-disabled="newChangeManagement.fromVNFVersion.$pristine"></multiselect> + <multiselect ng-model="vm.changeManagement.vnfNames" ng-change="vm.loadWorkFlows()" name="vnfName" + id="vnfName" options="vm.vnfNames" display-prop="name" id-prop="id" required + data-ng-disabled="newChangeManagement.fromVNFVersion.$pristine"></multiselect> </div> - <div ng-show="vm.changeManagement.vnfNames && vm.changeManagement.vnfNames.length > 0" class="form-group vnf-versions-container"> + <div ng-show="vm.changeManagement.vnfNames && vm.changeManagement.vnfNames.length > 0" + class="form-group vnf-versions-container"> <table class="table table-bordered"> <tbody> <tr ng-repeat="vnfName in vm.changeManagement.vnfNames"> <td class="col-md-2"><span class="vnf-versions-name">{{vnfName.name}}</span></td> <td class="col-md-2"> - <select ng-model="vnfName.version" ng-change="vm.selectVersionForVNFName(vnfName)" class="vnf-versions-select-as-text" id="{{vnfName['invariant-id']}}-target-version-select"> + <select ng-model="vnfName.version" ng-change="vm.selectVersionForVNFName(vnfName)" + class="vnf-versions-select-as-text" + id="{{vnfName['invariant-id']}}-target-version-select"> <option value="" disabled="" selected="selected">Select Target VNF Model Version</option> - <option ng-repeat="version in vnfName.availableVersions">{{version.modelInfo.modelVersion}}</option> + <option ng-repeat="version in vnfName.availableVersions"> + {{version.modelInfo.modelVersion}} + </option> </select> </td> <td class="col-md-1 vnf-versions-file"> - <input ng-model="vnfName.filePath" onchange="angular.element(this).scope().selectFileForVNFName(this)" type="file" id="{{vnfName['invariant-id']}}" class="vnf-files-select" /> + <input ng-model="vnfName.filePath" + onchange="angular.element(this).scope().selectFileForVNFName(this)" type="file" + id="{{vnfName['invariant-id']}}" class="vnf-files-select"/> <span class="vnf-versions-file">Select File<span class="caret"></span></span></td> </tr> </tbody> @@ -75,30 +133,44 @@ </div> <div class="form-group"> <label class="control-label">Workflow</label> - <select class="form-control" ng-model="vm.changeManagement.workflow" name="workflow" id="workflow" ng-options="item for item in vm.workflows" required data-ng-disabled="newChangeManagement.vnfName.$pristine"> + <select class="form-control" ng-model="vm.changeManagement.workflow" name="workflow" id="workflow" + ng-options="item for item in vm.workflows" required + data-ng-disabled="newChangeManagement.vnfName.$pristine"> <option value="" disabled>Select workflow</option> </select> </div> - <div class="form-group" ng-if="vm.changeManagement.workflow" ng-repeat="item in vm.getInternalWorkFlowParameters(vm.changeManagement.workflow, 'FILE')"> + <div class="form-group" ng-if="vm.changeManagement.workflow" + ng-repeat="item in vm.getInternalWorkFlowParameters(vm.changeManagement.workflow, 'FILE')"> <label class="control-label">{{item.name}}</label> <div class="file-wrapper"> - <input id="{{vm.getIdFor('file',item.id,item.name)}}" ng-change="vm.onChange(item)" class="file-input" type="file" ngf-select ng-model="item.value" ngf-validate-async-fn="vm.uploadConfigFile($file)" ng-attr-name="{{'internal-workflow-parameter-file-name-' + item.id}}" accept="{{item.acceptableFileType}}" ngf-pattern="{{item.acceptableFileType}}" ng-required="{{item.required}}"/> - <label id="{{vm.getIdFor('file',item.id,item.name)}}-label" class="file-input-label">{{item.value&&item.value.name||"Select File"}} </label> + <input id="{{vm.getIdFor('file',item.id,item.name)}}" ng-change="vm.onChange(item)" class="file-input" + type="file" ngf-select ng-model="item.value" ngf-validate-async-fn="vm.uploadConfigFile($file)" + ng-attr-name="{{'internal-workflow-parameter-file-name-' + item.id}}" + accept="{{item.acceptableFileType}}" ngf-pattern="{{item.acceptableFileType}}" + ng-required="{{item.required}}"/> + <label id="{{vm.getIdFor('file',item.id,item.name)}}-label" class="file-input-label"> + {{item.value&&item.value.name||"Select File"}} </label> <label ng-attr-for="{{vm.getIdFor('file',item.id,item.name)}}"><span class="icon-browse"></span></label> </div> - <label id="errorLabel" class="icon-alert error" ng-if="vm.hasPatternError(newChangeManagement, 'internal-workflow-parameter-file-name-' + item.id)">{{item.msgOnPatternError}}</label> - <label id="errorContentLabel" class="icon-alert error" ng-if="vm.hasAsyncFnError(newChangeManagement, 'internal-workflow-parameter-file-name-' + item.id)">{{item.msgOnContentError}}</label> + <label id="errorLabel" class="icon-alert error" + ng-if="vm.hasPatternError(newChangeManagement, 'internal-workflow-parameter-file-name-' + item.id)">{{item.msgOnPatternError}}</label> + <label id="errorContentLabel" class="icon-alert error" + ng-if="vm.hasAsyncFnError(newChangeManagement, 'internal-workflow-parameter-file-name-' + item.id)">{{item.msgOnContentError}}</label> </div> - <div class="form-group" ng-if="vm.changeManagement.workflow" ng-repeat="item in vm.getInternalWorkFlowParameters(vm.changeManagement.workflow, 'text')"> + <div class="form-group" ng-if="vm.changeManagement.workflow" + ng-repeat="item in vm.getInternalWorkFlowParameters(vm.changeManagement.workflow, 'text')"> <label ng-attr-for="{{vm.getIdFor('text',item.id,item.name)}}" class="control-label">{{item.name}}</label> - <input ng-model="item.value" type="text" id="{{vm.getIdFor('text',item.id,item.name)}}" pattern="{{item.pattern}}" ng-required="{{item.required}}"> + <input ng-model="item.value" type="text" id="{{vm.getIdFor('text',item.id,item.name)}}" + pattern="{{item.pattern}}" ng-required="{{item.required}}"> </div> - <div class="form-group" ng-if="vm.changeManagement.workflow" ng-repeat="item in vm.getRemoteWorkFlowParameters(vm.changeManagement.workflow)"> + <div class="form-group" ng-if="vm.changeManagement.workflow" + ng-repeat="item in vm.getRemoteWorkFlowParameters(vm.changeManagement.workflow)"> <label for="so-workflow-parameter-{{item.id}}" class="control-label">{{item.name}}</label> - <input ng-model="item.value" type="text" id="so-workflow-parameter-{{item.id}}" pattern="{{item.pattern}}" maxlength="{{item.maxLength}}" ng-required="{{item.required}}" soFieldName="{{item.soFieldName}}"> + <input ng-model="item.value" type="text" id="so-workflow-parameter-{{item.id}}" pattern="{{item.pattern}}" + maxlength="{{item.maxLength}}" ng-required="{{item.required}}" soFieldName="{{item.soFieldName}}"> </div> </div> @@ -114,7 +186,8 @@ <div>Invariant UUID</div> </div> - <div class="table-row" ng-repeat-start="vnf in vm.changeManagement.vnfNames" ng-click="vnf.isOpen=!!!vnf.isOpen"> + <div class="table-row" ng-repeat-start="vnf in vm.changeManagement.vnfNames" + ng-click="vnf.isOpen=!!!vnf.isOpen"> <div>{{vnf.isOpen ? '-' : '+'}}</div> <div>{{vnf['service-instance-node'][0].properties['service-instance-name']}}</div> <div>{{vnf.name}}</div> @@ -137,12 +210,13 @@ <div>{{moduleArr.length}}</div> <div ng-if="!moduleArr[0].scalable">N/A</div> <div ng-if="moduleArr[0].scalable"> - <input type="checkbox" ng-model="moduleArr[0].scale" /> + <input type="checkbox" ng-model="moduleArr[0].scale"/> </div> <div>{{moduleArr[0].uuid}}</div> <div ng-if="!moduleArr[0].scalable">N/A</div> <div ng-if="moduleArr[0].scalable"> - <input type="file" accept="application/json" onchange="angular.element(this).scope().setPreload(this)" /> + <input type="file" accept="application/json" + onchange="angular.element(this).scope().setPreload(this)"/> </div> </div> </div> @@ -150,13 +224,23 @@ <div class="modal-footer"> <div class="pull-left"> - <button ng-if="vm.wizardStep === 2" ng-click="vm.prevStep();" type="button" id="back" name="back" class="btn btn-primary">Back</button> + <button ng-if="vm.wizardStep === 2" ng-click="vm.prevStep();" type="button" id="back" name="back" + class="btn btn-primary">Back + </button> </div> <div class="pull-right"> <button type="button" id="cancel" name="cancel" class="btn btn-white" ng-click="vm.close()">Cancel</button> - <button ng-if="!vm.isScaleOut() || (vm.isScaleOut() && vm.wizardStep === 2) || vm.hasScheduler" type="submit" id="submit" name="submit" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">{{vm.hasScheduler ? "Schedule" : "Confirm"}}</button> - <button ng-if="(vm.isScaleOut() && vm.wizardStep === 1) && !vm.hasScheduler" ng-click="vm.nextStep();" type="button" id="next" name="next" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">Next</button> - <button ng-if="isShowErrorReport() && vm.errorMsg!==''" ng-click="showReportWindow()" type="button" class="btn btn-danger" >Create report</button> + <button ng-if="!vm.isScaleOut() || (vm.isScaleOut() && vm.wizardStep === 2) || vm.hasScheduler" + type="submit" id="submit" name="submit" class="btn btn-primary" + data-ng-disabled="newChangeManagement.$invalid">{{vm.hasScheduler ? "Schedule" : "Confirm"}} + </button> + <button ng-if="(vm.isScaleOut() && vm.wizardStep === 1) && !vm.hasScheduler" ng-click="vm.nextStep();" + type="button" id="next" name="next" class="btn btn-primary" + data-ng-disabled="newChangeManagement.$invalid">Next + </button> + <button ng-if="isShowErrorReport() && vm.errorMsg!==''" ng-click="showReportWindow()" type="button" + class="btn btn-danger">Create report + </button> </div> </div> </form>
\ No newline at end of file |