mirror of
https://github.com/nezhahq/nezha.git
synced 2025-01-23 13:18:13 -05:00
92 lines
4.6 KiB
HTML
Vendored
92 lines
4.6 KiB
HTML
Vendored
{{define "theme-mdui/service"}}
|
|
<!doctype html>
|
|
<html lang="zh-CN">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
|
<title>{{.Title}}</title>
|
|
<link rel="shortcut icon" type="image/png" href="/static/logo.svg?v20210804" />
|
|
|
|
<!-- MDUI CSS -->
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mdui@1.0.2/dist/css/mdui.min.css"/>
|
|
<link rel="stylesheet" href="/static/theme-mdui/mdui.css" type="text/css">
|
|
{{if ts .CustomCode}}
|
|
{{.CustomCode|safe}}
|
|
{{end}}
|
|
</head>
|
|
|
|
<body>
|
|
|
|
{{template "theme-mdui/menu" .}}
|
|
|
|
<!-- Container -->
|
|
<div id="container" class="mdui-container mdui-m-t-1">
|
|
<div class="mdui-table-fluid">
|
|
<table class="mdui-table mdui-table-hoverable">
|
|
<thead>
|
|
<tr>
|
|
<th class="mdui-text-center">Name</th>
|
|
<th class="mdui-text-center" mdui-tooltip="{content: 'The status of last 30 days', position: 'top'}">SLA</th>
|
|
<th class="mdui-text-center">Details of Last 30 Days</th>
|
|
<th class="mdui-text-center">Now</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{{range $service := .Services}}
|
|
<tr>
|
|
<td class="mdui-text-center"><strong>{{$service.Monitor.Name}}</strong></td>
|
|
<td class="mdui-text-center">{{float32f (divU64 $service.TotalUp (addU64 $service.TotalUp $service.TotalDown))}}%</td>
|
|
<td>
|
|
{{range $i,$d := $service.Delay}}
|
|
{{$percent := (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}
|
|
{{if eq $percent 0.0}}
|
|
<i class="mdui-icon material-icons" mdui-tooltip="{content: '{{dayBefore $i}}，在线率:{{float32f (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}%，平均延迟:{{float32f $d}}ms'}">favorite_border</i>
|
|
{{else if ge $percent 95.0}}
|
|
<i class="mdui-icon material-icons mdui-text-color-red-a700" mdui-tooltip="{position: 'top', content: '{{dayBefore $i}}，在线率:{{float32f (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}%，平均延迟:{{float32f $d}}ms'}">favorite</i>
|
|
{{else if ge $percent 80.0}}
|
|
<i class="mdui-icon material-icons mdui-text-color-orange" mdui-tooltip="{content: '{{dayBefore $i}}，在线率:{{float32f (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}%，平均延迟:{{float32f $d}}ms'}">favorite</i>
|
|
{{else}}
|
|
<i class="mdui-icon material-icons mdui-text-color-black" mdui-tooltip="{content: '{{dayBefore $i}}，在线率:{{float32f (div (index $service.Up $i) (add (index $service.Up $i) (index $service.Down $i)))}}%，平均延迟:{{float32f $d}}ms'}">favorite</i>
|
|
{{end}}
|
|
{{end}}
|
|
</td>
|
|
<td class="mdui-text-center">
|
|
{{$percent := (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}
|
|
{{if eq $percent 0.0}}
|
|
<i class="mdui-icon material-icons mdui-text-color-black">sentiment_neutral</i>
|
|
<p>{{statusName (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}</p>
|
|
{{else if ge $percent 95.0}}
|
|
<div class="mdui-spinner mdui-spinner-colorful"></div>
|
|
<p>{{statusName (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}</p>
|
|
{{else if ge $percent 80.0}}
|
|
<i class="mdui-icon material-icons mdui-text-color-orange">sentiment_dissatisfied</i>
|
|
<p>{{statusName (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}</p>
|
|
{{else}}
|
|
<i class="mdui-icon material-icons mdui-text-color-red-a700">sentiment_very_dissatisfied</i>
|
|
<p>{{statusName (divU64 $service.CurrentUp (addU64 $service.CurrentUp $service.CurrentDown))}}</p>
|
|
{{end}}
|
|
</td>
|
|
</tr>
|
|
{{end}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
{{template "theme-mdui/footer" .}}
|
|
|
|
<script src="/static/theme-mdui/mdui.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/mdui@1.0.2/dist/js/mdui.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
|
|
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue/2.6.12/vue.min.js"></script>
|
|
<script>
|
|
var container=document.querySelector("#container");
|
|
container.style.minHeight=window.innerHeight-document.body.clientHeight+container.clientHeight+'px';
|
|
mdui.mutation();
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|
|
{{end}}
|