提交 69c97acd 编写于 作者: L lepdou

config页面拆分controller

上级 f60ee3e2
......@@ -15,7 +15,7 @@
<div ng-include="'views/common/nav.html'"></div>
<div class="container-fluid apollo-container">
<div class="app" ng-controller="AppConfigController as appConfig">
<div class="app">
<!--配置信息-->
<div id="config-info">
......@@ -23,7 +23,7 @@
<!--具体配置信息-->
<div class="row config-info-container">
<!--tag导航-->
<div class="col-md-3">
<div class="col-md-3" ng-controller="ConfigBaseInfoController">
<div id="treeview"></div>
<!--app info-->
<section class="panel">
......@@ -92,9 +92,39 @@
</div>
</a>
</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 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 class="panel">
<header class="panel-heading">
......@@ -275,107 +305,74 @@
</div>
</div>
</div>
</div>
</div>
<!-- view old value Modal -->
<div class="modal fade" id="oldValueModal" 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">{{watch.key}}</h4>
</div>
<div class="modal-body" style="word-wrap: break-word;">
{{watch.value}}
<div ng-show="watch.oldValue">
<hr>
<b>已发布的值:</b>{{watch.oldValue}}
<!-- view old value Modal -->
<div class="modal fade" id="oldValueModal" 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">{{watch.key}}</h4>
</div>
<div class="modal-body" style="word-wrap: break-word;">
{{watch.value}}
<div ng-show="watch.oldValue">
<hr>
<b>已发布的值:</b>{{watch.oldValue}}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
</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-->
<div class="modal fade" id="commitModal" 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">Commit changes</h4>
</div>
<div class="modal-body">
<!-- commit modify config modal-->
<div class="modal fade" id="commitModal" 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">Commit changes</h4>
</div>
<div class="modal-body">
<textarea rows="4" class="form-control" style="width:570px;" placeholder="Add an optional extended description..."
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 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-->
<div class="modal fade" id="releaseModal" 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">
<input type="text" class="form-control" placeholder="input release title"
ng-model="releaseTitle" required="required">
<!--create release modal-->
<div class="modal fade" id="releaseModal" 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">
<input type="text" class="form-control" placeholder="input release title"
ng-model="releaseTitle" required="required">
<textarea rows="4" class="form-control" style="margin-top: 15px;" ng-model="releaseComment"
placeholder="Add an optional extended description..."></textarea>
</div>
<div class="modal-footer">
<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>
</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 class="modal-footer">
<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>
</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>
......@@ -417,7 +414,8 @@
<script type="application/javascript" src="scripts/AppUtils.js"></script>
<!--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>
......
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",
['$scope', '$location', 'toastr', 'AppService', 'AppUtil', 'ConfigService',
function ($scope, $location, toastr, AppService, 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信息出错");
});
application_module.controller("ConfigNamespaceController",
['$rootScope', '$scope', '$location', 'toastr', 'AppUtil', 'ConfigService',
function ($rootScope, $scope, $location, toastr, AppUtil, ConfigService) {
////// namespace //////
......@@ -79,14 +10,12 @@ application_module.controller("AppConfigController",
LOG: 'log'
};
refreshNamespaces();
function refreshNamespaces(viewType) {
if ($scope.pageContext.env == ''){
$rootScope.refreshNamespaces = function (viewType) {
if ($rootScope.pageContext.env == ''){
return;
}
ConfigService.load_all_namespaces($scope.pageContext.appId, $scope.pageContext.env,
$scope.pageContext.clusterName, viewType).then(
ConfigService.load_all_namespaces($rootScope.pageContext.appId, $rootScope.pageContext.env,
$rootScope.pageContext.clusterName, viewType).then(
function (result) {
$scope.namespaces = result;
......@@ -161,14 +90,13 @@ application_module.controller("AppConfigController",
function (result) {
toastr.success("更新成功");
//refresh all namespace items
refreshNamespaces();
$rootScope.refreshNamespaces();
$scope.draft.backupText = '';//清空备份文本
$scope.toggleTextEditStatus($scope.draft);
}, function (result) {
toastr.error(AppUtil.errorMsg(result), "更新失败");
}
);
};
......@@ -205,55 +133,20 @@ application_module.controller("AppConfigController",
$scope.releaseComment = '';
$scope.releaseTitle = '';
$scope.release = function () {
ConfigService.release($scope.pageContext.appId, $scope.pageContext.env,
$scope.pageContext.clusterName,
ConfigService.release($rootScope.pageContext.appId, $rootScope.pageContext.env,
$rootScope.pageContext.clusterName,
releaseNamespace.namespace.namespaceName, $scope.releaseTitle,
$scope.releaseComment).then(
function (result) {
toastr.success("发布成功");
//refresh all namespace items
refreshNamespaces();
$rootScope.refreshNamespaces();
}, function (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% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册