💄 优化 server-status 主题服务页流量统计

This commit is contained in:
naiba 2023-11-07 22:56:59 +08:00
parent 1c00cc8e3b
commit b6c2410b41
9 changed files with 56 additions and 63 deletions

View File

@ -4,7 +4,7 @@
<br> <br>
<small><i>LOGO designed by <a href="https://xio.ng" target="_blank">熊大</a> .</i></small> <small><i>LOGO designed by <a href="https://xio.ng" target="_blank">熊大</a> .</i></small>
<br><br> <br><br>
<img src="https://img.shields.io/github/actions/workflow/status/naiba/nezha/dashboard.yml?branch=master&label=Dash%20v0.15.7&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/github/v/release/nezhahq/agent?color=brightgreen&label=Agent&style=for-the-badge&logo=github">&nbsp;<img src="https://img.shields.io/github/actions/workflow/status/nezhahq/agent/agent.yml?branch=v0.15.7&label=Agent%20CI&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/badge/Installer-v0.15.0-brightgreen?style=for-the-badge&logo=linux"> <img src="https://img.shields.io/github/actions/workflow/status/naiba/nezha/dashboard.yml?branch=master&label=Dash%20v0.15.8&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/github/v/release/nezhahq/agent?color=brightgreen&label=Agent&style=for-the-badge&logo=github">&nbsp;<img src="https://img.shields.io/github/actions/workflow/status/nezhahq/agent/agent.yml?branch=v0.15.8&label=Agent%20CI&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/badge/Installer-v0.15.0-brightgreen?style=for-the-badge&logo=linux">
<br> <br>
<br> <br>
<p>:trollface: <b>Nezha Monitoring: Self-hostable, lightweight, servers and websites monitoring and O&M tool.</b></p> <p>:trollface: <b>Nezha Monitoring: Self-hostable, lightweight, servers and websites monitoring and O&M tool.</b></p>

View File

@ -481,8 +481,8 @@ other = "Light Mode"
[DarkMode] [DarkMode]
other = "Dark Mode" other = "Dark Mode"
[SystemMode] [FollowSystem]
other = "System Mode" other = "Follow System"
[GridLayout] [GridLayout]
other = "Grid Layout" other = "Grid Layout"

View File

@ -481,8 +481,8 @@ other = "Modo luminoso"
[DarkMode] [DarkMode]
other = "Modo oscuro" other = "Modo oscuro"
[SystemMode] [FollowSystem]
other = "Modo del sistema" other = "Seguir el sistema"
[GridLayout] [GridLayout]
other = "Grid Layout" other = "Grid Layout"

View File

@ -481,7 +481,7 @@ other = "白昼模式"
[DarkMode] [DarkMode]
other = "暗黑模式" other = "暗黑模式"
[SystemMode] [FollowSystem]
other = "跟随系统" other = "跟随系统"
[GridLayout] [GridLayout]

View File

@ -481,8 +481,8 @@ other = "白晝模式"
[DarkMode] [DarkMode]
other = "暗黑模式" other = "暗黑模式"
[SystemMode] [FollowSystem]
other = "系統模式" other = "跟隨系統"
[GridLayout] [GridLayout]
other = "網格視圖" other = "網格視圖"

View File

@ -25,7 +25,7 @@
{{else}} {{else}}
<li><a href="/login">{{tr "Login" }}</a></li> <li><a href="/login">{{tr "Login" }}</a></li>
{{end}} {{end}}
<li><a href="#" @click="setSystemTheme">{{tr "SystemMode" }} <li><a href="#" @click="setSystemTheme">{{tr "FollowSystem" }}
<span style="color: #fff" v-if="isSystemTheme"> ✔️</span></a> <span style="color: #fff" v-if="isSystemTheme"> ✔️</span></a>
</li> </li>
<li><a href="#" @click="setTheme('dark', true)">{{tr "DarkMode" }} <li><a href="#" @click="setTheme('dark', true)">{{tr "DarkMode" }}

View File

@ -38,7 +38,7 @@
</td> </td>
<td style="text-align: center;" class="node-cell location"> <td style="text-align: center;" class="node-cell location">
<i :class="node.location + ' flag'"></i>&nbsp; <i :class="node.location + ' flag'"></i>&nbsp;
<span>@#node.location#@</span> <span class="text-uppercase">@#node.location#@</span>
</td> </td>
<td style="text-align: center;" class="node-cell uptime">@#node.uptime#@</td> <td style="text-align: center;" class="node-cell uptime">@#node.uptime#@</td>
<td style="text-align: center;" class="node-cell load">@#node.load#@</td> <td style="text-align: center;" class="node-cell load">@#node.load#@</td>

View File

@ -44,25 +44,22 @@
</table> </table>
</div> </div>
<div class="ui container"> <div class="ui container" style="margin-bottom: 20px;">
<div class="service-status" style="margin-bottom: 20px;">
{{if .CycleTransferStats}} {{if .CycleTransferStats}}
<h2 style="text-align: center;">{{tr "CycleTransferStats"}}</h2> <h2 style="text-align: center;">{{tr "CycleTransferStats"}}</h2>
<table class="table table-striped">
<table class="ui celled table">
<thead> <thead>
<tr> <tr>
<th class="ui center aligned">ID</th> <th>ID</th>
<th class="ui center aligned">{{tr "Rules"}}</th> <th>{{tr "Rules"}}</th>
<th class="ui center aligned">{{tr "Server"}}</th> <th>{{tr "Server"}}</th>
<th class="ui center aligned">{{tr "From"}}</th> <th>{{tr "From"}}</th>
<th class="ui center aligned">{{tr "To"}}</th> <th>{{tr "To"}}</th>
<th class="ui center aligned">MAX</th> <th>MAX</th>
<th class="ui center aligned">MIN</th> <th>MIN</th>
<th class="ui center aligned">{{tr "NextCheck"}}</th> <th>{{tr "NextCheck"}}</th>
<th class="ui center aligned">{{tr "CurrentUsage"}}</th> <th>{{tr "CurrentUsage"}}</th>
<th class='ui center aligned' style='padding: 0px 31px 0px 31px;'>{{tr "Transleft"}}</th> <th class='ui center aligned'>{{tr "Transleft"}}</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@ -70,34 +67,30 @@
{{range $innerId, $transfer := $stats.Transfer}} {{range $innerId, $transfer := $stats.Transfer}}
{{$TransLeftPercent := TransLeftPercent (UintToFloat $transfer) (UintToFloat $stats.Max)}} {{$TransLeftPercent := TransLeftPercent (UintToFloat $transfer) (UintToFloat $stats.Max)}}
<tr> <tr>
<td class="ui center aligned">{{$id}}</td> <td>{{$id}}</td>
<td class="ui center aligned">{{$stats.Name}}</td> <td>{{$stats.Name}}</td>
<td class="ui center aligned">{{index $stats.ServerName $innerId}}</td> <td>{{index $stats.ServerName $innerId}}</td>
<td class="ui center aligned">{{$stats.From|tf}}</td> <td>{{$stats.From|tf}}</td>
<td class="ui center aligned">{{$stats.To|tf}}</td> <td>{{$stats.To|tf}}</td>
<td class="ui center aligned">{{$stats.Max|bf}}</td> <td>{{$stats.Max|bf}}</td>
<td class="ui center aligned">{{$stats.Min|bf}}</td> <td>{{$stats.Min|bf}}</td>
<td class="ui center aligned">{{(index $stats.NextUpdate $innerId)|sft}}</td> <td>{{(index $stats.NextUpdate $innerId)|sft}}</td>
<td class="ui center aligned">{{$transfer|bf}}</td> <td>{{$transfer|bf}}</td>
<td class="ui center aligned" style="padding: 14px 0px 0px 0px; position: relative;"> <td>
<div class="thirteen wide column">
<div class="ui progress {{TransClassName $TransLeftPercent}}" <div class="ui progress {{TransClassName $TransLeftPercent}}"
style=" background: rgba(0,0,0,.1); background-color: rgba(0,0,0,.1)!important; height: 25px;"> style=" background: rgba(0,0,0,.1); background-color: rgba(0,0,0,.1)!important; height: 25px; margin: unset !important">
<div class="bar" <div class="bar"
style="transition-duration: 300ms; min-width: unset; background-color: rgb(10, 148, 242); width: {{$TransLeftPercent}}% !important;"></div> style="transition-duration: 300ms; min-width: unset; background-color: rgb(10, 148, 242); width: {{$TransLeftPercent}}% !important"></div>
<small style="position: relative; top: -2em;">{{TransLeft $stats.Max $transfer}} / <small style="position: relative; top: -2em;">{{TransLeft $stats.Max $transfer}} /
{{$TransLeftPercent}} %</small></div> {{$TransLeftPercent}} %</small></div>
</div>
</td> </td>
</tr> </tr>
{{end}} {{end}}
{{end}} {{end}}
</tbody> </tbody>
</table> </table>
{{end}} {{end}}
</div> </div>
</div>
{{template "theme-server-status/content-footer" .}} {{template "theme-server-status/content-footer" .}}
</div> </div>
<script> <script>

View File

@ -12,7 +12,7 @@ import (
"github.com/naiba/nezha/pkg/utils" "github.com/naiba/nezha/pkg/utils"
) )
var Version = "v0.15.7" // !!记得修改 README 中的 badge 版本!! var Version = "v0.15.8" // !!记得修改 README 中的 badge 版本!!
var ( var (
Conf *model.Config Conf *model.Config