|
...
|
...
|
@@ -32,9 +32,9 @@ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="modal fade" style="margin-top: 60px;" id="myRedisProxyDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
|
|
|
<div class="modal fade" style="margin-top: 60px;" id="myRedisProxyDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
|
|
|
<div class="modal-dialog">
|
|
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-content" style="width:800px;">
|
|
|
|
<div class="modal-header">
|
|
|
|
<button type="button" class="close" data-dismiss="modal"
|
|
|
|
aria-hidden="true">×</button>
|
|
...
|
...
|
@@ -64,22 +64,30 @@ |
|
|
|
$.each(data.data,function(name,value) {
|
|
|
|
var contentHtml="";
|
|
|
|
var topNode="";
|
|
|
|
var activeCount=0;
|
|
|
|
var failedCount=0;
|
|
|
|
var successIp='';
|
|
|
|
var failedIp="";
|
|
|
|
var awsAcount=0;
|
|
|
|
var qcloudAcount=0;
|
|
|
|
var awsIp='';
|
|
|
|
var qcoloudIp='';
|
|
|
|
$.each(value, function (n, obj) {
|
|
|
|
if(obj.level==0){
|
|
|
|
topNode=obj.nodeFrom;
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
if(obj.level==1){
|
|
|
|
if(obj.isFailed==1){
|
|
|
|
successIp=successIp+'<a href="#" style="color: white;" onclick="displatyTetail(\''+obj.nodeTo+'\')">'+obj.nodeTo+'('+obj.paramMonitor+')</a><br/>';
|
|
|
|
activeCount=activeCount+1;
|
|
|
|
}else if(obj.isFailed==0){
|
|
|
|
failedCount=failedCount+1;
|
|
|
|
failedIp=failedIp+obj.nodeTo+'<br/>';
|
|
|
|
if(obj.nodeTo.indexOf("172")==0){
|
|
|
|
awsAcount=awsAcount+1;
|
|
|
|
if(obj.isFailed==1){
|
|
|
|
awsIp+='<button title="'+obj.paramMonitor+'" onclick="displatyTetail(\''+obj.nodeTo+'\')" class="btn_java_api btn btn-lg btn-default btn-primary" style="margin-top:5px;margin-left:5px;width: 160px;font-size: 12px;">'+obj.nodeTo+'</button>';
|
|
|
|
}else if(obj.isFailed==0){
|
|
|
|
awsIp+='<button class="btn_java_api btn btn-lg btn-default btn-danger" style="margin-top:5px;margin-left:5px;width: 160px;font-size: 12px;">'+obj.nodeTo+'</button>';
|
|
|
|
}
|
|
|
|
}else if(obj.nodeTo.indexOf("10")==0) {
|
|
|
|
qcloudAcount = qcloudAcount + 1;
|
|
|
|
if(obj.isFailed==1){
|
|
|
|
qcoloudIp+='<button title="'+obj.paramMonitor+'" onclick="displatyTetail(\''+obj.nodeTo+'\')" class="btn_java_api btn btn-lg btn-default btn-primary" style="margin-top:5px;margin-left:5px;width: 160px;font-size: 12px;">'+obj.nodeTo+'</button>';
|
|
|
|
}else if(obj.isFailed==0){
|
|
|
|
qcoloudIp+='<button class="btn_java_api btn btn-lg btn-default btn-danger" style="margin-top:5px;margin-left:5px;width: 160px;font-size: 12px;">'+obj.nodeTo+'</button>';
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return true;
|
|
|
|
}
|
|
...
|
...
|
@@ -89,24 +97,35 @@ |
|
|
|
}else if(obj.isSlave==1){
|
|
|
|
mySlaveRedis.push(obj);
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
});
|
|
|
|
contentHtml='<div class="col-md-4" id="aws" style="height: 300px;">'+
|
|
|
|
'<div class="panel panel-success-alt noborder" style="background-color: #5cb85c;">'+
|
|
|
|
'<div class="panel-heading noborder">'+
|
|
|
|
'<div>'+ '<div style="margin-left: 18px;"><img src="img/log_redis.png"><span style="font-size:28px;color: white;margin-left: 180px;">'+topNode+'</span></div>'+
|
|
|
|
'</div>'+
|
|
|
|
'<hr>'+
|
|
|
|
'<div class="clearfix mt15">'+
|
|
|
|
'<div class="pull-left">'+
|
|
|
|
'<h5 class="md-title nomargin" style="color: white;">twemproxy列表:'+activeCount+'(好),'+failedCount+'(失败)</h5>'+
|
|
|
|
'<h4 class="nomargin" style="font-size: 16px; line-height: 21px;">'+successIp+'</h4>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>';
|
|
|
|
contentHtml='<div class="col-md-4" id="aws" style="height: 360px; width: 800px;">'+
|
|
|
|
'<div class="panel panel-success-alt noborder" style="background-color: #5cb85c;">'+
|
|
|
|
'<div class="panel-heading noborder">'+
|
|
|
|
'<div>'+ '<div style="margin-left: 18px;"><img src="img/log_redis.png"><span style="font-size:28px;color: white;margin-left: 180px;">'+topNode+'</span></div>'+
|
|
|
|
'</div>'+
|
|
|
|
'<hr>'+
|
|
|
|
'<div class="clearfix mt15">'+
|
|
|
|
'<div style="width:350px; height: 130px;float: left; border: 1px solid white;word-break:break-all;">'+
|
|
|
|
'<h4 class="modal-title" style="text-align: center;color: white;">AWS</h4>';
|
|
|
|
if(awsIp==""){
|
|
|
|
contentHtml+="无";
|
|
|
|
}else{
|
|
|
|
contentHtml+=awsIp;
|
|
|
|
}
|
|
|
|
contentHtml+= '</div>'+
|
|
|
|
'<div style="width:350px; height: 130px;float: right; border: 1px solid white;word-break:break-all;">'+
|
|
|
|
'<h4 class="modal-title" style="text-align: center;color: white;" >QCloud</h4>';
|
|
|
|
if(qcoloudIp==""){
|
|
|
|
contentHtml+="无";
|
|
|
|
}else{
|
|
|
|
contentHtml+=qcoloudIp;
|
|
|
|
}
|
|
|
|
contentHtml+= '</div>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>'+
|
|
|
|
'</div>';
|
|
|
|
$("#redisAppendDiv").append(contentHtml);
|
|
|
|
});
|
|
|
|
}
|
|
...
|
...
|
@@ -116,31 +135,131 @@ |
|
|
|
function displatyTetail(ip){
|
|
|
|
var detailListRedis=new Array();
|
|
|
|
$.each(myMasterRedis, function (i, myMasterObj) {
|
|
|
|
myMasterObj.slaveParam="";
|
|
|
|
if(ip==myMasterObj.nodeFrom){
|
|
|
|
detailListRedis.push(myMasterObj);
|
|
|
|
$.each(mySlaveRedis, function (j, mySlaveObj) {
|
|
|
|
if(myMasterObj.nodeTo==mySlaveObj.nodeFrom){
|
|
|
|
detailListRedis.push(mySlaveObj);
|
|
|
|
myMasterObj.slaveParam=mySlaveObj.paramMonitor+","+mySlaveObj.nodeTo;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
detailListRedis.push(myMasterObj);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
console.log(detailListRedis);
|
|
|
|
$("#redislistDetail").table({
|
|
|
|
columnAutoWidth : false,
|
|
|
|
data : detailListRedis,
|
|
|
|
striped : true,
|
|
|
|
columns : [{
|
|
|
|
title : "nodeFrom",
|
|
|
|
field : "nodeFrom",
|
|
|
|
width : "12%"
|
|
|
|
title : "IP",
|
|
|
|
field : "nodeTo",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var ipport=value.split(":");
|
|
|
|
return ipport[0];
|
|
|
|
},
|
|
|
|
width : "10%"
|
|
|
|
},{
|
|
|
|
title : "nodeTo",
|
|
|
|
title : "port",
|
|
|
|
field : "nodeTo",
|
|
|
|
width : "12%"
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var ipport=value.split(":");
|
|
|
|
return ipport[1];
|
|
|
|
},
|
|
|
|
width : "8%"
|
|
|
|
},{
|
|
|
|
title : "角色",
|
|
|
|
field : "paramMonitor",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var paramMonitor=value.split(",");
|
|
|
|
if(paramMonitor[1]==null){
|
|
|
|
return "";
|
|
|
|
}else{
|
|
|
|
return paramMonitor[1];
|
|
|
|
}
|
|
|
|
},
|
|
|
|
width : "8%"
|
|
|
|
},{
|
|
|
|
title : "最大内存",
|
|
|
|
field : "paramMonitor",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var paramMonitor=value.split(",");
|
|
|
|
if(paramMonitor[2]==null){
|
|
|
|
return "";
|
|
|
|
}else{
|
|
|
|
return paramMonitor[2];
|
|
|
|
}
|
|
|
|
},
|
|
|
|
width : "8%"
|
|
|
|
},{
|
|
|
|
title : "redis监控信息",
|
|
|
|
title : "使用内存",
|
|
|
|
field : "paramMonitor",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var paramMonitor=value.split(",");
|
|
|
|
if(paramMonitor[4]==null){
|
|
|
|
return "";
|
|
|
|
}else{
|
|
|
|
return paramMonitor[4];
|
|
|
|
}
|
|
|
|
},
|
|
|
|
width : "8%"
|
|
|
|
},{
|
|
|
|
title : "使用率",
|
|
|
|
field : "paramMonitor",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var paramMonitor=value.split(",");
|
|
|
|
if(paramMonitor[3]==null){
|
|
|
|
return "";
|
|
|
|
}else{
|
|
|
|
return paramMonitor[3];
|
|
|
|
}
|
|
|
|
},
|
|
|
|
width : "6%"
|
|
|
|
},{
|
|
|
|
title : "状态",
|
|
|
|
field : "paramMonitor",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
var paramMonitor=value.split(",");
|
|
|
|
if(paramMonitor[0]==null){
|
|
|
|
return "";
|
|
|
|
}else{
|
|
|
|
if(paramMonitor[0]=="0"){
|
|
|
|
|
|
|
|
return "ERROR";
|
|
|
|
}else if(paramMonitor[0]=="1"){
|
|
|
|
return "OK"
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
styler : function(value, rowData, rowIndex) {
|
|
|
|
var paramMonitor=value.split(",");
|
|
|
|
if(paramMonitor[0]==null){
|
|
|
|
return "";
|
|
|
|
}else{
|
|
|
|
if(paramMonitor[0]=="0"){
|
|
|
|
return {
|
|
|
|
"background-color" : "red",
|
|
|
|
"color":"white"
|
|
|
|
};
|
|
|
|
}else if(paramMonitor[0]=="1"){
|
|
|
|
return {
|
|
|
|
"background-color" : "green",
|
|
|
|
"color":"white"
|
|
|
|
};
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
width : "6%"
|
|
|
|
},{
|
|
|
|
title : "主从",
|
|
|
|
field : "slaveParam",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
if(value!=""){
|
|
|
|
var slaveParam=value.split(",");
|
|
|
|
return "主从"+slaveParam[0]+"<br/>主IP:"+slaveParam[1];
|
|
|
|
}
|
|
|
|
return "无";
|
|
|
|
|
|
|
|
},
|
|
|
|
width : "12%"
|
|
|
|
}]
|
|
|
|
});
|
...
|
...
|
|
