Fixes for missing button actions

src/app/system/manage-scheduler-jobs/manage-scheduler-jobs.component.html

@@ -1,9 +1,13 @@
 <div class="container m-b-20" fxLayout="row" fxLayoutGap="20px">
-  <h2 class="no-m">Scheduler Status: {{ schedulerData.active === true ? 'Active' : 'Inactive' }}</h2>
-  <button mat-raised-button class="suspend">
+  <h2 class="no-m">Scheduler Status: {{ schedulerActive ? 'Active' : 'Inactive' }}</h2>
+  <button mat-raised-button class="suspend" (click)="suspendScheduler()" *ngIf="schedulerActive">
     <fa-icon icon="times-circle"></fa-icon>&nbsp;&nbsp;
     Suspend
   </button>
+  <button mat-raised-button class="activate" (click)="activateScheduler()" *ngIf="!schedulerActive">
+    <fa-icon icon="times-circle"></fa-icon>&nbsp;&nbsp;
+    Activate
+  </button>
 </div>
 
 <div class="container">
@@ -51,7 +55,7 @@
 
       <ng-container matColumnDef="previousRunStatus">
         <th mat-header-cell *matHeaderCellDef mat-sort-header> Previous Run Status </th>
-        <td mat-cell *matCellDef="let job">
+        <td mat-cell *matCellDef="let job" class="center">
           <fa-icon *ngIf="job.lastRunHistory.status === 'success'" class="success" matTooltip="Successful" matTooltipPosition="right" icon="check-circle" size="lg"></fa-icon>
           <fa-icon *ngIf="!(job.lastRunHistory.status == 'success')" class="fail" matTooltip="Failed" matTooltipPosition="right" icon="times-circle" size="lg"></fa-icon>
         </td>
@@ -59,7 +63,7 @@
 
       <ng-container matColumnDef="currentlyRunning">
         <th mat-header-cell *matHeaderCellDef mat-sort-header> Currently Running </th>
-        <td mat-cell *matCellDef="let job">
+        <td mat-cell *matCellDef="let job" class="center">
           <div [className]="job.currentlyRunning === true ? 'currently-running' : 'not-currently-running'">
               <fa-icon matTooltip="{{ job.currentlyRunning === true ? 'Yes' : 'No' }}" matTooltipPosition="right" icon="circle" size="lg"></fa-icon>
           </div>
@@ -68,7 +72,7 @@
 
       <ng-container matColumnDef="errorLog">
         <th mat-header-cell *matHeaderCellDef mat-sort-header> Error Log </th>
-        <td mat-cell *matCellDef="let job">
+        <td mat-cell *matCellDef="let job" class="center">
           <button mat-icon-button class="errorlog" *ngIf="!(job.lastRunHistory.status == 'success')" matTooltip="Error Log" matTooltipPosition="right" >
               <fa-icon icon="exclamation-circle" size="lg"></fa-icon>
           </button>
@@ -80,18 +84,18 @@
 
     </table>
 
-    <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
+    <mat-paginator [pageSizeOptions]="[50, 100]" showFirstLastButtons></mat-paginator>
 
   </div>
 
 </div>
 
-<div class="container" fxLayout="row" fxLayoutGap="20px">
-  <button mat-raised-button color="primary">
+<div class="container space-top" fxLayout="row" fxLayoutGap="20px">
+  <button mat-raised-button color="primary" (click)="runSelectedJobs()">
     <fa-icon icon="play"></fa-icon>&nbsp;&nbsp;
     Run Selected Jobs
   </button>
-  <button mat-raised-button color="primary">
+  <button mat-raised-button color="primary" (click)="refresh()">
     <fa-icon icon="sync"></fa-icon>&nbsp;&nbsp;
     Refresh
   </button>

src/app/system/manage-scheduler-jobs/manage-scheduler-jobs.component.scss

@@ -27,6 +27,15 @@ table {
 }
 
 .suspend {
-  background: #ffa726;
+  background: #32cd32;
   color: #ffffff;
 }
+
+.activate {
+  background: #f44366;
+  color: #ffffff;
+}
+
+.space-top {
+  margin-top: 30px;
+}

src/app/system/manage-scheduler-jobs/manage-scheduler-jobs.component.ts

@@ -3,11 +3,11 @@ import { Component, OnInit, ViewChild } from '@angular/core';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
 import { MatTableDataSource } from '@angular/material/table';
-import { ActivatedRoute } from '@angular/router';
 import { SelectionModel } from '@angular/cdk/collections';
 
 /** rxjs Imports */
 import { of } from 'rxjs';
+import { SystemService } from '../system.service';
 
 /**
  * Manage scheduler jobs component.
@@ -29,6 +29,10 @@ export class ManageSchedulerJobsComponent implements OnInit {
   dataSource: MatTableDataSource<any>;
   /** Initialize Selection */
   selection = new SelectionModel<any>(true, []);
+  /** Scheduler Status */
+  schedulerActive = false;
+  /** Jobs counter */
+  jobsCounter: any = 0;
 
   /** Paginator for table. */
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@@ -39,12 +43,7 @@ export class ManageSchedulerJobsComponent implements OnInit {
    * Retrieves the scheduler jobs data from `resolve`.
    * @param {ActivatedRoute} route Activated Route.
    */
-  constructor(private route: ActivatedRoute) {
-    this.route.data.subscribe((data: { jobsScheduler: any }) => {
-      this.jobData = data.jobsScheduler[0];
-      this.schedulerData = data.jobsScheduler[1];
-    });
-  }
+  constructor(private systemService: SystemService) {}
 
   /**
    * Filters data in manage scheduler jobs table based on passed value.
@@ -59,8 +58,7 @@ export class ManageSchedulerJobsComponent implements OnInit {
    */
   isAllSelected() {
     const numSelected = this.selection.selected.length;
-    const numRows = this.dataSource.data.length;
-    return numSelected === numRows;
+    return numSelected === this.jobsCounter;
   }
 
   /**
@@ -77,24 +75,61 @@ export class ManageSchedulerJobsComponent implements OnInit {
    */
   ngOnInit() {
     this.setJobs();
-    this.dataSource.sortingDataAccessor = (item, property) => {
-      switch (property) {
-        case 'previousRunStatus': return item.lastRunHistory.status;
-        case 'errorLog': return item.lastRunHistory.status;
-        case 'previousRunTime': return new Date(item.lastRunHistory.jobRunStartTime);
-        case 'nextRunTime': return new Date(item.nextRunTime);
-        default: return item[property];
-      }
-    };
+    this.getScheduler();
   }
 
   /**
    * Initializes the data source, paginator and sorter for manage scheduler jobs table.
    */
   setJobs() {
-    this.dataSource = new MatTableDataSource(this.jobData);
-    this.dataSource.paginator = this.paginator;
-    this.dataSource.sort = this.sort;
+    this.systemService.getJobs()
+    .subscribe((jobData: any) => {
+      this.dataSource = new MatTableDataSource(jobData);
+      this.dataSource.paginator = this.paginator;
+      this.dataSource.sort = this.sort;
+      this.jobsCounter = jobData.length;
+      this.selection.clear();
+      this.dataSource.sortingDataAccessor = (item, property) => {
+        switch (property) {
+          case 'previousRunStatus': return item.lastRunHistory.status;
+          case 'errorLog': return item.lastRunHistory.status;
+          case 'previousRunTime': return new Date(item.lastRunHistory.jobRunStartTime);
+          case 'nextRunTime': return new Date(item.nextRunTime);
+          default: return item[property];
+        }
+      };
+    });
   }
 
+  getScheduler() {
+    this.systemService.getScheduler()
+    .subscribe((schedulerData: any) => {
+      this.schedulerData = schedulerData;
+      this.schedulerActive = this.schedulerData.active;
+    });
+  }
+
+  suspendScheduler(): void {
+    this.systemService.runCommandOnScheduler('stop')
+    .subscribe(() => {
+      this.getScheduler();
+    });
+  }
+
+  activateScheduler(): void {
+    this.systemService.runCommandOnScheduler('start')
+    .subscribe(() => {
+      this.getScheduler();
+    });
+  }
+
+  runSelectedJobs(): void {
+    this.selection.selected.forEach((job) => {
+      this.systemService.runSelectedJob(job.jobId);
+    });
+  }
+
+  refresh(): void {
+    this.setJobs();
+  }
 }

src/app/system/system-routing.module.ts

@@ -413,9 +413,7 @@ const routes: Routes = [
           {
             path: '',
             component: ManageSchedulerJobsComponent,
-            resolve: {
-              jobsScheduler: ManageSchedulerJobsResolver
-            },
+            resolve: {},
           },
           {
             path: ':id',

src/app/system/system.service.ts

@@ -12,6 +12,7 @@ import { Observable } from 'rxjs';
   providedIn: 'root'
 })
 export class SystemService {
+  emptyPayload: any = {};
 
   /**
    * @param {HttpClient} http Http Client to send requests.
@@ -257,10 +258,27 @@ export class SystemService {
    * @param {any} Job Job to be updated.
    * @returns {Observable<any>}
    */
-  updateScheduler(jobId: string, job: any): Observable<any> {
+  runCommandOnScheduler(command: string): Observable<any> {
+    return this.http.post(`/scheduler?command=` + command, this.emptyPayload);
+  }
+
+  /**
+   * @param {string} jobId Job ID of Job to be updated.
+   * @param {any} Job Job to be updated.
+   * @returns {Observable<any>}
+   */
+   updateScheduler(jobId: string, job: any): Observable<any> {
     return this.http.put(`/jobs/${jobId}`, job);
   }
 
+  /**
+   * @param jobId Job Id to be edited
+   * @returns {Observable<any>} Fetches Scheduler Job.
+   */
+   runSelectedJob(jobId: string): Observable<any> {
+    return this.http.post(`/jobs/${jobId}?command=executeJob`, this.emptyPayload);
+  }
+
   /*
    * @param jobId Job Id to view the history.
    * @returns {Observable<any>} Fetches History of the Job.