diff options
Diffstat (limited to 'vid-app-common/src/main/webapp/app/vid/scripts/modals')
19 files changed, 1443 insertions, 0 deletions
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.css new file mode 100644 index 000000000..316c2e46e --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.css @@ -0,0 +1,3 @@ +.modal-header h3 { + border-bottom: 3px solid #ffb81c; +}
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html new file mode 100644 index 000000000..bdc95c98e --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html @@ -0,0 +1,12 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-change-management/new-change-management.css" /> +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/alert-change-management/alert-change-management.css" /> +<div class="modal-header"> + <h3 class="modal-title" id="alert-modal-header">On Hold</h3> + <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> +</div> +<div class="modal-body"> + <span id="alert-modal-content">{{vm.content}}</span> +</div> +<div class="modal-footer"> + <div ng-include="'app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html'"></div> +</div> diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.controller.js new file mode 100644 index 000000000..2c5eabed9 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.controller.js @@ -0,0 +1,33 @@ +(function () { + 'use strict'; + + appDS2.controller("alertNewSchedulerController", ["$uibModalInstance", "jobInfo", "MsoService", "COMPONENT", + "$log", alertNewSchedulerController]); + + function alertNewSchedulerController($uibModalInstance, jobInfo, MsoService, COMPONENT, $log) { + var vm = this; + + vm.manualTasks = []; + vm.MANUAL_TASKS = COMPONENT.MANUAL_TASKS; + var init = function() { + if (jobInfo) { + vm.content = jobInfo; + } else { + vm.content = "Successfully"; + } + + + + }; + + + + + + vm.close = function () { + $uibModalInstance.close(); + }; + + init(); + } +})();
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.css new file mode 100644 index 000000000..316c2e46e --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.css @@ -0,0 +1,3 @@ +.modal-header h3 { + border-bottom: 3px solid #ffb81c; +}
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.html new file mode 100644 index 000000000..e6255cf36 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.html @@ -0,0 +1,12 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-change-management/new-change-management.css" /> +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/alert-change-management/alert-change-management.css" /> +<div class="modal-header"> + <h3 class="modal-title" id="alert-modal-header">Response From Server</h3> + <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> +</div> +<div class="modal-body"> + <span id="alert-modal-content">{{vm.content}}</span> +</div> +<div class="modal-footer"> +<!-- <div ng-include="'app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html'"></div> --> +</div>
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js new file mode 100644 index 000000000..91bac5697 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js @@ -0,0 +1,56 @@ +(function () { + 'use strict'; + + appDS2.controller("changeManagementManualTasksController", ["$uibModalInstance", "jobInfo", "MsoService", "COMPONENT", + "$log", changeManagementManualTasksController]); + + function changeManagementManualTasksController($uibModalInstance, jobInfo, MsoService, COMPONENT, $log) { + var vm = this; + + vm.manualTasks = []; + vm.MANUAL_TASKS = COMPONENT.MANUAL_TASKS; + var init = function() { + if (jobInfo && jobInfo.details) { + vm.content = jobInfo.details; + } else { + vm.content = "The VNF change alerted due to unknown reason."; + } + + loadAvailableTasks(jobInfo.job.requestId); + + }; + + function loadAvailableTasks(requestId) { + MsoService.getManualTasks(requestId) + .then(function(response) { + vm.task = response.data[0]; + vm.manualTasks = vm.task && vm.task.validResponses; + }) + .catch(function(error) { + $log.error(error); + }); + } + + vm.completeTask = function(task) { + MsoService.completeTask(vm.task.taskId, task) + .then(function(response) { + vm.manualTasks = response.data; + $uibModalInstance.close(task + " action completed successfully."); + }) + .catch(function(error) { + $uibModalInstance.close(task + " action failed."); + $log.error(error); + }); + }; + + vm.close = function () { + $uibModalInstance.close(); + }; + + vm.isTaskAvailable = function(task) { + return vm.manualTasks.includes(task); + }; + + init(); + } +})();
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html new file mode 100644 index 000000000..687394156 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html @@ -0,0 +1,7 @@ +<div class="pull-right"> + <button ng-repeat="task in vm.manualTasks" + type="button" id="{{task}}-button" name="{{task}}" class="btn btn-primary" + ng-show="vm.isTaskAvailable(vm.MANUAL_TASKS[task])" + ng-click="vm.completeTask(vm.MANUAL_TASKS[task])">{{task.charAt(0).toUpperCase() + task.slice(1)}}</button> +</div> + diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.css new file mode 100644 index 000000000..fb4a06c7b --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.css @@ -0,0 +1,3 @@ +.modal-header h3 { + border-bottom: 3px solid #cf2a2a; +}
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html new file mode 100644 index 000000000..0deaf93d2 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html @@ -0,0 +1,12 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-change-management/new-change-management.css" /> +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/failed-change-management/failed-change-management.css" /> +<div class="modal-header"> + <h3 class="modal-title" id="failed-modal-header">Failed</h3> + <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> +</div> +<div class="modal-body"> + <span id="failed-modal-content">{{vm.content}}</span> +</div> +<div class="modal-footer"> + <div ng-include="'app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html'"></div> +</div> diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.css new file mode 100644 index 000000000..02a0df47e --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.css @@ -0,0 +1,3 @@ +.modal-header h3 { + border-bottom: 3px solid #4ca90c; +}
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html new file mode 100644 index 000000000..9b40db2a5 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html @@ -0,0 +1,12 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-change-management/new-change-management.css" /> +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.css" /> +<div class="modal-header"> + <h3 class="modal-title" id="in-progress-modal-header">In Progress</h3> + <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> +</div> +<div class="modal-body"> + <span id="in-progress-modal-content">{{vm.content}}</span> +</div> +<div class="modal-footer"> + <div ng-include="'app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html'"></div> +</div> 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 new file mode 100644 index 000000000..14ca43b56 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js @@ -0,0 +1,369 @@ +(function () { + 'use strict'; + + appDS2.controller("newChangeManagementModalController", ["$uibModalInstance", "$uibModal", "AaiService", "changeManagementService", + "$log", "$scope", "_", newChangeManagementModalController]); + + function newChangeManagementModalController($uibModalInstance, $uibModal, AaiService, changeManagementService, $log, $scope, _) { + var vm = this; + + var init = function () { + vm.changeManagement = {}; + + loadServicesCatalog(); + registerVNFNamesWatcher(); + vm.loadSubscribers(); + }; + + var loadServicesCatalog = function () { + changeManagementService.getAllSDCServices() + .then(function (response) { + vm.SDCServicesCatalog = response.data; + }) + .catch(function (error) { + $log.error(error); + }) + }; + + var registerVNFNamesWatcher = function () { + $scope.$watch('vm.changeManagement.vnfNames', function (newVal, oldVal) { + if (!oldVal || newVal && newVal.length > oldVal.length) { //JUST THE LAST ONE ADDED + var newVNFName = _.last(vm.changeManagement.vnfNames); + if (oldVal) { + vm.changeManagement.vnfNames = oldVal; + vm.changeManagement.vnfNames.push(newVNFName); + } + if (newVNFName && newVNFName["service-instance-node"]) { + var availableVersions = []; + var services = _.filter(vm.SDCServicesCatalog.services, + {"invariantUUID": newVNFName["service-instance-node"][0].properties["model-invariant-id"]}); + + _.each(services, function (service) { + changeManagementService.getSDCService(service.uuid) + .then(function (response) { + _.each(response.data.vnfs, function (vnf) { + if (newVNFName["invariant-id"] === vnf.invariantUuid) { + availableVersions.push(extractVNFModel(vnf, response.data.service, newVNFName)); + } + }); + var versions = _.uniqBy(availableVersions, ['modelInfo.modelVersion']); + newVNFName.availableVersions = _.uniq(versions, response.data.service, true); + }).catch(function (error) { + $log.error(error); + }); + }); + } + } + }, true); + }; + + var extractVNFModel = function (csarVNF, sdcService, selectionVNF) { + var versionCsarData = { + vnfInstanceId: "", + vnfName: csarVNF.name, + modelInfo: { + modelType: "vnf", + modelInvariantId: csarVNF.invariantUuid, + modelVersionId: selectionVNF.modelVersionId, + modelName: csarVNF.name, + modelVersion: csarVNF.version, + modelCustomizationName: csarVNF.modelCustomizationName, + modelCustomizationId: csarVNF.customizationUuid + }, + cloudConfiguration: { + lcpCloudRegionId: "mdt1", + tenantId: "88a6ca3ee0394ade9403f075db23167e" + }, + requestInfo: { + source: "VID", + suppressRollback: false, + requestorId: "az2016" + }, + relatedInstanceList: [ + { + relatedInstance: { + instanceId: selectionVNF["service-instance-node"]["0"].properties['service-instance-id'], + modelInfo: { + modelType: "service", + modelInvariantId: selectionVNF["service-instance-node"]["0"].properties['model-invariant-id'], + modelVersionId: selectionVNF.modelVersionId, + modelName: sdcService.name, + modelVersion: sdcService.version, + modelCustomizationName: selectionVNF["service-instance-node"]["0"].properties['model-customization-name'], //TODO: Missing + modelCustomizationId: selectionVNF["service-instance-node"]["0"].properties['model-customization-id'] + } + } + } + ], + requestParameters: { + usePreload: true + } + }; + + return versionCsarData; + }; + + vm.close = function () { + $uibModalInstance.close(); + }; + + vm.schedule = function () { + $uibModalInstance.close(vm.changeManagement); + + var modalInstance = $uibModal.open({ + templateUrl: 'app/vid/scripts/modals/new-scheduler/new-scheduler.html', + controller: 'newSchedulerController', + controllerAs: 'vm', + resolve: { + changeManagement: function () { + return vm.changeManagement; + } + } + }); + + modalInstance.result.then(function (result) { + console.log("This is the result of the new change management modal.", result); + }) + }; + + vm.loadSubscribers = function () { + vm.subscribers = []; + AaiService.getSubscribers(function (response) { + vm.subscribers = response; + }); + }; + + vm.loadServiceTypes = function () { + vm.serviceTypes = []; + + AaiService.getSubscriberServiceTypes(vm.changeManagement.subscriberId) + .then(function (response) { + vm.serviceTypes = response.data; + }) + .catch(function (error) { + $log.error(error); + }); + }; + + vm.loadVNFTypes = function () { + vm.vnfTypes = []; + vm.vnfTypesTemp = []; + vm.serviceInstances = []; + + var instances = vm.changeManagement.serviceType["service-instances"]["service-instance"]; + // var promiseArrOfGetVnfs = preparePromiseArrOfGetVnfs(instances); + + vm.vnfs = []; + + AaiService.getVnfsByCustomerIdAndServiceType( + vm.changeManagement.subscriberId, + vm.changeManagement.serviceType["service-type"] + ).then(function (response) { + var vnfsData = response.data.results; + if (vnfsData) { + for (var i = 0; i < vnfsData.length; i++) { + if (vnfsData[i]) { + const nodeType = vnfsData[i]['node-type']; + if (nodeType === "generic-vnf") { + _.forEach(vnfsData[i]['related-to'], function (node) { + if (node['node-type'] === 'vserver') { + vm.vnfs.push(vnfsData[i]); + } + }) + } else if (nodeType === "service-instance") { + vm.serviceInstances.push(vnfsData[i]); + } + } + } + + vm.vnfs = _.flattenDeep( + _.remove(vm.vnfs, function (vnf) { + var nfRole = vnf.properties['nf-role']; + if (nfRole !== undefined) { + return nfRole !== 'null' && nfRole !== ''; + } + }) + ); + + var filteredVnfs = _.uniqBy(vm.vnfs, function (vnf) { + return vnf.properties['nf-role']; + }); + + _.forEach(filteredVnfs, function (vnf) { + vm.vnfTypes.push(vnf.properties['nf-role']) + }); + } + } + ); + }; + + vm.loadVNFVersions = function () { + vm.fromVNFVersions = []; + vm.serviceInstancesToGetVersions = []; + var versions = []; + _.forEach(vm.vnfs, function (vnf) { + if (vnf.properties['nf-role'] === vm.changeManagement['vnfType']) { + + vm.serviceInstancesToGetVersions.push(vnf); + + versions.push(vnf.properties["model-invariant-id"]); + + + } + }); + + AaiService.getVnfVersionsByInvariantId(versions).then(function (response) { + if (response.data) { + var key = response.data.model["0"]["model-invariant-id"]; + var value = response.data.model["0"]["model-vers"]["model-ver"]["0"]["model-version"]; + var element = {"key": key, "value": value}; + vm.fromVNFVersions.push(element); + } + //TODO promise all and call the new api to get the versions. + // vm.fromVNFVersions.push(response.data.model["0"]["model-vers"]["model-ver"]["0"]["model-version"]); + // if(vm.serviceInstancesToGetVersions.length > 0){ + // + // var promiseArrOfGetVnfs = preparePromiseArrOfGetVersions('a9a77d5a-123e-4ca2-9eb9-0b015d2ee0fb'); + // + // Promise.all(promiseArrOfGetVnfs).then(function (allData) { + // vm.vnfs = _.flattenDeep(_.without(allData, null)); + // var filteredVnfs = _.sortedUniqBy(vm.vnfs, function (vnf) { + // return vnf.properties.vnfType; + // }); + // + // _.forEach(filteredVnfs, function (vnf) { + // vm.vnfTypes.push(vnf.properties.vnfType) + // }); + // + // }).catch(function (error) { + // $log(error); + // }); + // } + }) + // debugger; + + }; + + // function preparePromiseArrOfGetVersions(serviceInstances) { + // var promiseArr = []; + // for (var i = 0; i < serviceInstances.length; i++) { + // var modelInvariantId = serviceInstances[i].properties["model-invariant-id"]; + // promiseArr.push( + // getVnfs(modelInvariantId) + // ); + // } + // return promiseArr; + // } + + function getVnfs(modelInvariantId) { + return new Promise(function (resolve, reject) { + AaiService.getVnfVersionsByInvariantId(modelInvariantId) + .then(function (response) { + if (response.data.httpCode !== null && + response.data.httpCode === 200) { + var vnfsData = response.data.t.results; + for (var i = 0; i < vnfsData.length; i++) { + if (vnfsData[i]) { + if (vnfsData[i].nodeType === "generic-vnf") { + resolve(vnfsData[i]); + } else if (vnfsData[i].nodeType === "service-instance") { + vm.serviceInstances.push(vnfsData[i]); + } + } + } + resolve(null); + } + resolve(null); + }) + .catch(function (error) { + reject(error); + }); + }); + } + + vm.loadVNFNames = function () { + vm.vnfNames = []; + + _.forEach(vm.vnfs, function (vnf) { + + if (vnf.properties['nf-role'] === vm.changeManagement.vnfType) { + var vServer = {}; + + _.forEach(vnf['related-to'], function (node) { + if (node['node-type'] === 'vserver') { + vServer = extractLcpRegionIdAndTenantId(node.url); + } + }); + + vm.vnfNames.push({ + "id": vnf.properties["vnf-id"], + "name": vnf.properties["vnf-name"], + "invariant-id": vnf.properties["model-invariant-id"], + "service-instance-node": _.filter(vm.serviceInstances, {id: vnf["related-to"][0].id}), + "modelVersionId": vnf.properties["model-version-id"], + "properties": vnf.properties, + 'cloudConfiguration': vServer, + "relatedTo": vnf['related-to'] + }); + } + }); + }; + + function extractLcpRegionIdAndTenantId(url) { + + var cloudConfiguration = { + lcpCloudRegionId: '', + tenantId: '' + }; + + var splitedUrlByDash = _.split(url, '/', 100); + + cloudConfiguration.lcpCloudRegionId = splitedUrlByDash[7]; + cloudConfiguration.tenantId = splitedUrlByDash[10]; + + return cloudConfiguration; + }; + + vm.loadWorkFlows = function () { + var vnfs = []; + angular.forEach(vm.changeManagement.vnfNames, function (vnfName) { + vnfs.push(vnfName.name) + }); + + //TODO: When we'll have the mappings, use the backend call to get the workflows + // changeManagementService.getWorkflows(vnfs) + // .then(function(response) { + // vm.workflows = response.data; + // }) + // .catch(function(error) { + // $log.error(error); + // }); + + vm.workflows = ["Update", "Replace"]; + }; + + //Must be $scope because we bind to the onchange of the html (cannot attached to vm variable). + $scope.selectFileForVNFName = function (fileInput) { + if (fileInput && fileInput.id) { + var vnfName = _.filter(vm.changeManagement.vnfNames, {"invariant-id": fileInput.id}); + var file = fileInput.files[0]; + var fileReader = new FileReader(); + fileReader.onload = function (load) { + try { + var lines = load.target.result; + vnfName[0].selectedFile = JSON.parse(lines); + } catch (error) { + $log.error(error); + } + }; + fileReader.readAsText(file); + } + }; + + vm.selectVersionForVNFName = function (vnfName) { + console.log("Will add version for selected vnf name: " + vnfName.name); + }; + + init(); + } +})();
\ 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.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..9d270987a --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.css @@ -0,0 +1,130 @@ +.btn-white { + font-family: "Open Sans"; + border-radius: 2px; + border: 1px solid #d8d8d8; + background-color: #ffffff; + width: 94px; + height: 30px; + color: #5a5a5a; + font-size: 13px; + font-weight: 400; + line-height: 36px; + text-align: center; + padding: 4px 12px !important; +} + +.btn-primary { + font-family: "Open Sans"; + border-radius: 2px; + border: 1px solid #0091c8; + background-color: #009fdb; + width: 94px; + height: 30px; + color: #ffffff; + font-size: 13px; + font-weight: 400; + line-height: 36px; + text-align: center; + padding: 4px 12px !important; +} + +.modal-header { + border: none!important; + padding: 15px 15px 0px 15px!important; +} + +.modal-header h3 { + font-family: "Open Sans"; + color: #191919; + font-size: 22px; + font-weight: 300; + line-height: 16px; + padding-bottom: 20px; + border-bottom: 3px solid #009fdb; + +} + +.control-label { + font-family: "Open Sans"; + color: #5a5a5a; + font-size: 13px; + font-weight: 400; +} + +.modal-footer { + background-color: #eaeaea; +} + +.modal-dialog { + width: 587px; + border-radius: 8px; +} + +.modal-content { + width: 587px; + border-radius: 8px; + background-color: #ffffff; +} + +button.dropdown-toggle { + text-align: left; +} + +button[disabled].dropdown-toggle { + opacity: 1; + cursor: not-allowed; + background-color: #eee; + border: 1px solid #aaa; + color: #a0a0a0; +} + +multiselect[disabled] { + cursor: not-allowed; +} + +a.item-unselected:before { + font-family: "icomoon"!important; + content: "\e90c"; + color: #4ca90c; +} + +.modal-close { + margin: -40px 5px 0 0; + color: #5a5a5a; + font-size: 20px; + cursor: pointer; +} + +.vnf-versions-container .table { + position: relative; + background-color: #f8f8f8; + background-clip: padding-box; + border-radius: 6px; + outline: 0; +} + +.vnf-versions-name { + padding-top: 6px; + font-family: "Open Sans"; + position: absolute; +} + +.vnf-versions-select-as-text { + font-family: "Open Sans"; + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; + border: none; + overflow:hidden; + background-color: #f8f8f8; + height: 31px; +} + +.vnf-files-select { + z-index: 999; + opacity: 0.0; + position: absolute; + width: 23%; + cursor: pointer; + height:100%; +} 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 new file mode 100644 index 000000000..71c7eb331 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html @@ -0,0 +1,68 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-change-management/new-change-management.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> +<form name="newChangeManagement" ng-submit="vm.schedule()"> + <div class="modal-body"> + <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> + <option value="" disabled>Select subscriber</option> + <option data-tests-id="subscriberNameOption" ng-repeat="item in vm.subscribers" ng-value="item['global-customer-id']">{{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'] for item in vm.serviceTypes" required data-ng-disabled="newChangeManagement.subscriber.$pristine"> + <option value="" disabled>Select service type</option> + </select> + </div> + <div class="form-group"> + <label class="control-label">VNF type</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>Select VNF type</option> + </select> + </div> + <div class="form-group"> + <label class="control-label">Source 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"> + <option value="" disabled>Select from VNF version</option> + </select> + </div> + <div class="form-group"> + <label class="control-label">VNF name</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> + </div> + <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-6"><span class="vnf-versions-name">{{vnfName.name}}</span></td> + <td class="col-md-3"> + <select ng-model="vnfName.version" ng-change="vm.selectVersionForVNFName(vnfName)" class="vnf-versions-select-as-text"> + <option value="" disabled="" selected="selected">Select Target Version</option> + <option ng-repeat="version in vnfName.availableVersions">{{version.modelInfo.modelVersion}}</option> + </select> + </td> + <td class="col-md-3 vnf-versions-name"> + <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-name">Select File<span class="caret"></span></span></td> + </tr> + </tbody> + </table> + </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"> + <option value="" disabled>Select workflow</option> + </select> + </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 type="button" id="cancel" name="cancel" class="btn btn-white" ng-click="vm.close()">Cancel</button> + </div> + </div> +</form> diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.controller.js new file mode 100644 index 000000000..c8f44c715 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.controller.js @@ -0,0 +1,455 @@ +(function () { + 'use strict'; + + appDS2.controller("newSchedulerController", ["$scope", "$uibModal", "$uibModalInstance", "AaiService", "SchedulerService", "_", + "$log", "changeManagement", "$timeout", "$interval", "$filter", "VIDCONFIGURATION", "changeManagementService", newSchedulerController]); + + function newSchedulerController($scope, $uibModal, $uibModalInstance, AaiService, SchedulerService, _, $log, changeManagement, $timeout, $interval, $filter, VIDCONFIGURATION, changeManagementService) { + var vm = this; + var pollpromise; + + var init = function () { + vm.scheduler = {}; + vm.schedulingInfo = {}; + var callbackData = extractChangeManagementCallbackDataStr(changeManagement); + vm.vnfObject = changeManagement; + vm.schedulerObj = { + domain: 'ChangeManagement', + scheduleId: '', + scheduleName: 'VnfUpgrade/DWF', + userId: '', + domainData: [{ + 'WorkflowName': vm.scheduler.policy, + 'CallbackUrl': 'http://127.0.0.1:8989/scheduler/v1/loopbacktest/vid', + 'CallbackData': callbackData + }], + + schedulingInfo: { + normalDurationInSeconds: '', + additionalDurationInSeconds: '', + concurrencyLimit: '', + policyId: '', + vnfDetails: [ + { + groupId: "", + node: [], + changeWindow: [{ + startTime: '', + endTime: '' + }] + + } + ] + }, + + } + vm.schedulerObj1 = { + "domain": "ChangeManagement", + "scheduleName": "VnfUpgrade/DWF", + "userId": "su7376", + "domainData": [ + { + "WorkflowName": "HEAT Stack Software Update for vNFs", + "CallbackUrl": "http://127.0.0.1:8989/scheduler/v1/loopbacktest/vid", + "CallbackData": "testing" + } + ], + "schedulingInfo": { + "normalDurationInSeconds": 60, + "additionalDurationInSeconds": 60, + "concurrencyLimit": 60, + "policyId": "SNIRO_CM_1707.Config_MS_Demo_TimeLimitAndVerticalTopology_zone_localTime.1.xml", + "vnfDetails": [ + { + "groupId": "group1", + "node": ["satmo415vbc", "satmo455vbc"], + "changeWindow": [ + { + "startTime": "2017-08-08T16:37:30.521Z", + "endTime": "2017-08-08T16:37:30.521Z" + } + ] + } + ] + } + }; + + + vm.format = 'yyyy/MM/dd'; + vm.todate = new Date(); + vm.checkboxSelection = 'false'; + vm.fromDate = ''; + vm.toDate = ''; + vm.timeSlots = []; + + vm.changeManagement = {}; + + vm.subscribers = []; + + AaiService.getSubscribers(function (response) { + vm.subscribers = response; + }); + + vm.serviceTypes = []; + AaiService.getServices(function (response) { + vm.serviceTypes = response.data.service; + }); + + changeManagementService.getWorkflows() + .then(function (response) { + vm.workflows = response.data; + }) + .catch(function (error) { + $log.error(error); + }); + + //TODO: Get the VNF names from backend dynamically + vm.vnfNames = []; + + //TODO: Get the VNF types from backend dynamically + vm.vnfTypes = []; + + AaiService.getLoggedInUserID(function (response) { + vm.userID = response.data; + }); + vm.policys = []; + + var policyName = JSON.stringify({ + policyName: "SNIRO_1710.*", + configAttributes: { + service: "PlacementOptimizationPolicy" + } + }); + SchedulerService.getPolicyInfo(policyName, function (response) { + vm.policys = response.data.entity; + }); + }; + + vm.radioSelections = function (test) { + if (vm.checkboxSelection == "true") { + vm.fromDate = ''; + vm.toDate = '' + } + } + vm.close = function () { + $uibModalInstance.close(); + }; + + + function convertToSecs(number) { + var totalSecs; + if (vm.selectedOption === 'hours') { + totalSecs = number * 3600; + + } + else if (vm.selectedOption === 'minutes') { + totalSecs = number * 60; + } else { + totalSecs = number; + } + return totalSecs; + } + + vm.submit = function () { + vm.schedulingInfo = { + scheduleId: vm.schedulerID, + approvalDateTime: '2017-08-08T16:37:30.521Z', + approvalUserId: "sy6266", + approvalStatus: 'Accepted', + approvalType: 'Tier 2' + }; + + var approvalObj = JSON.stringify(vm.schedulingInfo); + SchedulerService.getSubmitForapprovedTimeslots(approvalObj, function (response) { + if (response.status == 200) { + openConfirmationModal("Successfully Sent for Approval"); + } + + }); + }; + + vm.reject = function () { + vm.schedulingInfo = { + scheduleId: vm.schedulerID, + approvalDateTime: '2017-08-08T16:37:30.521Z', + approvalUserId: "sy6266", + approvalStatus: 'Rejected', + approvalType: 'Tier 2' + } + + var approvalObj = JSON.stringify(vm.schedulingInfo) + SchedulerService.getSubmitForapprovedTimeslots(approvalObj, function (response) { + if (response.status == 200) { + openConfirmationModal("Successfully sent for Rejection"); + } + + }); + }; + + vm.schedule = function (myForm) { + $scope.$watch('fromDate', validateDates(myForm)); + $scope.$watch('toDate', validateDates(myForm)); + if (myForm.$valid) { + sendSchedulerReq() + } + }; + + + function sendSchedulerReq() { + var changeWindow = [{ + startTime: '', + endTime: '' + }]; + vm.timeSlots = []; + var fromDate = $filter('date')(new Date(vm.fromDate), "yyyy-MM-ddTHH:mmZ", "UTC"); + var toDate = $filter('date')(new Date(vm.toDate), "yyyy-MM-ddTHH:mmZ", "UTC"); + + changeWindow[0].startTime = fromDate; + changeWindow[0].endTime = toDate; + vm.schedulerObj.userId = vm.userID; + vm.schedulerObj.domainData[0].WorkflowName = changeManagement.workflow; + vm.schedulerObj.schedulingInfo.normalDurationInSeconds = convertToSecs(vm.scheduler.duration); + vm.schedulerObj.schedulingInfo.additionalDurationInSeconds = convertToSecs(vm.scheduler.fallbackDuration); + vm.schedulerObj.schedulingInfo.concurrencyLimit = vm.scheduler.concurrency; + vm.schedulerObj.schedulingInfo.policyId = vm.scheduler.policy.policyName; + vm.schedulerObj.schedulingInfo['vnfDetails'][0].groupId = 'groupId'; + vm.schedulerObj.schedulingInfo['vnfDetails'][0].node = getVnfData(changeManagement.vnfNames); + + vm.schedulerObj.schedulingInfo['vnfDetails'][0].changeWindow = changeWindow; + if (vm.checkboxSelection == "true") { //When Scheduled now we remove the changeWindow + delete vm.schedulerObj.schedulingInfo['vnfDetails'][0].changeWindow; + } + vm.schedulerObj.schedulingInfo['vnfDetails'][0].changeWindow = changeWindow; + delete vm.schedulerObj.schedulingInfo['vnfDetails'][0].changeWindow; + + var requestScheduler = JSON.stringify(vm.schedulerObj); + console.log(requestScheduler); + SchedulerService.getStatusSchedulerId(requestScheduler, function (response) { + vm.schedulerID = response.data.uuid; + vm.isSpinnerVisible = true; + if (vm.schedulerID) { + var scheduledID = JSON.stringify({scheduleId: vm.schedulerID}); + seviceCallToGetTimeSlots(); + } + }); + } + + function seviceCallToGetTimeSlots() { + + SchedulerService.getTimeSotsForSchedulerId(vm.schedulerID, function (response) { + if (vm.checkboxSelection == "false") { + if (response.data.entity.schedule) { + var scheduleColl = JSON.parse(response.data.entity.schedule); + if (scheduleColl.length > 0) { + vm.timeSlots = scheduleColl; + vm.isSpinnerVisible = false; + hasvaluereturnd = false; + $scope.stopPoll(); + openConfirmationModal(response.data.entity.scheduleId + " Successfully Returned TimeSlots."); + } + + } + else { + if (vm.timeSlots.length == 0 && hasthresholdreached == false) { + var polltime = VIDCONFIGURATION.SCHEDULER_POLLING_INTERVAL_MSECS; + pollpromise = poll(polltime, function () { + if (vm.timeSlots.length == 0) { + hasvaluereturnd = true; + seviceCallToGetTimeSlots() + } + else { + hasvaluereturnd = false; + } + + }); + + } else { + openConfirmationModal("Timeout error.") + } + } + + } + else { + if (response.data.entity) { + vm.isSpinnerVisible = false; + openConfirmationModal(response.data.entity.scheduleId + " Successfully Ready for Schedule.") + } + } + + }); + + } + + function openConfirmationModal(jobInfo) { + var modalInstance = $uibModal.open({ + templateUrl: 'app/vid/scripts/modals/alert-new-scheduler/alert-new-scheduler.html', + controller: 'alertNewSchedulerController', + controllerAs: 'vm', + resolve: { + jobInfo: function () { + return jobInfo; + } + } + }); + } + + var hasvaluereturnd = true; // Flag to check + var hasthresholdreached = false; + var thresholdvalue = VIDCONFIGURATION.SCHEDULER_MAX_POLLS; // interval threshold value + + function poll(interval, callback) { + return $interval(function () { + if (hasvaluereturnd) { //check flag before start new call + callback(hasvaluereturnd); + } + + thresholdvalue = thresholdvalue - 1; //Decrease threshold value + if (thresholdvalue == 0) { + $scope.stopPoll(); // Stop $interval if it reaches to threshold + } + }, interval) + } + + +// stop interval. + $scope.stopPoll = function () { + $interval.cancel(pollpromise); + thresholdvalue = 0; //reset all flags. + hasvaluereturnd = false; + hasthresholdreached = true; + vm.isSpinnerVisible = false; + } + + function getVnfData(arrColl) { + var vnfcolletion = []; + + for (var i = 0; i < arrColl.length; i++) { + vnfcolletion.push(arrColl[i].name); + } + + return vnfcolletion + } + + function validateDates(form) { + if (vm.checkboxSelection == "false") { + + if (form.startDate.$error.invalidDate || form.endDate.$error.invalidDate) { + form.startDate.$setValidity("endBeforeStart", true); //already invalid (per validDate directive) + } else { + //depending on whether the user used the date picker or typed it, this will be different (text or date type). + //creating a new date object takes care of that. + var endDate = new Date(vm.toDate); + var startDate = new Date(vm.fromDate); + form.startDate.$setValidity("endBeforeStart", endDate >= startDate); + } + } + } + + + function extractChangeManagementCallbackDataStr(changeManagement) { + var result = {}; + + result.requestType = changeManagement.workflow; + result.requestDetails = []; + + _.forEach(changeManagement.vnfNames, function (vnf) { + + var data = { + vnfName: vnf.name, + vnfInstanceId: vnf.id, + modelInfo: { + modelType: 'vnf', + modelInvariantId: vnf.properties['model-invariant-id'], + modelVersionId: vnf.modelVersionId, + modelName: vnf.properties['vnf-name'], + modelVersion: vnf.version, + modelCustomizationName: vnf.properties['model-customization-name'], + modelCustomizationId: vnf.properties['model-customization-id'] + }, + cloudConfiguration: { + lcpCloudRegionId: vnf.availableVersions[0].cloudConfiguration.lcpCloudRegionId, + tenantId: vnf.availableVersions[0].cloudConfiguration.tenantId + }, + requestInfo: { + source: vnf.availableVersions[0].requestInfo.source, + suppressRollback: vnf.availableVersions[0].requestInfo.suppressRollback, + requestorId: vnf.availableVersions[0].requestInfo.requestorId + }, + relatedInstanceList: [], + requestParameters: { + usePreload: vnf.availableVersions[0].requestParameters.usePreload + } + }; + + var serviceInstanceId = ''; + _.forEach(vnf['service-instance-node'], function (instanceNode) { + if(instanceNode['node-type'] === 'service-instance'){ + serviceInstanceId = instanceNode.properties['service-instance-id']; + } + }); + + + _.forEach(vnf.availableVersions[0].relatedInstanceList, function (related) { + + var rel = related.relatedInstance; + + var relatedInstance = { + instanceId: serviceInstanceId, + modelInfo: { + modelType: rel.modelInfo.modelType, + modelInvariantId: rel.modelInfo.modelInvariantId, + modelVersionId: rel.modelInfo.modelVersionId, + modelName: rel.modelInfo.modelName, + modelVersion: rel.modelInfo.modelVersion, + modelCustomizationName: rel.modelInfo.modelCustomizationName, + modelCustomizationId: rel.modelInfo.modelCustomizationId + } + }; + + if (rel.vnfInstanceId) + relatedInstance.instanceId = rel.vnfInstanceId; + + data.relatedInstanceList.push({relatedInstance: relatedInstance}); + }); + + + result.requestDetails.push(data); + } + ); + + + // _.forEach(changeManagement.vnfNames, function (vnfName) { + // if (vnfName && vnfName.version) { + // if (vnfName.selectedFile) { + // vnfName.version.requestParameters.userParams = vnfName.selectedFile; + // } + // result.requestDetails.push(vnfName.version) + // } + // }); + + return JSON.stringify(result); + } + + init(); + }; + + appDS2.directive('validDate', function () { + return { + restrict: 'A', + require: 'ngModel', + link: function (scope, element, attrs, control) { + control.$parsers.push(function (viewValue) { + var newDate = model.$viewValue; + control.$setValidity("invalidDate", true); + if (typeof newDate === "object" || newDate == "") return newDate; // pass through if we clicked date from popup + if (!newDate.match(/^\d{1,2}\/\d{1,2}\/((\d{2})|(\d{4}))$/)) + control.$setValidity("invalidDate", false); + return viewValue; + }); + } + }; + }) + + +})(); + diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.css new file mode 100644 index 000000000..8da5c55c5 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.css @@ -0,0 +1,145 @@ +.btn-white { + font-family: OpenSans; + border-radius: 2px; + border: 1px solid #d8d8d8; + background-color: #ffffff; + width: 94px; + height: 30px; + color: #5a5a5a; + font-size: 13px; + font-weight: 400; + line-height: 36px; + text-align: center; +} + +.btn-primary { + font-family: OpenSans; + border-radius: 2px; + border: 1px solid #0091c8; + background-color: #009fdb; + width: 94px; + height: 30px; + color: #ffffff; + font-size: 13px; + font-weight: 400; + line-height: 36px; + text-align: center; +} + +.modal-header { + border: none!important; + padding: 15px 15px 0px 15px!important; +} + +.modal-header h3 { + font-family: OpenSans; + color: #5a5a5a; + font-size: 22px; + font-weight: 300; + line-height: 16px; + padding-bottom: 20px; + border-bottom: 3px solid #009fdb; + +} + +.modal-footer { + background-color: #eaeaea; +} + +.modal-dialog { + width: 587px; + border-radius: 8px; +} + +.modal-content { + width: 587px; + border-radius: 8px; + background-color: #ffffff; +} +.label-font{ + font-size: 1em; +} +.calender-icon{ + background-image: url(../../../../../app/fusion/external/ebz/images/Calendar.svg); + background-repeat:no-repeat; + background-position:98%; + border-radius: 6px; + border: 1px solid #888; + color: #444; + font-family: clearview_att_regular; + width: 100%; + outline: 0; + padding: 7px 10px; + text-transform: none; + z-index: 0; + height: 40px; + position: relative; + +} + +input.calender-icon:focus{ + background-image: url(../../../../../app/fusion/external/ebz/images/Calendar_blue.svg); + background-repeat:no-repeat; +} + + + +.timeslots-content{ + margin-top: 0px; + margin-bottom: 0px; + height: 10em; +} +.find-block{ + float:5em; +} +.timeslots-block{ +/* margin-top: 1em; */ + height: 85px; + } + .policy-combo{ + background-image: none; + } + + div[ng-controller=newSchedulerController] .schedulerVisible { + visibility: visible; +} +div[ng-controller=newSchedulerController] .schedulerHidden { + visibility: hidden; +} + +.table { + border: 1px solid #eaeaea; + box-sizing: border-box; + background-color: #ffffff; + box-shadow: 0px 2px 7px 0px rgba(34, 31, 31, 0.17); + font-family: OpenSans; + color: #5a5a5a; + font-size: 14px; + font-weight: 400; +} +.table>thead { + background-color: #d2d2d2; + font-family: OpenSans; + color: #191919; + font-size: 13px; + font-weight: 600; + line-height: 40px; +} + +.table-headline-row { + font-family: OpenSans; + color: #5a5a5a; + font-size: 14px; + font-weight: 600; + background-color: #eaeaea; + box-shadow: 0px 1px 1px 0px rgba(34, 31, 31, 0.19); +} + +.table-bordered{border:1px solid #eaeaea;} +.table-bordered>tbody>tr>td, +.table-bordered>tbody>tr>th, +.table-bordered>tfoot>tr>td, +.table-bordered>tfoot>tr>th, +.table-bordered>thead>tr>td, +.table-bordered>thead>tr>th{border:1px solid #eaeaea;} + diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.html new file mode 100644 index 000000000..498ff2ec4 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-scheduler/new-scheduler.html @@ -0,0 +1,101 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-scheduler/new-scheduler.css" /> +<div class="modal-header"> + <h3 class="modal-title" id="modal-title">Scheduler Change</h3> +</div> +<form name="newschedulermodalForm" ng-submit="vm.schedule(newschedulermodalForm)"> + <div class="modal-body"> + + <div class="form-group" > + <label><input type="radio" ng-model="vm.checkboxSelection" ng-change="vm.radioSelections()" value="true">Now</label> + <label><input type="radio" ng-model="vm.checkboxSelection" ng-change="vm.radioSelections()" value="false">Range</label> + </div> +<!-- <div class="form-group"> --> +<!-- <input type="radio" ng-model="checkboxSelection" value="false" ><label>Range</label> --> +<!-- </div> --> + + + <div class="form-group" > + <label class="control-label">From Date</label> + <input ng-disabled="(vm.checkboxSelection=='true')? true:false" valid-date name="startDate" ng-model="vm.fromDate" id="startDate" datetime-picker ng-required="false" hour="23" minute='59' class="calender-icon"/> + + </div> + <div class="form-group" > + <label class="control-label">To Date</label> + <input ng-disabled="(vm.checkboxSelection=='true')? true:false" valid-date name="endDate" ng-model="vm.toDate" id="endDate" datetime-picker ng-required="false" hour="23" minute='59' class="calender-icon" /> + <span ng-show="newschedulermodalForm.startDate.$error.endBeforeStart">To date must be on or after From date.</span> + <span ng-show="newschedulermodalForm.startDate.$error.invalidDate || newschedulermodalForm.endDate.$error.invalidDate">Check dates for validity</span> + <span ng-show="newschedulermodalForm.startDate.$error.required || newschedulermodalForm.endDate.$error.required">A required date is missing</span> + </div> + + <div class="form-group" > + <label>Please Select Option For Duration and FallBack</label> + + <select class="form-control" name="selecttime" data-tests-id="timeUnitSelect" ng-model="vm.selectedOption" ng-change="vm.updateMinMax()"> + <option value="hours">HOURS</option> + <option value="minutes">MINUTES</option> + <option value="seconds">SECONDS</option> + </select> + </div> + <div class="row"> + <div class="form-group col-md-6 col-xs-12"> + <label class="control-label">Duration</label> + <input type="number" style="font-size: 1em;" data-tests-id="durationInput" name="durationinput" ng-model="vm.scheduler.duration" ng-required="true"> + + </div> + <div class="form-group col-md-6 col-xs-12" > + <label class="control-label">Fallback Duration</label> + <input type="number" style="font-size: 1em;" name="fallbackinput" data-tests-id="fallbackInput" ng-model="vm.scheduler.fallbackDuration" ng-required="true"> + + + </div> + </div> + <div class="form-group"> + <label class="control-label">Concurrency Limit</label> + <input type="number" style="font-size: 1em;" name="input" data-tests-id="concurrencyLimitInput" ng-model="vm.scheduler.concurrency" min="1" max="30" ng-required="true"> + </div> + <div class="form-group"> + <label class="control-label">Policy</label> + <select class="policy-combo" ng-model="vm.scheduler.policy" id="policy" ng-options="item.policyName for item in vm.policys"> + <option value="">Select Policy</option> + </select> + </div> + <div class="form-group"> + <button type="submit" id="find" name="Find" ng-disabled="vm.isClicked" class="btn btn-primary find-block">Find</button> + <span class="spinner" ng-show="vm.isSpinnerVisible"> + <img src="app/vid/images/spinner.gif"> + </img> + + </span> + + </div> + + <div class="form-group" ng-show="(vm.checkboxSelection=='false')? true:false"> +<!-- <label class="control-label">Time Slots</label> --> +<!-- <textarea rows="10" cols="50" class="timeslots-block" ></textarea> --> + <table class="table table-bordered"> + <thead class="thead-default"> + <tr> + <th>Start Time</th> + <th>End Time</th> + </tr> + </thead> + <tbody> + + <tr class="table-headline-row" ng-repeat="timeslot in vm.timeSlots"> + <td>{{timeslot.startTime}}</td> + <td>{{timeslot.finishTime}}</td> + </tr> + </tbody> + </table> + </div> + + </div> + <div class="modal-footer"> + <div class="pull-right"> + <button type="button" id="btn" name="submit" class="btn btn-primary" ng-click="vm.submit()">Schedule</button> + <button type="button" id="btn" name="submit" class="btn btn-primary" ng-click="vm.reject()">Reject</button> + <button type="button" id="cancel" name="cancel" class="btn btn-white" ng-click="vm.close()">Cancel</button> + </div> + </div> +</form> + diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/pending-change-management/pending-change-management.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/pending-change-management/pending-change-management.css new file mode 100644 index 000000000..d545a5cdc --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/pending-change-management/pending-change-management.css @@ -0,0 +1,7 @@ +.modal-header h3 { + border-bottom: 3px solid #00aeef; +} + +.btn-primary { + padding: 4px 9px !important; +}
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/pending-change-management/pending-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/pending-change-management/pending-change-management.html new file mode 100644 index 000000000..911e86c24 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/pending-change-management/pending-change-management.html @@ -0,0 +1,12 @@ +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/new-change-management/new-change-management.css" /> +<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/pending-change-management/pending-change-management.css" /> +<div class="modal-header"> + <h3 class="modal-title" id="pending-modal-header">Pending</h3> + <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> +</div> +<div class="modal-body"> + <span id="pending-modal-content">{{vm.content}}</span> +</div> +<div class="modal-footer"> + <div ng-include="'app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.html'"></div> +</div> |