case 4192

ayanova/src/components/extension-delete-control.vue

@@ -19,6 +19,15 @@
         @click="doAction()"
         >{{ $ay.t("StartJob") }}</v-btn
       >
+
+      <v-btn
+        v-if="jobActive"
+        color="red darken-1"
+        text
+        @click="requestCancel()"
+      >
+        {{ $ay.t("Cancel") }}</v-btn
+      ><span v-if="jobActive">{{ progress }}</span>
     </v-expansion-panel-content>
   </v-expansion-panel>
 </template>
@@ -29,6 +38,8 @@ export default {
   },
   data: () => ({
     jobActive: false,
+    currentJobId: null,
+    progress: "",
     rights: window.$gz.role.defaultRightsObject(),
     available: false
   }),
@@ -51,6 +62,12 @@ export default {
     canDoAction() {
       return true;
     },
+    async requestCancel() {
+      await window.$gz.api.upsert(
+        "job-operations/request-cancel",
+        this.currentJobId
+      );
+    },
     async doAction() {
       const vm = this;
       const dialogResult = await window.$gz.dialog.confirmGeneric(
@@ -68,37 +85,39 @@ export default {
       const body = this.dataListSelection;
 
       try {
+        this.progress = "";
         //call api route
         let jobId = await window.$gz.api.upsert(url, body);
         if (jobId.error) {
           throw new Error(window.$gz.errorHandler.errorToString(jobId, vm));
         }
-        jobId = jobId.jobId; //it's in a sub key
-        //indicate loading by setting on button
+
+        this.currentJobId = jobId.jobId;
         vm.jobActive = true;
 
-        let jobStatus = 1;
+        let jobProgress = {};
 
         while (vm.jobActive == true) {
-          await window.$gz.util.sleepAsync(1000);
-          //check if done
-          jobStatus = await window.$gz.api.get(
-            `job-operations/status/${jobId}`
+          await window.$gz.util.sleepAsync(2000);
+          jobProgress = await window.$gz.api.get(
+            `job-operations/progress/${this.currentJobId}`
           );
-          if (jobStatus.error) {
+          if (jobProgress.error) {
             throw new Error(
-              window.$gz.errorHandler.errorToString(jobStatus, vm)
+              window.$gz.errorHandler.errorToString(jobProgress, vm)
             );
           }
-          jobStatus = jobStatus.data;
-          if (jobStatus == 4 || jobStatus == 0) {
-            if (jobStatus == 4) {
+          jobProgress = jobProgress.data;
+          this.progress = jobProgress.progress;
+
+          if (jobProgress.jobStatus == 4 || jobProgress.jobStatus == 0) {
+            if (jobProgress.jobStatus == 4) {
               //emit job id and event to parent for log viewing
               vm.$emit("ext-show-job-log", jobId);
             }
             throw new Error("Job failed");
           }
-          if (jobStatus == 3) {
+          if (jobProgress.jobStatus == 3) {
             vm.jobActive = false;
           }
         }