From 527d4c12b44bdbc5a85f5b9ac70bf466512a78f0 Mon Sep 17 00:00:00 2001
From: Thomas Merkel <thomas.merkel@ionos.com>
Date: Mon, 16 Aug 2021 14:02:04 +0200
Subject: [PATCH 1/2] Add spinner / loading indicator for RunCard

The user should see some indicator that a job is running. For that
reason I added a simple loading spinner.
---
 src/components/RunCard.vue | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/src/components/RunCard.vue b/src/components/RunCard.vue
index 25e1a3ba..c6d4aaed 100644
--- a/src/components/RunCard.vue
+++ b/src/components/RunCard.vue
@@ -215,6 +215,7 @@
     </v-row>
     <v-row>
       <v-col sm="12">
+        <div class="lds-dual-ring" v-if="loading"></div>
         <v-card v-if="results">
           <v-card-title>Results</v-card-title>
           <v-card-text v-html="results" class="ansiStyle"></v-card-text>
@@ -307,6 +308,7 @@
         scheduleDate: new Date().toISOString().substr(0, 10),
         scheduleTime: new Date().toISOString().substr(11, 11).split(":").slice(0, -1).join(":"),
         scheduleName: null,
+        loading: false,
       }
     },
     methods: {
@@ -366,6 +368,7 @@
           }
         }
         this.$toast(action + " " + command)
+        this.loading = true
         this.$http.post("api/run/", formData).then(response => {
           let result = response.data
           // If we're expecting an async result, display a link to the minion's result.
@@ -387,8 +390,10 @@
             }
             result = new XMLSerializer().serializeToString(htmlRes)
           }
+          this.loading = false
           this.results = result + this.results
         }).catch((error) => {
+          this.loading = false
           this.$toast.error(error.response.data)
         })
       },
@@ -465,4 +470,31 @@
     padding: 10px;
   }
 
+  .lds-dual-ring {
+    width: 80px;
+    height: 80px;
+    float: none;
+    margin: 0 auto;
+  }
+
+  .lds-dual-ring:after {
+    content: " ";
+    display: block;
+    width: 64px;
+    height: 64px;
+    margin: 8px;
+    border-radius: 50%;
+    border: 6px solid rgba(138, 138, 138);
+    border-color: rgba(138, 138, 138) transparent rgba(138, 138, 138) transparent;
+    animation: lds-dual-ring 1.2s linear infinite;
+  }
+
+  @keyframes lds-dual-ring {
+    0% {
+      transform: rotate(0deg);
+    }
+    100% {
+      transform: rotate(360deg);
+    }
+  }
 </style>

From 4c87d5c1e0e2a98c302474dedcb932900a976642 Mon Sep 17 00:00:00 2001
From: Matt Melquiond <matt.LLVW@gmail.com>
Date: Sat, 25 Jun 2022 22:10:59 +0200
Subject: [PATCH 2/2] Update RunCard.vue

---
 src/components/RunCard.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/RunCard.vue b/src/components/RunCard.vue
index bd7f603d..7bb56cb8 100644
--- a/src/components/RunCard.vue
+++ b/src/components/RunCard.vue
@@ -502,8 +502,9 @@ export default {
             "schedule",
             this.scheduleDate + " " + this.scheduleTime + ":00"
           );
-        } else {
-          formData.set("cron", this.cron.currentValue);
+          } else {
+            formData.set("cron", this.cron.currentValue);
+          }
         }
         this.$toast(action + " " + command)
         this.loading = true