Merge branch 'master' into Spiritreader_master

# Conflicts:
#	src/pages/EditMonitor.vue
This commit is contained in:
LouisLam
2021-07-22 17:34:41 +08:00
20 changed files with 363 additions and 80 deletions

View File

@@ -4,9 +4,9 @@
<script>
import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime"
import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone' // dependent on utc plugin
import relativeTime from "dayjs/plugin/relativeTime"
import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone' // dependent on utc plugin
dayjs.extend(utc)
dayjs.extend(timezone)
dayjs.extend(relativeTime)

View File

@@ -55,7 +55,7 @@
<p style="margin-top: 8px;">
<template v-if="notification.telegramBotToken">
<a :href="telegramGetUpdatesURL" target="_blank">{{ telegramGetUpdatesURL }}</a>
<a :href="telegramGetUpdatesURL" target="_blank" style="word-break: break-word;">{{ telegramGetUpdatesURL }}</a>
</template>
<template v-else>
@@ -69,13 +69,13 @@
<template v-if="notification.type === 'webhook'">
<div class="mb-3">
<label for="webhook-url" class="form-label">Post URL</label>
<input type="url" pattern="https?://.+" class="form-control" id="webhook-url" required v-model="notification.webhookURL">
<input type="url" pattern="https?://.+" class="form-control" id="webhook-url" required v-model="notification.webhookURL">
</div>
<div class="mb-3">
<label for="webhook-content-type" class="form-label">Content Type</label>
<select class="form-select" id="webhook-content-type" v-model="notification.webhookContentType" required>
<select class="form-select" id="webhook-content-type" v-model="notification.webhookContentType" required>
<option value="json">application/json</option>
<option value="form-data">multipart/form-data</option>
</select>
@@ -100,7 +100,7 @@
<div class="mb-3">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="secure" v-model="notification.smtpSecure">
<input class="form-check-input" type="checkbox" value="" id="secure" v-model="notification.smtpSecure">
<label class="form-check-label" for="secure">
Secure
</label>
@@ -141,7 +141,7 @@
<template v-if="notification.type === 'signal'">
<div class="mb-3">
<label for="signal-url" class="form-label">Post URL</label>
<input type="url" pattern="https?://.+" class="form-control" id="signal-url" required v-model="notification.signalURL">
<input type="url" pattern="https?://.+" class="form-control" id="signal-url" required v-model="notification.signalURL">
</div>

View File

@@ -13,7 +13,7 @@
No Monitors, please <router-link to="/add">add one</router-link>.
</div>
<router-link :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }" v-for="item in sortedMonitorList" @click="$root.cancelActiveList">
<router-link :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }" v-for="(item, index) in sortedMonitorList" @click="$root.cancelActiveList" :key="index">
<div class="row">
<div class="col-6 col-md-8 small-padding">

View File

@@ -47,7 +47,7 @@
</tr>
</thead>
<tbody>
<tr v-for="beat in importantHeartBeatList">
<tr v-for="(beat, index) in displayedRecords" :key="index">
<td>{{ beat.name }}</td>
<td><Status :status="beat.status" /></td>
<td><Datetime :value="beat.time" /></td>
@@ -59,6 +59,13 @@
</tr>
</tbody>
</table>
<div class="d-flex justify-content-center kuma_pagination">
<pagination
v-model="page"
:records=importantHeartBeatList.length
:per-page="perPage" />
</div>
</div>
</div>
@@ -68,8 +75,21 @@
<script>
import Status from "../components/Status.vue";
import Datetime from "../components/Datetime.vue";
import Pagination from "v-pagination-3";
export default {
components: {Datetime, Status},
components: {
Datetime,
Status,
Pagination,
},
data() {
return {
page: 1,
perPage: 25,
heartBeatList: [],
}
},
computed: {
stats() {
let result = {
@@ -129,8 +149,16 @@ export default {
}
});
this.heartBeatList = result;
return result;
}
},
displayedRecords() {
const startIndex = this.perPage * (this.page - 1);
const endIndex = startIndex + this.perPage;
return this.heartBeatList.slice(startIndex, endIndex);
},
}
}
</script>

View File

@@ -12,7 +12,7 @@
<div class="functions">
<button class="btn btn-light" @click="pauseDialog" v-if="monitor.active">Pause</button>
<button class="btn btn-primary" @click="resumeMonitor" v-if="! monitor.active">Resume</button>
<button class="btn btn-primary" @click="resumeMonitor" v-if="! monitor.active">Resume</button>
<router-link :to=" '/edit/' + monitor.id " class="btn btn-secondary">Edit</router-link>
<button class="btn btn-danger" @click="deleteDialog">Delete</button>
</div>
@@ -64,7 +64,7 @@
</tr>
</thead>
<tbody>
<tr v-for="beat in importantHeartBeatList">
<tr v-for="(beat, index) in displayedRecords" :key="index">
<td><Status :status="beat.status" /></td>
<td><Datetime :value="beat.time" /></td>
<td>{{ beat.msg }}</td>
@@ -75,6 +75,13 @@
</tr>
</tbody>
</table>
<div class="d-flex justify-content-center kuma_pagination">
<pagination
v-model="page"
:records=importantHeartBeatList.length
:per-page="perPage" />
</div>
</div>
<Confirm ref="confirmPause" @yes="pauseMonitor">
@@ -95,6 +102,7 @@ import Status from "../components/Status.vue";
import Datetime from "../components/Datetime.vue";
import CountUp from "../components/CountUp.vue";
import Uptime from "../components/Uptime.vue";
import Pagination from "v-pagination-3";
export default {
components: {
@@ -104,13 +112,16 @@ export default {
HeartbeatBar,
Confirm,
Status,
Pagination,
},
mounted() {
},
data() {
return {
page: 1,
perPage: 25,
heartBeatList: [],
}
},
computed: {
@@ -154,6 +165,7 @@ export default {
importantHeartBeatList() {
if (this.$root.importantHeartbeatList[this.monitor.id]) {
this.heartBeatList = this.$root.importantHeartbeatList[this.monitor.id];
return this.$root.importantHeartbeatList[this.monitor.id]
} else {
return [];
@@ -166,8 +178,13 @@ export default {
} else {
return { }
}
}
},
displayedRecords() {
const startIndex = this.perPage * (this.page - 1);
const endIndex = startIndex + this.perPage;
return this.heartBeatList.slice(startIndex, endIndex);
},
},
methods: {
testNotification() {

View File

@@ -124,7 +124,7 @@ export default {
name: "",
url: "https://",
interval: 60,
maxretries: 0,
maxretries: 0,
notificationIDList: {},
}
} else if (this.isEdit) {

View File

@@ -11,7 +11,7 @@
<label for="timezone" class="form-label">Timezone</label>
<select class="form-select" id="timezone" v-model="$root.userTimezone">
<option value="auto">Auto: {{ guessTimezone }}</option>
<option v-for="timezone in timezoneList" :value="timezone.value">{{ timezone.name }}</option>
<option v-for="(timezone, index) in timezoneList" :value="timezone.value" :key="index">{{ timezone.name }}</option>
</select>
</div>
@@ -59,7 +59,7 @@
<p v-else>Please assign the notification to monitor(s) to get it works.</p>
<ul class="list-group mb-3" style="border-radius: 1rem;">
<li class="list-group-item" v-for="notification in $root.notificationList">
<li class="list-group-item" v-for="(notification, index) in $root.notificationList" :key="index">
{{ notification.name }}<br />
<a href="#" @click="$refs.notificationDialog.show(notification.id)">Edit</a>
</li>
@@ -77,8 +77,8 @@
<script>
import dayjs from "dayjs";
import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone'
import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone'
import NotificationDialog from "../components/NotificationDialog.vue";
dayjs.extend(utc)
dayjs.extend(timezone)

View File

@@ -1,6 +1,6 @@
import dayjs from "dayjs";
import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone'
import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone'
dayjs.extend(utc)
dayjs.extend(timezone)
@@ -29,6 +29,7 @@ function getTimezoneOffset(timeZone) {
}
// From: https://stackoverflow.com/questions/38399465/how-to-get-list-of-all-timezones-in-javascript
// TODO: Move to separate file
const aryIannaTimeZones = [
'Europe/Andorra',
'Asia/Dubai',
@@ -412,4 +413,3 @@ export function timezoneList() {
return result;
};