From 1fe9e4ad0cf5949365b4cd1fa82df7667234e7ac Mon Sep 17 00:00:00 2001
From: "Li, Juan" <sunshinejuanl@gmail.com>
Date: Sun, 15 Jul 2018 00:33:39 +0800
Subject: [PATCH] add popup window when performing stop action to a job

---
 ui/angular/src/app/job/job.component.html |  2 +-
 ui/angular/src/app/job/job.component.ts   | 82 ++++++++++++++++-------
 2 files changed, 60 insertions(+), 24 deletions(-)

diff --git a/ui/angular/src/app/job/job.component.html b/ui/angular/src/app/job/job.component.html
index d4842c70b..813d0c421 100644
--- a/ui/angular/src/app/job/job.component.html
+++ b/ui/angular/src/app/job/job.component.html
@@ -138,7 +138,7 @@
         <div class="modal-header">
           <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
           <toaster-container></toaster-container>
-          <h4 class="modal-title">Delete the job with the below information?</h4>
+          <h4 class="modal-title">{{modalWndMsg}}</h4>
         </div>
         <div class="modal-body">
           <!-- <ng-include src="'/pages/jobs/delete-confirm.html'"/> -->
diff --git a/ui/angular/src/app/job/job.component.ts b/ui/angular/src/app/job/job.component.ts
index 861c6e4a9..1334f2feb 100644
--- a/ui/angular/src/app/job/job.component.ts
+++ b/ui/angular/src/app/job/job.component.ts
@@ -43,6 +43,9 @@ export class JobComponent implements OnInit {
   deleteId: string;
   deleteIndex: number;
   action: string;
+  modalWndMsg:string;
+  isStop:boolean;
+
   private toasterService: ToasterService;
 
   constructor(
@@ -67,6 +70,7 @@ export class JobComponent implements OnInit {
 
   remove(row) {
     $("#save").removeAttr("disabled");
+    this.modalWndMsg = "Delete the job with the below information?";
     this.visible = true;
     setTimeout(() => (this.visibleAnimate = true), 100);
     this.deletedRow = row;
@@ -80,35 +84,67 @@ export class JobComponent implements OnInit {
   }
 
   confirmDelete() {
-    let deleteJob = this.serviceService.config.uri.deleteJob;
-    let deleteUrl = deleteJob + "/" + this.deleteId;
-    $("#save").attr("disabled", "true");
-    this.http.delete(deleteUrl).subscribe(
-      data => {
-        let self = this;
+    let self=this;
+    if(this.isStop){
+      $("#save").attr("disabled", "true");
+      let actionUrl = this.serviceService.config.uri.modifyJobs + "/" + this.deleteId + "?action=" + "stop";
+      this.http.put(actionUrl, {}).subscribe(data => {
+        let self=this;
         self.hide();
-        setTimeout(function() {
-          self.results.splice(self.deleteIndex, 1);
-        }, 0);
+        var result = JSON.parse(JSON.stringify(data));
+        self.results[self.deleteIndex].action = 'START';
+        self.results[self.deleteIndex].jobState.state = result["job.state"].state;
+        self.isStop=false;
       },
       err => {
-        this.toasterService.pop("error", "Error!", "Failed to delete job!");
-        console.log("Error when deleting job");
-      }
-    );
+        this.toasterService.pop("error", "Error!", "Failed to manage job state!");
+        console.log("Error when manage job state");
+      });
+    }
+    else{
+      let deleteJob = this.serviceService.config.uri.deleteJob;
+      let deleteUrl = deleteJob + "/" + this.deleteId;
+      $("#save").attr("disabled", "true");
+      this.http.delete(deleteUrl).subscribe(
+        data => {
+          let self = this;
+          self.hide();
+          setTimeout(function() {
+            self.results.splice(self.deleteIndex, 1);
+          }, 0);
+        },
+        err => {
+          this.toasterService.pop("error", "Error!", "Failed to delete job!");
+          console.log("Error when deleting job");
+        }
+      );
+    }
+
   }
 
   stateMag(row){
-    let actionUrl = this.serviceService.config.uri.modifyJobs + "/" + row.id + "?action=" + row.action.toLowerCase();
-    this.http.put(actionUrl, {}).subscribe(data => {
-      var result = JSON.parse(JSON.stringify(data));
-      row.action = (row.action === 'STOP' ? 'START' : 'STOP');
-      row.jobState.state = result["job.state"].state;
-    },
-    err => {
-      this.toasterService.pop("error", "Error!", "Failed to manage job state!");
-      console.log("Error when manage job state");
-    });
+    if(row.action.toLowerCase()=="stop"){
+      $("#save").removeAttr("disabled");
+      this.isStop = true;
+      this.modalWndMsg = "Stop the job with the below information?";
+      this.visible = true;
+      setTimeout(() => (this.visibleAnimate = true), 100);
+      this.deletedRow = row;
+      this.deleteIndex = this.results.indexOf(row);
+      this.deleteId = row.id;
+    }
+    else{
+      let actionUrl = this.serviceService.config.uri.modifyJobs + "/" + row.id + "?action=" + row.action.toLowerCase();
+      this.http.put(actionUrl, {}).subscribe(data => {
+        var result = JSON.parse(JSON.stringify(data));
+        row.action = (row.action === 'STOP' ? 'START' : 'STOP');
+        row.jobState.state = result["job.state"].state;
+      },
+      err => {
+        this.toasterService.pop("error", "Error!", "Failed to manage job state!");
+        console.log("Error when manage job state");
+      });
+    }
   }
 
   showInstances(row) {