|
|
@@ -6,21 +6,39 @@ function formatDate(time) {
|
|
|
var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
|
|
|
var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
|
|
|
var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
|
|
|
- return YY + MM + DD +" "+hh + mm + ss;
|
|
|
+ return YY + MM + DD + " " + hh + mm + ss;
|
|
|
}
|
|
|
|
|
|
// 查看详细数据
|
|
|
function bindQueryDataDetailEvent() {
|
|
|
- var $queryData = $(".queryData");
|
|
|
+ let $queryData = $(".queryData");
|
|
|
$queryData.unbind("click");
|
|
|
$queryData.click(function () {
|
|
|
- var json = $(this).parent().find("div").text();
|
|
|
- var html = '<div class="row driver_break_word">' + json + '</div>';
|
|
|
+ let json = $(this).parent().find("div").text();
|
|
|
BootstrapDialog.show({
|
|
|
+ size: BootstrapDialog.SIZE_WIDE,
|
|
|
title: "注意信息安全",
|
|
|
type: BootstrapDialog.TYPE_INFO,
|
|
|
- message: html,
|
|
|
- size: BootstrapDialog.SIZE_NORMAL,
|
|
|
+ message: function (dialog) {
|
|
|
+ let $content = '<table class="table table-hover">';
|
|
|
+ $content += '<thead><tr><th></th><th>字段</th><th>值</th></tr></thead>';
|
|
|
+ $content += '<tbody id="dataDetail" tableGroupId="">';
|
|
|
+
|
|
|
+ let jsonObj = $.parseJSON(json);
|
|
|
+ let index = 1;
|
|
|
+ $.each(jsonObj, function(name, value) {
|
|
|
+ $content += '<tr>';
|
|
|
+ $content += '<td>' + index + '</td>';
|
|
|
+ $content += '<td>' + name + '</td>';
|
|
|
+ $content += '<td class="driver_break_word">' + value + '</td>';
|
|
|
+ $content += '</tr>';
|
|
|
+ index++;
|
|
|
+ });
|
|
|
+
|
|
|
+ $content += '</tbody>';
|
|
|
+ $content += '</table>';
|
|
|
+ return $content;
|
|
|
+ },
|
|
|
buttons: [{
|
|
|
label: "关闭",
|
|
|
action: function (dialog) {
|
|
|
@@ -54,7 +72,7 @@ function bindQueryErrorDetailEvent() {
|
|
|
}
|
|
|
|
|
|
// 清空数据
|
|
|
-function bindClearEvent($btn, $title, $msg, $url, $callback){
|
|
|
+function bindClearEvent($btn, $title, $msg, $url, $callback) {
|
|
|
$btn.click(function () {
|
|
|
var $id = null != $callback ? $callback() : $(this).attr("id");
|
|
|
var data = {"id": $id};
|
|
|
@@ -88,12 +106,12 @@ function bindClearEvent($btn, $title, $msg, $url, $callback){
|
|
|
}
|
|
|
|
|
|
// 显示更多
|
|
|
-function showMore($this, $url, $params, $call){
|
|
|
+function showMore($this, $url, $params, $call) {
|
|
|
$params.pageNum = parseInt($this.attr("num")) + 1;
|
|
|
$params.pageSize = 10;
|
|
|
doGetter($url, $params, function (data) {
|
|
|
if (data.success == true) {
|
|
|
- if(data.resultValue.data.length > 0){
|
|
|
+ if (data.resultValue.data.length > 0) {
|
|
|
$this.attr("num", $params.pageNum);
|
|
|
}
|
|
|
$call(data.resultValue);
|
|
|
@@ -109,7 +127,13 @@ function bindQueryDataEvent() {
|
|
|
var keyword = $("#searchDataKeyword").val();
|
|
|
var id = $("#searchMetaData").selectpicker("val");
|
|
|
var success = $("#searchDataSuccess").selectpicker("val");
|
|
|
- doGetter('/monitor/queryData', {"error": keyword, "success": success, "id" : id, "pageNum" : 1, "pageSize" : 10}, function (data) {
|
|
|
+ doGetter('/monitor/queryData', {
|
|
|
+ "error": keyword,
|
|
|
+ "success": success,
|
|
|
+ "id": id,
|
|
|
+ "pageNum": 1,
|
|
|
+ "pageSize": 10
|
|
|
+ }, function (data) {
|
|
|
if (data.success == true) {
|
|
|
refreshDataList(data.resultValue);
|
|
|
} else {
|
|
|
@@ -118,23 +142,29 @@ function bindQueryDataEvent() {
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
+
|
|
|
function bindQueryDataMoreEvent() {
|
|
|
$("#queryDataMore").click(function () {
|
|
|
var keyword = $("#searchDataKeyword").val();
|
|
|
var id = $("#searchMetaData").selectpicker("val");
|
|
|
var success = $("#searchDataSuccess").selectpicker("val");
|
|
|
- showMore($(this), '/monitor/queryData', {"error": keyword, "success": success, "id" : id}, function(resultValue){
|
|
|
+ showMore($(this), '/monitor/queryData', {
|
|
|
+ "error": keyword,
|
|
|
+ "success": success,
|
|
|
+ "id": id
|
|
|
+ }, function (resultValue) {
|
|
|
refreshDataList(resultValue, true)
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
-function refreshDataList(resultValue, append){
|
|
|
+
|
|
|
+function refreshDataList(resultValue, append) {
|
|
|
var $dataList = $("#dataList");
|
|
|
var $dataTotal = $("#dataTotal");
|
|
|
var html = showData($dataList, resultValue.data, append);
|
|
|
- if(append){
|
|
|
+ if (append) {
|
|
|
$dataList.append(html);
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
$dataList.html(html);
|
|
|
$("#queryDataMore").attr("num", 1);
|
|
|
}
|
|
|
@@ -142,12 +172,13 @@ function refreshDataList(resultValue, append){
|
|
|
bindQueryDataDetailEvent();
|
|
|
bindQueryErrorDetailEvent();
|
|
|
}
|
|
|
-function showData($dataList, arr, append){
|
|
|
+
|
|
|
+function showData($dataList, arr, append) {
|
|
|
var html = '';
|
|
|
var size = arr.length;
|
|
|
- if(size > 0){
|
|
|
+ if (size > 0) {
|
|
|
var start = append ? $dataList.find("tr").size() : 0;
|
|
|
- for(i = 0; i < size; i++) {
|
|
|
+ for (i = 0; i < size; i++) {
|
|
|
html += '<tr>';
|
|
|
html += '<td>' + (start + i + 1) + '</td>';
|
|
|
html += '<td>' + arr[i].targetTableName + '</td>';
|
|
|
@@ -166,7 +197,7 @@ function showData($dataList, arr, append){
|
|
|
function bindQueryLogEvent() {
|
|
|
$("#queryLogBtn").click(function () {
|
|
|
var keyword = $("#searchLogKeyword").val();
|
|
|
- doGetter('/monitor/queryLog', {"json": keyword, "pageNum" : 1, "pageSize" : 10}, function (data) {
|
|
|
+ doGetter('/monitor/queryLog', {"json": keyword, "pageNum": 1, "pageSize": 10}, function (data) {
|
|
|
if (data.success == true) {
|
|
|
refreshLogList(data.resultValue);
|
|
|
} else {
|
|
|
@@ -175,32 +206,35 @@ function bindQueryLogEvent() {
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
+
|
|
|
function bindQueryLogMoreEvent() {
|
|
|
$("#queryLogMore").click(function () {
|
|
|
var keyword = $("#searchLogKeyword").val();
|
|
|
- showMore($(this), '/monitor/queryLog', {"json": keyword}, function(resultValue){
|
|
|
+ showMore($(this), '/monitor/queryLog', {"json": keyword}, function (resultValue) {
|
|
|
refreshLogList(resultValue, true)
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
-function refreshLogList(resultValue, append){
|
|
|
+
|
|
|
+function refreshLogList(resultValue, append) {
|
|
|
var $logList = $("#logList");
|
|
|
var $logTotal = $("#logTotal");
|
|
|
var html = showLog($logList, resultValue.data, append);
|
|
|
- if(append){
|
|
|
+ if (append) {
|
|
|
$logList.append(html);
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
$logList.html(html);
|
|
|
$("#queryLogMore").attr("num", 1);
|
|
|
}
|
|
|
$logTotal.html(resultValue.total);
|
|
|
}
|
|
|
-function showLog($logList, arr, append){
|
|
|
+
|
|
|
+function showLog($logList, arr, append) {
|
|
|
var size = arr.length;
|
|
|
var html = '';
|
|
|
- if(size > 0){
|
|
|
+ if (size > 0) {
|
|
|
var start = append ? $logList.find("tr").size() : 0;
|
|
|
- for(i = 0; i < size; i++) {
|
|
|
+ for (i = 0; i < size; i++) {
|
|
|
html += '<tr>';
|
|
|
html += '<td>' + (start + i + 1) + '</td>';
|
|
|
html += '<td>' + arr[i].json + '</td>';
|
|
|
@@ -212,14 +246,14 @@ function showLog($logList, arr, append){
|
|
|
}
|
|
|
|
|
|
// 堆积数据
|
|
|
-function showQueueChart(queueUp, queueCapacity){
|
|
|
- var option={
|
|
|
- title:{
|
|
|
- text:"堆积数据",
|
|
|
- x:'center',
|
|
|
+function showQueueChart(queueUp, queueCapacity) {
|
|
|
+ var option = {
|
|
|
+ title: {
|
|
|
+ text: "堆积数据",
|
|
|
+ x: 'center',
|
|
|
y: 'top'
|
|
|
},
|
|
|
- tooltip : {
|
|
|
+ tooltip: {
|
|
|
formatter: "{a}: {c}",
|
|
|
position: 'top'
|
|
|
},
|
|
|
@@ -233,7 +267,7 @@ function showQueueChart(queueUp, queueCapacity){
|
|
|
splitNumber: 2,
|
|
|
axisLine: { // 坐标轴线
|
|
|
lineStyle: { // 属性lineStyle控制线条样式
|
|
|
- color: [[0.3, '#67e0e3'], [0.7, '#37a2da'],[1, '#fd666d']],
|
|
|
+ color: [[0.3, '#67e0e3'], [0.7, '#37a2da'], [1, '#fd666d']],
|
|
|
width: 5
|
|
|
}
|
|
|
},
|
|
|
@@ -249,15 +283,16 @@ function showQueueChart(queueUp, queueCapacity){
|
|
|
color: 'auto'
|
|
|
}
|
|
|
},
|
|
|
- detail: {fontSize:12, offsetCenter:[0,'65%']},
|
|
|
+ detail: {fontSize: 12, offsetCenter: [0, '65%']},
|
|
|
data: [{value: queueUp, name: ''}]
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
echarts.init(document.getElementById('queueChart')).setOption(option);
|
|
|
}
|
|
|
+
|
|
|
// 事件分类
|
|
|
-function showEventChart(ins, upd, del){
|
|
|
+function showEventChart(ins, upd, del) {
|
|
|
var option = {
|
|
|
title: {
|
|
|
text: '事件分类',
|
|
|
@@ -276,9 +311,9 @@ function showEventChart(ins, upd, del){
|
|
|
type: 'pie',
|
|
|
radius: '50%',
|
|
|
data: [
|
|
|
- {value:upd, name:'更新'},
|
|
|
- {value:ins, name:'插入'},
|
|
|
- {value:del, name:'删除'}
|
|
|
+ {value: upd, name: '更新'},
|
|
|
+ {value: ins, name: '插入'},
|
|
|
+ {value: del, name: '删除'}
|
|
|
],
|
|
|
emphasis: {
|
|
|
itemStyle: {
|
|
|
@@ -296,8 +331,9 @@ function showEventChart(ins, upd, del){
|
|
|
$("#updateSpan").html(upd);
|
|
|
$("#deleteSpan").html(del);
|
|
|
}
|
|
|
+
|
|
|
// 统计成功失败
|
|
|
-function showTotalChart(success, fail){
|
|
|
+function showTotalChart(success, fail) {
|
|
|
var option = {
|
|
|
title: {
|
|
|
text: '已完成数据',
|
|
|
@@ -316,8 +352,8 @@ function showTotalChart(success, fail){
|
|
|
type: 'pie',
|
|
|
radius: '50%',
|
|
|
data: [
|
|
|
- {value:success, name:'成功'},
|
|
|
- {value:fail, name:'失败'}
|
|
|
+ {value: success, name: '成功'},
|
|
|
+ {value: fail, name: '失败'}
|
|
|
],
|
|
|
emphasis: {
|
|
|
itemStyle: {
|
|
|
@@ -335,16 +371,17 @@ function showTotalChart(success, fail){
|
|
|
$("#successSpan").html(success);
|
|
|
$("#failSpan").html(fail);
|
|
|
}
|
|
|
+
|
|
|
// CPU历史
|
|
|
-function showCpuChart(cpu){
|
|
|
+function showCpuChart(cpu) {
|
|
|
var option = {
|
|
|
- title : {
|
|
|
- show:true,
|
|
|
+ title: {
|
|
|
+ show: true,
|
|
|
text: 'CPU(%)',
|
|
|
- x:'center',
|
|
|
+ x: 'center',
|
|
|
y: 'bottom'
|
|
|
},
|
|
|
- tooltip : {
|
|
|
+ tooltip: {
|
|
|
trigger: 'item',
|
|
|
formatter: "{b} : {c}%"
|
|
|
},
|
|
|
@@ -362,16 +399,17 @@ function showCpuChart(cpu){
|
|
|
};
|
|
|
echarts.init(document.getElementById('cpuChart')).setOption(option);
|
|
|
}
|
|
|
+
|
|
|
// 内存历史
|
|
|
-function showMemoryChart(memory){
|
|
|
+function showMemoryChart(memory) {
|
|
|
var option = {
|
|
|
- title : {
|
|
|
- show:true,
|
|
|
+ title: {
|
|
|
+ show: true,
|
|
|
text: '内存(MB)',
|
|
|
- x:'center',
|
|
|
+ x: 'center',
|
|
|
y: 'bottom'
|
|
|
},
|
|
|
- tooltip : {
|
|
|
+ tooltip: {
|
|
|
trigger: 'item',
|
|
|
formatter: "{b} : {c}MB"
|
|
|
},
|
|
|
@@ -391,21 +429,23 @@ function showMemoryChart(memory){
|
|
|
};
|
|
|
echarts.init(document.getElementById('memoryChart')).setOption(option);
|
|
|
}
|
|
|
+
|
|
|
// 指标列表
|
|
|
-function showMetricTable(metrics){
|
|
|
+function showMetricTable(metrics) {
|
|
|
var html = '';
|
|
|
- $.each(metrics, function(i) {
|
|
|
+ $.each(metrics, function (i) {
|
|
|
html += '<tr>';
|
|
|
- html += ' <td style="width:5%;">'+ (i + 1) +'</td>';
|
|
|
- html += ' <td>'+ '['+ metrics[i].group + ']' + metrics[i].metricName +'</td>';
|
|
|
- html += ' <td>'+ metrics[i].detail +'</td>';
|
|
|
+ html += ' <td style="width:5%;">' + (i + 1) + '</td>';
|
|
|
+ html += ' <td>' + '[' + metrics[i].group + ']' + metrics[i].metricName + '</td>';
|
|
|
+ html += ' <td>' + metrics[i].detail + '</td>';
|
|
|
html += '</tr>';
|
|
|
});
|
|
|
$("#metricTable").html(html);
|
|
|
}
|
|
|
+
|
|
|
// 显示图表信息
|
|
|
-function showChartTable(){
|
|
|
- doGetWithoutLoading("/monitor/queryAppReportMetric",{}, function (data) {
|
|
|
+function showChartTable() {
|
|
|
+ doGetWithoutLoading("/monitor/queryAppReportMetric", {}, function (data) {
|
|
|
if (data.success == true) {
|
|
|
var report = data.resultValue;
|
|
|
showTotalChart(report.success, report.fail);
|
|
|
@@ -419,12 +459,13 @@ function showChartTable(){
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
+
|
|
|
// 创建定时器
|
|
|
-function createTimer(){
|
|
|
+function createTimer() {
|
|
|
showChartTable();
|
|
|
- doGetWithoutLoading("/monitor/getRefreshInterval",{}, function (data) {
|
|
|
+ doGetWithoutLoading("/monitor/getRefreshInterval", {}, function (data) {
|
|
|
if (data.success == true) {
|
|
|
- timer = setInterval(function(){
|
|
|
+ timer = setInterval(function () {
|
|
|
showChartTable();
|
|
|
}, data.resultValue * 1000);
|
|
|
} else {
|
AE86