Infra-Mirrors/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-12-14 10:14:44 -05:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Improve code formatting & comments

Browse Source
This commit is contained in:
Nelson Chan 2021-10-22 18:44:11 +08:00
parent 2f7b60f5e5
commit 445674aacb
1 changed files with 20 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/PingChart.vue
View File

@ -1,7 +1,12 @@
<template> <template>
<div> <div>
<div class="period-options"> <div class="period-options">
{{ $t("show") }}: <select id="chart-period-select" v-model="chartPeriodHrs" class="form-select form-select-sm ms-1"> {{ $t("show") }}:
<select
id="chart-period-select"
v-model="chartPeriodHrs"
class="form-select form-select-sm ms-1"
>
<option value="0">{{ $t("recent") }}</option> <option value="0">{{ $t("recent") }}</option>
<option value="3">3h</option> <option value="3">3h</option>
<option value="6">6h</option> <option value="6">6h</option>
@ -44,9 +49,8 @@ export default {
// Configurable filtering on top of the returned data // Configurable filtering on top of the returned data
chartPeriodHrs: 0, chartPeriodHrs: 0,
// Just Draft:
// A heartbeatList for 3h, 6h, 24h, 1w // A heartbeatList for 3h, 6h, 24h, 1w
// Set it to null, switch back to realtime (last 100 beats) // Uses the $root.heartbeatList when value is null
heartbeatList: null heartbeatList: null
}; };
}, },
@ -161,7 +165,10 @@ export default {
.filter( .filter(
// Filtering as data gets appended // Filtering as data gets appended
// not the most efficient, but works for now // not the most efficient, but works for now
(beat) => dayjs.utc(beat.time).tz(this.$root.timezone).isAfter(dayjs().subtract(Math.max(this.chartPeriodHrs, 6), "hours"))) (beat) => dayjs.utc(beat.time).tz(this.$root.timezone).isAfter(
dayjs().subtract(Math.max(this.chartPeriodHrs, 6), "hours")
)
)
.map((beat) => { .map((beat) => {
const x = this.$root.datetime(beat.time); const x = this.$root.datetime(beat.time);
pingData.push({ pingData.push({
@ -201,6 +208,7 @@ export default {
}, },
}, },
watch: { watch: {
// Update chart data when the selected chart period changes
chartPeriodHrs: function (newPeriod) { chartPeriodHrs: function (newPeriod) {
if (newPeriod == "0") { if (newPeriod == "0") {
newPeriod = null; newPeriod = null;
@ -219,11 +227,14 @@ export default {
created() { created() {
// Setup Watcher on the root heartbeatList, // Setup Watcher on the root heartbeatList,
// And mirror latest change to this.heartbeatList // And mirror latest change to this.heartbeatList
this.$watch(() => this.$root.heartbeatList[this.monitorId], (heartbeatList) => { this.$watch(() => this.$root.heartbeatList[this.monitorId],
(heartbeatList) => {
if (this.chartPeriodHrs != 0) { if (this.chartPeriodHrs != 0) {
this.heartbeatList.push(heartbeatList.at(-1)); this.heartbeatList.push(heartbeatList.at(-1));
} }
}, { deep: true }); },
{ deep: true }
);
} }
}; };
</script> </script>