nezha/resource/template/theme-default/service.html
liuyanxi975 433277df2e 流量剩余显示增加详细信息
增加流量剩余显示的详细剩余流量
改进CSS,优化显示效果
2022-05-31 13:18:20 +08:00

85 lines
4.8 KiB
HTML
Vendored
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{{define "theme-default/service"}}
{{template "common/header" .}}
{{if ts .CustomCode}}
{{.CustomCode|safe}}
{{end}}
{{template "common/menu" .}}
<div class="nb-container">
<div class="ui container">
<div class="service-status">
<table class="ui celled table">
<thead>
<tr>
<th class="ui center aligned">{{tr "Name"}}</th>
<th class="ui center aligned">{{tr "30DaysOnline"}}</th>
<th class="ui center aligned">{{tr "Details"}}</th>
<th class="ui center aligned">{{tr "Status"}}</th>
</tr>
</thead>
<tbody>
{{range $service := .Services}}
<tr>
<td class="ui center aligned">{{$service.Monitor.Name}}</td>
<td class="ui center aligned">
{{$service.TotalUptime|float32f}}%
</td>
<td class="ui center aligned">{{range $i,$d := $service.Delay}}
<div class="ui icon button {{className (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}"
data-tooltip="{{dayBefore $i}}{{tr "Availability"}}:{{float32f (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}%{{tr "AverageLatency"}}:{{float32f $d}}ms">
</div> {{end}}
</td>
<td class="ui center aligned delay-today">
<i
class="delay-today {{className (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}"></i>
{{statusName (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}
</td>
</tr> {{end}}
</tbody>
</table>
{{if .CycleTransferStats}}
<h2 style="text-align: center;">{{tr "CycleTransferStats"}}</h2>
<table class="ui celled table">
<thead>
<tr>
<th class="ui center aligned">ID</th>
<th class="ui center aligned">{{tr "Rules"}}</th>
<th class="ui center aligned">{{tr "Server"}}</th>
<th class="ui center aligned">{{tr "From"}}</th>
<th class="ui center aligned">{{tr "To"}}</th>
<th class="ui center aligned">MAX</th>
<th class="ui center aligned">MIN</th>
<th class="ui center aligned">{{tr "NextCheck"}}</th>
<th class="ui center aligned">{{tr "CurrentUsage"}}</th>
<th class='ui center aligned' style='padding: 0px 31px 0px 31px;'>{{tr "Transleft"}}</th>
</tr>
</thead>
<tbody>
{{range $id, $stats := .CycleTransferStats}}
{{range $innerId, $transfer := $stats.Transfer}}
{{$TransLeftPercent := TransLeftPercent (UintToFloat $transfer) (UintToFloat $stats.Max)}}
<tr>
<td class="ui center aligned">{{$id}}</td>
<td class="ui center aligned">{{$stats.Name}}</td>
<td class="ui center aligned">{{index $stats.ServerName $innerId}}</td>
<td class="ui center aligned">{{$stats.From|tf}}</td>
<td class="ui center aligned">{{$stats.To|tf}}</td>
<td class="ui center aligned">{{$stats.Max|bf}}</td>
<td class="ui center aligned">{{$stats.Min|bf}}</td>
<td class="ui center aligned">{{(index $stats.NextUpdate $innerId)|sft}}</td>
<td class="ui center aligned">{{$transfer|bf}}</td>
<td class="ui center aligned" style="padding: 14px 0px 0px 0px; position: relative;"><div class="thirteen wide column"><div class="ui progress {{TransClassName $TransLeftPercent}}" style=" background: rgba(0,0,0,.1); background-color: rgba(0,0,0,.1)!important; height: 25px;"><div class="bar" 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}} / {{$TransLeftPercent}} %</small></div></div></td>
</tr>
{{end}}
{{end}}
</tbody>
</table>
{{end}}
</div>
</div>
</div>
{{template "common/footer" .}}
{{end}}