Commit 69c97acd authored by lepdou's avatar lepdou

config页面拆分controller

parent f60ee3e2
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
<div ng-include="'views/common/nav.html'"></div> <div ng-include="'views/common/nav.html'"></div>
<div class="container-fluid apollo-container"> <div class="container-fluid apollo-container">
<div class="app" ng-controller="AppConfigController as appConfig"> <div class="app">
<!--配置信息--> <!--配置信息-->
<div id="config-info"> <div id="config-info">
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<!--具体配置信息--> <!--具体配置信息-->
<div class="row config-info-container"> <div class="row config-info-container">
<!--tag导航--> <!--tag导航-->
<div class="col-md-3"> <div class="col-md-3" ng-controller="ConfigBaseInfoController">
<div id="treeview"></div> <div id="treeview"></div>
<!--app info--> <!--app info-->
<section class="panel"> <section class="panel">
...@@ -92,9 +92,39 @@ ...@@ -92,9 +92,39 @@
</div> </div>
</a> </a>
</section> </section>
<!--create env modal-->
<div class="modal fade" id="createEnvModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header panel-primary">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
<h4 class="modal-title">添加环境</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label>请选择环境:</label>
<div class="checkbox" ng-repeat="env in missEnvs">
<label>
<input type="checkbox" name="selectedEnvs[]" value="{{env}}"
ng-checked="selectedEnvs.indexOf(env) > -1" ng-click="toggleSelection(env)">{{env}}
</label>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="createEnvs()">添加
</button>
</div>
</div>
</div>
</div>
</div> </div>
<div class="col-md-9 config-item-container"> <div class="col-md-9 config-item-container" ng-controller="ConfigNamespaceController">
<div ng-repeat="namespace in namespaces"> <div ng-repeat="namespace in namespaces">
<div class="panel"> <div class="panel">
<header class="panel-heading"> <header class="panel-heading">
...@@ -275,107 +305,74 @@ ...@@ -275,107 +305,74 @@
</div> </div>
</div> </div>
</div> <!-- view old value Modal -->
<div class="modal fade" id="oldValueModal" tabindex="-1" role="dialog">
</div> <div class="modal-dialog" role="document">
<div class="modal-content">
</div> <div class="modal-header panel-primary">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
<!-- view old value Modal --> aria-hidden="true">&times;</span></button>
<div class="modal fade" id="oldValueModal" tabindex="-1" role="dialog"> <h4 class="modal-title">{{watch.key}}</h4>
<div class="modal-dialog" role="document"> </div>
<div class="modal-content"> <div class="modal-body" style="word-wrap: break-word;">
<div class="modal-header panel-primary"> {{watch.value}}
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span <div ng-show="watch.oldValue">
aria-hidden="true">&times;</span></button> <hr>
<h4 class="modal-title">{{watch.key}}</h4> <b>已发布的值:</b>{{watch.oldValue}}
</div> </div>
<div class="modal-body" style="word-wrap: break-word;"> </div>
{{watch.value}} <div class="modal-footer">
<div ng-show="watch.oldValue"> <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<hr> </div>
<b>已发布的值:</b>{{watch.oldValue}} </div>
</div> </div>
</div> </div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- commit modify config modal--> <!-- commit modify config modal-->
<div class="modal fade" id="commitModal" tabindex="-1" role="dialog"> <div class="modal fade" id="commitModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header panel-primary"> <div class="modal-header panel-primary">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button> aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Commit changes</h4> <h4 class="modal-title">Commit changes</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<textarea rows="4" class="form-control" style="width:570px;" placeholder="Add an optional extended description..." <textarea rows="4" class="form-control" style="width:570px;" placeholder="Add an optional extended description..."
ng-model="commitComment"></textarea> ng-model="commitComment"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="commitChange()">
提交
</button>
</div>
</div>
</div>
</div> </div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="commitChange()">
提交
</button>
</div>
</div>
</div>
</div>
<!--create release modal--> <!--create release modal-->
<div class="modal fade" id="releaseModal" tabindex="-1" role="dialog"> <div class="modal fade" id="releaseModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header panel-primary"> <div class="modal-header panel-primary">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button> aria-hidden="true">&times;</span></button>
<h4 class="modal-title">发布</h4> <h4 class="modal-title">发布</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<input type="text" class="form-control" placeholder="input release title" <input type="text" class="form-control" placeholder="input release title"
ng-model="releaseTitle" required="required"> ng-model="releaseTitle" required="required">
<textarea rows="4" class="form-control" style="margin-top: 15px;" ng-model="releaseComment" <textarea rows="4" class="form-control" style="margin-top: 15px;" ng-model="releaseComment"
placeholder="Add an optional extended description..."></textarea> placeholder="Add an optional extended description..."></textarea>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="submit" class="btn btn-primary" data-dismiss="modal" ng-click="release()">提交 <button type="submit" class="btn btn-primary" data-dismiss="modal" ng-click="release()">提交
</button> </button>
</div> </div>
</div>
</div>
</div>
<!--create env modal-->
<div class="modal fade" id="createEnvModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header panel-primary">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
<h4 class="modal-title">添加环境</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label>请选择环境:</label>
<div class="checkbox" ng-repeat="env in missEnvs">
<label>
<input type="checkbox" name="selectedEnvs[]" value="{{env}}"
ng-checked="selectedEnvs.indexOf(env) > -1" ng-click="toggleSelection(env)">{{env}}
</label>
</div> </div>
</div> </div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="createEnvs()">添加
</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -417,7 +414,8 @@ ...@@ -417,7 +414,8 @@
<script type="application/javascript" src="scripts/AppUtils.js"></script> <script type="application/javascript" src="scripts/AppUtils.js"></script>
<!--controller--> <!--controller-->
<script type="application/javascript" src="scripts/controller/app/AppConfigController.js"></script> <script type="application/javascript" src="scripts/controller/app/ConfigNamespaceController.js"></script>
<script type="application/javascript" src="scripts/controller/app/ConfigBaseInfoController.js"></script>
<script type="application/javascript" src="scripts/PageCommon.js"></script> <script type="application/javascript" src="scripts/PageCommon.js"></script>
......
application_module.controller("ConfigBaseInfoController",
['$rootScope', '$scope', '$location', 'toastr', 'AppService', 'AppUtil',
function ($rootScope, $scope, $location, toastr, AppService, AppUtil) {
var appId = AppUtil.parseParams($location.$$url).appid;
var pageContext = {
appId: appId,
env: '',
clusterName: 'default'
};
$rootScope.pageContext = pageContext;
////// load cluster nav tree //////
AppService.load_nav_tree($rootScope.pageContext.appId).then(function (result) {
var navTree = [];
var nodes = result.nodes;
nodes.forEach(function (item) {
var node = {};
//first nav
node.text = item.env;
var clusterNodes = [];
//如果env下面只有一个default集群则不显示集群列表
if (item.clusters && item.clusters.length == 1 && item.clusters[0].name == 'default'){
node.selectable = true;
}else {
node.selectable = false;
//second nav
item.clusters.forEach(function (item) {
var clusterNode = {},
parentNode = [];
clusterNode.text = item.name;
parentNode.push(node.text);
clusterNode.tags = parentNode;
clusterNodes.push(clusterNode);
});
}
node.nodes = clusterNodes;
navTree.push(node);
});
$('#treeview').treeview({
color: "#428bca",
showBorder: true,
data: navTree,
levels: 99,
onNodeSelected: function (event, data) {
if (!data.tags){//first nav node
$rootScope.pageContext.env = data.text;
$rootScope.pageContext.clusterName = 'default';
}else {//second cluster node
$rootScope.pageContext.env = data.tags[0];
$rootScope.pageContext.clusterName = data.text;
}
$rootScope.refreshNamespaces();
}
});
}, function (result) {
toastr.error(AppUtil.errorMsg(result), "加载导航出错");
});
////// app info //////
AppService.load($rootScope.pageContext.appId).then(function (result) {
$scope.appBaseInfo = result.app;
$scope.missEnvs = result.missEnvs;
$scope.selectedEnvs = angular.copy($scope.missEnvs);
},function (result) {
toastr.error(AppUtil.errorMsg(result), "加载App信息出错");
});
////// 补缺失的环境 //////
$scope.toggleSelection = function toggleSelection(env) {
var idx = $scope.selectedEnvs.indexOf(env);
// is currently selected
if (idx > -1) {
$scope.selectedEnvs.splice(idx, 1);
}
// is newly selected
else {
$scope.selectedEnvs.push(env);
}
};
$scope.createEnvs = function () {
var count = 0;
$scope.selectedEnvs.forEach(function (env) {
AppService.create(env, $scope.appBaseInfo).then(function (result) {
toastr.success(env, '创建成功');
count ++;
if (count == $scope.selectedEnvs.length){
location.reload(true);
}
}, function (result) {
toastr.error(AppUtil.errorMsg(result), '创建失败:' + env);
count ++;
if (count == $scope.selectedEnvs){
$route.reload();
}
});
});
};
}]);
application_module.controller("AppConfigController", application_module.controller("ConfigNamespaceController",
['$scope', '$location', 'toastr', 'AppService', 'AppUtil', 'ConfigService', ['$rootScope', '$scope', '$location', 'toastr', 'AppUtil', 'ConfigService',
function ($scope, $location, toastr, AppService, AppUtil, ConfigService) { function ($rootScope, $scope, $location, toastr, AppUtil, ConfigService) {
var appId = AppUtil.parseParams($location.$$url).appid;
var pageContext = {
appId: appId,
env: '',
clusterName: 'default'
};
$scope.pageContext = pageContext;
////// load cluster nav tree //////
AppService.load_nav_tree($scope.pageContext.appId).then(function (result) {
var navTree = [];
var nodes = result.nodes;
nodes.forEach(function (item) {
var node = {};
//first nav
node.text = item.env;
var clusterNodes = [];
//如果env下面只有一个default集群则不显示集群列表
if (item.clusters && item.clusters.length == 1 && item.clusters[0].name == 'default'){
node.selectable = true;
}else {
node.selectable = false;
//second nav
item.clusters.forEach(function (item) {
var clusterNode = {},
parentNode = [];
clusterNode.text = item.name;
parentNode.push(node.text);
clusterNode.tags = parentNode;
clusterNodes.push(clusterNode);
});
}
node.nodes = clusterNodes;
navTree.push(node);
});
$('#treeview').treeview({
color: "#428bca",
showBorder: true,
data: navTree,
levels: 99,
onNodeSelected: function (event, data) {
if (!data.tags){//first nav node
$scope.pageContext.env = data.text;
$scope.pageContext.clusterName = 'default';
}else {//second cluster node
$scope.pageContext.env = data.tags[0];
$scope.pageContext.clusterName = data.text;
}
refreshNamespaces();
}
});
}, function (result) {
toastr.error(AppUtil.errorMsg(result), "加载导航出错");
});
////// app info //////
AppService.load($scope.pageContext.appId).then(function (result) {
$scope.appBaseInfo = result.app;
$scope.missEnvs = result.missEnvs;
$scope.selectedEnvs = angular.copy($scope.missEnvs);
},function (result) {
toastr.error(AppUtil.errorMsg(result), "加载App信息出错");
});
////// namespace ////// ////// namespace //////
...@@ -79,14 +10,12 @@ application_module.controller("AppConfigController", ...@@ -79,14 +10,12 @@ application_module.controller("AppConfigController",
LOG: 'log' LOG: 'log'
}; };
refreshNamespaces(); $rootScope.refreshNamespaces = function (viewType) {
if ($rootScope.pageContext.env == ''){
function refreshNamespaces(viewType) {
if ($scope.pageContext.env == ''){
return; return;
} }
ConfigService.load_all_namespaces($scope.pageContext.appId, $scope.pageContext.env, ConfigService.load_all_namespaces($rootScope.pageContext.appId, $rootScope.pageContext.env,
$scope.pageContext.clusterName, viewType).then( $rootScope.pageContext.clusterName, viewType).then(
function (result) { function (result) {
$scope.namespaces = result; $scope.namespaces = result;
...@@ -161,14 +90,13 @@ application_module.controller("AppConfigController", ...@@ -161,14 +90,13 @@ application_module.controller("AppConfigController",
function (result) { function (result) {
toastr.success("更新成功"); toastr.success("更新成功");
//refresh all namespace items //refresh all namespace items
refreshNamespaces(); $rootScope.refreshNamespaces();
$scope.draft.backupText = '';//清空备份文本 $scope.draft.backupText = '';//清空备份文本
$scope.toggleTextEditStatus($scope.draft); $scope.toggleTextEditStatus($scope.draft);
}, function (result) { }, function (result) {
toastr.error(AppUtil.errorMsg(result), "更新失败"); toastr.error(AppUtil.errorMsg(result), "更新失败");
} }
); );
}; };
...@@ -205,55 +133,20 @@ application_module.controller("AppConfigController", ...@@ -205,55 +133,20 @@ application_module.controller("AppConfigController",
$scope.releaseComment = ''; $scope.releaseComment = '';
$scope.releaseTitle = ''; $scope.releaseTitle = '';
$scope.release = function () { $scope.release = function () {
ConfigService.release($scope.pageContext.appId, $scope.pageContext.env, ConfigService.release($rootScope.pageContext.appId, $rootScope.pageContext.env,
$scope.pageContext.clusterName, $rootScope.pageContext.clusterName,
releaseNamespace.namespace.namespaceName, $scope.releaseTitle, releaseNamespace.namespace.namespaceName, $scope.releaseTitle,
$scope.releaseComment).then( $scope.releaseComment).then(
function (result) { function (result) {
toastr.success("发布成功"); toastr.success("发布成功");
//refresh all namespace items //refresh all namespace items
refreshNamespaces(); $rootScope.refreshNamespaces();
}, function (result) { }, function (result) {
toastr.error(AppUtil.errorMsg(result), "发布失败"); toastr.error(AppUtil.errorMsg(result), "发布失败");
} }
); );
}
////// create env //////
$scope.toggleSelection = function toggleSelection(env) {
var idx = $scope.selectedEnvs.indexOf(env);
// is currently selected
if (idx > -1) {
$scope.selectedEnvs.splice(idx, 1);
}
// is newly selected
else {
$scope.selectedEnvs.push(env);
}
};
$scope.createEnvs = function () {
var count = 0;
$scope.selectedEnvs.forEach(function (env) {
AppService.create(env, $scope.appBaseInfo).then(function (result) {
toastr.success(env, '创建成功');
count ++;
if (count == $scope.selectedEnvs.length){
location.reload(true);
}
}, function (result) {
toastr.error(AppUtil.errorMsg(result), '创建失败:' + env);
count ++;
if (count == $scope.selectedEnvs){
$route.reload();
}
});
});
}; };
}]); }]);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment