Merge pull request #89 in TEA/mina-sidor-fa-web from feature/TV-555 to develop

Squashed commit of the following:

commit a189e60d3c43827fe6ee67c869d0b2b12ce3e932
Merge: 5f93a8b ca8160f
Author: Chingiz <chingiz.esenbaev@arbetsformedlingen.se>
Date:   Tue Sep 14 16:45:16 2021 +0200

    Merge branch 'develop' into feature/TV-555

commit 5f93a8b88aae3d3904ee0324e0ce2bd0d1ad6cd9
Merge: 7ac534a 2a37566
Author: Chingiz <chingiz.esenbaev@arbetsformedlingen.se>
Date:   Mon Sep 13 16:02:47 2021 +0200

    Merge branch 'develop' into feature/TV-555

commit 7ac534ad7644daf4e7e504b6265dae485ab75b23
Merge: 53b55aa 502614d
Author: Chingiz <chingiz.esenbaev@arbetsformedlingen.se>
Date:   Mon Sep 13 15:25:20 2021 +0200

    Merge branch 'develop' into feature/TV-555

commit 53b55aa432d86460f34b959f2086d0121d078dad
Author: Chingiz <chingiz.esenbaev@arbetsformedlingen.se>
Date:   Sun Sep 12 15:10:27 2021 +0200

    feat(gemensam-planering):refaktorerade reportsFormSelect så att den är generisk, samma fÃalla rapporter

commit c4c30430f6e3633bc5a1074e856b42622e2bf1b4
Author: Chingiz <chingiz.esenbaev@arbetsformedlingen.se>
Date:   Sun Sep 12 13:38:52 2021 +0200

    feat(gemensam-planering):route och sida för gemensam planering

apps/mina-sidor-fa/src/app/pages/deltagare/deltagare-routing.module.ts

@@ -17,6 +17,14 @@ const routes: Routes = [
     data: { title: 'Skapa rapport' },
     loadChildren: () => import('./pages/deltagare-report/deltagare-report.module').then(m => m.DeltagareReportModule),
   },
+  {
+    path: 'planering/:deltagareId',
+    data: { title: 'Skapa gemensam planering' },
+    loadChildren: () =>
+      import('./pages/deltagare-report/deltagare-gemensam-planering/deltagare-gemensam-planering.module').then(
+        m => m.DeltagareGemensamPlaneringModule
+      ),
+  },
 ];
 
 @NgModule({

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.html

@@ -195,18 +195,18 @@
               <p>Här kan du skicka rapporter om deltagaren till arbetsförmedlingen.</p>
               <form [formGroup]="reportPickerFormGroup">
                 <digi-ng-form-select
-                  [formControlName]="avvikelseFormControlName"
+                  [formControlName]="reportsFormControlName"
                   afLabel="Välj rapporttyp"
                   afPlaceholder="Välj rapporttyp"
                   [afSelectItems]="selectableReportTypes"
                   [afDisableValidStyle]="true"
                   [afRequired]="true"
-                  [afInvalid]="avvikelseFormControl.invalid && avvikelseFormControl.touched"
+                  [afInvalid]="reportsFormControl.invalid && reportsFormControl.touched"
                 >
                 </digi-ng-form-select>
                 <digi-form-validation-message
                   af-variation="error"
-                  *ngIf="avvikelseFormControl.invalid && avvikelseFormControl.touched"
+                  *ngIf="reportsFormControl.invalid && reportsFormControl.touched"
                 >
                   Du måste välja en rapporttyp
                 </digi-form-validation-message>
@@ -215,8 +215,7 @@
             <div class="deltagare-card__cta-wrapper">
               <digi-ng-link-button
                 afText="Skapa ny rapport"
-                [afRoute]="avvikelseFormControl.valid ? ['/deltagare/rapportera', deltagare.id] : null"
+                (click)="onFormSubmitted($event, reportsFormControl.value, deltagare.id)"
-                (click)="onFormSubmitted($event)"
               ></digi-ng-link-button>
             </div>
             <div>

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.ts

@@ -1,7 +1,7 @@
 import { FormSelectItem } from '@af/digi-ng/_form/form-select';
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { IconType } from '@msfa-enums/icon-type.enum';
 import { Deltagare } from '@msfa-models/deltagare.model';
 import { ReportsData } from '@msfa-models/reports.model';
@@ -20,14 +20,17 @@ export class DeltagareCardComponent {
   deltagare$: Observable<Deltagare> = this.deltagareService.deltagare$;
   reportsData$: Observable<ReportsData> = this.deltagareService.reportsData$;
 
-  readonly avvikelseFormControlName = 'avvikelse';
+  readonly reportsFormControlName = 'reports';
 
   reportPickerFormGroup: FormGroup = this.formBuilder.group({
-      // eslint-disable-next-line  @typescript-eslint/unbound-method
+    // eslint-disable-next-line  @typescript-eslint/unbound-method
-    avvikelse: this.formBuilder.control('', [Validators.required]),
+    reports: this.formBuilder.control('', [Validators.required]),
   });
 
-  selectableReportTypes: Array<FormSelectItem> = [{ name: 'Avvikelse', value: 'avvikelse' }];
+  selectableReportTypes: Array<FormSelectItem> = [
+    { name: 'Avvikelse', value: 'avvikelse' },
+    { name: 'Gemensam Planering', value: 'planering' },
+  ];
   selectedReportType: FormSelectItem;
 
   firstVisibleWorkExperiences$: Observable<WorkExperience[]> = this.deltagare$.pipe(
@@ -43,12 +46,14 @@ export class DeltagareCardComponent {
   constructor(
     private activatedRoute: ActivatedRoute,
     private deltagareService: DeltagareService,
-    private formBuilder: FormBuilder) {
+    private formBuilder: FormBuilder,
+    private router: Router
+  ) {
     this.deltagareService.setCurrentDeltagareId(this.activatedRoute.snapshot.params.deltagareId);
   }
 
-  get avvikelseFormControl(): AbstractControl | null {
+  get reportsFormControl(): AbstractControl | null {
-    return this.reportPickerFormGroup?.get(this.avvikelseFormControlName);
+    return this.reportPickerFormGroup?.get(this.reportsFormControlName);
   }
 
   toggleAccordionExpanded(): void {
@@ -59,18 +64,29 @@ export class DeltagareCardComponent {
     this.deltagareService.setPage(page);
   }
 
-  onFormSubmitted(event: Event): void {
+  onFormSubmitted(event: Event, reportType: string, deltagareId: string): void {
     event.preventDefault();
 
-    this.avvikelseFormControl.markAsTouched();
+    switch (reportType) {
+      case 'planering':
+        this.reportsFormControl.valid ? this.router.navigate(['/deltagare/planering', deltagareId]) : null;
+        break;
+      case 'avvikelse':
+        this.reportsFormControl.valid ? this.router.navigate(['/deltagare/rapportera', deltagareId]) : null;
+        break;
+      default:
+        return;
+    }
+
+    this.reportsFormControl.markAsTouched();
 
     if (!this.selectableReportTypes || this.reportPickerFormGroup.invalid) {
       return;
     }
 
     const selectedReportType = this.selectableReportTypes.find(report => {
-      return report.value === this.avvikelseFormControl.value;
+      return report.value === this.reportsFormControl.value;
-    })
+    });
 
     this.deltagareService.setReportType(selectedReportType);
   }

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/deltagare-gemensam-planering/deltagare-gemensam-planering.component.html

@@ -0,0 +1,3 @@
+<msfa-layout>
+  <p>deltagare-gemensam-planering works!</p>
+</msfa-layout>

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/deltagare-gemensam-planering/deltagare-gemensam-planering.component.spec.ts

@@ -0,0 +1,29 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { LayoutComponent } from '@msfa-shared/components/layout/layout.component';
+import { DeltagareGemensamPlaneringComponent } from './deltagare-gemensam-planering.component';
+
+describe('DeltagareGemensamPlaneringComponent', () => {
+  let component: DeltagareGemensamPlaneringComponent;
+  let fixture: ComponentFixture<DeltagareGemensamPlaneringComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+      declarations: [DeltagareGemensamPlaneringComponent, LayoutComponent],
+      imports: [RouterTestingModule, HttpClientTestingModule],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeltagareGemensamPlaneringComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/deltagare-gemensam-planering/deltagare-gemensam-planering.component.ts

@@ -0,0 +1,9 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'msfa-deltagare-gemensam-planering',
+  templateUrl: './deltagare-gemensam-planering.component.html',
+  styleUrls: ['./deltagare-gemensam-planering.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class DeltagareGemensamPlaneringComponent {}

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/deltagare-gemensam-planering/deltagare-gemensam-planering.module.ts

@@ -0,0 +1,17 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
+import { DeltagareGemensamPlaneringComponent } from './deltagare-gemensam-planering.component';
+
+@NgModule({
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  declarations: [DeltagareGemensamPlaneringComponent],
+  imports: [
+    CommonModule,
+    RouterModule.forChild([{ path: '', component: DeltagareGemensamPlaneringComponent }]),
+    LayoutModule,
+  ],
+  exports: [DeltagareGemensamPlaneringComponent],
+})
+export class DeltagareGemensamPlaneringModule {}