From 41a3cc61bdc82de51a5bfac9ff2c3d2a5400c643 Mon Sep 17 00:00:00 2001 From: Nicolas Fuentes Maturana Date: Mon, 27 Sep 2021 17:25:25 +0200 Subject: [PATCH] Merge pull request #134 in TEA/mina-sidor-fa-web from feature/TV-668-pr-activities-form to develop Squashed commit of the following: commit 25325c6ee86f294d7b0a5673a0643948e3a2a583 Merge: 71715ea5 ca32a1ed Author: Aden Hassan Date: Mon Sep 27 17:22:02 2021 +0200 Merge branch 'develop' into feature/TV-668-pr-activities-form commit 71715ea5215c680f655c0455a836c449fffac389 Author: Aden Hassan Date: Mon Sep 27 17:15:33 2021 +0200 minor changes commit 6a0b64d587665444635b6f93f6932ef42f51c6ce Author: Aden Hassan Date: Mon Sep 27 12:53:52 2021 +0200 re-added mistakenly removed line commit 9c0a0d1261c2342309059681c128dacd9fe0c50c Author: Aden Hassan Date: Mon Sep 27 12:42:33 2021 +0200 swiched over to actual types-model for activity and aDsubActivities commit c50c7ca5b02f45b5c32776952e93e0943c843065 Merge: 7bfd9bf4 a7aa94e0 Author: Aden Hassan Date: Mon Sep 27 12:39:10 2021 +0200 fixed some merge conflicts commit 7bfd9bf4d867f68e50fa9756e2904e39ce8cd944 Merge: 5268a2c0 85242b05 Author: Aden Hassan Date: Mon Sep 27 09:00:36 2021 +0200 resolved some merge conflicts commit 5268a2c0c6ce940b2235d872f3dfaa2193380d12 Author: Aden Hassan Date: Mon Sep 27 08:48:43 2021 +0200 minor changes and removals commit 02d43100c3760fb3620057d452026fb4f692e460 Author: Aden Hassan Date: Sun Sep 26 13:24:30 2021 +0200 remove empty space commit 33a8884e41f03c84b3f825e6729e7dc007c5ebb8 Author: Aden Hassan Date: Sat Sep 25 22:37:36 2021 +0200 added changes to method to dynamically create activity fields commit b049890a340afd35fc6af1ab5c77cb3ec94a6100 Author: Aden Hassan Date: Fri Sep 24 14:07:25 2021 +0200 changes made to the mock api for the activities commit e6aaf979cb83b716feea37bf68c110df4ea0599c Author: Aden Hassan Date: Fri Sep 24 12:58:06 2021 +0200 minor corrections commit 2b38e18c77973057c804fb383a93b33af6656a75 Author: Aden Hassan Date: Fri Sep 24 12:42:47 2021 +0200 created mock-data for getting activites and sub-activities commit acfe8ab60b7f7bb4c9eb8b14ff7ca0c855b414f7 Author: Aden Hassan Date: Fri Sep 24 11:46:10 2021 +0200 created basic structure of the periodisk redovisning form-object and relevant basic methods commit 05865a5eec270bae8720abfd738f67df72d7d457 Author: Aden Hassan Date: Thu Sep 23 23:09:43 2021 +0200 added formcontrol for comments commit 2e38dd70f4b03c9a6af86497124b5ee08999d21b Author: Aden Hassan Date: Thu Sep 23 22:04:40 2021 +0200 minor addition commit d56a76c600d8ff63187d958fc76af04e729d3aa0 Author: Aden Hassan Date: Thu Sep 23 22:01:55 2021 +0200 created for arrays for the fields that required it commit 43026442c523ceb559f128ddec7a3d8dd39eed88 Author: Aden Hassan Date: Thu Sep 23 17:34:14 2021 +0200 created getters for formarrayfields commit 0dc78842ba154b03c945a89adbe05d142eee0ac0 Author: Aden Hassan Date: Thu Sep 23 17:28:02 2021 +0200 created the activities form fields commit c14807a5acb11140250066c7340acb54bc75dcf9 Merge: 8918360c ed840425 Author: Aden Hassan Date: Thu Sep 23 15:11:18 2021 +0200 Merge branch 'feature/TV-654-pr-form-base' into feature/TV-668-pr-activities-form commit ed8404251283d896f8612cf43f3a2e3dc59015e1 Merge: 032e4501 14739fb9 Author: Aden Hassan Date: Thu Sep 23 15:09:38 2021 +0200 Merge branch 'develop' into feature/TV-654-pr-form-base ... and 13 more commits --- .../periodisk-redovisning-form.component.ts | 5 +- .../periodisk-redovisning.component.html | 62 ++++----- .../periodisk-redovisning.component.ts | 131 +++++++++++++++--- .../periodisk-redovisning-form.service.ts | 17 --- .../services/periodisk-redovisning.service.ts | 23 +++ .../src/app/shared/models/activity.model.ts | 16 +-- .../mina-sidor-fa/scripts/generate-api.js | 1 + 7 files changed, 180 insertions(+), 75 deletions(-) delete mode 100644 apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning-form.service.ts create mode 100644 apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning.service.ts diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/components/periodisk-redovisning-form/periodisk-redovisning-form.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/components/periodisk-redovisning-form/periodisk-redovisning-form.component.ts index 11ae275..a6e6691 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/components/periodisk-redovisning-form/periodisk-redovisning-form.component.ts +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/components/periodisk-redovisning-form/periodisk-redovisning-form.component.ts @@ -5,11 +5,14 @@ import { FormGroup } from '@angular/forms'; selector: 'msfa-periodisk-redovisning-form', templateUrl: './periodisk-redovisning-form.component.html', styleUrls: ['./periodisk-redovisning-form.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush, + changeDetection: ChangeDetectionStrategy.OnPush }) export class PeriodiskRedovisningFormComponent { @Input() periodiskRedovisningFormGroup: FormGroup; @Input() totalAmountOfSteps: number; @Input() currentStep: number; @Output() submitPRFormGroup = new EventEmitter(); + + + constructor() {} } diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.html index 8ea5297..0297486 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.html +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.html @@ -4,46 +4,44 @@ reportSubTitle="Skapa redovisning" [totalAmountOfSteps]="totalAmountOfSteps" [currentStep]="currentStep" - [isPeriodDate]="true" + [isPeriodDate]="true" [startDate]="'2021-09-01'" - [endDate]="'2021-09-30'"> + [endDate]="'2021-09-30'" + (currentStepEvent)="currentStep = $event" + (sendRequestEvent)="sendRequest = $event">
-
-
-

Har ni lämnat individuella förslag på arbeten till arbetssökande under perioden?

- - - Svar på frågorna är obligatoriskt - - -

Har ni, under perioden, tillhandahållit språkstöd?

- - - Svar på frågorna är obligatoriskt - -
-
+

Har ni lämnat individuella förslag på arbeten till arbetssökande under perioden?

+ + + Ett val är obligatoriskt + + +

Har ni, under perioden, tillhandahållit språkstöd?

+ + + Ett val är obligatoriskt + - -
+
+
- Tillbaka diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.ts index 1d1fbed..5a18b3c 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.ts +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.component.ts @@ -1,7 +1,8 @@ import { RadiobuttonGroupDirection } from '@af/digi-ng/_form/form-radiobutton-group'; import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { AbstractControl, FormControl, FormGroup } from '@angular/forms'; -import { RequiredValidator } from '@msfa-validators/required.validator'; +import { AbstractControl, FormArray, FormControl, FormGroup, Validators } from '@angular/forms'; +import { Activity, SubActivity } from '@msfa-models/activity.model'; +import { PeriodiskRedovisningService } from '../../services/periodisk-redovisning.service'; @Component({ selector: 'msfa-periodisk-redovisning', @@ -10,18 +11,30 @@ import { RequiredValidator } from '@msfa-validators/required.validator'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class PeriodiskRedovisningComponent implements OnInit { + //activities$ = this.periodiskRedovisningService.getActivities$(); + radiobuttonGroupDirection = RadiobuttonGroupDirection; - totalAmountOfSteps = 3; + totalAmountOfSteps =3; currentStep = 1; + moveToNextStep = false; // Form-related variables periodiskRedovisningFormGroup: FormGroup; + submitted = false; readonly lamnatJobbForslagFormControlName = 'lamnatJobbForslag'; readonly providedSprakStodFormControlName = 'providedSprakStod'; + readonly activitiesFormArrayName = 'activities'; + readonly datesForActivitiesFormArrayName = 'datesForActivities'; + readonly subActivitiesFormArrayName = 'subActivities'; + + constructor(private periodiskRedovisningService: PeriodiskRedovisningService) {} + ngOnInit(): void { - this.initializePeriodiskRedovisningFormGroup(); + this.periodiskRedovisningService.getActivities$().subscribe( + activities => this.initializePeriodiskRedovisningFormGroup(activities) + ); } get lamnatJobbForslagFormControl(): AbstractControl { @@ -30,30 +43,114 @@ export class PeriodiskRedovisningComponent implements OnInit { get providedSprakStodFormControl(): AbstractControl { return this.periodiskRedovisningFormGroup.get(this.providedSprakStodFormControlName); } + get activitiesFormArray(): FormArray { + return this.periodiskRedovisningFormGroup.get(this.activitiesFormArrayName) as FormArray; + } - initializePeriodiskRedovisningFormGroup(): void { + initializePeriodiskRedovisningFormGroup(activitiesList: Activity[]):void { this.periodiskRedovisningFormGroup = new FormGroup({ - lamnatJobbForslag: new FormControl(null, [RequiredValidator()]), - providedSprakStod: new FormControl(null, [RequiredValidator()]), + lamnatJobbForslag: new FormControl(null, [Validators.required]), + providedSprakStod: new FormControl(null, [Validators.required]), + activities: new FormArray([]), + }); + this.getActivitesFormArray(activitiesList); + } + + getActivitesFormArray(activities: Activity[]):void { + activities.forEach(activity => { + const newActivity = [`activity${activity.id}`, 'datesForActivities', 'subActivities', 'comment']; + this.activitiesFormArray.push( + new FormGroup( + Object.fromEntries( + newActivity.map(formCtrlName => [ + formCtrlName, this.getActivtiesFormField(formCtrlName, activity) + ]) + ) + ) + ); }); } - nextStep(): void { - if (this.periodiskRedovisningFormGroup?.valid && this.currentStep < this.totalAmountOfSteps) { - console.log('this.prFormGroup', this.periodiskRedovisningFormGroup); - this.currentStep++; + getActivtiesFormField(formCtrlName: string, activity: Activity):(FormArray | FormControl) { + if (formCtrlName === 'datesForActivities') { + return new FormArray([]); + } else if (formCtrlName === 'subActivities') { + return this.addSubActivitesFormArray(activity?.subActivities, activity.id); } - console.log('this.prFormGroup', this.lamnatJobbForslagFormControl.value); - this.periodiskRedovisningFormGroup?.markAllAsTouched(); + return new FormControl(null, []); } - previousStep(): void { - if (this.currentStep > 1) { + addSelectedDatesToFormArray(datesList: string[]):FormArray { + // TODO: Använd denna metod när datumen valts i kalendern! + const formcontrolNamesList = ['date', 'hours', 'doneOnRemote']; + const datesForActivitiesFormArray = new FormArray([]); + for (let i = 0; i < datesList.length; i++) { + datesForActivitiesFormArray.push( + new FormGroup( + Object.fromEntries( + formcontrolNamesList.map(formCtrlName => [ + formCtrlName, + new FormControl(null, []) + ]) + ) + ) + ); + } + return datesForActivitiesFormArray; + } + + addSubActivitesFormArray(subActivities: SubActivity[], activityId: number):FormArray { + // TODO: lägg till if-sats ex: if !subActivities etc. + if(!subActivities) {return;} + const subActivitiesList = subActivities.map(activity => [`activity${activity.id}`]); + const subActivitiesFormArray = new FormArray([]); + if (activityId === 188 || activityId === 162) { + subActivitiesList.forEach(activity => { + subActivitiesFormArray.push( + new FormGroup( + Object.fromEntries( + activity.map(formCtrlName => [formCtrlName, new FormControl(null, [])]) + ) + ) + ); + }); + } + return subActivitiesFormArray; + } + + getActivityId(formCtrlName: string):number { + if(!formCtrlName.startsWith('activity')) { + return; + } + return Number(formCtrlName.replace('activity', '')); + } + + nextStep():void { + this.submitted = true; + console.log('TESSSSST:::', this.periodiskRedovisningFormGroup.getRawValue()); + this.moveToNextStep = true; + if( + this.currentStep === 1 && + this.lamnatJobbForslagFormControl.valid && + this.providedSprakStodFormControl.valid + ) { + this.moveToNextStep = false; + this.currentStep++; + } else if(this.periodiskRedovisningFormGroup.valid && + this.currentStep === (this.totalAmountOfSteps-2)) { + this.currentStep++; + } + } + + previousStep():void { + this.moveToNextStep = false; + if(this.currentStep > 1) { this.currentStep--; } } - sendRequest(val: boolean): boolean { + sendRequest(val: boolean):boolean { return val; } -} + +} \ No newline at end of file diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning-form.service.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning-form.service.ts deleted file mode 100644 index d4c0cd2..0000000 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning-form.service.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { Injectable } from '@angular/core'; -import { FormGroup } from '@angular/forms'; - -@Injectable({ - providedIn: 'root', -}) -export class PeriodiskRedovisningFormService { - private periodiskRedovisningFormGroup: FormGroup; - - setPeriodiskRedovisningForm(form: FormGroup): void { - this.periodiskRedovisningFormGroup = form; - } - - get periodiskRedovisningForm(): FormGroup { - return this.periodiskRedovisningFormGroup; - } -} diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning.service.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning.service.ts new file mode 100644 index 0000000..a3adbbd --- /dev/null +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/services/periodisk-redovisning.service.ts @@ -0,0 +1,23 @@ +import { HttpClient } from '@angular/common/http'; +import { Injectable } from '@angular/core'; +import { environment } from '@msfa-environment'; +import { Activity, ActivityResponse, mapResponseToActivity } from '@msfa-models/activity.model'; +import { Observable } from 'rxjs'; +import { filter, map } from 'rxjs/operators'; + +@Injectable({ + providedIn: 'root' +}) +export class PeriodiskRedovisningService { + private _apiBaseUrl = `${environment.api.url}`; + + public getActivities$(): Observable { // endpoint ska uppdateras + return this.httpClient.get<{ data: ActivityResponse[] }>(`${this._apiBaseUrl}/activities`).pipe( + filter(response => !!response?.data), + map(({ data }) => data.map(aktivitet => mapResponseToActivity(aktivitet))) + ) + } + + constructor(private httpClient: HttpClient) { } + +} diff --git a/apps/mina-sidor-fa/src/app/shared/models/activity.model.ts b/apps/mina-sidor-fa/src/app/shared/models/activity.model.ts index 9883365..f6e3e55 100644 --- a/apps/mina-sidor-fa/src/app/shared/models/activity.model.ts +++ b/apps/mina-sidor-fa/src/app/shared/models/activity.model.ts @@ -1,25 +1,25 @@ export interface Activity { - activityId: number; - activityName: string; + id: number; + name: string; description?: string; subActivities: SubActivity[]; } export interface SubActivity { id: number; - subActivityName: string; - subActivityDescription: string; + name: string; + description: string; } export interface ActivityResponse { id: number; - activityName: string; + name: string; description?: string; subActivities: SubActivity[]; } export function mapResponseToActivity(data: ActivityResponse): Activity { - const { id, activityName, description, subActivities } = data; + const { id, name, description, subActivities } = data; return { - activityId: id, - activityName, + id, + name, description, subActivities, }; diff --git a/mock-api/mina-sidor-fa/scripts/generate-api.js b/mock-api/mina-sidor-fa/scripts/generate-api.js index cb856f2..f0ae8a2 100644 --- a/mock-api/mina-sidor-fa/scripts/generate-api.js +++ b/mock-api/mina-sidor-fa/scripts/generate-api.js @@ -42,6 +42,7 @@ const generateOrsaksKoderFranvaro = orsaksKoderFranvaro.generate(); const generateOrsaksKoderAvvikelse = orsaksKoderAvvikelse.generate(); const generateKandaAvvikelseKoder = kandaAvvikelseKoder.generate(); const generateFragorForAvvikelser = fragorForAvvikelser.generate(); +const generatedActivites = activities.generate(); generatedAvrop.forEach(({ tjanstekod, tjansteNamn, utforandeVerksamhetId, utforandeverksamhet, kommunKod, kommun }) => { const tjanstExists = avropTjanster.find(tjanst => tjanst.id === tjanstekod);