mirror of
https://github.com/TeaOSLab/EdgeAdmin.git
synced 2025-11-11 18:30:25 +08:00
优化界面
This commit is contained in:
@@ -170,6 +170,7 @@ func (this *IndexAction) RunGet(params struct {
|
|||||||
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
||||||
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
|
"keys": chart.MetricChart.MetricItem.Keys,
|
||||||
},
|
},
|
||||||
"stats": statMaps,
|
"stats": statMaps,
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -192,6 +192,7 @@ func (this *IndexAction) RunGet(params struct {
|
|||||||
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
||||||
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
|
"keys": chart.MetricChart.MetricItem.Keys,
|
||||||
},
|
},
|
||||||
"stats": statMaps,
|
"stats": statMaps,
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -237,6 +237,7 @@ func (this *IndexAction) RunGet(params struct{}) {
|
|||||||
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
||||||
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
|
"keys": chart.MetricChart.MetricItem.Keys,
|
||||||
},
|
},
|
||||||
"stats": statMaps,
|
"stats": statMaps,
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -198,6 +198,7 @@ func (this *IndexAction) RunGet(params struct{}) {
|
|||||||
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
||||||
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
|
"keys": chart.MetricChart.MetricItem.Keys,
|
||||||
},
|
},
|
||||||
"stats": statMaps,
|
"stats": statMaps,
|
||||||
})
|
})
|
||||||
|
|||||||
55
internal/web/actions/default/servers/ipbox/index.go
Normal file
55
internal/web/actions/default/servers/ipbox/index.go
Normal file
@@ -0,0 +1,55 @@
|
|||||||
|
// Copyright 2021 Liuxiangchao iwind.liu@gmail.com. All rights reserved.
|
||||||
|
|
||||||
|
package ipbox
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
|
||||||
|
"github.com/TeaOSLab/EdgeCommon/pkg/rpc/pb"
|
||||||
|
timeutil "github.com/iwind/TeaGo/utils/time"
|
||||||
|
"time"
|
||||||
|
)
|
||||||
|
|
||||||
|
type IndexAction struct {
|
||||||
|
actionutils.ParentAction
|
||||||
|
}
|
||||||
|
|
||||||
|
func (this *IndexAction) Init() {
|
||||||
|
this.Nav("", "", "")
|
||||||
|
}
|
||||||
|
|
||||||
|
func (this *IndexAction) RunGet(params struct {
|
||||||
|
Ip string
|
||||||
|
}) {
|
||||||
|
this.Data["ip"] = params.Ip
|
||||||
|
|
||||||
|
accessLogsResp, err := this.RPC().HTTPAccessLogRPC().ListHTTPAccessLogs(this.AdminContext(), &pb.ListHTTPAccessLogsRequest{
|
||||||
|
Day: timeutil.Format("Ymd"),
|
||||||
|
Keyword: "ip:" + params.Ip,
|
||||||
|
Size: 10,
|
||||||
|
})
|
||||||
|
if err != nil {
|
||||||
|
this.ErrorPage(err)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
var accessLogs = accessLogsResp.HttpAccessLogs
|
||||||
|
if len(accessLogs) == 0 {
|
||||||
|
// 查询昨天
|
||||||
|
accessLogsResp, err = this.RPC().HTTPAccessLogRPC().ListHTTPAccessLogs(this.AdminContext(), &pb.ListHTTPAccessLogsRequest{
|
||||||
|
Day: timeutil.Format("Ymd", time.Now().AddDate(0, 0, -1)),
|
||||||
|
Keyword: "ip:" + params.Ip,
|
||||||
|
Size: 10,
|
||||||
|
})
|
||||||
|
if err != nil {
|
||||||
|
this.ErrorPage(err)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
accessLogs = accessLogsResp.HttpAccessLogs
|
||||||
|
|
||||||
|
if len(accessLogs) == 0 {
|
||||||
|
accessLogs = []*pb.HTTPAccessLog{}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.Data["accessLogs"] = accessLogs
|
||||||
|
|
||||||
|
this.Show()
|
||||||
|
}
|
||||||
19
internal/web/actions/default/servers/ipbox/init.go
Normal file
19
internal/web/actions/default/servers/ipbox/init.go
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
// Copyright 2021 Liuxiangchao iwind.liu@gmail.com. All rights reserved.
|
||||||
|
|
||||||
|
package ipbox
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/TeaOSLab/EdgeAdmin/internal/configloaders"
|
||||||
|
"github.com/TeaOSLab/EdgeAdmin/internal/web/helpers"
|
||||||
|
"github.com/iwind/TeaGo"
|
||||||
|
)
|
||||||
|
|
||||||
|
func init() {
|
||||||
|
TeaGo.BeforeStart(func(server *TeaGo.Server) {
|
||||||
|
server.
|
||||||
|
Helper(helpers.NewUserMustAuth(configloaders.AdminModuleCodeServer)).
|
||||||
|
Prefix("/servers/ipbox").
|
||||||
|
Get("", new(IndexAction)).
|
||||||
|
EndAll()
|
||||||
|
})
|
||||||
|
}
|
||||||
@@ -144,6 +144,7 @@ func (this *IndexAction) RunGet(params struct {
|
|||||||
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
"periodUnit": chart.MetricChart.MetricItem.PeriodUnit,
|
||||||
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueType": serverconfigs.FindMetricValueType(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
"valueTypeName": serverconfigs.FindMetricValueName(chart.MetricChart.MetricItem.Category, chart.MetricChart.MetricItem.Value),
|
||||||
|
"keys": chart.MetricChart.MetricItem.Keys,
|
||||||
},
|
},
|
||||||
"stats": statMaps,
|
"stats": statMaps,
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -60,7 +60,6 @@ import (
|
|||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/components/groups"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/components/groups"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/components/log"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/components/log"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/components/waf"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/components/waf"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/iplists"
|
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/metrics"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/metrics"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/metrics/charts"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/metrics/charts"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server"
|
||||||
@@ -112,6 +111,10 @@ import (
|
|||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/websocket"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/websocket"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/stat"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/stat"
|
||||||
|
|
||||||
|
// IP相关
|
||||||
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/ipbox"
|
||||||
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/iplists"
|
||||||
|
|
||||||
// 设置相关
|
// 设置相关
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings"
|
||||||
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/authority"
|
_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/authority"
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ Vue.component("metric-chart", {
|
|||||||
return v.value
|
return v.value
|
||||||
})
|
})
|
||||||
if (sum < stats[0].total) {
|
if (sum < stats[0].total) {
|
||||||
|
if (this.vChart.type == "pie") {
|
||||||
stats.push({
|
stats.push({
|
||||||
keys: ["其他"],
|
keys: ["其他"],
|
||||||
value: stats[0].total - sum,
|
value: stats[0].total - sum,
|
||||||
@@ -22,8 +23,11 @@ Vue.component("metric-chart", {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
if (this.vChart.maxItems > 0) {
|
if (this.vChart.maxItems > 0) {
|
||||||
stats = stats.slice(0, this.vChart.maxItems)
|
stats = stats.slice(0, this.vChart.maxItems)
|
||||||
|
} else {
|
||||||
|
stats = stats.slice(0, 10)
|
||||||
}
|
}
|
||||||
|
|
||||||
stats.$rsort(function (v1, v2) {
|
stats.$rsort(function (v1, v2) {
|
||||||
@@ -55,6 +59,9 @@ Vue.component("metric-chart", {
|
|||||||
},
|
},
|
||||||
render: function (el) {
|
render: function (el) {
|
||||||
let chart = echarts.init(el)
|
let chart = echarts.init(el)
|
||||||
|
window.addEventListener("resize", function () {
|
||||||
|
chart.resize()
|
||||||
|
})
|
||||||
switch (this.chart.type) {
|
switch (this.chart.type) {
|
||||||
case "pie":
|
case "pie":
|
||||||
this.renderPie(chart)
|
this.renderPie(chart)
|
||||||
@@ -271,6 +278,15 @@ Vue.component("metric-chart", {
|
|||||||
})
|
})
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
|
let bottom = 24
|
||||||
|
let rotate = 0
|
||||||
|
let result = teaweb.xRotation(chart, this.stats.map(function (v) {
|
||||||
|
return v.keys[0]
|
||||||
|
}))
|
||||||
|
if (result != null) {
|
||||||
|
bottom = result[0]
|
||||||
|
rotate = result[1]
|
||||||
|
}
|
||||||
let that = this
|
let that = this
|
||||||
chart.setOption({
|
chart.setOption({
|
||||||
xAxis: {
|
xAxis: {
|
||||||
@@ -278,7 +294,8 @@ Vue.component("metric-chart", {
|
|||||||
return v.keys[0]
|
return v.keys[0]
|
||||||
}),
|
}),
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
interval: 0
|
interval: 0,
|
||||||
|
rotate: rotate
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
@@ -310,7 +327,7 @@ Vue.component("metric-chart", {
|
|||||||
left: 40,
|
left: 40,
|
||||||
top: 10,
|
top: 10,
|
||||||
right: 20,
|
right: 20,
|
||||||
bottom: 25
|
bottom: bottom
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
@@ -327,6 +344,19 @@ Vue.component("metric-chart", {
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// IP相关操作
|
||||||
|
if (this.item.keys != null && this.item.keys.$contains("${remoteAddr}")) {
|
||||||
|
let that = this
|
||||||
|
chart.on("click", function (args) {
|
||||||
|
let index = that.item.keys.$indexesOf("${remoteAddr}")[0]
|
||||||
|
let value = that.stats[args.dataIndex].keys[index]
|
||||||
|
teaweb.popup("/servers/ipbox?ip=" + value, {
|
||||||
|
width: "50em",
|
||||||
|
height: "30em"
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
renderTable: function (chart) {
|
renderTable: function (chart) {
|
||||||
let table = `<table class="ui table celled">
|
let table = `<table class="ui table celled">
|
||||||
|
|||||||
@@ -410,16 +410,24 @@ window.teaweb = {
|
|||||||
}
|
}
|
||||||
let click = options.click
|
let click = options.click
|
||||||
|
|
||||||
|
let bottom = 24
|
||||||
|
let rotate = 0
|
||||||
let chartBox = document.getElementById(chartId)
|
let chartBox = document.getElementById(chartId)
|
||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = this.initChart(chartBox)
|
||||||
|
let result = this.xRotation(chart, values.map(xFunc))
|
||||||
|
if (result != null) {
|
||||||
|
bottom = result[0]
|
||||||
|
rotate = result[1]
|
||||||
|
}
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: values.map(xFunc),
|
data: values.map(xFunc),
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
interval: 0
|
interval: 0,
|
||||||
|
rotate: rotate
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
@@ -440,7 +448,7 @@ window.teaweb = {
|
|||||||
left: 40,
|
left: 40,
|
||||||
top: 10,
|
top: 10,
|
||||||
right: 20,
|
right: 20,
|
||||||
bottom: 24
|
bottom: bottom
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
@@ -478,7 +486,7 @@ window.teaweb = {
|
|||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = this.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: values.map(xFunc),
|
data: values.map(xFunc),
|
||||||
@@ -522,6 +530,25 @@ window.teaweb = {
|
|||||||
}
|
}
|
||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
|
},
|
||||||
|
xRotation: function (chart, names) {
|
||||||
|
let chartWidth = chart.getWidth()
|
||||||
|
let width = 0
|
||||||
|
names.forEach(function (name) {
|
||||||
|
width += name.length * 10
|
||||||
|
})
|
||||||
|
if (width <= chartWidth) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
return [40, -20]
|
||||||
|
},
|
||||||
|
initChart: function (dom) {
|
||||||
|
let instance = echarts.init(dom)
|
||||||
|
window.addEventListener("resize", function () {
|
||||||
|
instance.resize()
|
||||||
|
})
|
||||||
|
return instance
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -65,7 +65,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -198,7 +198,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
|
|||||||
@@ -111,7 +111,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -247,7 +247,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
|
|||||||
@@ -68,7 +68,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
|
|||||||
@@ -6,16 +6,6 @@ Tea.context(function () {
|
|||||||
this.reloadHourlyRequestsChart()
|
this.reloadHourlyRequestsChart()
|
||||||
this.reloadTopDomainsChart()
|
this.reloadTopDomainsChart()
|
||||||
this.reloadTopNodesChart()
|
this.reloadTopNodesChart()
|
||||||
|
|
||||||
let that = this
|
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
if (that.trafficTab == "hourly") {
|
|
||||||
that.resizeHourlyTrafficChart()
|
|
||||||
}
|
|
||||||
if (that.trafficTab == "daily") {
|
|
||||||
that.resizeDailyTrafficChart()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.selectTrafficTab = function (tab) {
|
this.selectTrafficTab = function (tab) {
|
||||||
@@ -61,25 +51,13 @@ Tea.context(function () {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeHourlyTrafficChart = function () {
|
|
||||||
let chartBox = document.getElementById("hourly-traffic-chart-box")
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
|
|
||||||
this.resizeDailyTrafficChart = function () {
|
|
||||||
let chartBox = document.getElementById("daily-traffic-chart-box")
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
this.reloadTrafficChart = function (chartId, stats, tooltipFunc) {
|
this.reloadTrafficChart = function (chartId, stats, tooltipFunc) {
|
||||||
let axis = teaweb.bytesAxis(stats, function (v) {
|
let axis = teaweb.bytesAxis(stats, function (v) {
|
||||||
return v.bytes
|
return v.bytes
|
||||||
})
|
})
|
||||||
let chartBox = document.getElementById(chartId)
|
let chartBox = document.getElementById(chartId)
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let that = this
|
let that = this
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
@@ -219,7 +197,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
|
|||||||
@@ -63,7 +63,7 @@ Tea.context(function () {
|
|||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(xFunc)
|
data: stats.map(xFunc)
|
||||||
|
|||||||
@@ -3,16 +3,6 @@ Tea.context(function () {
|
|||||||
|
|
||||||
this.$delay(function () {
|
this.$delay(function () {
|
||||||
this.reloadHourlyTrafficChart()
|
this.reloadHourlyTrafficChart()
|
||||||
|
|
||||||
let that = this
|
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
if (that.trafficTab == "hourly") {
|
|
||||||
that.resizeHourlyTrafficChart()
|
|
||||||
}
|
|
||||||
if (that.trafficTab == "daily") {
|
|
||||||
that.resizeDailyTrafficChart()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.selectTrafficTab = function (tab) {
|
this.selectTrafficTab = function (tab) {
|
||||||
@@ -28,18 +18,12 @@ Tea.context(function () {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeHourlyTrafficChart = function () {
|
|
||||||
let chartBox = document.getElementById("hourly-traffic-chart-box")
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
|
|
||||||
this.reloadHourlyTrafficChart = function () {
|
this.reloadHourlyTrafficChart = function () {
|
||||||
let axis = teaweb.bytesAxis(this.hourlyTrafficStats, function (v) {
|
let axis = teaweb.bytesAxis(this.hourlyTrafficStats, function (v) {
|
||||||
return v.bytes
|
return v.bytes
|
||||||
})
|
})
|
||||||
let chartBox = document.getElementById("hourly-traffic-chart-box")
|
let chartBox = document.getElementById("hourly-traffic-chart-box")
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let that = this
|
let that = this
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
@@ -91,18 +75,13 @@ Tea.context(function () {
|
|||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeDailyTrafficChart = function () {
|
|
||||||
let chartBox = document.getElementById("daily-traffic-chart-box")
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
|
|
||||||
this.reloadDailyTrafficChart = function () {
|
this.reloadDailyTrafficChart = function () {
|
||||||
let axis = teaweb.bytesAxis(this.dailyTrafficStats, function (v) {
|
let axis = teaweb.bytesAxis(this.dailyTrafficStats, function (v) {
|
||||||
return v.bytes
|
return v.bytes
|
||||||
})
|
})
|
||||||
let chartBox = document.getElementById("daily-traffic-chart-box")
|
let chartBox = document.getElementById("daily-traffic-chart-box")
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
|
|
||||||
let that = this
|
let that = this
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
|
|||||||
10
web/views/@default/servers/ipbox/index.html
Normal file
10
web/views/@default/servers/ipbox/index.html
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
{$layout "layout_popup"}
|
||||||
|
|
||||||
|
<h3>最近访问日志<span class="grey">({{ip}})</span></h3>
|
||||||
|
|
||||||
|
<p class="comment" v-if="accessLogs.length == 0">暂时还没有访问日志。</p>
|
||||||
|
<table class="ui table selectable" v-if="accessLogs.length > 0">
|
||||||
|
<tr v-for="accessLog in accessLogs" :key="accessLog.requestId">
|
||||||
|
<td><http-access-log-box :v-access-log="accessLog"></http-access-log-box></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
@@ -73,7 +73,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -209,7 +209,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
|
|||||||
@@ -10,9 +10,6 @@ Tea.context(function () {
|
|||||||
}, function (args) {
|
}, function (args) {
|
||||||
return that.systemStats[args.dataIndex].system.name + ": " + teaweb.formatNumber(that.systemStats[args.dataIndex].count)
|
return that.systemStats[args.dataIndex].system.name + ": " + teaweb.formatNumber(that.systemStats[args.dataIndex].count)
|
||||||
}, systemAxis)
|
}, systemAxis)
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("system-chart")
|
|
||||||
})
|
|
||||||
|
|
||||||
let browserAxis = teaweb.countAxis(this.browserStats, function (v) {
|
let browserAxis = teaweb.countAxis(this.browserStats, function (v) {
|
||||||
return v.count
|
return v.count
|
||||||
@@ -22,11 +19,6 @@ Tea.context(function () {
|
|||||||
}, function (args) {
|
}, function (args) {
|
||||||
return that.browserStats[args.dataIndex].browser.name + ": " + teaweb.formatNumber(that.browserStats[args.dataIndex].count)
|
return that.browserStats[args.dataIndex].browser.name + ": " + teaweb.formatNumber(that.browserStats[args.dataIndex].count)
|
||||||
}, browserAxis)
|
}, browserAxis)
|
||||||
|
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("system-chart")
|
|
||||||
that.resizeChart("browser-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
||||||
@@ -34,7 +26,7 @@ Tea.context(function () {
|
|||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(xFunc),
|
data: stats.map(xFunc),
|
||||||
@@ -78,13 +70,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -28,10 +28,6 @@ Tea.context(function () {
|
|||||||
}
|
}
|
||||||
return ""
|
return ""
|
||||||
})
|
})
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("daily-requests-chart")
|
|
||||||
that.resizeChart("daily-traffic-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadRequestsChart = function (chartId, name, stats, tooltipFunc) {
|
this.reloadRequestsChart = function (chartId, name, stats, tooltipFunc) {
|
||||||
@@ -44,7 +40,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -116,7 +112,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -177,13 +173,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -28,10 +28,6 @@ Tea.context(function () {
|
|||||||
}
|
}
|
||||||
return ""
|
return ""
|
||||||
})
|
})
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("hourly-requests-chart")
|
|
||||||
that.resizeChart("hourly-traffic-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadRequestsChart = function (chartId, name, stats, tooltipFunc) {
|
this.reloadRequestsChart = function (chartId, name, stats, tooltipFunc) {
|
||||||
@@ -44,7 +40,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -116,7 +112,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -177,13 +173,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -28,10 +28,6 @@ Tea.context(function () {
|
|||||||
}
|
}
|
||||||
return ""
|
return ""
|
||||||
})
|
})
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("minutely-requests-chart")
|
|
||||||
that.resizeChart("minutely-traffic-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadRequestsChart = function (chartId, name, stats, tooltipFunc) {
|
this.reloadRequestsChart = function (chartId, name, stats, tooltipFunc) {
|
||||||
@@ -44,7 +40,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.countRequests, v.countCachedRequests)
|
return Math.max(v.countRequests, v.countCachedRequests)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -116,7 +112,7 @@ Tea.context(function () {
|
|||||||
return Math.max(v.bytes, v.cachedBytes)
|
return Math.max(v.bytes, v.cachedBytes)
|
||||||
})
|
})
|
||||||
|
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(function (v) {
|
data: stats.map(function (v) {
|
||||||
@@ -177,13 +173,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -10,9 +10,6 @@ Tea.context(function () {
|
|||||||
}, function (args) {
|
}, function (args) {
|
||||||
return that.providerStats[args.dataIndex].provider.name + ": " + teaweb.formatNumber(that.providerStats[args.dataIndex].count)
|
return that.providerStats[args.dataIndex].provider.name + ": " + teaweb.formatNumber(that.providerStats[args.dataIndex].count)
|
||||||
}, axis)
|
}, axis)
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("provider-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
||||||
@@ -20,7 +17,7 @@ Tea.context(function () {
|
|||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(xFunc),
|
data: stats.map(xFunc),
|
||||||
@@ -64,13 +61,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -31,12 +31,6 @@ Tea.context(function () {
|
|||||||
}, function (args) {
|
}, function (args) {
|
||||||
return that.cityStats[args.dataIndex].country.name + ": " + that.cityStats[args.dataIndex].province.name + " " + that.cityStats[args.dataIndex].city.name + " " + teaweb.formatNumber(that.cityStats[args.dataIndex].count)
|
return that.cityStats[args.dataIndex].country.name + ": " + that.cityStats[args.dataIndex].province.name + " " + that.cityStats[args.dataIndex].city.name + " " + teaweb.formatNumber(that.cityStats[args.dataIndex].count)
|
||||||
}, cityAxis)
|
}, cityAxis)
|
||||||
|
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("country-chart")
|
|
||||||
that.resizeChart("province-chart")
|
|
||||||
that.resizeChart("city-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
||||||
@@ -44,7 +38,7 @@ Tea.context(function () {
|
|||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(xFunc),
|
data: stats.map(xFunc),
|
||||||
@@ -88,13 +82,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -39,11 +39,6 @@ Tea.context(function () {
|
|||||||
}
|
}
|
||||||
return that.groupStats[args.dataIndex].group.name + ": " + teaweb.formatNumber(that.groupStats[args.dataIndex].count) + percent
|
return that.groupStats[args.dataIndex].group.name + ": " + teaweb.formatNumber(that.groupStats[args.dataIndex].count) + percent
|
||||||
}, groupAxis)
|
}, groupAxis)
|
||||||
|
|
||||||
window.addEventListener("resize", function () {
|
|
||||||
that.resizeChart("daily-chart")
|
|
||||||
that.resizeChart("group-chart")
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
||||||
this.reloadLineChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
this.reloadLineChart = function (chartId, name, stats, xFunc, tooltipFunc, axis) {
|
||||||
@@ -52,7 +47,7 @@ Tea.context(function () {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
let that = this
|
let that = this
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(xFunc)
|
data: stats.map(xFunc)
|
||||||
@@ -129,7 +124,7 @@ Tea.context(function () {
|
|||||||
if (chartBox == null) {
|
if (chartBox == null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let chart = echarts.init(chartBox)
|
let chart = teaweb.initChart(chartBox)
|
||||||
let option = {
|
let option = {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: stats.map(xFunc)
|
data: stats.map(xFunc)
|
||||||
@@ -170,13 +165,4 @@ Tea.context(function () {
|
|||||||
chart.setOption(option)
|
chart.setOption(option)
|
||||||
chart.resize()
|
chart.resize()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.resizeChart = function (chartId) {
|
|
||||||
let chartBox = document.getElementById(chartId)
|
|
||||||
if (chartBox == null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
let chart = echarts.init(chartBox)
|
|
||||||
chart.resize()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
Reference in New Issue
Block a user