TRKJ/EdgeAdmin
2
0
Fork 0
mirror of https://github.com/TeaOSLab/EdgeAdmin.git synced 2025-12-07 21:50:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

对服务增加基础的数据统计

Browse Source
This commit is contained in:
刘祥超
2021-01-25 16:40:49 +08:00
parent 2812b30b01
commit dbe598a934
27 changed files with 1047 additions and 272 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/views/@default/servers/server/stat/clients.css Normal file
View File

@@ -0,0 +1,4 @@
.chart-box {
height: 20em;
}
/*# sourceMappingURL=clients.css.map */

1
web/views/@default/servers/server/stat/clients.css.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["clients.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"clients.css"}

21
web/views/@default/servers/server/stat/clients.html Normal file
View File

@@ -0,0 +1,21 @@
{$layout}
{$var "header"}
<!-- echart -->
<script type="text/javascript" src="/js/echarts/echarts.min.js"></script>
{$end}
{$template "/left_menu"}
<div class="right-box">
{$ if eq .statIsOn false}
<p class="ui message">
要想查看统计数据，需要先开启统计功能，<a :href="'/servers/server/settings/stat?serverId=' + serverId">[点击这里]</a>修改配置。
</p>
{$else}
<h4>操作系统排行</h4>
<div class="chart-box" id="system-chart"></div>
<h4>浏览器排行</h4>
<div class="chart-box" id="browser-chart"></div>
{$end}
</div>

108
web/views/@default/servers/server/stat/clients.js Normal file
View File

@@ -0,0 +1,108 @@
Tea.context(function () {
this.$delay(function () {
let that = this
let systemUnit = this.processMaxUnit(this.systemStats)
this.reloadChart("system-chart", "操作系统", this.systemStats, function (v) {
return v.system.name
}, function (args) {
return that.systemStats[args.dataIndex].system.name + ": " + teaweb.formatNumber(that.systemStats[args.dataIndex].rawCount)
}, systemUnit)
window.addEventListener("resize", function () {
that.resizeChart("system-chart")
})
let browserUnit = this.processMaxUnit(this.browserStats)
this.reloadChart("browser-chart", "浏览器", this.browserStats, function (v) {
return v.browser.name
}, function (args) {
return that.browserStats[args.dataIndex].browser.name + ": " + teaweb.formatNumber(that.browserStats[args.dataIndex].rawCount)
}, browserUnit)
window.addEventListener("resize", function () {
that.resizeChart("system-chart")
that.resizeChart("browser-chart")
})
})
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, unit) {
let chartBox = document.getElementById(chartId)
if (chartBox == null) {
return
}
let chart = echarts.init(chartBox)
let option = {
xAxis: {
data: stats.map(xFunc)
},
yAxis: {
axisLabel: {
formatter: function (value) {
return value + unit
}
}
},
tooltip: {
show: true,
trigger: "item",
formatter: tooltipFunc
},
grid: {
left: 40,
top: 10,
right: 20,
bottom: 20
},
series: [
{
name: name,
type: "bar",
data: stats.map(function (v) {
return v.count;
}),
itemStyle: {
color: "#9DD3E8"
},
barWidth: "20em"
}
],
animation: true
}
chart.setOption(option)
chart.resize()
}
this.resizeChart = function (chartId) {
let chartBox = document.getElementById(chartId)
if (chartBox == null) {
return
}
let chart = echarts.init(chartBox)
chart.resize()
}
this.processMaxUnit = function (stats) {
let max = stats.$map(function (k, v) {
return v.count
}).$max()
let divider = 0
let unit = ""
if (max >= 1000 * 1000 * 1000) {
unit = "B"
divider = 1000 * 1000 * 1000
} else if (max >= 1000 * 1000) {
unit = "M"
divider = 1000 * 1000
} else if (max >= 1000) {
unit = "K"
divider = 1000
}
stats.forEach(function (v) {
v.rawCount = v.count
if (divider > 0) {
v.count /= divider
}
})
return unit
}
})

3
web/views/@default/servers/server/stat/clients.less Normal file
View File

@@ -0,0 +1,3 @@
.chart-box {
height: 20em;
}

4
web/views/@default/servers/server/stat/index.css
View File

@@ -0,0 +1,4 @@
.chart-box {
height: 20em;
}
/*# sourceMappingURL=index.css.map */

2
web/views/@default/servers/server/stat/index.css.map
View File

@@ -1 +1 @@
undefined
{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"index.css"}

26
web/views/@default/servers/server/stat/index.html
View File

@@ -1,6 +1,30 @@
{$layout}
{$var "header"}
<!-- echart -->
<script type="text/javascript" src="/js/echarts/echarts.min.js"></script>
{$end}
{$template "/left_menu"}
<div class="right-box">
<div class="ui message">此功能暂未开放，敬请期待。</div>
{$ if eq .statIsOn false}
<p class="ui message">
要想查看统计数据，需要先开启统计功能，<a :href="'/servers/server/settings/stat?serverId=' + serverId">[点击这里]</a>修改配置。
</p>
{$else}
<h4>地区排行</h4>
<div class="chart-box" id="country-chart">
</div>
<h4>省市排行</h4>
<div class="chart-box" id="province-chart">
</div>
<h4>城市排行</h4>
<div class="chart-box" id="city-chart">
</div>
{$end}
</div>

113
web/views/@default/servers/server/stat/index.js Normal file
View File

@@ -0,0 +1,113 @@
Tea.context(function () {
this.$delay(function () {
let that = this
let countryUnit = this.processMaxUnit(this.countryStats)
this.reloadChart("country-chart", "地区", this.countryStats, function (v) {
return v.country.name
}, function (args) {
return that.countryStats[args.dataIndex].country.name + ": " + teaweb.formatNumber(that.countryStats[args.dataIndex].rawCount)
}, countryUnit)
let provinceUnit = this.processMaxUnit(this.provinceStats)
this.reloadChart("province-chart", "省市", this.provinceStats, function (v) {
return v.province.name
}, function (args) {
return that.provinceStats[args.dataIndex].country.name + ": " + that.provinceStats[args.dataIndex].province.name + " " + teaweb.formatNumber(that.provinceStats[args.dataIndex].rawCount)
}, provinceUnit)
let cityUnit = this.processMaxUnit(this.cityStats)
this.reloadChart("city-chart", "城市", this.cityStats, function (v) {
return v.city.name
}, 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].rawCount)
}, cityUnit)
window.addEventListener("resize", function () {
that.resizeChart("country-chart")
that.resizeChart("province-chart")
that.resizeChart("city-chart")
})
})
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, unit) {
let chartBox = document.getElementById(chartId)
if (chartBox == null) {
return
}
let chart = echarts.init(chartBox)
let option = {
xAxis: {
data: stats.map(xFunc)
},
yAxis: {
axisLabel: {
formatter: function (value) {
return value + unit
}
}
},
tooltip: {
show: true,
trigger: "item",
formatter: tooltipFunc
},
grid: {
left: 40,
top: 10,
right: 20,
bottom: 20
},
series: [
{
name: name,
type: "bar",
data: stats.map(function (v) {
return v.count;
}),
itemStyle: {
color: "#9DD3E8"
},
barWidth: "20em"
}
],
animation: true
}
chart.setOption(option)
chart.resize()
}
this.resizeChart = function (chartId) {
let chartBox = document.getElementById(chartId)
if (chartBox == null) {
return
}
let chart = echarts.init(chartBox)
chart.resize()
}
this.processMaxUnit = function (stats) {
let max = stats.$map(function (k, v) {
return v.count
}).$max()
let divider = 0
let unit = ""
if (max >= 1000 * 1000 * 1000) {
unit = "B"
divider = 1000 * 1000 * 1000
} else if (max >= 1000 * 1000) {
unit = "M"
divider = 1000 * 1000
} else if (max >= 1000) {
unit = "K"
divider = 1000
}
stats.forEach(function (v) {
v.rawCount = v.count
if (divider > 0) {
v.count /= divider
}
})
return unit
}
})

3
web/views/@default/servers/server/stat/index.less
View File

@@ -0,0 +1,3 @@
.chart-box {
height: 20em;
}

4
web/views/@default/servers/server/stat/providers.css Normal file
View File

@@ -0,0 +1,4 @@
.chart-box {
height: 20em;
}
/*# sourceMappingURL=providers.css.map */

1
web/views/@default/servers/server/stat/providers.css.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["providers.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"providers.css"}

18
web/views/@default/servers/server/stat/providers.html Normal file
View File

@@ -0,0 +1,18 @@
{$layout}
{$var "header"}
<!-- echart -->
<script type="text/javascript" src="/js/echarts/echarts.min.js"></script>
{$end}
{$template "/left_menu"}
<div class="right-box">
{$ if eq .statIsOn false}
<p class="ui message">
要想查看统计数据，需要先开启统计功能，<a :href="'/servers/server/settings/stat?serverId=' + serverId">[点击这里]</a>修改配置。
</p>
{$else}
<h4>运营商排行</h4>
<div class="chart-box" id="provider-chart"></div>
{$end}
</div>

96
web/views/@default/servers/server/stat/providers.js Normal file
View File

@@ -0,0 +1,96 @@
Tea.context(function () {
this.$delay(function () {
let that = this
let providerUnit = this.processMaxUnit(this.providerStats)
this.reloadChart("provider-chart", "运营商", this.providerStats, function (v) {
return v.provider.name
}, function (args) {
return that.providerStats[args.dataIndex].provider.name + ": " + teaweb.formatNumber(that.providerStats[args.dataIndex].rawCount)
}, providerUnit)
window.addEventListener("resize", function () {
that.resizeChart("provider-chart")
})
})
this.reloadChart = function (chartId, name, stats, xFunc, tooltipFunc, unit) {
let chartBox = document.getElementById(chartId)
if (chartBox == null) {
return
}
let chart = echarts.init(chartBox)
let option = {
xAxis: {
data: stats.map(xFunc)
},
yAxis: {
axisLabel: {
formatter: function (value) {
return value + unit
}
}
},
tooltip: {
show: true,
trigger: "item",
formatter: tooltipFunc
},
grid: {
left: 40,
top: 10,
right: 20,
bottom: 20
},
series: [
{
name: name,
type: "bar",
data: stats.map(function (v) {
return v.count;
}),
itemStyle: {
color: "#9DD3E8"
},
barWidth: "20em"
}
],
animation: true
}
chart.setOption(option)
chart.resize()
}
this.resizeChart = function (chartId) {
let chartBox = document.getElementById(chartId)
if (chartBox == null) {
return
}
let chart = echarts.init(chartBox)
chart.resize()
}
this.processMaxUnit = function (stats) {
let max = stats.$map(function (k, v) {
return v.count
}).$max()
let divider = 0
let unit = ""
if (max >= 1000 * 1000 * 1000) {
unit = "B"
divider = 1000 * 1000 * 1000
} else if (max >= 1000 * 1000) {
unit = "M"
divider = 1000 * 1000
} else if (max >= 1000) {
unit = "K"
divider = 1000
}
stats.forEach(function (v) {
v.rawCount = v.count
if (divider > 0) {
v.count /= divider
}
})
return unit
}
})

3
web/views/@default/servers/server/stat/providers.less Normal file
View File

@@ -0,0 +1,3 @@
.chart-box {
height: 20em;
}