status.html 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. {{define "status"}}
  2. <html>
  3. <head><title>{{.Title}}</title></head>
  4. <style>
  5. body {
  6. /* max-width: 60rem; */
  7. margin-left: auto;
  8. margin-right: auto;
  9. padding: 3rem 1rem 8rem;
  10. line-height: 1.4;
  11. font-size: 1rem;
  12. font-weight: 400;
  13. font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
  14. text-rendering: optimizeLegibility;
  15. }
  16. .small {
  17. font-size: 0.7rem;
  18. }
  19. h1 {
  20. font-weight: 500;
  21. letter-spacing: -.025em;
  22. }
  23. a { color: rgb(74 125 221); }
  24. a:hover { color: rgb(73 100 149); }
  25. ul {
  26. list-style: none;
  27. margin: 0;
  28. padding: 0;
  29. }
  30. ul>li::before {
  31. position: absolute;
  32. top: .625rem;
  33. left: .125rem;
  34. height: .375rem;
  35. width: .375rem;
  36. border-radius: 9999px;
  37. background-color: currentColor;
  38. opacity: .4;
  39. content: "";
  40. }
  41. ul>li {
  42. position: relative;
  43. padding-left: 1.25rem;
  44. }
  45. th, td {
  46. padding: 5px;
  47. text-align: left;
  48. background: #eeeeee;
  49. }
  50. .error {
  51. color: red;
  52. }
  53. </style>
  54. <body>
  55. <h1>{{.Title}}</h1>
  56. <ul>
  57. <li>Prober Status:
  58. {{if .UnhealthyProbes }}
  59. <span class="error">{{.UnhealthyProbes}}</span>
  60. out of {{.TotalProbes}} probes failed or never ran.
  61. {{else}}
  62. All {{.TotalProbes}} probes are healthy
  63. {{end}}
  64. </li>
  65. {{ range $text, $url := .Links }}
  66. <li><a href="{{$url}}">{{$text}}</a></li>
  67. {{end}}
  68. </ul>
  69. <h1>Probes:</h1>
  70. <table class="sortable">
  71. <thead><tr>
  72. <th>Name</th>
  73. <th>Probe Class & Labels</th>
  74. <th>Interval</th>
  75. <th>Last Finished</th>
  76. <th>Last Started</th>
  77. <th>Status</th>
  78. <th>Latency</th>
  79. <th>Last Error</th>
  80. </tr></thead>
  81. <tbody>
  82. {{range $name, $probeInfo := .Probes}}
  83. <tr>
  84. <td>
  85. {{$name}}
  86. {{range $text, $url := $probeInfo.Links}}
  87. <br/>
  88. {{if not $probeInfo.Continuous}}
  89. <button onclick="location.href='{{$url}}';" type="button">
  90. {{$text}}
  91. </button>
  92. {{end}}
  93. {{end}}
  94. </td>
  95. <td>{{$probeInfo.Class}}<br/>
  96. <div class="small">
  97. {{range $label, $value := $probeInfo.Labels}}
  98. {{$label}}={{$value}}<br/>
  99. {{end}}
  100. </div>
  101. </td>
  102. <td>
  103. {{if $probeInfo.Continuous}}
  104. Continuous
  105. {{else}}
  106. {{$probeInfo.Interval}}
  107. {{end}}
  108. </td>
  109. <td data-sort="{{$probeInfo.TimeSinceLastEnd.Milliseconds}}">
  110. {{if $probeInfo.TimeSinceLastEnd}}
  111. {{$probeInfo.TimeSinceLastEnd.String}} ago<br/>
  112. <span class="small">{{$probeInfo.End.Format "2006-01-02T15:04:05Z07:00"}}</span>
  113. {{else}}
  114. Never
  115. {{end}}
  116. </td>
  117. <td data-sort="{{$probeInfo.TimeSinceLastStart.Milliseconds}}">
  118. {{if $probeInfo.TimeSinceLastStart}}
  119. {{$probeInfo.TimeSinceLastStart.String}} ago<br/>
  120. <span class="small">{{$probeInfo.Start.Format "2006-01-02T15:04:05Z07:00"}}</span>
  121. {{else}}
  122. Never
  123. {{end}}
  124. </td>
  125. <td>
  126. {{if $probeInfo.Error}}
  127. <span class="error">{{$probeInfo.Status}}</span>
  128. {{else}}
  129. {{$probeInfo.Status}}
  130. {{end}}<br/>
  131. {{if not $probeInfo.Continuous}}
  132. <div class="small">Recent: {{$probeInfo.RecentResults}}</div>
  133. <div class="small">Mean: {{$probeInfo.RecentSuccessRatio}}</div>
  134. {{end}}
  135. </td>
  136. <td data-sort="{{$probeInfo.Latency.Milliseconds}}">
  137. {{if $probeInfo.Continuous}}
  138. n/a
  139. {{else}}
  140. {{$probeInfo.Latency.String}}
  141. <div class="small">Recent: {{$probeInfo.RecentLatencies}}</div>
  142. <div class="small">Median: {{$probeInfo.RecentMedianLatency}}</div>
  143. {{end}}
  144. </td>
  145. <td class="small">{{$probeInfo.Error}}</td>
  146. </tr>
  147. {{end}}
  148. </tbody>
  149. </table>
  150. <link href="https://cdn.jsdelivr.net/gh/tofsjonas/sortable@latest/sortable-base.min.css" rel="stylesheet" />
  151. <script src="https://cdn.jsdelivr.net/gh/tofsjonas/sortable@latest/sortable.min.js"></script>
  152. </body>
  153. </html>
  154. {{end}}