mirror of https://github.com/Aidaho12/haproxy-wi
parent
714bd71bf2
commit
c0d667547f
|
@ -2,7 +2,7 @@ from flask import render_template, request, jsonify, g
|
||||||
from flask_login import login_required
|
from flask_login import login_required
|
||||||
|
|
||||||
from app.routes.smon import bp
|
from app.routes.smon import bp
|
||||||
from app.middleware import get_user_params
|
from middleware import get_user_params
|
||||||
import app.modules.db.smon as smon_sql
|
import app.modules.db.smon as smon_sql
|
||||||
import app.modules.common.common as common
|
import app.modules.common.common as common
|
||||||
import app.modules.tools.smon_agent as smon_agent
|
import app.modules.tools.smon_agent as smon_agent
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
--menu-color: #06212a;
|
--menu-color: #06212a;
|
||||||
--right-menu-blue-rolor: #5D9CEB;
|
--right-menu-blue-rolor: #5D9CEB;
|
||||||
--yellow-color: #ffcc00;
|
--yellow-color: #ffcc00;
|
||||||
|
--unknown-color: #fff3cd;
|
||||||
--border-radius: 3px;
|
--border-radius: 3px;
|
||||||
--indent: 15px;
|
--indent: 15px;
|
||||||
}
|
}
|
||||||
|
@ -765,7 +766,7 @@ td,th {
|
||||||
}
|
}
|
||||||
.alert-warning {
|
.alert-warning {
|
||||||
color: #856404;
|
color: #856404;
|
||||||
background-color: #fff3cd;
|
background-color: var(--unknown-color);
|
||||||
border-color: #ffeeba;
|
border-color: #ffeeba;
|
||||||
}
|
}
|
||||||
.wrong-login {
|
.wrong-login {
|
||||||
|
@ -833,6 +834,9 @@ label {
|
||||||
.div-server-head-pause {
|
.div-server-head-pause {
|
||||||
border-top: 3px solid orange !important;
|
border-top: 3px solid orange !important;
|
||||||
}
|
}
|
||||||
|
.div-server-head-unknown {
|
||||||
|
border-top: 3px solid #efdb9d !important;
|
||||||
|
}
|
||||||
.div-server-head-up, .div-server-head-down, .div-server-head-dis, .div-server-head-pause {
|
.div-server-head-up, .div-server-head-down, .div-server-head-dis, .div-server-head-pause {
|
||||||
padding-top: 7px;
|
padding-top: 7px;
|
||||||
}
|
}
|
||||||
|
@ -1038,7 +1042,7 @@ label {
|
||||||
}
|
}
|
||||||
.unknown {
|
.unknown {
|
||||||
color: #856404;
|
color: #856404;
|
||||||
background-color: #fff3cd;
|
background-color: var(--unknown-color);
|
||||||
border-color: #ffeeba;
|
border-color: #ffeeba;
|
||||||
}
|
}
|
||||||
.disable {
|
.disable {
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
{% set additional_classes = 'err div-server-head-down' %}
|
{% set additional_classes = 'err div-server-head-down' %}
|
||||||
{% set uptime_desc = lang.words.downtime + ': <time class="timeago" datetime='+s.smon_id.time_state|string()+'>'+s.smon_id.time_state|string()+'</time>' %}
|
{% set uptime_desc = lang.words.downtime + ': <time class="timeago" datetime='+s.smon_id.time_state|string()+'>'+s.smon_id.time_state|string()+'</time>' %}
|
||||||
{% else %}
|
{% else %}
|
||||||
{% set additional_classes = 'err div-server-head-down' %}
|
{% set additional_classes = 'err div-server-head-unknown' %}
|
||||||
{% set uptime_desc = lang.words.uptime + ': N/A' %}
|
{% set uptime_desc = lang.words.uptime + ': N/A' %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% else %}
|
{% else %}
|
||||||
|
@ -63,7 +63,7 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<div class="res_time">
|
<div class="res_time">
|
||||||
<b>{{ lang.smon_page.desc.enabled_checks }}</b> {{ s.smon_id.check_type|upper }}
|
<b>{{ lang.smon_page.desc.enabled_checks }}:</b> {{ s.smon_id.check_type|upper }}
|
||||||
<b>{{lang.words.agent|title()}}:</b>
|
<b>{{lang.words.agent|title()}}:</b>
|
||||||
{% for a in agents %}
|
{% for a in agents %}
|
||||||
{% if a.id|string() == s.agent_id|string() %}
|
{% if a.id|string() == s.agent_id|string() %}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
`{% extends "base.html" %}
|
{% extends "base.html" %}
|
||||||
{% from 'include/input_macros.html' import select %}
|
{% from 'include/input_macros.html' import select %}
|
||||||
{% block title %}{{ lang.menu_links.history.title }} {{ smon_name }}{% endblock %}
|
{% block title %}{{ lang.menu_links.history.title }} {{ smon_name }}{% endblock %}
|
||||||
{% block h2 %}{{ lang.menu_links.history.title }} {{ smon_name }}{% endblock %}
|
{% block h2 %}{{ lang.menu_links.history.title }} {{ smon_name }}{% endblock %}
|
||||||
|
@ -10,7 +10,6 @@
|
||||||
<link href="{{ url_for('static', filename='css/chart.min.css') }}" rel="stylesheet">
|
<link href="{{ url_for('static', filename='css/chart.min.css') }}" rel="stylesheet">
|
||||||
<link href="{{ url_for('static', filename='css/smon.css') }}" rel="stylesheet">
|
<link href="{{ url_for('static', filename='css/smon.css') }}" rel="stylesheet">
|
||||||
<script src="/inc/chart.min-4.3.0.js"></script>
|
<script src="/inc/chart.min-4.3.0.js"></script>
|
||||||
<script src="/inc/metrics.js"></script>
|
|
||||||
<script src="/inc/smon.js"></script>
|
<script src="/inc/smon.js"></script>
|
||||||
<div class="row wrap1">
|
<div class="row wrap1">
|
||||||
{% for s in smon %}
|
{% for s in smon %}
|
||||||
|
|
106
inc/metrics.js
106
inc/metrics.js
|
@ -556,13 +556,6 @@ $( function() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
function removeData() {
|
|
||||||
let chart;
|
|
||||||
for (let i = 0; i < charts.length; i++) {
|
|
||||||
chart = charts[i];
|
|
||||||
chart.destroy();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function showOverviewHapWI() {
|
function showOverviewHapWI() {
|
||||||
removeData();
|
removeData();
|
||||||
getChartDataHapWiCpu('1');
|
getChartDataHapWiCpu('1');
|
||||||
|
@ -581,101 +574,4 @@ function updatingCpuRamCharts() {
|
||||||
} else {
|
} else {
|
||||||
removeData();
|
removeData();
|
||||||
}
|
}
|
||||||
}
|
}Œ
|
||||||
function getSmonHistoryCheckData(server) {
|
|
||||||
$.ajax({
|
|
||||||
url: "/app/smon/history/metric/" + server,
|
|
||||||
// data: {
|
|
||||||
// time_range: $( "#time-range option:selected" ).val(),
|
|
||||||
// },
|
|
||||||
// type: "POST",
|
|
||||||
success: function (result) {
|
|
||||||
var data = [];
|
|
||||||
data.push(result.chartData.curr_con);
|
|
||||||
var labels = result.chartData.labels;
|
|
||||||
renderSMONChart(data[0], labels, '3');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
function renderSMONChart(data, labels, server) {
|
|
||||||
const resp_time_word = $('#translate').attr('data-resp_time');
|
|
||||||
const ctx = document.getElementById('metrics_' + server);
|
|
||||||
|
|
||||||
// Преобразование данных в массивы
|
|
||||||
const labelArray = labels.split(',');
|
|
||||||
const dataArray = data.split(',');
|
|
||||||
|
|
||||||
// Удаление последнего пустого элемента в каждом массиве
|
|
||||||
labelArray.pop();
|
|
||||||
dataArray.pop();
|
|
||||||
|
|
||||||
// Создание объекта dataset
|
|
||||||
const dataset = {
|
|
||||||
label: resp_time_word + ' (ms)',
|
|
||||||
data: dataArray,
|
|
||||||
borderColor: 'rgba(92, 184, 92, 1)',
|
|
||||||
backgroundColor: 'rgba(92, 184, 92, 0.2)',
|
|
||||||
tension: 0.4,
|
|
||||||
pointRadius: 3,
|
|
||||||
borderWidth: 1,
|
|
||||||
fill: true
|
|
||||||
};
|
|
||||||
|
|
||||||
const config = {
|
|
||||||
type: 'line',
|
|
||||||
data: {
|
|
||||||
labels: labelArray,
|
|
||||||
datasets: [dataset]
|
|
||||||
},
|
|
||||||
options: {
|
|
||||||
animation: true,
|
|
||||||
maintainAspectRatio: false,
|
|
||||||
plugins: {
|
|
||||||
title: {
|
|
||||||
display: true,
|
|
||||||
font: { size: 15 },
|
|
||||||
padding: { top: 10 }
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
display: false,
|
|
||||||
position: 'left',
|
|
||||||
align: 'end',
|
|
||||||
labels: {
|
|
||||||
color: 'rgb(255, 99, 132)',
|
|
||||||
font: { size: 10, family: 'BlinkMacSystemFont' },
|
|
||||||
boxWidth: 13,
|
|
||||||
padding: 5
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
scales: {
|
|
||||||
x: {
|
|
||||||
title: {
|
|
||||||
display: true,
|
|
||||||
text: 'Time'
|
|
||||||
},
|
|
||||||
ticks: {
|
|
||||||
source: 'data',
|
|
||||||
autoSkip: true,
|
|
||||||
autoSkipPadding: 45,
|
|
||||||
maxRotation: 0
|
|
||||||
}
|
|
||||||
},
|
|
||||||
y: {
|
|
||||||
title: {
|
|
||||||
display: true,
|
|
||||||
text: resp_time_word + ' (ms)'
|
|
||||||
},
|
|
||||||
ticks: {
|
|
||||||
font: {
|
|
||||||
size: 10
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const myChart = new Chart(ctx, config);
|
|
||||||
charts.push(myChart);
|
|
||||||
}
|
|
||||||
|
|
|
@ -1480,7 +1480,7 @@ function returnNiceCheckingConfig(data) {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
}
|
}
|
||||||
alerts.forEach((element) => {
|
alerts.forEach((element) => {
|
||||||
if (element.indexOf('error: ') != '-1' || element.indexOf('Fatal') != '-1' || element.indexOf('Error') != '-1' || element.indexOf('failed ') != '-1' || element.indexOf('emerg] ') != '-1' || element.indexOf('Syntax error ') != '-1' || element.indexOf('Parsing') != '-1') {
|
if (element.indexOf('error: ') != '-1' || element.indexOf('Fatal') != '-1' || element.indexOf('Error') != '-1' || element.indexOf('failed ') != '-1' || element.indexOf('emerg] ') != '-1' || element.indexOf('Syntax error ') != '-1' || element.indexOf('Parsing') != '-1' || element.indexOf('Unknown') != '-1') {
|
||||||
alert_error = alert_error + element;
|
alert_error = alert_error + element;
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -1694,3 +1694,10 @@ function showPassword(input) {
|
||||||
x.type = "password";
|
x.type = "password";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
function removeData() {
|
||||||
|
let chart;
|
||||||
|
for (let i = 0; i < charts.length; i++) {
|
||||||
|
chart = charts[i];
|
||||||
|
chart.destroy();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
97
inc/smon.js
97
inc/smon.js
|
@ -270,6 +270,9 @@ function getSmonCheck(smon_id, check_id, dialog_id, new_check=false) {
|
||||||
type: "get",
|
type: "get",
|
||||||
success: function (data) {
|
success: function (data) {
|
||||||
if (new_check) {
|
if (new_check) {
|
||||||
|
if ( !$( "#dashboards" ).length ) {
|
||||||
|
location.reload();
|
||||||
|
}
|
||||||
$('#dashboards').prepend(data);
|
$('#dashboards').prepend(data);
|
||||||
} else {
|
} else {
|
||||||
$('#smon-' + smon_id).replaceWith(data);
|
$('#smon-' + smon_id).replaceWith(data);
|
||||||
|
@ -982,3 +985,97 @@ function agentAction(action, id, server_ip, dialog_id) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
var charts = []
|
||||||
|
function getSmonHistoryCheckData(server) {
|
||||||
|
$.ajax({
|
||||||
|
url: "/app/smon/history/metric/" + server,
|
||||||
|
success: function (result) {
|
||||||
|
let data = [];
|
||||||
|
data.push(result.chartData.curr_con);
|
||||||
|
let labels = result.chartData.labels;
|
||||||
|
renderSMONChart(data[0], labels, '3');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
function renderSMONChart(data, labels, server) {
|
||||||
|
const resp_time_word = $('#translate').attr('data-resp_time');
|
||||||
|
const ctx = document.getElementById('metrics_' + server);
|
||||||
|
|
||||||
|
// Преобразование данных в массивы
|
||||||
|
const labelArray = labels.split(',');
|
||||||
|
const dataArray = data.split(',');
|
||||||
|
|
||||||
|
// Удаление последнего пустого элемента в каждом массиве
|
||||||
|
labelArray.pop();
|
||||||
|
dataArray.pop();
|
||||||
|
|
||||||
|
// Создание объекта dataset
|
||||||
|
const dataset = {
|
||||||
|
label: resp_time_word + ' (ms)',
|
||||||
|
data: dataArray,
|
||||||
|
borderColor: 'rgba(92, 184, 92, 1)',
|
||||||
|
backgroundColor: 'rgba(92, 184, 92, 0.2)',
|
||||||
|
tension: 0.4,
|
||||||
|
pointRadius: 3,
|
||||||
|
borderWidth: 1,
|
||||||
|
fill: true
|
||||||
|
};
|
||||||
|
|
||||||
|
const config = {
|
||||||
|
type: 'line',
|
||||||
|
data: {
|
||||||
|
labels: labelArray,
|
||||||
|
datasets: [dataset]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
animation: true,
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
plugins: {
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
font: { size: 15 },
|
||||||
|
padding: { top: 10 }
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
display: false,
|
||||||
|
position: 'left',
|
||||||
|
align: 'end',
|
||||||
|
labels: {
|
||||||
|
color: 'rgb(255, 99, 132)',
|
||||||
|
font: { size: 10, family: 'BlinkMacSystemFont' },
|
||||||
|
boxWidth: 13,
|
||||||
|
padding: 5
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
x: {
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
text: 'Time'
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
source: 'data',
|
||||||
|
autoSkip: true,
|
||||||
|
autoSkipPadding: 45,
|
||||||
|
maxRotation: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
y: {
|
||||||
|
title: {
|
||||||
|
display: true,
|
||||||
|
text: resp_time_word + ' (ms)'
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
font: {
|
||||||
|
size: 10
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const myChart = new Chart(ctx, config);
|
||||||
|
charts.push(myChart);
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue