2024-02-29 11:15:15 +00:00
|
|
|
{{ define "main" }}
|
|
|
|
<div class="container max-w-screen-md flex flex-col mt-20">
|
|
|
|
{{ if eq .MonitorsLength 0 }}
|
|
|
|
<section>
|
|
|
|
<div class="py-8 px-4 mx-auto max-w-screen-xl text-center lg:py-16">
|
|
|
|
<h1
|
|
|
|
class="mb-4 text-2xl font-extrabold tracking-tight leading-none text-gray-900 md:text-3xl lg:text-4xl"
|
|
|
|
>
|
|
|
|
There are no monitors yet.
|
2024-02-22 16:29:17 +00:00
|
|
|
</h1>
|
2024-02-29 11:15:15 +00:00
|
|
|
<p
|
|
|
|
class="mb-8 text-l font-normal text-gray-500 lg:text-l sm:px-8 lg:px-40"
|
|
|
|
>
|
|
|
|
Create a monitor to monitor your services and get notified when they
|
|
|
|
are down.
|
2024-02-22 16:29:17 +00:00
|
|
|
</p>
|
2024-02-29 11:15:15 +00:00
|
|
|
<div
|
|
|
|
class="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0"
|
|
|
|
>
|
|
|
|
<a
|
|
|
|
href="/settings/monitors/create"
|
|
|
|
class="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300"
|
|
|
|
>
|
|
|
|
Create First Monitor
|
|
|
|
<svg class="feather ml-1 h-5 w-5 overflow-visible">
|
|
|
|
<use href="/static/icons/feather-sprite.svg#plus" />
|
|
|
|
</svg>
|
|
|
|
</a>
|
2024-02-22 16:29:17 +00:00
|
|
|
</div>
|
2024-02-29 11:15:15 +00:00
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
{{ else }}
|
|
|
|
{{ if or (eq .Status "UNKNOWN") (eq .Status "SUCCESS") }}
|
|
|
|
<div class="flex flex-col items-center">
|
|
|
|
<svg
|
|
|
|
class="feather h-20 w-20 rounded-full bg-green-300 p-4 overflow-visible"
|
|
|
|
>
|
|
|
|
<use href="/static/icons/feather-sprite.svg#check" />
|
|
|
|
</svg>
|
|
|
|
<h1 class="text-slate-500 mt-4">All services are online</h1>
|
|
|
|
<p class="text-slate-500 text-sm">
|
2024-02-29 14:12:20 +00:00
|
|
|
Last updated on
|
|
|
|
{{ Now.UTC.Format "Jan 02 at 15:04 MST" }}
|
2024-02-29 11:15:15 +00:00
|
|
|
</p>
|
|
|
|
</div>
|
2024-02-22 16:29:17 +00:00
|
|
|
{{ else }}
|
2024-02-29 11:15:15 +00:00
|
|
|
<div class="flex flex-col items-center">
|
|
|
|
<svg
|
|
|
|
class="feather h-20 w-20 rounded-full bg-red-300 p-4 overflow-visible"
|
|
|
|
>
|
|
|
|
<use href="/static/icons/feather-sprite.svg#alert-triangle" />
|
|
|
|
</svg>
|
|
|
|
<h3 class="text-slate-500 mt-4">Degraded performance</h3>
|
|
|
|
<p class="text-slate-500 text-sm">
|
2024-02-29 14:12:20 +00:00
|
|
|
Last updated on
|
|
|
|
{{ Now.UTC.Format "Jan 02 at 15:04 MST" }}
|
2024-02-29 11:15:15 +00:00
|
|
|
</p>
|
|
|
|
</div>
|
2024-02-22 16:29:17 +00:00
|
|
|
{{ end }}
|
2024-02-29 11:15:15 +00:00
|
|
|
<div class="monitors">
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
|
|
|
|
<p class="text-l font-normal text-gray-800 text-center sm:text-left">
|
|
|
|
Monitors
|
|
|
|
</p>
|
|
|
|
<div
|
2024-02-29 14:12:20 +00:00
|
|
|
class="inline-flex gap-1 rounded-md shadow-sm justify-self-center sm:justify-self-end time-range py-1 px-1 bg-gray-100"
|
2024-02-29 11:15:15 +00:00
|
|
|
role="group"
|
|
|
|
>
|
|
|
|
<a
|
|
|
|
href="/?time-range=90days"
|
|
|
|
class="{{ if eq .TimeRange "90days" }}active{{ end }}"
|
|
|
|
type="button"
|
|
|
|
>90 Days</a
|
|
|
|
>
|
|
|
|
<a
|
|
|
|
href="/?time-range=48hours"
|
|
|
|
class="{{ if eq .TimeRange "48hours" }}active{{ end }}"
|
|
|
|
type="button"
|
|
|
|
>48 Hours</a
|
|
|
|
>
|
2024-02-29 14:12:20 +00:00
|
|
|
<a
|
|
|
|
href="/?time-range=90minutes"
|
|
|
|
class="{{ if eq .TimeRange "90minutes" }}active{{ end }}"
|
|
|
|
type="button"
|
|
|
|
>90 Minutes</a
|
|
|
|
>
|
2024-02-29 11:15:15 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{{ range .HealthChecks }}
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
|
|
|
|
<div class="flex items-center">
|
|
|
|
{{ if eq .Status "SUCCESS" }}
|
|
|
|
<span
|
|
|
|
class="flex w-3 h-3 me-2 bg-green-400 rounded-full"
|
|
|
|
></span>
|
|
|
|
{{ else if eq .Status "FAILURE" }}
|
|
|
|
<span class="flex w-3 h-3 me-2 bg-red-400 rounded-full"></span>
|
|
|
|
{{ else }}
|
2024-02-29 22:57:23 +00:00
|
|
|
<span class="flex w-3 h-3 me-2 bg-gray-200 rounded-full"></span>
|
2024-02-29 11:15:15 +00:00
|
|
|
{{ end }}
|
|
|
|
<p>{{ .Name }}</p>
|
|
|
|
</div>
|
2024-02-29 22:42:56 +00:00
|
|
|
<div class="justify-self-end text-sm">
|
|
|
|
{{ .History.Uptime }}% uptime
|
|
|
|
</div>
|
|
|
|
<div
|
|
|
|
class="grid gap-px col-span-2 grid-flow-col h-8 rounded overflow-hidden"
|
|
|
|
>
|
|
|
|
{{ range .History.List }}
|
|
|
|
{{ if eq . "SUCCESS" }}
|
|
|
|
<div class="bg-green-400 hover:bg-green-500 flex-auto"></div>
|
|
|
|
{{ else if eq . "FAILURE" }}
|
|
|
|
<div class="bg-red-400 hover:bg-red-500 flex-auto"></div>
|
|
|
|
{{ else }}
|
2024-02-29 22:57:23 +00:00
|
|
|
<div class="bg-gray-200 hover:bg-gray-300 flex-auto"></div>
|
2024-02-29 22:42:56 +00:00
|
|
|
{{ end }}
|
|
|
|
{{ end }}
|
|
|
|
</div>
|
|
|
|
<div class="text-slate-500 justify-self-start text-sm">
|
|
|
|
{{ if eq $.TimeRange "90days" }}
|
|
|
|
90 days ago
|
|
|
|
{{ else if eq $.TimeRange "48hours" }}
|
|
|
|
48 hours ago
|
|
|
|
{{ else if eq $.TimeRange "90minutes" }}
|
|
|
|
90 minutes ago
|
|
|
|
{{ end }}
|
|
|
|
</div>
|
|
|
|
<div class="text-slate-500 justify-self-end text-sm">Now</div>
|
2024-02-29 11:15:15 +00:00
|
|
|
</div>
|
|
|
|
{{ end }}
|
|
|
|
</div>
|
2024-02-12 13:20:38 +00:00
|
|
|
{{ end }}
|
2024-02-10 11:59:58 +00:00
|
|
|
</div>
|
2024-02-29 11:15:15 +00:00
|
|
|
{{ end }}
|