From 47a594dda2449c58b1edc02c00db4146eb3a7f94 Mon Sep 17 00:00:00 2001
From: Dmitry <b4tm4n@mail.ru>
Date: Mon, 7 Jun 2021 15:57:48 +0300
Subject: [PATCH] monitor update in background

---
 src/components/ApacheRestartMonitor.vue | 48 ++++++++++++++++++++-----
 src/store/modules/apache_restart.js     |  6 ++--
 2 files changed, 42 insertions(+), 12 deletions(-)

diff --git a/src/components/ApacheRestartMonitor.vue b/src/components/ApacheRestartMonitor.vue
index bbcbc77..6e119ae 100644
--- a/src/components/ApacheRestartMonitor.vue
+++ b/src/components/ApacheRestartMonitor.vue
@@ -1,7 +1,7 @@
 <template>
   <transition name="bounce">
     <div
-      v-if="isApacheNeedRestart || isApacheRestartPending"
+      v-if="isActive"
       class="
         container
         d-flex
@@ -54,14 +54,44 @@
 import { mapGetters, mapActions } from "vuex";
 
 export default {
-  computed: mapGetters([
-    "isApacheNeedRestart",
-    "isApacheRestartPending",
-    "isApacheRestartFlagSent",
-  ]),
-  methods: mapActions(["updateApacheRestartFlag", "fetchApacheRestartFlag"]),
-  async updated() {
-    this.fetchApacheRestartFlag();
+  data: () => ({
+    is_locked: false,
+  }),
+  computed: {
+    ...mapGetters([
+      "isApacheNeedRestart",
+      "isApacheRestartPending",
+      "isApacheRestartFlagSent",
+    ]),
+    isActive() {
+      return this.isApacheNeedRestart || this.isApacheRestartPending;
+    },
+  },
+  methods: {
+    ...mapActions(["updateApacheRestartFlag", "fetchApacheRestartFlag"]),
+    async monitor_status() {
+      if (this.is_locked) return;
+      this.is_locked = true;
+
+      while (this.isActive) {
+        await new Promise((resolve) => setTimeout(resolve, 2000));
+        await this.fetchApacheRestartFlag();
+      }
+
+      this.is_locked = false;
+    },
+  },
+  watch: {
+    "$store.getters.isApacheNeedRestart": function () {
+      this.monitor_status();
+    },
+    "$store.getters.isApacheRestartPending": function () {
+      this.monitor_status();
+    },
+  },
+  async mounted() {
+    if (this.isActive) await this.monitor_status();
+    else await this.fetchApacheRestartFlag();
   },
 };
 </script>
diff --git a/src/store/modules/apache_restart.js b/src/store/modules/apache_restart.js
index 70a8317..dd57ad3 100644
--- a/src/store/modules/apache_restart.js
+++ b/src/store/modules/apache_restart.js
@@ -4,7 +4,7 @@ import config from "@/config.js";
 
 const api_base = config.api;
 
-const pass = (some) => some
+const pass = () => {};
 
 export default {
   state: {
@@ -47,8 +47,8 @@ export default {
         await axios.put(`${api_base}/apache-restart`);
         ctx.commit("setApacheRestartFlag", true);
         ctx.commit("setApacheRestartFlagSent", true);
-      } catch(err) {
-        pass()
+      } catch (err) {
+        pass();
       }
     },
   },