From 6e36528f35ace93c6b83f8587ac64a6c794dfbf5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E7=A5=A5=E8=B6=85?= Date: Wed, 15 Sep 2021 17:54:03 +0800 Subject: [PATCH] =?UTF-8?q?IP=E5=9C=B0=E5=9D=80=E8=AF=A6=E6=83=85=E4=B8=AD?= =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=8C=BA=E5=9F=9F=E7=9B=91=E6=8E=A7=E9=9B=B7?= =?UTF-8?q?=E8=BE=BE=E5=9B=BE=E3=80=81=E6=95=B0=E6=8D=AE=E5=88=97=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../clusters/ip-addrs/addr/@menu.html | 1 + .../@default/clusters/ip-addrs/addr/index.css | 9 +++ .../clusters/ip-addrs/addr/index.css.map | 1 + .../clusters/ip-addrs/addr/index.html | 11 ++- .../@default/clusters/ip-addrs/addr/index.js | 78 +++++++++++++++++++ .../clusters/ip-addrs/addr/index.less | 12 +++ .../clusters/ip-addrs/addr/reports.html | 35 +++++++++ .../clusters/ip-addrs/addr/reports.js | 18 +++++ 8 files changed, 164 insertions(+), 1 deletion(-) create mode 100644 web/views/@default/clusters/ip-addrs/addr/index.css create mode 100644 web/views/@default/clusters/ip-addrs/addr/index.css.map create mode 100644 web/views/@default/clusters/ip-addrs/addr/index.less create mode 100644 web/views/@default/clusters/ip-addrs/addr/reports.html create mode 100644 web/views/@default/clusters/ip-addrs/addr/reports.js diff --git a/web/views/@default/clusters/ip-addrs/addr/@menu.html b/web/views/@default/clusters/ip-addrs/addr/@menu.html index 0264b8f5..d52e6b3e 100644 --- a/web/views/@default/clusters/ip-addrs/addr/@menu.html +++ b/web/views/@default/clusters/ip-addrs/addr/@menu.html @@ -3,5 +3,6 @@ | "{{addr.ip}}"详情 日志 + 监控 修改 \ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/index.css b/web/views/@default/clusters/ip-addrs/addr/index.css new file mode 100644 index 00000000..39dcfacd --- /dev/null +++ b/web/views/@default/clusters/ip-addrs/addr/index.css @@ -0,0 +1,9 @@ +h4 a { + font-size: 0.8em; + margin-left: 0.6em; + font-weight: normal; +} +.chart-box { + height: 20em; +} +/*# sourceMappingURL=index.css.map */ \ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/index.css.map b/web/views/@default/clusters/ip-addrs/addr/index.css.map new file mode 100644 index 00000000..83a0caba --- /dev/null +++ b/web/views/@default/clusters/ip-addrs/addr/index.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA,EACC;EACC,gBAAA;EACA,kBAAA;EACA,mBAAA;;AAKF;EACC,YAAA","file":"index.css"} \ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/index.html b/web/views/@default/clusters/ip-addrs/addr/index.html index 3093cd8a..6dd3130a 100644 --- a/web/views/@default/clusters/ip-addrs/addr/index.html +++ b/web/views/@default/clusters/ip-addrs/addr/index.html @@ -1,6 +1,8 @@ {$layout} +{$template "/echarts"} {$template "menu"} + @@ -48,4 +50,11 @@ 没有设置阈值。 -
IP地址
\ No newline at end of file + + + +
+
+

区域监控 [详情]

+
+
\ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/index.js b/web/views/@default/clusters/ip-addrs/addr/index.js index 89b3cdf0..0c63d54f 100644 --- a/web/views/@default/clusters/ip-addrs/addr/index.js +++ b/web/views/@default/clusters/ip-addrs/addr/index.js @@ -1,4 +1,8 @@ Tea.context(function () { + this.$delay(function () { + this.loadChart() + }) + this.updateUp = function (addrId, isUp) { let status = isUp ? "在线" : "离线" teaweb.confirm("确定要手动将节点设置为" + status + "吗?", function () { @@ -20,4 +24,78 @@ Tea.context(function () { .refresh() }) } + + this.loadChart = function () { + if (this.results.length == 0) { + return + } + + let sumColor = "green" + this.results.forEach(function (v) { + switch (v.level) { + case "good": + v.color = "green" + break + case "normal": + v.color = "blue" + break + case "bad": + v.color = "orange" + if (sumColor != "red") { + sumColor = "orange" + } + break + case "broken": + v.color = "red" + sumColor = "red" + break + } + }) + + + let chartBox = document.getElementById("reports-chart-box") + if (chartBox == null || chartBox.offsetHeight == 0) { + let that = this + setTimeout(function () { + that.loadChart() + }) + return + } + let chart = teaweb.initChart(chartBox) + chart.setOption({ + radar: { + splitNumber: 4, + indicator: this.results.map(function (result) { + return { + name: result.node.name, + color: result.color, + max: 5000 + } + }) + }, + series: [{ + name: '', + type: 'radar', + data: [ + { + value: this.results.map(function (result) { + return result.costMs + }) + } + ], + lineStyle: { + width: "1", + color: sumColor, + opacity: 0.2 + }, + itemStyle: { + opacity: 0 + }, + areaStyle: { + color: sumColor, + opacity: 0.2 + } + }] + }) + } }) \ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/index.less b/web/views/@default/clusters/ip-addrs/addr/index.less new file mode 100644 index 00000000..874c9a83 --- /dev/null +++ b/web/views/@default/clusters/ip-addrs/addr/index.less @@ -0,0 +1,12 @@ +h4 { + a { + font-size: 0.8em; + margin-left: 0.6em; + font-weight: normal; + } +} + + +.chart-box { + height: 20em; +} \ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/reports.html b/web/views/@default/clusters/ip-addrs/addr/reports.html new file mode 100644 index 00000000..47f89a73 --- /dev/null +++ b/web/views/@default/clusters/ip-addrs/addr/reports.html @@ -0,0 +1,35 @@ +{$layout} +{$template "menu"} + +

暂时还没有监控结果。

+ + + + + + + + + + + + + + + + + +
监控节点对象级别耗时错误信息
+ {{result.node.name}} +
+ {{result.node.location}} {{result.node.isp}} +
+
{{result.targetDesc}} + {{result.levelName}} + + {{result.costMs}}ms + - + + {{result.error}} + - +
\ No newline at end of file diff --git a/web/views/@default/clusters/ip-addrs/addr/reports.js b/web/views/@default/clusters/ip-addrs/addr/reports.js new file mode 100644 index 00000000..41d769d0 --- /dev/null +++ b/web/views/@default/clusters/ip-addrs/addr/reports.js @@ -0,0 +1,18 @@ +Tea.context(function () { + this.results.forEach(function (v) { + switch (v.level) { + case "good": + v.color = "green" + break + case "normal": + v.color = "blue" + break + case "bad": + v.color = "orange" + break + case "broken": + v.color = "red" + break + } + }) +}) \ No newline at end of file