mirror of
https://github.com/louislam/uptime-kuma.git
synced 2025-08-21 22:18:16 +08:00
Merge branch 'master' into group-monitors
This commit is contained in:
Peace
GitHub
@@ -3,7 +3,7 @@
|
||||
<div>
|
||||
<h1 class="mb-3">{{ pageName }}</h1>
|
||||
<form @submit.prevent="submit">
|
||||
<div class="shadow-box">
|
||||
<div class="shadow-box shadow-box-with-fixed-bottom-bar">
|
||||
<div class="row">
|
||||
<div class="col-xl-10">
|
||||
<!-- Title -->
|
||||
@@ -85,35 +85,39 @@
|
||||
|
||||
<h2 class="mt-5">{{ $t("Date and Time") }}</h2>
|
||||
|
||||
<div>⚠️ {{ $t("warningTimezone") }}: <mark>{{ $root.info.serverTimezone }} ({{ $root.info.serverTimezoneOffset }})</mark></div>
|
||||
|
||||
<!-- Strategy -->
|
||||
<div class="my-3">
|
||||
<label for="strategy" class="form-label">{{ $t("Strategy") }}</label>
|
||||
<select id="strategy" v-model="maintenance.strategy" class="form-select">
|
||||
<option value="manual">{{ $t("strategyManual") }}</option>
|
||||
<option value="single">{{ $t("Single Maintenance Window") }}</option>
|
||||
<option value="cron">{{ $t("cronExpression") }}</option>
|
||||
<option value="recurring-interval">{{ $t("Recurring") }} - {{ $t("recurringInterval") }}</option>
|
||||
<option value="recurring-weekday">{{ $t("Recurring") }} - {{ $t("dayOfWeek") }}</option>
|
||||
<option value="recurring-day-of-month">{{ $t("Recurring") }} - {{ $t("dayOfMonth") }}</option>
|
||||
<option v-if="false" value="recurring-day-of-year">{{ $t("Recurring") }} - Day of Year</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Single Maintenance Window -->
|
||||
<template v-if="maintenance.strategy === 'single'">
|
||||
<!-- DateTime Range -->
|
||||
</template>
|
||||
|
||||
<template v-if="maintenance.strategy === 'cron'">
|
||||
<!-- Cron -->
|
||||
<div class="my-3">
|
||||
<label class="form-label">{{ $t("DateTime Range") }}</label>
|
||||
<Datepicker
|
||||
v-model="maintenance.dateRange"
|
||||
:dark="$root.isDark"
|
||||
range
|
||||
:monthChangeOnScroll="false"
|
||||
:minDate="minDate"
|
||||
format="yyyy-MM-dd HH:mm"
|
||||
modelType="yyyy-MM-dd HH:mm:ss"
|
||||
/>
|
||||
<label for="cron" class="form-label">
|
||||
{{ $t("cronExpression") }}
|
||||
</label>
|
||||
<p>{{ $t("cronSchedule") }}{{ cronDescription }}</p>
|
||||
<input id="cron" v-model="maintenance.cron" type="text" class="form-control" required>
|
||||
</div>
|
||||
|
||||
<div class="my-3">
|
||||
<!-- Duration -->
|
||||
<label for="duration" class="form-label">
|
||||
{{ $t("Duration (Minutes)") }}
|
||||
</label>
|
||||
<input id="duration" v-model="maintenance.durationMinutes" type="number" class="form-control" required min="1" step="1">
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -180,7 +184,6 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- For any recurring types -->
|
||||
<template v-if="maintenance.strategy === 'recurring-interval' || maintenance.strategy === 'recurring-weekday' || maintenance.strategy === 'recurring-day-of-month'">
|
||||
<!-- Maintenance Time Window of a Day -->
|
||||
<div class="my-3">
|
||||
@@ -192,33 +195,50 @@
|
||||
disableTimeRangeValidation range
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="maintenance.strategy === 'recurring-interval' || maintenance.strategy === 'recurring-weekday' || maintenance.strategy === 'recurring-day-of-month' || maintenance.strategy === 'cron' || maintenance.strategy === 'single'">
|
||||
<!-- Timezone -->
|
||||
<div class="mb-4">
|
||||
<label for="timezone" class="form-label">
|
||||
{{ $t("Timezone") }}
|
||||
</label>
|
||||
<select id="timezone" v-model="maintenance.timezoneOption" class="form-select">
|
||||
<option value="SAME_AS_SERVER">{{ $t("sameAsServerTimezone") }}</option>
|
||||
<option value="UTC">UTC</option>
|
||||
<option
|
||||
v-for="(timezone, index) in timezoneList"
|
||||
:key="index"
|
||||
:value="timezone.value"
|
||||
>
|
||||
{{ timezone.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Date Range -->
|
||||
<div class="my-3">
|
||||
<label class="form-label">{{ $t("Effective Date Range") }}</label>
|
||||
<Datepicker
|
||||
v-model="maintenance.dateRange"
|
||||
:dark="$root.isDark"
|
||||
range datePicker
|
||||
:monthChangeOnScroll="false"
|
||||
:minDate="minDate"
|
||||
format="yyyy-MM-dd HH:mm:ss"
|
||||
modelType="yyyy-MM-dd HH:mm:ss"
|
||||
required
|
||||
/>
|
||||
<label v-if="maintenance.strategy !== 'single'" class="form-label">{{ $t("Effective Date Range") }}</label>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="mb-2">{{ $t("startDateTime") }}</div>
|
||||
<input v-model="maintenance.dateRange[0]" type="datetime-local" class="form-control" :required="maintenance.strategy === 'single'">
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="mb-2">{{ $t("endDateTime") }}</div>
|
||||
<input v-model="maintenance.dateRange[1]" type="datetime-local" class="form-control" :required="maintenance.strategy === 'single'">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="mt-4 mb-1">
|
||||
<button
|
||||
id="monitor-submit-btn" class="btn btn-primary" type="submit"
|
||||
:disabled="processing"
|
||||
>
|
||||
{{ $t("Save") }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fixed-bottom-bar p-3">
|
||||
<button id="monitor-submit-btn" class="btn btn-primary" type="submit" :disabled="processing">{{ $t("Save") }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@@ -226,11 +246,11 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { useToast } from "vue-toastification";
|
||||
import VueMultiselect from "vue-multiselect";
|
||||
import dayjs from "dayjs";
|
||||
import Datepicker from "@vuepic/vue-datepicker";
|
||||
import { timezoneList } from "../util-frontend";
|
||||
import cronstrue from "cronstrue/i18n";
|
||||
|
||||
const toast = useToast();
|
||||
|
||||
@@ -242,6 +262,7 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
timezoneList: timezoneList(),
|
||||
processing: false,
|
||||
maintenance: {},
|
||||
affectedMonitors: [],
|
||||
@@ -250,24 +271,11 @@ export default {
|
||||
selectedStatusPages: [],
|
||||
dark: (this.$root.theme === "dark"),
|
||||
neverEnd: false,
|
||||
minDate: this.$root.date(dayjs()) + " 00:00",
|
||||
lastDays: [
|
||||
{
|
||||
langKey: "lastDay1",
|
||||
value: "lastDay1",
|
||||
},
|
||||
{
|
||||
langKey: "lastDay2",
|
||||
value: "lastDay2",
|
||||
},
|
||||
{
|
||||
langKey: "lastDay3",
|
||||
value: "lastDay3",
|
||||
},
|
||||
{
|
||||
langKey: "lastDay4",
|
||||
value: "lastDay4",
|
||||
}
|
||||
],
|
||||
weekdays: [
|
||||
{
|
||||
@@ -311,6 +319,34 @@ export default {
|
||||
|
||||
computed: {
|
||||
|
||||
cronDescription() {
|
||||
if (! this.maintenance.cron) {
|
||||
return "";
|
||||
}
|
||||
|
||||
let locale = "";
|
||||
|
||||
if (this.$root.language) {
|
||||
locale = this.$root.language.replace("-", "_");
|
||||
}
|
||||
|
||||
// Special handling
|
||||
// If locale is also not working in your language, you can map it here
|
||||
// https://github.com/bradymholt/cRonstrue/tree/master/src/i18n/locales
|
||||
if (locale === "zh_HK") {
|
||||
locale = "zh_TW";
|
||||
}
|
||||
|
||||
try {
|
||||
return cronstrue.toString(this.maintenance.cron, {
|
||||
locale,
|
||||
});
|
||||
} catch (e) {
|
||||
return this.$t("invalidCronExpression", e.message);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
selectedStatusPagesOptions() {
|
||||
return Object.values(this.$root.statusPageList).map(statusPage => {
|
||||
return {
|
||||
@@ -392,8 +428,10 @@ export default {
|
||||
description: "",
|
||||
strategy: "single",
|
||||
active: 1,
|
||||
cron: "30 3 * * *",
|
||||
durationMinutes: 60,
|
||||
intervalDay: 1,
|
||||
dateRange: [ this.minDate ],
|
||||
dateRange: [],
|
||||
timeRange: [{
|
||||
hours: 2,
|
||||
minutes: 0,
|
||||
@@ -403,6 +441,7 @@ export default {
|
||||
}],
|
||||
weekdays: [],
|
||||
daysOfMonth: [],
|
||||
timezoneOption: null,
|
||||
};
|
||||
} else if (this.isEdit) {
|
||||
this.$root.getSocket().emit("getMaintenance", this.$route.params.id, (res) => {
|
||||
@@ -523,10 +562,6 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.shadow-box {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
min-height: 150px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user