7x31/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2025-08-21 16:15:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into introduce-resend-interval

Browse Source
This commit is contained in:
OidaTiftla
2022-06-15 16:19:47 +02:00
committed by GitHub
parent 93050208bb a3b94aa532
commit 869a040011
119 changed files with 7405 additions and 1005 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/pages/AddStatusPage.vue
View File

@@ -51,6 +51,7 @@ export default {
};
},
methods: {
/** Submit form data to add new status page */
async submit() {
this.processing = true;

17
src/pages/Details.vue
View File

@@ -77,7 +77,7 @@
<h4>{{ $t("Cert Exp.") }}</h4>
<p>(<Datetime :value="tlsInfo.certInfo.validTo" date-only />)</p>
<span class="num">
<a href="#" @click.prevent="toggleCertInfoBox = !toggleCertInfoBox">{{ tlsInfo.certInfo.daysRemaining }} {{ $t("days") }}</a>
<a href="#" @click.prevent="toggleCertInfoBox = !toggleCertInfoBox">{{ tlsInfo.certInfo.daysRemaining }} {{ $tc("day", tlsInfo.certInfo.daysRemaining) }}</a>
</span>
</div>
</div>
@@ -289,39 +289,47 @@ export default {
},
methods: {
/** Request a test notification be sent for this monitor */
testNotification() {
this.$root.getSocket().emit("testNotification", this.monitor.id);
toast.success("Test notification is requested.");
},
/** Show dialog to confirm pause */
pauseDialog() {
this.$refs.confirmPause.show();
},
/** Resume this monitor */
resumeMonitor() {
this.$root.getSocket().emit("resumeMonitor", this.monitor.id, (res) => {
this.$root.toastRes(res);
});
},
/** Request that this monitor is paused */
pauseMonitor() {
this.$root.getSocket().emit("pauseMonitor", this.monitor.id, (res) => {
this.$root.toastRes(res);
});
},
/** Show dialog to confirm deletion */
deleteDialog() {
this.$refs.confirmDelete.show();
},
/** Show dialog to confirm clearing events */
clearEventsDialog() {
this.$refs.confirmClearEvents.show();
},
/** Show dialog to confirm clearing heartbeats */
clearHeartbeatsDialog() {
this.$refs.confirmClearHeartbeats.show();
},
/** Request that this monitor is deleted */
deleteMonitor() {
this.$root.deleteMonitor(this.monitor.id, (res) => {
if (res.ok) {
@@ -333,6 +341,7 @@ export default {
});
},
/** Request that this monitors events are cleared */
clearEvents() {
this.$root.clearEvents(this.monitor.id, (res) => {
if (! res.ok) {
@@ -341,6 +350,7 @@ export default {
});
},
/** Request that this monitors heartbeats are cleared */
clearHeartbeats() {
this.$root.clearHeartbeats(this.monitor.id, (res) => {
if (! res.ok) {
@@ -349,6 +359,11 @@ export default {
});
},
/**
* Return the correct title for the ping stat
* @param {boolean} [average=false] Is the statistic an average?
* @returns {string} Title formated dependant on monitor type
*/
pingTitle(average = false) {
let translationPrefix = "";
if (average) {

158
src/pages/EditMonitor.vue
View File

@@ -11,30 +11,41 @@
<div class="my-3">
<label for="type" class="form-label">{{ $t("Monitor Type") }}</label>
<select id="type" v-model="monitor.type" class="form-select">
<option value="http">
HTTP(s)
</option>
<option value="port">
TCP Port
</option>
<option value="ping">
Ping
</option>
<option value="keyword">
HTTP(s) - {{ $t("Keyword") }}
</option>
<option value="dns">
DNS
</option>
<option value="push">
Push
</option>
<option value="steam">
Steam Game Server
</option>
<option value="mqtt">
MQTT
</option>
<optgroup label="General Monitor Type">
<option value="http">
HTTP(s)
</option>
<option value="port">
TCP Port
</option>
<option value="ping">
Ping
</option>
<option value="keyword">
HTTP(s) - {{ $t("Keyword") }}
</option>
<option value="dns">
DNS
</option>
</optgroup>
<optgroup label="Passive Monitor Type">
<option value="push">
Push
</option>
</optgroup>
<optgroup label="Specific Monitor Type">
<option value="steam">
{{ $t("Steam Game Server") }}
</option>
<option value="mqtt">
MQTT
</option>
<option value="sqlserver">
SQL Server
</option>
</optgroup>
</select>
</div>
@@ -94,6 +105,15 @@
</div>
</div>
<!-- Port -->
<div class="my-3">
<label for="port" class="form-label">{{ $t("Port") }}</label>
<input id="port" v-model="monitor.port" type="number" class="form-control" required min="0" max="65535" step="1">
<div class="form-text">
{{ $t("dnsPortDescription") }}
</div>
</div>
<div class="my-3">
<label for="dns_resolve_type" class="form-label">{{ $t("Resource Record Type") }}</label>
@@ -148,6 +168,18 @@
</div>
</template>
<!-- SQL Server -->
<template v-if="monitor.type === 'sqlserver'">
<div class="my-3">
<label for="sqlserverConnectionString" class="form-label">SQL Server {{ $t("Connection String") }}</label>
<input id="sqlserverConnectionString" v-model="monitor.databaseConnectionString" type="text" class="form-control">
</div>
<div class="my-3">
<label for="sqlserverQuery" class="form-label">SQL Server {{ $t("Query") }}</label>
<textarea id="sqlserverQuery" v-model="monitor.databaseQuery" class="form-control" placeholder="Example: select getdate()"></textarea>
</div>
</template>
<!-- Interval -->
<div class="my-3">
<label for="interval" class="form-label">{{ $t("Heartbeat Interval") }} ({{ $t("checkEverySecond", [ monitor.interval ]) }})</label>
@@ -345,18 +377,46 @@
<textarea id="headers" v-model="monitor.headers" class="form-control" :placeholder="headersPlaceholder"></textarea>
</div>
<!-- HTTP Basic Auth -->
<h4 class="mt-5 mb-2">{{ $t("HTTP Basic Auth") }}</h4>
<!-- HTTP Auth -->
<h4 class="mt-5 mb-2">{{ $t("HTTP Authentication") }}</h4>
<!-- Method -->
<div class="my-3">
<label for="basicauth" class="form-label">{{ $t("Username") }}</label>
<input id="basicauth-user" v-model="monitor.basic_auth_user" type="text" class="form-control" :placeholder="$t('Username')">
<label for="method" class="form-label">{{ $t("Method") }}</label>
<select id="method" v-model="monitor.authMethod" class="form-select">
<option :value="null">
None
</option>
<option value="basic">
Basic
</option>
<option value="ntlm">
NTLM
</option>
</select>
</div>
<template v-if="monitor.authMethod && monitor.authMethod !== null ">
<div class="my-3">
<label for="basicauth" class="form-label">{{ $t("Username") }}</label>
<input id="basicauth-user" v-model="monitor.basic_auth_user" type="text" class="form-control" :placeholder="$t('Username')">
</div>
<div class="my-3">
<label for="basicauth" class="form-label">{{ $t("Password") }}</label>
<input id="basicauth-pass" v-model="monitor.basic_auth_pass" type="password" autocomplete="new-password" class="form-control" :placeholder="$t('Password')">
</div>
<div class="my-3">
<label for="basicauth" class="form-label">{{ $t("Password") }}</label>
<input id="basicauth-pass" v-model="monitor.basic_auth_pass" type="password" autocomplete="new-password" class="form-control" :placeholder="$t('Password')">
</div>
<template v-if="monitor.authMethod === 'ntlm' ">
<div class="my-3">
<label for="basicauth" class="form-label">{{ $t("Domain") }}</label>
<input id="basicauth-domain" v-model="monitor.authDomain" type="text" class="form-control" :placeholder="$t('Domain')">
</div>
<div class="my-3">
<label for="basicauth" class="form-label">{{ $t("Workstation") }}</label>
<input id="basicauth-workstation" v-model="monitor.authWorkstation" type="text" class="form-control" :placeholder="$t('Workstation')">
</div>
</template>
</template>
</template>
</div>
</div>
@@ -478,6 +538,15 @@ export default {
this.monitor.pushToken = genSecret(10);
}
}
// Set default port for DNS if not already defined
if (! this.monitor.port || this.monitor.port === "53") {
if (this.monitor.type === "dns") {
this.monitor.port = "53";
} else {
this.monitor.port = "";
}
}
}
},
@@ -513,6 +582,7 @@ export default {
this.dnsresolvetypeOptions = dnsresolvetypeOptions;
},
methods: {
/** Initialize the edit monitor form */
init() {
if (this.isAdd) {
@@ -524,6 +594,7 @@ export default {
interval: 60,
retryInterval: this.interval,
resendInterval: 0,
databaseConnectionString: "Server=<hostname>,<port>;Database=<your database>;User Id=<your user id>;Password=<your password>;Encrypt=<true/false>;TrustServerCertificate=<Yes/No>;Connection Timeout=<int>",
maxretries: 0,
notificationIDList: {},
ignoreTls: false,
@@ -538,6 +609,7 @@ export default {
mqttPassword: "",
mqttTopic: "",
mqttSuccessMessage: "",
authMethod: null,
};
if (this.$root.proxyList && !this.monitor.proxyId) {
@@ -570,6 +642,10 @@ export default {
},
/**
* Validate form input
* @returns {boolean} Is the form input valid?
*/
isInputValid() {
if (this.monitor.body) {
try {
@@ -590,6 +666,10 @@ export default {
return true;
},
/**
* Submit the form data for processing
* @returns {void}
*/
async submit() {
this.processing = true;
@@ -634,14 +714,20 @@ export default {
}
},
// Added a Notification Event
// Enable it if the notification is added in EditMonitor.vue
/**
* Added a Notification Event
* Enable it if the notification is added in EditMonitor.vue
* @param {number} id ID of notification to add
*/
addedNotification(id) {
this.monitor.notificationIDList[id] = true;
},
// Added a Proxy Event
// Enable it if the proxy is added in EditMonitor.vue
/**
* Added a Proxy Event
* Enable it if the proxy is added in EditMonitor.vue
* @param {number} id ID of proxy to add
*/
addedProxy(id) {
this.monitor.proxyId = id;
},

10
src/pages/List.vue
View File

@@ -1,6 +1,6 @@
<template>
<transition name="slide-fade" appear>
<MonitorList />
<MonitorList :scrollbar="true" />
</transition>
</template>
@@ -14,3 +14,11 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../assets/vars";
.shadow-box {
padding: 20px;
}
</style>

5
src/pages/ManageStatusPage.vue
View File

@@ -51,6 +51,11 @@ export default {
},
methods: {
/**
* Get the correct URL for the icon
* @param {string} icon Path for icon
* @returns {string} Correctly formatted path including port numbers
*/
icon(icon) {
if (icon === "/icon.svg") {
return icon;

14
src/pages/NotFound.vue
View File

@@ -22,16 +22,17 @@
</div>
<div class="guide">
Most likely causes:
{{ $t("Most likely causes:") }}
<ul>
<li>The resource is no longer available.</li>
<li>There might be a typing error in the address.</li>
<li>{{ $t("The resource is no longer available.") }}</li>
<li>{{ $t("There might be a typing error in the address.") }}</li>
</ul>
What you can try:<br />
{{ $t("What you can try:") }}<br />
<ul>
<li>Retype the address.</li>
<li><a href="#" class="go-back" @click="goBack()">Go back to the previous page.</a></li>
<li>{{ $t("Retype the address.") }}</li>
<li><a href="#" class="go-back" @click="goBack()">{{ $t("Go back to the previous page.") }}</a></li>
<li><a href="/" class="go-back">Go back to home page.</a></li>
</ul>
</div>
</div>
@@ -44,6 +45,7 @@ export default {
},
methods: {
/** Go back 1 in browser history */
goBack() {
history.back();
}

19
src/pages/Settings.vue
View File

@@ -118,13 +118,17 @@ export default {
methods: {
// For desktop only, mobile do nothing
/**
* Load the general settings page
* For desktop only, on mobile do nothing
*/
loadGeneralPage() {
if (!this.currentPage && !this.$root.isMobile) {
this.$router.push("/settings/general");
}
},
/** Load settings from server */
loadSettings() {
this.$root.getSocket().emit("getSettings", (res) => {
this.settings = res.data;
@@ -145,13 +149,24 @@ export default {
this.settings.keepDataPeriodDays = 180;
}
if (this.settings.tlsExpiryNotifyDays === undefined) {
this.settings.tlsExpiryNotifyDays = [ 7, 14, 21 ];
}
this.settingsLoaded = true;
});
},
/**
* Callback for saving settings
* @callback saveSettingsCB
* @param {Object} res Result of operation
*/
/**
* Save Settings
* @param currentPassword (Optional) Only need for disableAuth to true
* @param {saveSettingsCB} [callback]
* @param {string} [currentPassword] Only need for disableAuth to true
*/
saveSettings(callback, currentPassword) {
this.$root.getSocket().emit("setSettings", this.settings, currentPassword, (res) => {

4
src/pages/Setup.vue
View File

@@ -71,6 +71,10 @@ export default {
});
},
methods: {
/**
* Submit form data for processing
* @returns {void}
*/
submit() {
this.processing = true;

111
src/pages/StatusPage.vue
View File

@@ -45,7 +45,7 @@
</div>
<div v-if="false" class="my-3">
<label for="password" class="form-label">{{ $t("Password") }} <sup>Coming Soon</sup></label>
<label for="password" class="form-label">{{ $t("Password") }} <sup>{{ $t("Coming Soon") }}</sup></label>
<input id="password" v-model="config.password" disabled type="password" autocomplete="new-password" class="form-control">
</div>
@@ -98,21 +98,22 @@
<h1 class="mb-4 title-flex">
<!-- Logo -->
<span class="logo-wrapper" @click="showImageCropUploadMethod">
<img :src="logoURL" alt class="logo me-2" :class="logoClass" @load="statusPageLogoLoaded" />
<img :src="logoURL" alt class="logo me-2" :class="logoClass" />
<font-awesome-icon v-if="enableEditMode" class="icon-upload" icon="upload" />
</span>
<!-- Uploader -->
<!-- url="/api/status-page/upload-logo" -->
<ImageCropUpload v-model="showImageCropUpload"
field="img"
:width="128"
:height="128"
:langType="$i18n.locale"
img-format="png"
:noCircle="true"
:noSquare="false"
@crop-success="cropSuccess"
<ImageCropUpload
v-model="showImageCropUpload"
field="img"
:width="128"
:height="128"
:langType="$i18n.locale"
img-format="png"
:noCircle="true"
:noSquare="false"
@crop-success="cropSuccess"
/>
<!-- Title -->
@@ -281,22 +282,21 @@
<script>
import axios from "axios";
import PublicGroupList from "../components/PublicGroupList.vue";
import ImageCropUpload from "vue-image-crop-upload";
import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_PARTIAL_DOWN, UP } from "../util.ts";
import { useToast } from "vue-toastification";
import dayjs from "dayjs";
import Favico from "favico.js";
import { getResBaseURL } from "../util-frontend";
import Confirm from "../components/Confirm.vue";
// import Prism Editor
import { PrismEditor } from "vue-prism-editor";
import "vue-prism-editor/dist/prismeditor.min.css"; // import the styles somewhere
// import highlighting library (you can use any library you want just return html string)
import { highlight, languages } from "prismjs/components/prism-core";
import "prismjs/components/prism-css";
import "prismjs/themes/prism-tomorrow.css"; // import syntax highlighting styles
import ImageCropUpload from "vue-image-crop-upload";
// import Prism Editor
import { PrismEditor } from "vue-prism-editor";
import "vue-prism-editor/dist/prismeditor.min.css"; // import the styles somewhere
import { useToast } from "vue-toastification";
import Confirm from "../components/Confirm.vue";
import PublicGroupList from "../components/PublicGroupList.vue";
import { getResBaseURL } from "../util-frontend";
import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_PARTIAL_DOWN, UP } from "../util.ts";
const toast = useToast();
@@ -332,6 +332,7 @@ export default {
},
props: {
/** Override for the status page slug */
overrideSlug: {
type: String,
required: false,
@@ -538,7 +539,7 @@ export default {
this.slug = "default";
}
axios.get("/api/status-page/" + this.slug).then((res) => {
this.getData().then((res) => {
this.config = res.data.config;
if (!this.config.domainNameList) {
@@ -551,6 +552,11 @@ export default {
this.incident = res.data.incident;
this.$root.publicGroupList = res.data.publicGroupList;
}).catch( function (error) {
if (error.response.status === 404) {
location.href = "/page-not-found";
}
console.log(error);
});
// 5mins a loop
@@ -567,10 +573,31 @@ export default {
},
methods: {
/**
* Get status page data
* It should be preloaded in window.preloadData
* @returns {Promise<any>}
*/
getData: function () {
if (window.preloadData) {
return new Promise(resolve => resolve({
data: window.preloadData
}));
} else {
return axios.get("/api/status-page/" + this.slug);
}
},
/**
* Provide syntax highlighting for CSS
* @param {string} code Text to highlight
* @returns {string}
*/
highlighter(code) {
return highlight(code, languages.css);
},
/** Update the heartbeat list and update favicon if neccessary */
updateHeartbeatList() {
// If editMode, it will use the data from websocket.
if (! this.editMode) {
@@ -599,14 +626,19 @@ export default {
}
},
/** Enable editing mode */
edit() {
if (this.hasToken) {
this.$root.initSocketIO(true);
this.enableEditMode = true;
this.clickedEditButton = true;
// Try to fix #1658
this.loadedData = true;
}
},
/** Save the status page */
save() {
let startTime = new Date();
this.config.slug = this.config.slug.trim().toLowerCase();
@@ -634,10 +666,12 @@ export default {
});
},
/** Show dialog confirming deletion */
deleteDialog() {
this.$refs.confirmDelete.show();
},
/** Request deletion of this status page */
deleteStatusPage() {
this.$root.getSocket().emit("deleteStatusPage", this.slug, (res) => {
if (res.ok) {
@@ -649,10 +683,16 @@ export default {
});
},
/**
* Returns label for a specifed monitor
* @param {Object} monitor Object representing monitor
* @returns {string}
*/
monitorSelectorLabel(monitor) {
return `${monitor.name}`;
},
/** Add a group to the status page */
addGroup() {
let groupName = this.$t("Untitled Group");
@@ -666,32 +706,32 @@ export default {
});
},
/** Add a domain to the status page */
addDomainField() {
this.config.domainNameList.push("");
},
/** Discard changes to status page */
discard() {
location.href = "/status/" + this.slug;
},
/**
* Crop Success
* Set URL of new image after successful crop operation
* @param {string} imgDataUrl URL of image in data:// format
*/
cropSuccess(imgDataUrl) {
this.imgDataUrl = imgDataUrl;
},
/** Show image crop dialog if in edit mode */
showImageCropUploadMethod() {
if (this.editMode) {
this.showImageCropUpload = true;
}
},
statusPageLogoLoaded(eventPayload) {
// Remark: may not work in dev, due to cros
favicon.image(eventPayload.target);
},
/** Create an incident for this status page */
createIncident() {
this.enableEditIncidentMode = true;
@@ -706,6 +746,7 @@ export default {
};
},
/** Post the incident to the status page */
postIncident() {
if (this.incident.title === "" || this.incident.content === "") {
toast.error(this.$t("Please input title and content"));
@@ -725,14 +766,13 @@ export default {
},
/**
* Click Edit Button
*/
/** Click Edit Button */
editIncident() {
this.enableEditIncidentMode = true;
this.previousIncident = Object.assign({}, this.incident);
},
/** Cancel creation or editing of incident */
cancelIncident() {
this.enableEditIncidentMode = false;
@@ -742,16 +782,25 @@ export default {
}
},
/** Unpin the incident */
unpinIncident() {
this.$root.getSocket().emit("unpinIncident", this.slug, () => {
this.incident = null;
});
},
/**
* Get the relative time difference of a date from now
* @returns {string}
*/
dateFromNow(date) {
return dayjs.utc(date).fromNow();
},
/**
* Remove a domain from the status page
* @param {number} index Index of domain to remove
*/
removeDomain(index) {
this.config.domainNameList.splice(index, 1);
},