diff options
author | c00149107 <chenchuanyu@huawei.com> | 2017-02-27 14:56:20 +0800 |
---|---|---|
committer | c00149107 <chenchuanyu@huawei.com> | 2017-02-27 14:56:20 +0800 |
commit | bcde7a18119384ad99018a6bf7b76dad5a4a42fc (patch) | |
tree | 58162dd52f6eba65d5746881da081cce1db15271 /lifecyclemgr | |
parent | 248e1a98954153e9d29fb256a0dc2d71682ff45e (diff) |
Merge codes to the new client framework
Merge codes to the new client framework
Change-Id: Ie17f634790578bdfb6549d8cea4ffee5343532d9
Issue-ID:GSO-232
Signed-off-by: c00149107 <chenchuanyu@huawei.com>
Diffstat (limited to 'lifecyclemgr')
4 files changed, 766 insertions, 109 deletions
diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/index.html b/lifecyclemgr/src/main/webapp/lifecyclemgr/index.html index d695eaca..ad6a359d 100644 --- a/lifecyclemgr/src/main/webapp/lifecyclemgr/index.html +++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/index.html @@ -11,7 +11,6 @@ <link rel="stylesheet" href="https://unpkg.com/ng-table@2.0.2/bundles/ng-table.min.css"> <link href="css/open-ostyle.css" rel="stylesheet"/> <link href="css/style.css" rel="stylesheet"/> - <script src="js/angular.min.js"></script> <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script> <script src="js/angular-ui-router.min.js"></script> @@ -22,6 +21,7 @@ <script src="js/app.js"></script> <script src="js/DataService.js"></script> <script src="js/mustache.js"></script> + <script src="js/bootbox.min.js"></script> </head> <body ng-app="lcApp" onload="loadTemplate()"> diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js index fd3e3d9a..c31a7487 100644 --- a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js +++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js @@ -1,11 +1,19 @@ app.factory("DataService", function($http, $log){ var lcData = null; + var createParamJsonObj = { + templateId:'', + parameters: {} + }; + return { + getCreateParamJsonObj: function(){ + return createParamJsonObj; + }, loadGetServiceData : function() { //load main Table return $http({ - url: '/openoapi/inventory/v1/services', + url: '/openoapi/servicegateway/v1/services', //url: 'http://localhost:5000/api/getLCData', method: 'GET', headers: {'Content-Type': 'application/json'} @@ -20,8 +28,8 @@ app.factory("DataService", function($http, $log){ 'serviceId': ""})*/ }).then(function(response){ //$log.info(response); - lcData = response.data.lcData; - return response.data; + lcData = response; + return response; }); }, getSavedLCData : function(id){ @@ -71,44 +79,664 @@ app.factory("DataService", function($http, $log){ headers: {'Content-Type': 'application/json'} }).then(function(response){ //$log.info(response); - return response.data.templateData; + return response.data; }); }, - fetchCreateParameters : function(templateId) { - //For Template parameters tab in popup - return $http({ - url: '/openoapi/catalog/v1/servicetemplates/'+templateId, - // url: 'http://localhost:5000/api/getTemplateParameter', - method: 'GET', - headers: {'Content-Type': 'application/json'} - }).then(function(response){ - //$log.info(response); - return response.data; + generateCreateParameters : function(template) { + // For Template parameters tab in popup + return $.when(fetchCreateParameters(template.serviceTemplateId)) + .then(function(createParam) { + // set the create param object + createParamJsonObj = createParam; + // convert the create param to UI. + return convertCreateParamsToUI('create', createParam.parameters); + }); }, - createServiceInstance : function(lifecycleData, sengMsgObj) { - ///For submit of OK button - var parameter = { - 'service' : { - 'name' : lifecycleData.name, - 'description' : lifecycleData.desc, - 'serviceDefId' : '', //no need now, reserved - 'templateId' : lifecycleData.optSelect, - 'parameters' : sengMsgObj - } - }; - return $http({ - url: '/openoapi/servicegateway/v1/services', - //url: 'http://localhost:5000/api/getTemplateData', - method: 'POST', - headers: {'Content-Type': 'application/json'}, - data : JSON.stringify(parameter) - }).then(function(response){ - //$log.info(response); - return response.data.templateData; + createService : function(serviceBaseInfo) { + if (!checkInputs('create', createParamJsonObj.parameters)) { + return {status:'checkfailed'}; + } + var sengMsgObj = collectCreateParamfromUI('', 'create', createParamJsonObj.parameters); + var gatewayService = '/openoapi/servicegateway/v1/services'; + return createServiceInstance(serviceBaseInfo, sengMsgObj); + }, + + deleteService : function(serviceId) { + return deleteServiceInstance(serviceId); + } + } +}); + +/** + * init parameter tab + * @returns + */ +function initParameterTab() { + // Service template was not changed. Do not re-initiate the parameter tab. + if (!templateParameters.changed) { + return; + } + var templateId = $("#svcTempl").val(); + if ('select' === templateId) { + document.getElementById("templateParameterTab").innerHTML = ''; + return; + } + $.when(fetchCreateParameters(templateId)) + .then(function(createParam) { + // set the create param object + templateParameters.paramJsonObj = createParam.parameters; + // convert the create param to UI. + var components = convertCreateParamsToUI('create', createParam.parameters); + document.getElementById("templateParameterTab").innerHTML = components; + templateParameters.changed = false; + }); +} + +/** + * generate the template to create parameters object + * + * @param templateId + * the template id + * @returns + */ +function fetchCreateParameters(templateId) { + //return $.getJSON("./conf/queryCreateParams.json"); + var uri = '/openoapi/servicegateway/v1/createparameters/' + templateId; + return $.ajax({ + type : "GET", + url : uri, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Generate parameters failed.", xhr.responseText); + } + }); +} + +/** + * convert the template params obj to html UI string + * + * @param identify the object identify, it should be '' when called + * @return the html component string + */ +function convertCreateParamsToUI(identify, createParam) { + var components = ''; + // convert host to UI + if (undefined != createParam.domainHost && 'enum' === createParam.domainHost.type) { + components = components + + generateParamComponent(createParam.nodeType, identify, + createParam.domainHost, false); + } + // convert own locationConstraints to UI + if(undefined != createParam.nsParameters.locationConstraints){ + createParam.nsParameters.locationConstraints.forEach(function(param) { + components = components + + generateParamComponent(createParam.nodeType, + identify, param.locationConstraints.vimId, false); + }); + } + + // convert own param to UI + createParam.nsParameters.additionalParamForNs + .forEach(function(param) { + components = components + + generateParamComponent(createParam.nodeType, + identify, param, false); }); + // convert segments to UI + createParam.segments.forEach(function(segment) { + // each segment in a field set. + components = components + '<fieldset style="margin-left:25px;"><legend>' + + segment.nodeTemplateName + '</legend>'; + // the identify for segment + var segmentIdentify = '' == identify ? segment.nodeTemplateName + : identify + '_' + segment.nodeTemplateName; + // convert segment to UI + components = components + + convertCreateParamsToUI(segmentIdentify, segment); + components = components + '</fieldset>'; + }); + return components; +} + + +/** + * for each required parameter it could not be empty + * @param identify the identify of a segment + * @param createParam the create param object + * @returns the check result + */ +function checkInputs(identify, createParam) { + //check domain host + if (undefined != createParam.domainHost && 'enum' === createParam.domainHost.type) { + var value = collectParamValue(identify, createParam.domainHost); + if ('select' == value) { + var name = getParamLabel(createParam.nodeType, createParam.domainHost); + alert( name + ' is required.') + return false; + } + } + //check location constraints + if(undefined != createParam.nsParameters.locationConstraints){ + for(var i= 0; i < createParam.nsParameters.locationConstraints.length; i++){ + var param = createParam.nsParameters.locationConstraints[i].locationConstraints.vimId; + var value = collectParamValue(identify, param); + if('true' === param.required && ('' === value || ('enum' == param.type && 'select' == value))){ + // the param resource key is nodeType.paramName + var name = getParamLabel(createParam.nodeType, param); + alert(name + ' is required.') + return false; + } } } -});
\ No newline at end of file + + // check parameters + for(var i= 0; i < createParam.nsParameters.additionalParamForNs.length; i++){ + var param = createParam.nsParameters.additionalParamForNs[i]; + var value = collectParamValue(identify, param); + if('true' === param.required && ('' === value || ('enum' == param.type && 'select' == value))){ + // the param resource key is nodeType.paramName + var name = getParamLabel(createParam.nodeType, param); + alert(name + ' is required.') + return false; + } + } + // get segments param value from UI + var segmentcheckResult = true; + for(var i= 0; i < createParam.segments.length; i++){ + var segment = createParam.segments[i]; + // the identify for segment + var segmentIdentify = '' == identify ? segment.nodeTemplateName + : identify + '_' + segment.nodeTemplateName; + segmentcheckResult = checkInputs(segmentIdentify, segment); + if (!segmentcheckResult) { + break; + } + } + return segmentcheckResult; +} + + +/** + * convert the template params obj to html UI string + * + * @param identify the object identify, it should be different every time + * @return the html component string + */ +function collectCreateParamfromUI(parentHost,identify, createParam) { + // the create params used for create msg + var paramSentObj = { + domainHost:'', + nodeTemplateName:'', + nodeType:'', + segments:[], + nsParameters:{} + }; + // get the domain value + if (undefined != createParam.domainHost && 'enum' === createParam.domainHost.type) { + var domain = collectParamValue(identify, createParam.domainHost); + paramSentObj.domainHost = collectParamValue(identify, createParam.domainHost) + } + //if parent domainHost is not '' and local domain host is'', it should be setted as parent + if('' != parentHost && '' == paramSentObj.domainHost){ + paramSentObj.domainHost = parentHost; + } + paramSentObj.nodeTemplateName = createParam.nodeTemplateName; + paramSentObj.nodeType = createParam.nodeType; + + //get location constraints + if(undefined != createParam.nsParameters.locationConstraints){ + paramSentObj.nsParameters['locationConstraints'] = []; + createParam.nsParameters.locationConstraints.forEach(function(param) { + var locationConstraints = {}; + locationConstraints['vnfProfileId'] = param.vnfProfileId; + locationConstraints['locationConstraints'] = {}; + locationConstraints.locationConstraints['vimId'] = collectParamValue(identify, param.locationConstraints.vimId); + paramSentObj.nsParameters.locationConstraints.push(locationConstraints); + }); + } + + paramSentObj.nsParameters['additionalParamForNs'] = {}; + // get own param value from UI + createParam.nsParameters.additionalParamForNs.forEach(function(param) { + paramSentObj.nsParameters.additionalParamForNs[param.name] = collectParamValue(identify, param); + }); + // get segments param value from UI + createParam.segments.forEach(function(segment) { + // the identify for segment + var segmentIdentify = '' == identify ? segment.nodeTemplateName + : identify + '_' + segment.nodeTemplateName; + var segmentObj = collectCreateParamfromUI(paramSentObj.domainHost, segmentIdentify, segment); + paramSentObj.segments.push(segmentObj); + }); + return paramSentObj; +} + +/** + * get a param value + * @param identify the identify of a segment + * @param param the param object + * @returns the value of the param + */ +function collectParamValue(identify, param) { + var value = $('#' + getParamId(identify, param)).val(); + return value; +} + +/** + * get the param id in ui + * @param identify + * @param param + * @returns + */ +function getParamId(identify, param) { + return '' ===identify ? param.name : identify + '_' + param.name; +} + +/** + * get the resource string of a param. + * @param nodeType node type + * @param param param object + * @returns resource string + */ +function getParamLabel(nodeType, param) { + //var name = $.i18n.prop(nodeType + '.' + param.name); + var name = param.name; + if (name.length === 0 || name.slice(0, 1) === '[') { + name = param.name; + } + return name; +} +/** + * convert combox component + * + * @param inputPara + * @param items + * @param stringReadOnly + * @returns + */ +function generateParamComponent(nodeType, identify, param, strReadOnly) { + // the param resource key is nodeType.paramName + var name = getParamLabel(nodeType, param); + var id = getParamId(identify,param); + var component = ''; + if (param.type === 'string') { + component = '<div class="mT15 form-group" style="margin-left:0px;">' + + '<label class="col-sm-5 control-label">' + + '<span>' + name + '</span>' + generateRequiredLabel(param) + + '</label>' + + '<div class="col-sm-5"><input type="text" id="' + id + + '" name="parameter description" class="form-control" placeholder="' + + name + '" value="' + param.defaultValue; + if(strReadOnly){ + component = component + '" readonly="' + strReadOnly + '"/>'+ '</div></div>'; + }else{ + component = component + '"/>'+ '</div></div>'; + } + + } else if (param.type === 'enum') { + component = '<div class="form-group" style="margin-left:0px;margin-bottom:5px;">' + + '<label class="col-sm-5 control-label">' + + '<span>' + name + '</span>' + + '<span class="required">*</span>' + + '</label>' + + '<div class="col-sm-5">' + + '<select class="form-control" style ="padding-top: 0px;padding-bottom: 0px;"' + + ' id="' + id + '" name="' + param.name + '" value="' + param.defaultValue + + '">' + + this.transformToOptions(param.range) + + '</select></div></div>'; + } + return component; +} + +/** + * transfer the enum range to html body + * @param items the map of the range + * @returns the html string + */ +function transformToOptions(items) { + var options = '<option value="select">--select--</option>'; + var i; + for ( var key in items) { + var option = '<option value="' + key + '">' + items[key] + '</option>'; + options = options + option; + } + return options; +} + +/** + * generate required identify to html string + * @param parameter the parameter object + * @returns the html string + */ +function generateRequiredLabel(parameter) { + var requiredLabel = ''; + if (parameter.required === 'true') { + requiredLabel = '<span class="required">*</span>'; + } + return requiredLabel; +} + +/** + * create service + * @param sengMsgObj the parameters + * @returns + */ +function createServiceInstance(serviceBaseInfo, sengMsgObj) { + var defer = $.Deferred(); + var parameter = { + 'service' : { + 'name' : serviceBaseInfo.name, + 'description' : serviceBaseInfo.description, + 'serviceDefId' : '', //no need now, reserved + 'templateId' : serviceBaseInfo.templateId, + 'parameters' : sengMsgObj + } + }; + var serviceGatewayUri = '/openoapi/servicegateway/v1/services'; + $.when($.ajax({ + type : "POST", + url : serviceGatewayUri, + contentType : "application/json", + dataType : "json", + data : JSON.stringify(parameter), + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Create service failed.", xhr.responseText); + } + })) + .then(function(response) { + return queryProgress('create service', response.service.serviceId,response.service.operationId); + }).then(function(result){ + defer.resolve(result); + }); + return defer; +} + +/** + * sent delete instance msg + * @param serviceId the service id + * @returns + */ +function deleteServiceInstance(serviceId) { + var defer = $.Deferred(); + var deleteUrl = '/openoapi/servicegateway/v1/services/' + serviceId; + var parameter = {}; + $.when($.ajax({ + type : "DELETE", + url : deleteUrl, + contentType : "application/json", + dataType : "json", + data : JSON.stringify(parameter), + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Delete service failed.", xhr.responseText); + } + })) + .then(function(response) { + return queryProgress('delete service', serviceId,response.operationId); + }).then(function(result){ + defer.resolve(result); + }); + return defer; +} + +/** + * query progress of the operation + * @param operation the operation string + * @param serviceId the service id + * @param operationId the operation id + * @returns + */ +function queryProgress(operation, serviceId, operationId) { + //show the progress dialog + $( "#idProgressTitle" ).text(operation); + $( "#progressContent" ).text('status:'); + $( "#progressbar" ).attr("style","width: 0%"); + $( "#progressDialog" ).modal({backdrop:'static', keyboard:false}); + //set a timer for query operation + var defer = $.Deferred(); + var queryProgressUril = '/openoapi/servicegateway/v1/services/' + serviceId + '/operations/' + operationId; + var timerDefer = $.Deferred(); + var timeout = 3600000; + var fun = function() { + if (timeout === 0) { + timerDefer.resolve({ + status : 'error', + reason : operation + ' timeout!', + }); + return; + } + timeout = timeout - 1000; + $.when($.ajax({ + type : "GET", + url : queryProgressUril, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Query progress failed.", xhr.responseText); + } + })) + .then(function(response) { + //update progress + $( "#progressbar" ).attr("style","width: " + response.operation.progress.toString() + "%"); + $( "#progressValue" ).text(response.operation.progress.toString() + '%'); + $( "#progressContent" ).text('status: ' + response.operation.operationContent); + if (response.operation.result == 'finished' || response.operation.result == 'error') { + timerDefer.resolve({ + status : response.operation.result , + reason : response.operation.reason + }); + } + }); + }; + var timerId = setInterval(fun, 1000); + $.when(timerDefer) + .then(function(responseDesc) { + clearInterval(timerId); + $('#progressDialog').modal('hide'); + defer.resolve({ + status : responseDesc.status, + reason : responseDesc.reason, + serviceId:serviceId + }); + + }); + return defer; +} + + +/** + * convert the input parameters to ui + * @param identify the identify of a segment + * @param createParam the create param object + * @returns the check result + */ +function convertInputsToUI(parentHost, identify, serviceParam) { + var components = ''; + // convert host to UI + if (undefined != serviceParam.domainHost && '' != serviceParam.domainHost && parentHost != serviceParam.domainHost) { + var param ={ + name:'domainHost', + type:'string', + defaultValue:getShowVal('domainHost', serviceParam.domainHost), + required:false + } + components = components + generateParamComponent(serviceParam.nodeType, identify, + param, true); + } + //convert location constraints to UI + if(undefined != serviceParam.nsParameters.locationConstraints){ + serviceParam.nsParameters.locationConstraints.forEach(function(param) { + var showValue = getShowVal('location', param.locationConstraints.vimId) + var param ={ + name: param.vnfProfileId + '_Location', + type:'string', + defaultValue:showValue, + required:false + } + components = components + generateParamComponent(serviceParam.nodeType, + identify, param, true); + }); + } + + // convert own param to UI + for(var key in serviceParam.nsParameters.additionalParamForNs ){ + var param ={ + name: key, + type:'string', + defaultValue:getShowVal(key, serviceParam.nsParameters.additionalParamForNs[key]), + required:false + } + components = components + generateParamComponent(serviceParam.nodeType, + identify, param, true); + } + // convert segments to UI + serviceParam.segments.forEach(function(segment) { + // each segment in a field set. + components = components + '<div class="mT15 form-group"><fieldset style="margin-left:25px;"><legend>' + + segment.nodeTemplateName + '</legend>'; + // the identify for segment + var segmentIdentify = '' == identify ? segment.nodeTemplateName + : identify + '_' + segment.nodeTemplateName; + // convert segment to UI + components = components + + convertInputsToUI(serviceParam.domainHost, segmentIdentify, segment); + components = components + '</fieldset></div>'; + }); + return components; +} + +function getShowVal(paramName, paramValue){ + if(paramName == 'domainHost'){ + return getHostNameByVal(paramValue); + } + else if(paramName == 'location'){ + return getVimNameById(paramValue); + } + else if(paramName == 'sdncontroller'){ + return getSdnControllerNameById(paramValue); + } + else{ + return paramValue; + } +} + +function getHostNameByVal(hostDomain){ + var requestUrl ="/openoapi/servicegateway/v1/domains"; + var returnObj = ''; + $.ajax({ + type : "GET", + async: false, + url : requestUrl, + contentType : "application/json", + success : function(jsonobj) { + jsonobj.forEach(function(host){ + if(host.host == hostDomain){ + returnObj = host.name; + } + }); + }, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Query host failed.", xhr.responseText); + } + }); + return returnObj; +} + +//get the vim name by id. +function getVimNameById(vimId){ + var requestUrl ="/openoapi/extsys/v1/vims/" + vimId; + var returnObj; + $ + .ajax({ + type : "GET", + async: false, + url : requestUrl, + contentType : "application/json", + success : function(jsonobj) { + // TODO return according to the json data received. + returnObj = jsonobj.name; + }, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Query vims failed.", xhr.responseText); + } + }); + return returnObj; +} + +//get the sdn controller name by id. +function getSdnControllerNameById(sdnControllerId){ + var requestUrl ="/openoapi/extsys/v1/sdncontrollers/" + sdnControllerId; + var returnObj; + $ + .ajax({ + type : "GET", + async: false, + url : requestUrl, + contentType : "application/json", + success : function(jsonobj) { + // TODO return according to the json data received. + returnObj = jsonobj.name; + }, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Query sdn controllers failed.", xhr.responseText); + } + }); + return returnObj; +} + + + +/** + * show error dialog + * @param title the title + * @param result the result + * @returns + */ +function showErrorMessage(title, result) { + //show the error dialog + $( "#errorDialogTitle" ).text(title); + if(undefined != result.reason){ + $( "#errorDialogReason" ).text(result.reason); + } + else{ + $( "#errorDialogReason" ).text(result); + } + $( "#errorDialog" ).modal({backdrop:'static', keyboard:false}); +} + +/** + * generate the template to create parameters object + * + * @param templateId the template id + * @returns + */ +function queryService(serviceId) { + var uri = '/openoapi/servicegateway/v1/services/' + serviceId; + return $.ajax({ + type : "GET", + url : uri, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Query service failed.", xhr.responseText); + } + }); +} + +function queryServiceData(){ + var returnVal = []; + var requestUrl = "/openoapi/servicegateway/v1/services"; + $ + .ajax({ + type : "GET", + url : requestUrl, + async: false, + contentType : "application/json", + success : function(jsonobj) { + // TODO return according to the json data received. + returnVal = jsonobj; + }, + error : function(xhr, ajaxOptions, thrownError) { + showErrorMessage("Query services fail",xhr.responseText); + } + }); + return returnVal; +}
\ No newline at end of file diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js index 7293f0de..8a4d1e38 100644 --- a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js +++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js @@ -100,8 +100,8 @@ var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', ' DataService.loadGetServiceData()
.then(function (data) {
if (data) {
- $scope.tableData = data.lcData;
- var tableData = data.lcData;
+ $scope.tableData = data.data;
+ var tableData = data.data;
loadTableData();
}
else {
@@ -191,11 +191,11 @@ var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', ' var number = $(modelTemplate).filter('#numeric').html();
var dropDown = $(modelTemplate).filter('#simpleDropdownTmpl').html();
- var dataText = {"ErrMsg" : {"textboxErr" : "Service name is required.", "modalVar":"lifecycleData.name", "placeholder":"Service Name"}};
+ var dataText = {"ErrMsg" : {"textboxErr" : "Service name is required.", "modalVar":"lifecycleData.serviceName", "placeholder":"Service Name"}};
$('#myModal .serviceName').html($compile(Mustache.to_html(text, dataText.ErrMsg))($scope));
- var TempNameText = {"ErrMsg" : {"textboxErr" : "Template name is required.", "modalVar":"lifecycleData.template", "placeholder":"Template Name"}};
- $('#myModal .templateName').html($compile(Mustache.to_html(text, TempNameText.ErrMsg))($scope));
+ var serviceDescriptionText = {"ErrMsg" : {"textboxErr" : "Description is required.", "modalVar":"lifecycleData.description", "placeholder":"Descritpion"}};
+ $('#myModal .serviceDescription').html($compile(Mustache.to_html(text, serviceDescriptionText.ErrMsg))($scope));
//var creatorText = {"ErrMsg" : {"textboxErr" : "Creator is required.", "modalVar":"lifecycleData.creator", "placeholder":"Creator"}};
/*$scope.data = {
@@ -275,15 +275,18 @@ var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', ' }
$scope.templateParam = function() {
- //$scope.lifecycleData.optSelect = 1.2;
- //$log.info($scope.lifecycleData);
-
- DataService.fetchCreateParameters($scope.lifecycleData.optSelect)
+
+ var template = $scope.lifecycleData.optSelect;
+ var lastSelTempCreateParam = DataService.getCreateParamJsonObj();
+ //if the template not changed, no need to update the page.
+ if(lastSelTempCreateParam.templateId == template.serviceTemplateId){
+ return;
+ }
+ $.when(DataService.generateCreateParameters(template))
.then(function (tmplatesParamResponse) {
console.log("Data Param Template :: ");
$log.info(tmplatesParamResponse);
- $scope.paramJsonObj= tmplatesParamResponse.templateName;
-
+ document.getElementById("templateParameters").innerHTML = tmplatesParamResponse;
}, function (reason) {
$scope.error = "Error ! " + reason;
});
@@ -329,61 +332,58 @@ var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', ' }
$scope.saveData = function() {
- //TODO
- var sengMsgObj = {};//collectCreateParamfromUI('', 'create', $scope.templateParameters.paramJsonObj);
- //createServiceInstance(sengMsgObj)
- DataService.createServiceInstance(lifecycleData, sengMsgObj)
+ //collect service base info
+ var serviceBaseInfo = {
+ 'name' : $scope.lifecycleData.serviceName,
+ 'description' : $scope.lifecycleData.description,
+ 'templateId' : $scope.lifecycleData.optSelect.serviceTemplateId,
+ };
+ //send message
+ $.when(DataService.createService(serviceBaseInfo))
.then(function (response) {
$log.info(response);
- //TODO
- }, function (reason) {
- $scope.error = "Error ! " + reason;
+ if(response.sataus === 'checkfailed'){
+ return;
+ }else if (response.status === 'finished') {
+ $.when(queryService(response.serviceId)).then(function(serviceInstance){
+ $scope.tableData.push(serviceInstance);
+ $scope.$apply();
+ $scope.tableParams.reload();
+ $('#myModal').modal('hide');
+ });
+ } else{
+ showErrorMessage('Create service failed',response);
+ }
});
}
-
- /**
- * convert the template params obj to html UI string
- *
- * @param identify the object identify, it should be different every time
- * @return the html component string
- */
- function collectCreateParamfromUI(parentHost,identify, createParam) {
- // the create params used for create msg
- var paramSentObj = {
- domainHost:'',
- nodeTemplateName:'',
- nodeType:'',
- segments:[],
- additionalParamForNs:{}
+ $scope.deleteIndividualData = function(id){
+ var deleteHandle = function(result) {
+ if (result) {
+ var remove = function() {
+ var pos = 0;
+ for(var i= 0; i < $scope.tableData.length; i++){
+ if($scope.tableData[i].serviceId === id){
+ pos = i;
+ break;
+ }
+ }
+ $scope.tableData.splice(pos, 1);
+ $scope.$apply();
+ $scope.tableParams.reload();
+ };
+ $.when(DataService.deleteService(id))
+ .then(function(response) {
+ if (response.status === 'finished') {
+ remove();
+ } else {
+ showErrorMessage('Delete service failed',response);
+ }
+ });
+ }
};
- // get the domain value
- if (undefined != createParam.domainHost && 'enum' === createParam.domainHost.type) {
- var domain = collectParamValue(identify, createParam.domainHost);
- paramSentObj.domainHost = collectParamValue(identify, createParam.domainHost)
- }
- //if parent domainHost is not '' and local domain host is'', it should be setted as parent
- if('' != parentHost && '' == paramSentObj.domainHost){
- paramSentObj.domainHost = parentHost;
- }
- paramSentObj.nodeTemplateName = createParam.nodeTemplateName;
- paramSentObj.nodeType = createParam.nodeType;
-
- // get own param value from UI
- createParam.additionalParamForNs.forEach(function(param) {
- paramSentObj.additionalParamForNs[param.name] = collectParamValue(identify, param);
- });
- // get segments param value from UI
- createParam.segments.forEach(function(segment) {
- // the identify for segment
- var segmentIdentify = '' == identify ? segment.nodeTemplateName
- : identify + '_' + segment.nodeTemplateName;
- var segmentObj = collectCreateParamfromUI(paramSentObj.domainHost, segmentIdentify, segment);
- paramSentObj.segments.push(segmentObj);
- });
- return paramSentObj;
+ bootbox.confirm("Do you confirm to delete service?", deleteHandle);
}
-
})
.controller('lcTabsCtrl', function($scope, $state, $stateParams) {
diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/home.html b/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/home.html index 64965614..f901ab6f 100644 --- a/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/home.html +++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/home.html @@ -7,25 +7,25 @@ <br> <div class="panel panel-default"> <table ng-table="tableParams" class="table table table-striped table-hover table-bordered lctable" show-filter="true"> - <tr ng-repeat="lcData in $data" ui-sref=".lcTabs({id: lcData.id})" ui-sref-active="selected-row" ui-sref-opts="{reload: true}"><!--target="_self" ng-click="setClickedRow($index, lcData.id)" --> + <tr ng-repeat="lcData in $data" ui-sref=".lcTabs({id: lcData.serviceId})" ui-sref-active="selected-row" ui-sref-opts="{reload: true}"><!--target="_self" ng-click="setClickedRow($index, lcData.id)" --> <td header="'ng-table/headers/checkbox.html'"> - <input type="checkbox" ng-model="checkboxes.items[lcData.id]" /> + <input type="checkbox" ng-model="checkboxes.items[lcData.serviceId]" /> </td> <td title="'Service Name'" filter="{ name: 'text'}" sortable="'name'"> <!--<a data-toggle="modal" class="srvname" ng-click="callModal(lcData.id)">{{lcData.name}}</a>--> - <a data-toggle="modal" ng-click="test(lcData.id)" href="#popupModal" class="srvname">{{lcData.name}}</a> + <a data-toggle="modal" ng-click="test(lcData.id)" href="#popupModal" class="srvname">{{lcData.serviceName}}</a> <!--<a data-toggle="modal" ng-href="#popupModal" class="srvname">{{lcData.name}}</a>--><!-- ui-sref=".modal1"--> </td> <td title="'Template Name'" filter="{ template: 'text'}" sortable="'template'"> - {{lcData.template}}</td> + {{lcData.templateName}}</td> <td title="'Create time'" filter="{ createtime: 'text'}" sortable="'createtime'"> - {{lcData.createtime}}</td> + {{lcData.createTime}}</td> <td title="'Creator'" filter="{ creator: 'text'}" sortable="'creator'"> {{lcData.creator}}</td> <td title="'Action'"> <!--<img src="../images/delete.png" ng-click="editData(lcData.id)" style="cursor: pointer"></img>--> - <span class="pull-right glyphicon glyphicon-edit" ng-click="editData(lcData.id)" style="cursor: pointer;margin: 0 5px"></span> - <span class="pull-right glyphicon glyphicon-trash" ng-click="deleteIndividualData(lcData.id)" style="cursor: pointer;margin: 0 5px"></span> + <span class="pull-right glyphicon glyphicon-edit" ng-click="editData(lcData.serviceId)" style="cursor: pointer;margin: 0 5px"></span> + <span class="pull-right glyphicon glyphicon-trash" ng-click="deleteIndividualData(lcData.serviceId)" style="cursor: pointer;margin: 0 5px"></span> </td> </tr> </table> @@ -66,8 +66,8 @@ </div> </div> <div class="form-group row"> - <label class="col-xs-4 col-form-label labelstyle">Template Name</label> - <div class="col-xs-8 templateName" > + <label class="col-xs-4 col-form-label labelstyle">Service Description</label> + <div class="col-xs-8 serviceDescription" > <!--<input class="form-control" ng-model="province.ip" type="ipv4" pattern="((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$" value="" placeholder="IP Address" id="ipaddress" required><br>--> </div> </div> @@ -83,10 +83,6 @@ </div> </div> <div id="templateParameters" class="tab-pane fade"> - <div class="form-group row"> - <label class="col-xs-4 col-form-label labelstyle">Template version</label> - <div class="col-xs-8" > {{paramJsonObj}}</div> - </div> </div> </div> @@ -94,4 +90,37 @@ </div> </div> </div> -</div>
\ No newline at end of file +</div> +<div class="modal fade" id="progressDialog" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false"> + <div class="modal-dialog"> + <div class="modal-content"> + <div class="modal-header" style="margin-left:10px;margin-bottom:5px;"> + <h4 class="modal-title" id="idProgressTitle" style="text-align:center;"></h4> + </div> + <div class="modal-body" style="margin-left:10px;margin-bottom:5px;margin-right:10px;"> + <div class="progress"> + <div id="progressbar" class="progress-bar" role="progressbar" style="width: 10%;"> + <span id ="progressValue">0%</span> + </div> + </div> + <div id="progressContent"></div> + </div> + </div> + </div> +</div> +<div class="modal fade" id="errorDialog" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> + <div class="modal-dialog"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal" + aria-hidden="true">กม + </button> + <h4 class="modal-title" id="errorDialogTitle" style="text-align:center;"></h4> + </div> + <div class="modal-body" id = "errorDialogReason" style="margin-left:20px;margin-bottom:5px;margin-right:10px;"></div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">close</button> + </div> + </div> + </div> +</div> |