ops / monitor-ui · Commits

Go to a project

Authored by bblu
Commit b8630f20bcc32c3c45ac4a566db9f30b8e9fa752 1 parent 1ff311c1

nginx->gateway 前台代码修改

Inline Side-by-side
Showing 3 changed files with 74 additions and 80 deletions
... ... @@ -23,14 +23,14 @@
<link rel="stylesheet" href="<%=basePath %>css/ace.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/ace-rtl.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/ace-skins.min.css"/>
<script src="<%=basePath %>js/jquery-2.1.4.min.js"></script>
<script src="<%=basePath %>js/bootstrap.min.js"></script>
<script src="<%=basePath %>js/typeahead-bs2.min.js"></script>
<script src="<%=basePath %>js/ace-elements.min.js"></script>
<script src="<%=basePath %>js/ace.min.js"></script>
<script src="<%=basePath %>script/nginx_switch.js"></script>
<script src="<%=basePath %>js/layer/layer.js"></script>
<script src="<%=basePath %>/js/unicorn.js"></script>
<script src="<%=basePath %>js/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/typeahead-bs2.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/ace-elements.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/ace.min.js" type="text/javascript"></script>
<script src="<%=basePath %>script/nginx_switch.js" type="text/javascript"></script>
<script src="<%=basePath %>js/layer/layer.js" type="text/javascript"></script>
<script src="<%=basePath %>/js/unicorn.js" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/moment-with-locales.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/bootstrap-datetimepicker.js" charset="UTF-8"
... ... @@ -51,8 +51,8 @@
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.select.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jquery.toaster.js"></script>
<script>
<script src="<%=basePath %>js/jquery.toaster.js" type="text/javascript"></script>
<script type="text/javascript">
var contextPath = '<%=basePath %>';
</script>
<title>YOHO!运维</title>
... ... @@ -65,8 +65,8 @@
<!-- 右侧具体内容 -->
<div id="content">
<div id="breadcrumb">
<a href="#" title="Go to Home" class="tip-bottom"><i
class="icon-home"></i> Home</a> <a href="#" class="current">lua切换</a>
<a href="#" title="Go to Home" class="tip-bottom"><em
class="icon-home"></em> Home</a> <a href="#" class="current">lua切换</a>
</div>
<div class="row">
... ... @@ -84,44 +84,39 @@
<h3 class="header smaller red"></h3>
<div class="btn-group" style="padding:5px 20px">
<button class="btn btn-sm btn-success" onclick="initSwitch('aws')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
aws切换
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('qcloud')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
qq切换
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('mix')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
混合切换
</button>
</div>
</div>
</div>
</div>
</div>
</div><!-- /span -->
<div class="vspace-xs-6"></div>
</div><!-- /row -->
</div>
</div><!-- /span -->
<script type="text/javascript">
var $path_assets = "assets";//this will be used in gritter alerts containing images
</script>
<div class="vspace-xs-6"></div>
</div><!-- /row -->
<!-- PAGE CONTENT ENDS -->
</div><!-- /.col -->
</div><!-- /.row -->
</div>
<script type="text/javascript">
var $path_assets = "assets";//this will be used in gritter alerts containing images
</script>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script>
$("#li_switch").addClass("active open");
$("#li_luaswitch").addClass("active");
<!-- PAGE CONTENT ENDS -->
</div><!-- /.col -->
</div><!-- /.row -->
<script src="<%=basePath %>script/common/genarate_left_panel.js" type="text/javascript"></script>
<script type="text/javascript">
function initSwitch(cloudName) {
var dialog = $("<div>").appendTo($("body"));
dialog.dialog({
... ... @@ -139,8 +134,8 @@
className: "btn-success",
onclick: function () {
var param = {
cloudName: cloudName,
}
cloudName: cloudName
};
$.ajax({
type: 'post',
url: 'switchConf',
... ... @@ -164,7 +159,7 @@
}]
});
},
error: function (data) {
error: function () {
layer.msg("异常", {icon: 2});
}
});
... ...
... ... @@ -23,14 +23,14 @@
<link rel="stylesheet" href="<%=basePath %>css/ace.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/ace-rtl.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/ace-skins.min.css"/>
<script src="<%=basePath %>js/jquery-2.1.4.min.js"></script>
<script src="<%=basePath %>js/bootstrap.min.js"></script>
<script src="<%=basePath %>js/typeahead-bs2.min.js"></script>
<script src="<%=basePath %>js/ace-elements.min.js"></script>
<script src="<%=basePath %>js/ace.min.js"></script>
<script src="<%=basePath %>script/nginx_switch.js"></script>
<script src="<%=basePath %>js/layer/layer.js"></script>
<script src="<%=basePath %>/js/unicorn.js"></script>
<script src="<%=basePath %>js/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/typeahead-bs2.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/ace-elements.min.js" type="text/javascript"></script>
<script src="<%=basePath %>js/ace.min.js" type="text/javascript"></script>
<script src="<%=basePath %>script/nginx_switch.js" type="text/javascript"></script>
<script src="<%=basePath %>js/layer/layer.js" type="text/javascript"></script>
<script src="<%=basePath %>/js/unicorn.js" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/moment-with-locales.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/bootstrap-datetimepicker.js" charset="UTF-8"
... ... @@ -51,8 +51,8 @@
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.select.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jquery.toaster.js"></script>
<script>
<script src="<%=basePath %>js/jquery.toaster.js" type="text/javascript"></script>
<script type="text/javascript">
var contextPath = '<%=basePath %>';
</script>
<title>YOHO!运维</title>
... ... @@ -65,8 +65,8 @@
<!-- 右侧具体内容 -->
<div id="content">
<div id="breadcrumb">
<a href="#" title="Go to Home" class="tip-bottom"><i
class="icon-home"></i> Home</a> <a href="#" class="current">nginx切换</a>
<a href="#" title="Go to Home" class="tip-bottom"><em
class="icon-home"></em> Home</a> <a href="#" class="current">nginx切换</a>
</div>
<div class="row">
... ... @@ -79,14 +79,14 @@
<ul class="nav nav-tabs" id="myTab">
<li class="active" style="width: 110px">
<a data-toggle="tab" href="#home">
<i class="green icon-cloud bigger-110"></i>
<em class="green icon-cloud bigger-110"></em>
亚马逊
</a>
</li>
<li style="width: 110px">
<a data-toggle="tab" href="#profile">
<i class="green icon-cloud bigger-110"></i>
<em class="green icon-cloud bigger-110"></em>
腾讯云
</a>
</li>
... ... @@ -124,28 +124,29 @@
<button class="btn btn-sm ">
线上切换
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('aws','qcloud','online')">
<i class="icon-cogs bigger-110"></i>
<button class="btn btn-sm btn-success"
onclick="initSwitch('aws','qcloud','online')">
<em class="icon-cogs bigger-110"></em>
切向qcloud
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('aws','aws','online')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
切向aws
</button><br><br>
</button>
<br><br>
<button class="btn btn-sm ">
灰度切换
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('aws','qcloud','gray')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
切向qcloud
</button>
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('aws','aws','gray')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
切向aws
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('aws','gray','gray')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
切向gray
</button>
</div>
... ... @@ -180,28 +181,32 @@
<button class="btn btn-sm ">
线上切换
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('qcloud','qcloud','online')">
<i class="icon-cogs bigger-110"></i>
<button class="btn btn-sm btn-success"
onclick="initSwitch('qcloud','qcloud','online')">
<em class="icon-cogs bigger-110"></em>
切向qcloud
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('qcloud','aws','online')">
<i class="icon-cogs bigger-110"></i>
<button class="btn btn-sm btn-success"
onclick="initSwitch('qcloud','aws','online')">
<em class="icon-cogs bigger-110"></em>
切向aws
</button>
<br/><br/>
<button class="btn btn-sm ">
灰度切换
</button>&nbsp;&nbsp;
<button class="btn btn-sm btn-success" onclick="initSwitch('qcloud','qcloud','gray')">
<i class="icon-cogs bigger-110"></i>
</button>
&nbsp;&nbsp;
<button class="btn btn-sm btn-success"
onclick="initSwitch('qcloud','qcloud','gray')">
<em class="icon-cogs bigger-110"></em>
切向qcloud
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('qcloud','aws','gray')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
切向aws
</button>
<button class="btn btn-sm btn-success" onclick="initSwitch('qcloud','gray','gray')">
<i class="icon-cogs bigger-110"></i>
<em class="icon-cogs bigger-110"></em>
切向gray
</button>
... ... @@ -217,7 +222,6 @@
<div class="space"></div>
<script type="text/javascript">
var $path_assets = "assets";//this will be used in gritter alerts containing images
</script>
... ... @@ -228,6 +232,6 @@
</div>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script src="<%=basePath %>script/common/genarate_left_panel.js" type="text/javascript"></script>
</body>
</html>
... ...
$(function () {});
var dialog1;
var dialog2;
var dialog3;
$(function () {
dialog1 = $("<div>").appendTo($("body"));
dialog2 = $("<div>").appendTo($("body"));
dialog3 = $("<div>").appendTo($("body"));
});
function initSwitch(cloudName, target, onlineOrGray) {
var arr = getNoChangeIpArr(cloudName, onlineOrGray);
if (undefined === arr || null === arr || 0 === arr.length) {
... ... @@ -15,7 +10,7 @@ function initSwitch(cloudName, target, onlineOrGray) {
return;
}
$(dialog2).empty();
dialog2 = $("<div>").appendTo($("body"));
dialog2.dialog({
title: "你确定切换吗",
backdrop: "static",
... ... @@ -44,9 +39,9 @@ function initSwitch(cloudName, target, onlineOrGray) {
function viewToChangeSuccess(resp) {
$(dialog2).dialog("hide");
$(dialog3).empty();
var data = JSON.parse(resp);
dialog3 = $("<div>").appendTo($("body"));
dialog3.dialog({
title: "切换结果",
backdrop: "static",
... ... @@ -78,8 +73,8 @@ function switchSuccess() {
/**
* 获取不切换的服务器ip（由于线上和灰度同在nginx.conf配置中，模板须设计两个占位符，所以切换某一处时，须将不切换的ip提交到后台）
* @param cloudName 切换的中心aws/qcloud
* @param onlineOrGray 切换线上/灰度
* @param list 线上和灰度的upstream配置列表
* @returns {Array} 不切换服务器的ip列表
*/
function getNoChangeIpArr(cloudName, onlineOrGray) {
... ... @@ -90,7 +85,7 @@ function getNoChangeIpArr(cloudName, onlineOrGray) {
var result = [];
list.each(function () {
result.push($(this).text().split(":")[0]);
})
});
return result;
}
... ... @@ -100,7 +95,7 @@ function getNoChangeIpArr(cloudName, onlineOrGray) {
* @param content
*/
function prompt(title, content) {
$(dialog1).empty();
dialog1 = $("<div>").appendTo($("body"));
dialog1.dialog({
title: title,
backdrop: "static",
... ...