Feature: Clone existing monitor

Closes #565
Closes #2319

Adds the feature of cloning existing monitor, I have briefly tested it with ping and https and ensured that all properties was cloned including notifications.

src/languages/en.js

@@ -57,6 +57,7 @@ export default {
     List: "List",
     Add: "Add",
     "Add New Monitor": "Add New Monitor",
+    "Clone Monitor": "Clone Monitor",
     "Quick Stats": "Quick Stats",
     Up: "Up",
     Down: "Down",
@@ -70,6 +71,7 @@ export default {
     "No important events": "No important events",
     Resume: "Resume",
     Edit: "Edit",
+    Clone: "Clone",
     Delete: "Delete",
     Current: "Current",
     Uptime: "Uptime",

src/pages/Details.vue

@@ -30,6 +30,9 @@
                     <router-link :to=" '/edit/' + monitor.id " class="btn btn-normal">
                         <font-awesome-icon icon="edit" /> {{ $t("Edit") }}
                     </router-link>
+                    <router-link :to=" '/clone/' + monitor.id " class="btn btn-normal">
+                        <font-awesome-icon icon="plus" /> {{ $t("Clone") }}
+                    </router-link>
                     <button class="btn btn-danger" @click="deleteDialog">
                         <font-awesome-icon icon="trash" /> {{ $t("Delete") }}
                     </button>

src/pages/EditMonitor.vue

@@ -620,13 +620,23 @@ export default {
         },
 
         pageName() {
-            return this.$t((this.isAdd) ? "Add New Monitor" : "Edit");
+            let name = "Add New Monitor";
+            if (this.isClone) {
+                name = "Clone Monitor";
+            } else if (this.isEdit) {
+                name = "Edit";
+            }
+            return this.$t(name);
         },
 
         isAdd() {
             return this.$route.path === "/add";
         },
 
+        isClone() {
+            return this.$route.path.startsWith("/clone");
+        },
+
         isEdit() {
             return this.$route.path.startsWith("/edit");
         },
@@ -804,11 +814,22 @@ message HealthCheckResponse {
                         this.monitor.notificationIDList[this.$root.notificationList[i].id] = true;
                     }
                 }
-            } else if (this.isEdit) {
+            } else if (this.isEdit || this.isClone) {
                 this.$root.getSocket().emit("getMonitor", this.$route.params.id, (res) => {
                     if (res.ok) {
                         this.monitor = res.monitor;
 
+                        if (this.isClone) {
+                            /**
+                             * Cloning a monitor will include properties that can not be posted to backend
+                             * as they are not valid columns in the SQLite table.
+                             */
+                            this.monitor.id = undefined; // Remove id when cloning as we want a new id
+                            this.monitor.includeSensitiveData = undefined;
+                            this.monitor.maintenance = undefined;
+                            this.monitor.tags = undefined; // FIXME: Cloning tags does not work yet
+                        }
+
                         // Handling for monitors that are created before 1.7.0
                         if (this.monitor.retryInterval === 0) {
                             this.monitor.retryInterval = this.monitor.interval;
@@ -866,7 +887,7 @@ message HealthCheckResponse {
                 this.monitor.headers = JSON.stringify(JSON.parse(this.monitor.headers), null, 4);
             }
 
-            if (this.isAdd) {
+            if (this.isAdd || this.isClone) {
                 this.$root.add(this.monitor, async (res) => {
 
                     if (res.ok) {

src/router.js

@@ -63,6 +63,10 @@ const routes = [
                                         path: "/edit/:id",
                                         component: EditMonitor,
                                     },
+                                    {
+                                        path: "/clone/:id",
+                                        component: EditMonitor,
+                                    },
                                 ],
                             },
                             {