ric/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-11-27 08:44:04 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Status Page: Display offline monitors at the top of the statuspage.

Browse source
This commit is contained in:
Zandor Smith 2024-04-18 21:03:34 +02:00
parent b25ac55a2f
commit 1dd6e61269
No known key found for this signature in database
2 changed files with 49 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/lang/en.json
View file

@ -910,5 +910,7 @@
"Allow Long SMS": "Allow Long SMS",
"cellsyntSplitLongMessages": "Split long messages into up to 6 parts. 153 x 6 = 918 characters.",
"max 15 digits": "max 15 digits",
"max 11 alphanumeric characters": "max 11 alphanumeric characters"
"max 11 alphanumeric characters": "max 11 alphanumeric characters",
"offlineMonitor": "Offline Monitor",
"offlineMonitors": "Offline Monitors"
}

46
src/pages/StatusPage.vue
View file

@ -313,6 +313,30 @@
</div>
</div>
<div v-if="this.$root.downMonitors?.length > 0" class="mb-4">
<div class="mb-5">
<h2 class="group-title">
{{ $t(this.$root.downMonitors.length === 1 ? "offlineMonitor" : "offlineMonitors") }}
</h2>
<div class="shadow-box monitor-list mt-4 position-relative">
<div v-for="monitor in this.$root.downMonitors" :key="monitor.id" class="item">
<div class="row">
<div class="col-9 col-md-8 small-padding">
<div class="info">
<Uptime :monitor="monitor" type="24" :pill="true" />
{{ monitor.name }}
</div>
</div>
<div :key="$root.userHeartbeatBar" class="col-3 col-md-4">
<HeartbeatBar size="mid" :monitor-id="monitor.id" />
</div>
</div>
</div>
</div>
</div>
</div>
<div class="mb-4">
<div v-if="$root.publicGroupList.length === 0 && loadedData" class="text-center">
<!-- 👀 Nothing here, please add a group or a monitor. -->
@ -374,6 +398,8 @@ import { getResBaseURL } from "../util-frontend";
import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_MAINTENANCE, STATUS_PAGE_PARTIAL_DOWN, UP, MAINTENANCE } from "../util.ts";
import Tag from "../components/Tag.vue";
import VueMultiselect from "vue-multiselect";
import Uptime from "../components/Uptime.vue";
import HeartbeatBar from "../components/HeartbeatBar.vue";
const toast = useToast();
dayjs.extend(duration);
@ -390,6 +416,8 @@ const favicon = new Favico({
export default {
components: {
HeartbeatBar,
Uptime,
PublicGroupList,
ImageCropUpload,
Confirm,
@ -768,6 +796,8 @@ export default {
this.$root.heartbeatList = heartbeatList;
this.$root.uptimeList = uptimeList;
this.$root.downMonitors = this.downMonitors();
const heartbeatIds = Object.keys(heartbeatList);
const downMonitors = heartbeatIds.reduce((downMonitorsAmount, currentId) => {
const monitorHeartbeats = heartbeatList[currentId];
@ -789,6 +819,22 @@ export default {
}
},
downMonitors() {
let result = [];
for (const id in this.$root.publicMonitorList) {
const monitor = this.$root.publicMonitorList[id];
const heartbeats = this.$root.heartbeatList[monitor.id];
const lastHeartbeat = heartbeats.at(-1);
if (!lastHeartbeat || lastHeartbeat.status !== 0) {
continue;
}
result.push(monitor);
}
return result;
},
/**
* Setup timer to display countdown to refresh
* @returns {void}