WIP

src/languages/en.js

@@ -630,4 +630,5 @@ export default {
     lastDay2: "2nd Last Day of Month",
     lastDay3: "3rd Last Day of Month",
     lastDay4: "4th Last Day of Month",
+    "No Maintenance": "No Maintenance",
 };

src/pages/EditMaintenance.vue

@@ -200,7 +200,8 @@
                                         :monthChangeOnScroll="false"
                                         :minDate="minDate"
                                         :enableTimePicker="false"
-                                        :utc="true"
+                                        format="yyyy-MM-dd"
+                                        modelType="yyyy-MM-dd HH:mm:ss"
                                     />
                                 </div>
                             </template>
@@ -356,9 +357,6 @@ export default {
     },
     methods: {
         init() {
-            // Use browser's timezone!
-            let timezone = dayjs.tz.guess();
-
             this.affectedMonitors = [];
             this.selectedStatusPages = [];
 
@@ -381,7 +379,7 @@ export default {
                     daysOfMonth: [],
                 };
             } else if (this.isEdit) {
-                this.$root.getSocket().emit("getMaintenance", this.$route.params.id, timezone, (res) => {
+                this.$root.getSocket().emit("getMaintenance", this.$route.params.id, (res) => {
                     if (res.ok) {
                         this.maintenance = res.maintenance;
 
@@ -440,11 +438,8 @@ export default {
             this.maintenance.end_date = this.$root.toUTC(this.maintenance.end_date);
             */
 
-            // Use browser's timezone!
-            let timezone = dayjs.tz.guess();
-
             if (this.isAdd) {
-                this.$root.addMaintenance(this.maintenance, timezone, async (res) => {
+                this.$root.addMaintenance(this.maintenance, async (res) => {
                     if (res.ok) {
                         await this.addMonitorMaintenance(res.maintenanceID, async () => {
                             await this.addMaintenanceStatusPage(res.maintenanceID, () => {
@@ -461,7 +456,7 @@ export default {
 
                 });
             } else {
-                this.$root.getSocket().emit("editMaintenance", this.maintenance, timezone, async (res) => {
+                this.$root.getSocket().emit("editMaintenance", this.maintenance, async (res) => {
                     if (res.ok) {
                         await this.addMonitorMaintenance(res.maintenanceID, async () => {
                             await this.addMaintenanceStatusPage(res.maintenanceID, () => {

src/pages/ManageMaintenance.vue

@@ -13,7 +13,7 @@
 
             <div class="shadow-box">
                 <span v-if="Object.keys(sortedMaintenanceList).length === 0" class="d-flex align-items-center justify-content-center my-3">
-                    {{ $t("No maintenance") }}
+                    {{ $t("No Maintenance") }}
                 </span>
 
                 <div
@@ -34,9 +34,19 @@
 
                     <div class="buttons">
                         <router-link v-if="false" :to="maintenanceURL(item.id)" class="btn btn-light">{{ $t("Details") }}</router-link>
+
+                        <button v-if="item.active" class="btn btn-light" @click="pauseDialog">
+                            <font-awesome-icon icon="pause" /> {{ $t("Pause") }}
+                        </button>
+
+                        <button v-if="!item.active" class="btn btn-primary" @click="resumeMaintenance">
+                            <font-awesome-icon icon="play" /> {{ $t("Resume") }}
+                        </button>
+
                         <router-link :to="'/maintenance/edit/' + item.id" class="btn btn-secondary">
                             <font-awesome-icon icon="edit" /> {{ $t("Edit") }}
                         </router-link>
+
                         <button class="btn btn-danger" @click="deleteDialog(item.id)">
                             <font-awesome-icon icon="trash" /> {{ $t("Delete") }}
                         </button>
@@ -48,6 +58,10 @@
                 <a href="https://github.com/louislam/uptime-kuma/wiki/Maintenance" target="_blank">Learn More</a>
             </div>
 
+            <Confirm ref="confirmPause" :yes-text="$t('Yes')" :no-text="$t('No')" @yes="pauseMaintenance">
+                {{ $t("pauseMaintenanceMsg") }}
+            </Confirm>
+
             <Confirm ref="confirmDelete" btn-style="btn-danger" :yes-text="$t('Yes')" :no-text="$t('No')" @yes="deleteMaintenance">
                 {{ $t("deleteMaintenanceMsg") }}
             </Confirm>
@@ -148,6 +162,33 @@ export default {
                 }
             });
         },
+
+        /**
+         * Show dialog to confirm pause
+         */
+        pauseDialog() {
+            this.$refs.confirmPause.show();
+        },
+
+        /**
+         * Pause maintenance
+         */
+        pauseMonitor() {
+            return;
+            this.$root.getSocket().emit("pauseMaintenance", selectedMaintenanceID, (res) => {
+                this.$root.toastRes(res);
+            });
+        },
+
+        /**
+         * Resume maintenance
+         */
+        resumeMaintenance() {
+            return;
+            this.$root.getSocket().emit("resumeMaintenance", selectedMaintenanceID, (res) => {
+                this.$root.toastRes(res);
+            });
+        },
     },
 };
 </script>