fix: set tab index value (#22)

Sets the correct tab index from the selected cron type. This allows the correct tab to be opened on initialization.
haavardj · Dec 11, 2023 · 80c613e · 80c613e
1 parent 355c5cf
commit 80c613e
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/libs/ngx-cron-editor/src/cron-editor.component.ts b/libs/ngx-cron-editor/src/cron-editor.component.ts
@@ -52,7 +52,7 @@ function* range(start: number, end: number) {
   providers: [CRON_VALUE_ACCESSOR]
 })
 export class CronGenComponent implements OnInit, OnDestroy, ControlValueAccessor {
-
+  public tabIndex = 0;
   public seconds = [...range(0, 59)];
   public minutes = [...range(0, 59)];
   public hours = [...range(0, 23)];
@@ -214,21 +214,27 @@ export class CronGenComponent implements OnInit, OnDestroy, ControlValueAccessor
         break;
       case 'hourly':
         cron = this.computeHourlyCron();
+        this.tabIndex = 1;
         break;
       case 'daily':
         cron = this.computeDailyCron();
+        this.tabIndex = 2;
         break;
       case 'weekly':
         cron = this.computeWeeklyCron();
+        this.tabIndex = 3;
         break;
       case 'monthly':
         cron = this.computeMonthlyCron();
+        this.tabIndex = 4;
         break;
       case 'yearly':
         cron = this.computeYearlyCron();
+        this.tabIndex = 5;
         break;
       case 'unknown':
         cron = this.computeAdvancedExpression();
+        this.tabIndex = 6;
         break;
       default:
         throw Error('Unknown cron type ' + this.allForm.value.cronType);
@@ -395,7 +401,7 @@ export class CronGenComponent implements OnInit, OnDestroy, ControlValueAccessor
     // Month
     x = parseCronNumberToken(t[4])
     this.allForm.controls.months.setValue(x.val, {emitEvent: false});
-    this.allForm.controls.monthsInc.setValue(x.inc, {emitEvent: false});
+    this.allForm.controls.monthsInc.setValue(x.inc, { emitEvent: false });
 
     // Day of Week
     this.allForm.controls.day.setValue(t[5]);
@@ -429,7 +435,7 @@ export class CronGenComponent implements OnInit, OnDestroy, ControlValueAccessor
       this.allForm.controls.FRI.setValue(false, {emitEvent: false});
     }
 
-    if (t[5].match('SAT')) {
+   if (t[5].match('SAT')) {
       this.allForm.controls.SAT.setValue(true, {emitEvent: false});
     } else {
       this.allForm.controls.SAT.setValue(false, {emitEvent: false});

diff --git a/libs/ngx-cron-editor/src/cron-editor.template.html b/libs/ngx-cron-editor/src/cron-editor.template.html
@@ -1,5 +1,5 @@
 <section class="cron-editor-main">
-  <mat-tab-group class="cron-editor-container" (selectedTabChange)="onTabChange($event)" [backgroundColor]="backgroundColor" [color]="color">
+  <mat-tab-group class="cron-editor-container" (selectedTabChange)="onTabChange($event)" [backgroundColor]="backgroundColor" [color]="color" [(selectedIndex)]="tabIndex">
 
     <!-- Minute -->
     <mat-tab [formGroup]="allForm" class="cron-editor-tab" label="Minutely" *ngIf="!options.hideMinutesTab" #minutesTab>