mirror of
https://github.com/nezhahq/nezha.git
synced 2025-01-23 13:18:13 -05:00
125 lines
6.7 KiB
HTML
125 lines
6.7 KiB
HTML
|
{{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>
|
||
|
|
<!-- Menu -->
|
||
|
|
<div class="mdui-appbar">
|
||
|
|
<div class="mdui-tab mdui-color-theme" mdui-tab>
|
||
|
|
{{if .IsAdminPage}}
|
||
|
|
<a href="/server" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">computer</i>主机</a>
|
||
|
|
<a href="/monitor" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">accessibility</i>服务</a>
|
||
|
|
<a href="/cron" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">access_time</i>任务</a>
|
||
|
|
<a href="/notification" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">notifications</i>报警</a>
|
||
|
|
<a href="/setting" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">settings</i>设置</a>
|
||
|
|
{{else}}
|
||
|
|
<a href="/" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">home</i>首页</a>
|
||
|
|
<a href="/service" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">accessibility</i>服务</a>
|
||
|
|
{{end}}
|
||
|
|
<div class="mdui-toolbar-spacer"></div>
|
||
|
|
{{if .Admin}}
|
||
|
|
{{if .IsAdminPage}}
|
||
|
|
<a href="/" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">arrow_back</i>返回前台</a>
|
||
|
|
{{else}}
|
||
|
|
<a href="/server" class="mdui-ripple mdui-ripple-white mdui-hoverable"><i class="mdui-icon material-icons">arrow_forward</i>管理后台</a>
|
||
|
|
{{end}}
|
||
|
|
<a class="mdui-ripple mdui-ripple-white mdui-hoverable" onclick="showConfirm('确认注销？','注销后您必须重新登录才能使用',logout,{{.Admin.ID}})"><i class="mdui-icon material-icons">directions_run</i>注销登录</a>
|
||
|
|
{{else}}
|
||
|
|
<a href="/login" class="mdui-ripple mdui-ripple-white mdui-hoverable">登录</a>
|
||
|
|
{{end}}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 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-iconsi 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>
|
||
|
|
|
||
|
|
<footer class="mdui-m-t-5">
|
||
|
|
<div class="mdui-p-a-3 mdui-typo">
|
||
|
|
<center>
|
||
|
|
<p>
|
||
|
|
<a href="/"><at>{{.Title}}</at></a>
|
||
|
|
Powered by <a href="https://github.com/naiba/nezha"><st>哪吒监控<{{.Version}}></st></a> | Theme designed by Mikoy Chinese
|
||
|
|
</p>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</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}}
|