package_config meta data ui

Change-Id: I775c30525bda2dc3ac40800834ce4fd87b490f68
This commit is contained in:
sharonlucong 2015-04-15 16:53:08 -07:00
parent b36a14484c
commit 52c70e37ec
6 changed files with 431 additions and 94 deletions

View File

@ -210,6 +210,11 @@ define(['./baseController'], ()->
$scope.commit = (sendRequest) ->
wizardService.targetSystemConfigCommit($scope, sendRequest)
$scope.addValue = (key1,key2) ->
if !$scope.package_config[key1][key2]
$scope.package_config[key1][key2] = []
$scope.package_config[key1][key2].push ""
]
.controller 'roleAssignCtrl', ['$scope', 'wizardService', '$filter', 'ngTableParams',
($scope, wizardService, $filter, ngTableParams) ->

View File

@ -19,7 +19,7 @@ define(['./baseFactory'], () ->
@network_mapping = {}
@ceph_config = {}
@os_gloable_config = {}
@package_config = {}
clean: ->
@cluster = {}
@steps = []
@ -37,7 +37,7 @@ define(['./baseFactory'], () ->
@console_credentials = {}
@network_mapping = {}
@ceph_config = {}
@package_config = {}
preConfig: (config) ->
@setInterfaces(config.interface)
@ -48,6 +48,7 @@ define(['./baseFactory'], () ->
@setConsoleCredentials(config.console_credentials)
@setNetworkMapping(config.network_mapping)
@setCephConfig(config.ceph_config) if config.ceph_config
@setPackageConfig(config.package_config) if config.package_config
setClusterInfo: (cluster) ->
@cluster = cluster
@ -131,10 +132,12 @@ define(['./baseFactory'], () ->
return @commit
setServers: (servers) ->
return @servers = servers
setPackageConfig: (packageConfig) ->
@package_config = packageConfig
getPackageConfig: ->
return @package_config
angular.module('compass.factories').factory('wizardFactory',[ () -> new WizardFactory()])
)

View File

@ -1,39 +1,119 @@
<div ng-controller="packageConfigCtrl">
<div class="row">
<div class="col-xs-12">
<form id="packageConfigForm" name="packageConfigForm" class="form-horizontal" role="form">
<div class="accordion-style1 panel-group accordion-style2" id="accordion">
<accordion close-others="true">
<accordion-group ng-repeat="(key,value) in metaData">
<accordion-heading>
<i class="ace-icon fa fa-angle-right" ng-class="{'fa-angle-down': cephAccordion.open, 'fa-angle-right': !cephAccordion.open}"></i> {{value.accordion_heading}}
</accordion-heading>
<!-- data-structure:table -->
<div ng-if="value.data_structure=='table'">
<table class="table table-hover nowrap">
<thead>
<tr>
<th ng-repeat="header in value.table_display_header">{{header}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(service, credential) in value.dataSource">
<td><span>{{service}}</span>
</td>
<td ng-repeat="val in value.modifiable_data">
<span ng-hide="editServiceMode[$parent.$index]">{{credential[val]}}</span>
<input ng-show="editServiceMode[$parent.$index]" ng-model="credential[val]" placeholder="prop" type="text" ng-required />
<input ng-show="editServiceMode[$parent.$index] && val=='password'" ng-model="credential[val]" placeholder="Confirm Password" type="password" ng-required />
</td>
<td ng-if="value.action=='true'">
<!--edit button-->
<button ng-hide="editServiceMode[$index]" ng-click="editServiceMode[$index] = true; sEdit($index)" class="btn btn-xs btn-success border-radius-4">
<i class="ace-icon fa fa-pencil bigger-120"></i>
</button>
<!--save button -->
<button ng-show="editServiceMode[$index]" ng-click="editServiceMode[$index] = false; sSave()" class="btn btn-xs btn-primary border-radius-4">
<i class="ace-icon fa fa-check bigger-120"></i>
</button>
<!--cancel button -->
<button ng-show="editServiceMode[$index]" ng-click="editServiceMode[$index] = false; sReset()" class="btn btn-xs btn-danger border-radius-4">
<i class="ace-icon fa fa-times bigger-120"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
<!-- data-structure:form -->
<div ng-if="value.data_structure=='form'">
<div class="row">
<div class="col-xs-12">
<!-- <form id="packageConfigForm" name="packageConfigForm" class="form-horizontal" role="form"> -->
<div class="form-group" ng-repeat="val in value.data">
<div>
<div class="col-sm-8">
<!-- input-type is text or multiple-->
<div ng-if="val.display_type=='text'">
<label class="col-sm-4 control-label no-padding-right">
{{val.label}}
<span ng-if="val.is_required=='true'" class="text-danger">*</span>
</label>
<input ng-model="package_config[value.category][val.name]" type="text" class="col-xs-10 col-sm-5" placeholder="{{val.label}}" name="{{val.name}}" ng-required="val.is_required=='true'">
</div>
<!-- input-type is drop-down -->
<div ng-if="val.input_type=='dropdown'">
<label class="col-sm-4 control-label no-padding-right">
{{val.label}}
<span ng-if="val.is_required=='true'" class="text-danger">*</span>
</label>
<select ng-model="package_config[value.category][val.name]" name="{{val.name}}" class="col-xs-10 col-sm-5" ng-change="change(value.category,val.name,package_config[value.category][val.name])">
<!-- ng-change="change(value.category,val.name,package_config[value.category][val.name])" -->
<option ng-repeat="opt in val.options">{{opt}}</option>
</select>
</div>
<!-- input-type is dropdown-text-multiple -->
<div ng-if="val.input_type=='dropdown'" ng-repeat="(type,detail) in val.content_data[package_config[value.category][val.name]]">
<!-- input-type is dropdown_text_multiple -->
<div ng-if="detail.display_type=='dropdown_text_multiple'">
<div ng-repeat="x in package_config[value.category][detail.name] track by $index">
<label class="col-sm-4 control-label no-padding-right">
{{detail.label}}
<span ng-if="val.is_required=='true'" class="text-danger">*</span>
</label>
<input ng-model="package_config[value.category][detail.name][$index]" type="text" placeholder="{{val.label}}" name="{{val.name}}" class="col-xs-10 col-sm-5" ng-required="val.is_required=='true'">
<span class="col-xs-2 col-sm-3">
<!--Add Action-->
<span class="action" ng-click="addValue(value.category,detail.name)">
<i class="fa fa-plus-circle bigger-140 blue"></i>
</span>
<!--Remove Action-->
<!--span ng-show="package_config[value.category][detail.name].length > 1" class="action" ng-click="general.dns_servers.splice($index,1)">-->
<span ng-show="package_config[value.category][detail.name].length > 1" class="action" ng-click="package_config[value.category][detail.name].splice($index,1)">
<i class="fa fa-minus-circle bigger-140 blue"></i>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- </form> -->
</div>
</div>
</div>
</accordion-group>
</accordion>
</div>
</form>
</div>
</div>
</div>
<!-- <div ng-controller="packageConfigCtrl">
<div class="row">
<div class="col-xs-12">
<div class="accordion-style1 panel-group accordion-style2" id="accordion">
<accordion close-others="true">
<!--accordion-group is-open="serverAccordion.open" ng-init="serverAccordion.open=true">
<accordion-heading>
<i class="ace-icon fa fa-angle-right" ng-class="{'fa-angle-down': status1.open, 'fa-angle-right': !status1.open}"></i> Server Credentials
</accordion-heading>
<div class="row">
<div class="col-xs-12">
<form class="form-horizontal" role="form">
<div class="form-group">
<label class="col-sm-4 control-label no-padding-right">Username</label>
<div class="col-sm-8">
<input type="text" class="col-xs-10 col-sm-5" placeholder="Username" id="server-username" ng-model="server_credentials.username">
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label no-padding-right">Password</label>
<div class="col-sm-8">
<input type="password" class="col-xs-10 col-sm-5" placeholder="Password" id="server-password" ng-model="server_credentials.password">
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label no-padding-right">Confirm Password</label>
<div class="col-sm-8">
<input type="password" class="col-xs-10 col-sm-5" placeholder="Confirm Password">
</div>
</div>
</form>
</div>
</div>
</accordion-group-->
<accordion-group is-open="serviceAccordion.open" ng-if="currentAdapterName != 'ceph_firefly'">
<accordion-heading>
@ -68,17 +148,17 @@
<input ng-show="editServiceMode[$index]" ng-model="credential.password" placeholder="Password" type="password" ng-required />
<input ng-show="editServiceMode[$index]" ng-model="credential.confirmPassword" placeholder="Confirm Password" type="password" ng-required />
</td>
<td>
<!--edit button-->
<button ng-hide="editServiceMode[$index]" ng-click="editServiceMode[$index] = true; sEdit($index)" class="btn btn-xs btn-success border-radius-4">
<td> -->
<!--edit button-->
<!-- <button ng-hide="editServiceMode[$index]" ng-click="editServiceMode[$index] = true; sEdit($index)" class="btn btn-xs btn-success border-radius-4">
<i class="ace-icon fa fa-pencil bigger-120"></i>
</button>
<!--save button -->
<button ng-show="editServiceMode[$index]" ng-click="editServiceMode[$index] = false; sSave()" class="btn btn-xs btn-primary border-radius-4">
</button> -->
<!--save button -->
<!-- <button ng-show="editServiceMode[$index]" ng-click="editServiceMode[$index] = false; sSave()" class="btn btn-xs btn-primary border-radius-4">
<i class="ace-icon fa fa-check bigger-120"></i>
</button>
<!--cancel button -->
<button ng-show="editServiceMode[$index]" ng-click="editServiceMode[$index] = false; sReset()" class="btn btn-xs btn-danger border-radius-4">
</button> -->
<!--cancel button -->
<!-- <button ng-show="editServiceMode[$index]" ng-click="editServiceMode[$index] = false; sReset()" class="btn btn-xs btn-danger border-radius-4">
<i class="ace-icon fa fa-times bigger-120"></i>
</button>
</td>
@ -127,17 +207,17 @@
<input ng-show="editMgntMode[$index]" ng-model="credential.password" placeholder="Password" type="password" ng-required />
<input ng-show="editMgntMode[$index]" ng-model="credential.confirmPassword" placeholder="Confirm Password" type="password" ng-required />
</td>
<td>
<!--edit button-->
<button ng-hide="editMgntMode[$index]" ng-click="mEdit($index)" class="btn btn-xs btn-success border-radius-4">
<td> -->
<!--edit button-->
<!-- <button ng-hide="editMgntMode[$index]" ng-click="mEdit($index)" class="btn btn-xs btn-success border-radius-4">
<i class="ace-icon fa fa-pencil bigger-120"></i>
</button>
<!--save button-->
<button ng-show="editMgntMode[$index]" ng-click="editMgntMode[$index] = false; mSave()" class="btn btn-xs btn-primary border-radius-4">
</button> -->
<!--save button-->
<!-- <button ng-show="editMgntMode[$index]" ng-click="editMgntMode[$index] = false; mSave()" class="btn btn-xs btn-primary border-radius-4">
<i class="ace-icon fa fa-check bigger-120"></i>
</button>
<!--cancel button-->
<button ng-show="editMgntMode[$index]" ng-click="editMgntMode[$index] = false; mReset()" class="btn btn-xs btn-default btn-danger border-radius-4">
</button> -->
<!--cancel button-->
<!-- <button ng-show="editMgntMode[$index]" ng-click="editMgntMode[$index] = false; mReset()" class="btn btn-xs btn-default btn-danger border-radius-4">
<i class="ace-icon fa fa-times bigger-120"></i>
</button>
</td>
@ -213,29 +293,7 @@
</div>
</div>
</div>
<!--div class="form-group">
<div>
<label class="col-sm-4 control-label no-padding-right">
OSD Devices
<span class="text-danger opacity-zero">*</span>
</label>
<div class="col-sm-8">
<input ng-model="cephConfig.osd_devices" type="text" class="col-xs-5 col-sm-2" placeholder="Device" name="device">
<input ng-model="cephConfig.journals" type="text" class="col-xs-5 col-sm-3" placeholder="Journal" name="journal">
<span class="col-xs-2 col-sm-3"-->
<!--Add Action-->
<!--span class="action" ng-click="addValue('dns_servers')">
<i class="fa fa-plus-circle bigger-140 blue"></i>
</span-->
<!--Remove Action-->
<!--span ng-show="general.dns_servers.length > 1" class="action" ng-click="general.dns_servers.splice($index,1)">
<i class="fa fa-minus-circle bigger-140 blue"></i>
</span-->
<!--/span>
</div>
</div>
</div-->
</form>
</div>
</div>
@ -247,4 +305,4 @@
</div>
</div>
</div>
</div> -->

View File

@ -972,6 +972,7 @@ define(['angular', 'angularMocks'], function() {
"create_at": "2014-3-25 12:00:00",
"updated_at": "2014-3-26 13:00:00",
"flavor": {
"id": 1,
"roles": [{
"display_name": "Compute",
"name": "os-compute-worker"
@ -1003,6 +1004,171 @@ define(['angular', 'angularMocks'], function() {
return [200, cluster, {}];
});
$httpBackend.whenGET(/\.*\/flavors\/([0-9]|[1-9][0-9])\/ui_metadata$/).respond(function(method,url,data){
console.log(method, url);
var uiData = {
"flavor_config":[{
"category": "service_credentials",
"modifiable_data": ["username","password"],
"table_display_header": ["Service","UserName","Password","Action"],
"accordion_heading": "OpenStack Database and Queue Credentials",
"action": 'true',
"data_structure": "table",
"config": {
"rabbitmq": {
"username": "guest",
"password": "guest"
},
"compute": {
"username": "nova",
"password": "nova"
},
"dashboard": {
"username": "dashboard",
"password": "dashboard"
},
"identity": {
"username": "keystone",
"password": "keystone"
},
"image": {
"username": "glance",
"password": "glance"
},
"metering": {
"username": "ceilometer",
"password": "ceilometer"
},
"mysql": {
"username": "root",
"password": "root"
},
"volume": {
"username": "cinder",
"password": "cinder"
}
}
},{
"category": "console_credentials",
"modifiable_data": ["username","password"],
"table_display_header": ["Service","UserName","Password","Action"],
"accordion_heading": "OpenStack Keystone User Credentials",
"action": 'true',
"data_structure": "table",
"config":{
"admin": {
"username": "admin",
"password": "admin"
},
"compute": {
"username": "nova",
"password": "nova"
},
"dashboard": {
"username": "dashboard",
"password": "dashboard"
},
"image": {
"username": "glance",
"password": "glance"
},
"metering": {
"username": "ceilometer",
"password": "ceilometer"
},
"network": {
"username": "quantum",
"password": "quantum"
},
"object-store": {
"username": "swift",
"password": "swift"
},
"volume": {
"username": "cinder",
"password": "cinder"
}
}
},{
"accordion_heading": "Ceph Global Configurations",
"category": "ceph_config",
"form_name": "cephForm",
"data_structure": "form",
"data":[{
"label": "OP Threads",
"is_required": 'false',
"name": "op_threads",
"default_value": "1",
"display_type": "text"
},{
"label": "Journal Size",
"is_required": 'false',
"default_value": "1",
"name": "journal_size",
"display_type": "text"
},{
"label": "OSD Pool Size",
"is_required": 'true',
"default_value": "1",
"name": "osd_pool_size",
"display_type": "text"
},{
"label": "OSD Pool PG Number",
"is_required": 'true',
"default_value": "1",
"name": "osd_pool_pgp_num",
"display_type": "text"
}]
},{
"accordion_heading": "Neutron Configurations",
"category": "neutron_config",
"form_name": "neutronForm",
"data_structure": "form",
"data":[{
"name": "tenant_network_type",
"input_type": "dropdown",
"label": "Tenant Network Type",
"content_data":{
"gre":[{
"is_required": 'true',
"display_type": "dropdown_text_multiple",
"name": "tunnel_id_ranges",
"label": "Tunnel ID Ranges",
"hint": "e.g. 1:1000"
}],
"vlan":[{
"is_required": 'true',
"display_type": "dropdown_text_multiple",
"name": "vlan_ranges",
"label": "Network Vlan Ranges",
"hint": "e.g. physnet1:2700:2999"
},{
"is_required": 'true',
"display_type": "dropdown_text_multiple",
"name": "bridge",
"label": "Bridge Mapping",
"hint": "e.g. physnet1:br-eth1"
}]
},
"is_required": 'true',
"options":['gre', 'vlan']
}]
},{
"accordion_heading": "High Availability Configurations",
"category": "ha_proxy",
"form_name": "haForm",
"data_structure": "form",
"data":[{
"label": "VIP",
"is_required": 'true',
"name": "vip",
"display_type": "text"
}]
}]
};
return [200, uiData, {}];
});
$httpBackend.whenGET(/\.*\/clusters\/([0-9]|[1-9][0-9])*\/config/).respond(function(method, url, data) {
console.log(method, url, data);
var config = {

View File

@ -118,6 +118,7 @@ define(['./baseService'], () ->
getOsGlobalConfigMetaData: (id) ->
return @$http.get(@settings.apiUrlBase + '/oses/'+ id + '/ui_metadata')
getPackageConfigUiElements: (id) ->
return @$http.get(@settings.apiUrlBase + '/flavors/' + id + '/ui_metadata')
angular.module('compass.services').service('dataService', ['$http', 'settings', ($http,settings) -> new DS($http,settings)])
)

View File

@ -52,6 +52,7 @@ define(['./baseService'], ()->
wizardFactory.setConsoleCredentials(oldConfig.package_config.security.console_credentials) if oldConfig.package_config.security.console_credentials
wizardFactory.setNetworkMapping(oldConfig.package_config.network_mapping) if oldConfig.package_config.network_mapping
wizardFactory.setCephConfig(oldConfig.package_config.ceph_config) if oldConfig.package_config.ceph_config
wizardFactory.setPackageConfig(oldConfig.package_config)
getClusterInfo: ->
@ -256,6 +257,48 @@ define(['./baseService'], ()->
$scope.service_credentials = @wizardFactory.getServiceCredentials()
$scope.console_credentials = @wizardFactory.getConsoleCredentials()
$scope.package_config = @wizardFactory.getPackageConfig();
@dataService.getPackageConfigUiElements($scope.cluster.flavor.id).success (data) ->
$scope.metaData = data.flavor_config
for key,value of $scope.metaData
if value.category isnt "service_credentials" and value.category isnt "console_credentials"
if !$scope.package_config[value.category]
$scope.package_config[value.category] = {};
if value.data_structure is "form"
for serialNum, content of value.data
if !$scope.package_config[value.category][content.name]
if !content.default_value
$scope.package_config[value.category][content.name] = "";
else
$scope.package_config[value.category][content.name] = content.default_value;
for content_data_key, content_data_value of content.content_data
for details_content_data_key, details_content_data_value of content_data_value
if !$scope.package_config[value.category][details_content_data_value.name]
$scope.package_config[value.category][details_content_data_value.name] = [""]
if value.category is "service_credentials" or value.category is "console_credentials"
if !$scope.package_config["security"]
$scope.package_config["security"] = {}
$scope.package_config["security"][value.category] = value.config
$scope.metaData[key].dataSource = $scope.package_config["security"][value.category]
else
$scope.metaData[key].dataSource = $scope.package_config[value.category]
$scope.change = (category,name,value) ->
for i of $scope.package_config[category]
if i!=name
delete $scope.package_config[category][i]
for metaKey, metaValue of $scope.metaData
if metaValue.category is category
for serialNum, content of metaValue.data
for content_data_key, content_data_value of content.content_data
if content_data_key is value
for i in content_data_value
if !$scope.package_config[category][i.name]
$scope.package_config[category][i.name] = [""]
keyLength_service_credentials = Object.keys($scope.service_credentials).length;
$scope.editServiceMode = []
$scope.editServiceMode.length = keyLength_service_credentials
@ -676,30 +719,91 @@ define(['./baseService'], ()->
"message": ""
)
return;
$scope.$emit "loading", true
targetSysConfigData =
"package_config":
"security":
"service_credentials": $scope.service_credentials
"console_credentials": $scope.console_credentials
targetSysConfigData["package_config"]["ceph_config"] = $scope.cephConfig if $scope.currentAdapterName == "ceph_openstack_icehouse"
# targetSysConfigData =
# "package_config":
# "security":
# "service_credentials": $scope.service_credentials
# "console_credentials": $scope.console_credentials
# targetSysConfigData["package_config"]["ceph_config"] = $scope.cephConfig if $scope.currentAdapterName == "ceph_openstack_icehouse"
if $scope.currentAdapterName == "ceph_firefly"
targetSysConfigData["package_config"]={}
targetSysConfigData["package_config"]["ceph_config"] = $scope.cephConfig
@dataService.updateClusterConfig($scope.cluster.id, targetSysConfigData).success (data) ->
wizardFactory.setCommitState(
"name": "package_config"
"state": "success"
"message": ""
)
.error (response) ->
wizardFactory.setCommitState(
"name": "package_config"
"state": "error"
"message": response
if $scope.package_config["neutron_config"]
if !$scope.package_config["neutron_config"]["openvswitch"]
$scope.package_config["neutron_config"]["openvswitch"] = {}
for key,value of $scope.package_config["neutron_config"]
if key isnt "openvswitch"
if typeof value is "string"
$scope.package_config["neutron_config"]["openvswitch"][key] = value
else
$scope.package_config["neutron_config"]["openvswitch"][key] = []
for num,item of value
$scope.package_config["neutron_config"]["openvswitch"][key].push(item)
delete $scope.package_config["neutron_config"][key]
if $scope.package_config["ceph_config"]
if !$scope.package_config["ceph_config"]["osd_config"]
$scope.package_config["ceph_config"]["osd_config"] = {}
if !$scope.package_config["ceph_config"]["global_config"]
$scope.package_config["ceph_config"]["global_config"] = {}
for key, value of $scope.package_config["ceph_config"]
if key is "op_threads" or key is "journal_size"
if key is "op_threads"
$scope.package_config["ceph_config"]["osd_config"][key] = parseInt(value)
else
$scope.package_config["ceph_config"]["osd_config"][key] = value
delete $scope.package_config["ceph_config"][key]
if key is "osd_pool_size" or key is "osd_pool_pgp_num" or key is "osd_pool_pg_num"
$scope.package_config["ceph_config"]["global_config"][key] = value
delete $scope.package_config["ceph_config"][key]
targetSysConfigData =
"package_config": $scope.package_config
console.log($scope.package_config)
if $scope.packageConfigForm.$valid
@dataService.updateClusterConfig($scope.cluster.id, targetSysConfigData).success (configData) ->
wizardFactory.setCommitState({
"name": "package_config"
"state": "success"
"message": ""
})
.error (response) ->
wizardFactory.setCommitState({
"name": "package_config"
"state": "error"
"message": response
})
else
if $scope.packageConfigForm.$error.required
message = "The required(*) fields can not be empty !"
else if $scope.packageConfigForm.$error.match
message = "The passwords do not match"
@wizardFactory.setCommitState(
"name": "package_config",
"state": "invalid",
"message": message
)
# @dataService.updateClusterConfig($scope.cluster.id, targetSysConfigData).success (data) ->
# wizardFactory.setCommitState(
# "name": "package_config"
# "state": "success"
# "message": ""
# )
# .error (response) ->
# wizardFactory.setCommitState(
# "name": "package_config"
# "state": "error"
# "message": response
# )
# manually assign roles
assignRole: ($scope, role) ->
serverChecked = false