From 8909f7c3d1e91833988c69d1f8485cd217654e32 Mon Sep 17 00:00:00 2001 From: Daniel Appelgren Date: Thu, 30 Dec 2021 14:18:58 +0100 Subject: [PATCH] =?UTF-8?q?feature(Avvikelserapporten):=20Anv=C3=A4nd=20ny?= =?UTF-8?q?a=20dialogen=20(TV-845)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Merge in TEA/mina-sidor-fa-web from feature/TV-845-ersätt-dialogen-i-Avvikelserapporten-(TV-845) to develop Squashed commit of the following: commit 780f93baab0891a2f2ba49bf14d2c3add99e03c8 Author: Daniel Appelgren Date: Thu Dec 30 11:27:28 2021 +0100 Update avvikelse-report-form.component.ts commit bea883f6aedfe2655efbb69d66788c1366e48a43 Author: Daniel Appelgren Date: Thu Dec 30 11:19:03 2021 +0100 cleanup commit ffdf13dfcb3d97960ddb585b09fa5e6446504a68 Author: Daniel Appelgren Date: Wed Dec 29 15:52:37 2021 +0100 Update app.component.ts commit 1631cb763bc7023a9e95682272fb63dcbe15d84e Author: Daniel Appelgren Date: Wed Dec 29 15:52:03 2021 +0100 fix deltagarelist commit c6080ac50cb6773aac8d4e45336fc1ba2f053a8d Author: Daniel Appelgren Date: Wed Dec 29 15:24:44 2021 +0100 Update avrop.component.html commit 85057d0860ddceef8309253c983a1674a57291c4 Author: Daniel Appelgren Date: Wed Dec 29 15:21:33 2021 +0100 wip commit a73164bda8a8ae06c5700e382e197d823bef6767 Author: Daniel Appelgren Date: Wed Dec 29 15:20:04 2021 +0100 wip commit 83f3ada5c4c60c9e46d7b01bbbf92053eb1b29ff Author: Daniel Appelgren Date: Wed Dec 29 15:18:30 2021 +0100 wip commit 5e184bc0e1a3f7bb6a3040d4da54a9b0e562dad3 Author: Daniel Appelgren Date: Wed Dec 29 14:18:39 2021 +0100 wip commit 30a90ce726dde31974e26c974215f6a5a60b025e Author: Daniel Appelgren Date: Tue Dec 28 15:11:14 2021 +0100 added scrollbars inside dialog commit 600dd20f3281b4206c12d851cba91ae0ecf1e21a Merge: 7af19054 b9434741 Author: Daniel Appelgren Date: Tue Dec 28 14:30:49 2021 +0100 Merge branch 'develop' into feature/TV-845-ersätt-dialogen-i-Avvikelserapporten-(TV-845) commit 7af190549c0109f71af87157e8099aa0483c879f Author: Daniel Appelgren Date: Tue Dec 28 12:05:22 2021 +0100 wip commit 6e47e4a641daf4cef121e96c3855e4ce4944c6c4 Author: Daniel Appelgren Date: Tue Dec 28 09:38:36 2021 +0100 wip commit f9354d04f51425cce29f13a10b32555113edaaa2 Author: Daniel Appelgren Date: Tue Dec 28 09:16:54 2021 +0100 feature(Nya deltagare): Använd nya dialogen (TV-845) --- apps/mina-sidor-fa/src/app/app.component.ts | 1 + .../employee-delete.component.html | 58 +++++------ .../employee-delete/employee-delete.module.ts | 7 +- .../src/app/pages/avrop/avrop.component.html | 3 +- .../src/app/pages/avrop/avrop.component.ts | 4 +- .../src/app/pages/avrop/avrop.module.ts | 4 +- .../avvikelse-confirm-dialog.component.html | 30 ++++++ .../avvikelse-confirm-dialog.component.scss | 0 ...avvikelse-confirm-dialog.component.spec.ts | 25 +++++ .../avvikelse-confirm-dialog.component.ts | 49 ++++++++++ .../avvikelse-report-form.component.html | 47 +++------ .../avvikelse-report-form.component.ts | 95 ++++++++++--------- .../avvikelse-report-form.module.ts | 7 +- ...agare-list-handelser-dialog.component.html | 2 - .../deltagare-list-table.component.ts | 2 + .../ui-dialog-layout.component.html | 14 +++ .../ui-dialog-layout.component.scss | 40 ++++++++ .../ui-dialog-layout.component.spec.ts | 25 +++++ .../ui-dialog-layout.component.ts | 11 +++ libs/ui/src/dialog/ui-dialog-ref.ts | 6 ++ libs/ui/src/dialog/ui-dialog.component.html | 28 +++--- libs/ui/src/dialog/ui-dialog.component.scss | 12 +++ libs/ui/src/dialog/ui-dialog.component.ts | 7 ++ libs/ui/src/dialog/ui-dialog.model.ts | 3 + libs/ui/src/dialog/ui-dialog.module.ts | 7 +- libs/ui/src/dialog/ui-dialog.service.ts | 14 +-- 26 files changed, 359 insertions(+), 142 deletions(-) create mode 100644 apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.html create mode 100644 apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.scss create mode 100644 apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.spec.ts create mode 100644 apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.ts create mode 100644 libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.html create mode 100644 libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.scss create mode 100644 libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.spec.ts create mode 100644 libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.ts diff --git a/apps/mina-sidor-fa/src/app/app.component.ts b/apps/mina-sidor-fa/src/app/app.component.ts index 6ac7cbc..9d48483 100644 --- a/apps/mina-sidor-fa/src/app/app.component.ts +++ b/apps/mina-sidor-fa/src/app/app.component.ts @@ -33,6 +33,7 @@ export class AppComponent extends UnsubscribeDirective implements OnInit { private _dialogRef: UiDialogRef; private _userIsIdle$: Observable = this.idleService.isIdle$; private _idleDialogConfig: UiDialogConfig = { + includeBasicFooter: true, primaryButtonText: 'Fortsätt sessionen', primaryAction: () => this.setUserAsActive(), secondaryButtonText: 'Logga ut', diff --git a/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.component.html b/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.component.html index 2d42c3e..216eeb7 100644 --- a/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.component.html +++ b/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.component.html @@ -1,32 +1,32 @@ - - - -

Personalkonto för {{deleteEmployeeData.lastDeleted.fullName}} är borttaget.

- - - -

Är du säker på att du vill ta bort personalkontot för {{deleteEmployeeData.toDelete.fullName}}?

- + + + + + + + + + + + + + + + + + + + - - -

- Vi kunde inte radera personalkontot för {{deleteEmployeeData.toDelete.fullName}}. Ladda om sidan och försök - igen. -

-

{{error.message}}

- - - + + + + + + + + + + diff --git a/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.module.ts b/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.module.ts index 04e7406..e46d5a1 100644 --- a/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.module.ts +++ b/apps/mina-sidor-fa/src/app/pages/administration/components/employee-delete/employee-delete.module.ts @@ -1,4 +1,3 @@ -import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog'; import { CommonModule } from '@angular/common'; import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -7,7 +6,11 @@ import { EmployeeDeleteComponent } from './employee-delete.component'; @NgModule({ schemas: [CUSTOM_ELEMENTS_SCHEMA], declarations: [EmployeeDeleteComponent], - imports: [CommonModule, RouterModule, DigiNgDialogModule], + imports: [ + CommonModule, + RouterModule, + // DigiNgDialogModule + ], exports: [EmployeeDeleteComponent], }) export class EmployeeDeleteModule {} diff --git a/apps/mina-sidor-fa/src/app/pages/avrop/avrop.component.html b/apps/mina-sidor-fa/src/app/pages/avrop/avrop.component.html index 5f1f731..a59ce5e 100644 --- a/apps/mina-sidor-fa/src/app/pages/avrop/avrop.component.html +++ b/apps/mina-sidor-fa/src/app/pages/avrop/avrop.component.html @@ -86,8 +86,6 @@ -

Information

-

Genomförandereferens

Genomförandereferens är det referensnummer du ska använda dig av i kontakten med Arbetsförmedlingen. Du kan också använda genomförandereferensen till att leta fram en order i leverantörsportalen. @@ -109,6 +107,7 @@ språkstöd som ingår i upphandlingen av olika tjänster och utbildningar. Du hittar mer information om språkstöd och tolk i förfrågningsunderlaget för specifik upphandling.

+ ; + uiDialogRef: UiDialogRef; readonly totalAmountOfSteps = 3; currentStep$: Observable = this.avropService.currentStep$; error$: Observable = this.avropService.error$; @@ -77,6 +79,6 @@ export class AvropComponent implements OnDestroy { } openAvropDialog(): void { - this.uiDialog.open(this.informationDialog); + this.uiDialogRef = this.uiDialog.open(this.informationDialog, { heading: 'Information', includeBasicFooter: true }); } } diff --git a/apps/mina-sidor-fa/src/app/pages/avrop/avrop.module.ts b/apps/mina-sidor-fa/src/app/pages/avrop/avrop.module.ts index 30bb3bf..926abf0 100644 --- a/apps/mina-sidor-fa/src/app/pages/avrop/avrop.module.ts +++ b/apps/mina-sidor-fa/src/app/pages/avrop/avrop.module.ts @@ -9,7 +9,7 @@ import { UiSkeletonModule } from '@ui/skeleton/skeleton.module'; import { AvropComponent } from './avrop.component'; import { AvropFiltersModule } from './components/avrop-filters/avrop-filters.module'; import { AvropListModule } from './components/avrop-list/avrop-list.module'; -import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog'; +import { UiDialogModule } from '@ui/dialog/ui-dialog.module'; @NgModule({ schemas: [CUSTOM_ELEMENTS_SCHEMA], @@ -24,7 +24,7 @@ import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog'; UiLoaderModule, HandledarePickerFormModule, UnauthorizedAlertModule, - DigiNgDialogModule, + UiDialogModule, ], }) export class AvropModule {} diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.html new file mode 100644 index 0000000..a810a36 --- /dev/null +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.html @@ -0,0 +1,30 @@ + +

Vill du skicka in Avvikelserapport (avvikelse)

+ + +
Orsak till avvikelse:
+
{{data.chosenReason.name }}
+ +
{{question.svar.length === 0 ? 'Inget svar' : question.svar }}
+ +
Dag för avvikelse:
+
{{data.avvikelseSubmitData.avvikelseAlternativ.rapporteringsdatum }}
+ + + +

Kunde inte spara Avvikelserapport (frånvaro). Ladda om sidan och försök igen.

+

{{error.message}}

+ + + + Skicka in + Avbryt + + diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.spec.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.spec.ts new file mode 100644 index 0000000..144d088 --- /dev/null +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AvvikelseConfirmDialogComponent } from './avvikelse-confirm-dialog.component'; + +describe('AvvikelseConfirmDialogComponent', () => { + let component: AvvikelseConfirmDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ AvvikelseConfirmDialogComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(AvvikelseConfirmDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.ts new file mode 100644 index 0000000..b0ec65e --- /dev/null +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-confirm-dialog/avvikelse-confirm-dialog.component.ts @@ -0,0 +1,49 @@ +import { Component } from '@angular/core'; +import { UiDialogRef } from '@ui/dialog/ui-dialog-ref'; +import { DeltagareAvrop } from '@msfa-models/avrop.model'; +import { AvvikelseReason } from '@msfa-models/avvikelse-reason.model'; +import { AvvikelseReportRequest } from '@msfa-models/api/avvikelse-request.model'; +import { AvvikelseReportFormService } from '../avvikelse-report-form.service'; +import { CustomError } from '@msfa-models/error/custom-error'; +import { BehaviorSubject } from 'rxjs'; + +export interface AvvikelseConfirmDialogData { + avrop: DeltagareAvrop; + chosenReason: AvvikelseReason; + avvikelseSubmitData: AvvikelseReportRequest; +} +@Component({ + selector: 'msfa-avvikelse-confirm-dialog', + templateUrl: './avvikelse-confirm-dialog.component.html', + styleUrls: ['./avvikelse-confirm-dialog.component.scss'], +}) +export class AvvikelseConfirmDialogComponent { + submitIsLoading$ = new BehaviorSubject(false); + submitError$ = new BehaviorSubject(null); + + constructor(public uiDialogRef: UiDialogRef, private avvikelseReportFormService: AvvikelseReportFormService) {} + + get data(): AvvikelseConfirmDialogData { + return this.uiDialogRef.config.data as AvvikelseConfirmDialogData; + } + + close(): void { + this.uiDialogRef.close(); + } + + submitAndCloseConfirmDialog(avvikelseSubmitData: AvvikelseReportRequest): void { + this.submitIsLoading$.next(true); + this.avvikelseReportFormService.createAvvikelse$(avvikelseSubmitData).subscribe({ + next: () => { + this.submitIsLoading$.next(false); + this.uiDialogRef.close({ submitted: new Date() }); + }, + error: (customError: CustomError) => { + this.submitError$.next({ ...customError, message: customError.error.message }); + + this.submitIsLoading$.next(false); + throw { ...customError, avoidToast: true }; + }, + }); + } +} diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.html index ef3b7a8..a0d6318 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.html +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.html @@ -33,7 +33,11 @@ -
+
- - - -
Orsak till avvikelse:
-
{{(chosenReason$ | async)?.name }}
- - -
{{getCurrentQuestionFromId(question.fraga).name}}
-
{{question.svar.length === 0 ? 'Inget svar' : question.svar }}
- -
Dag för avvikelse:
-
{{avvikelseSubmitData.avvikelseAlternativ.rapporteringsdatum }}
- - - -

Kunde inte spara Avvikelserapport (avvikelse). Ladda om sidan och försök igen.

-

{{error.message}}

- - +

Kunde inte spara Avvikelserapport (avvikelse). Försök igen om en stund.

+

{{error.message}}

+ diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.ts index 1d38f62..5fd4831 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.ts +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.ts @@ -12,8 +12,14 @@ import { RegexValidator } from '@msfa-utils/validators/regex.validator'; import { RequiredValidator } from '@msfa-validators/required.validator'; import { addDays } from 'date-fns'; import { BehaviorSubject, combineLatest, Observable, Subscription } from 'rxjs'; -import { map, shareReplay, switchMap, take } from 'rxjs/operators'; +import { first, map, shareReplay, switchMap, tap } from 'rxjs/operators'; import { AvvikelseReportFormService } from './avvikelse-report-form.service'; +import { UiDialog } from '@ui/dialog/ui-dialog.service'; +import { UiDialogRef } from '@ui/dialog/ui-dialog-ref'; +import { + AvvikelseConfirmDialogComponent, + AvvikelseConfirmDialogData, +} from './avvikelse-confirm-dialog/avvikelse-confirm-dialog.component'; interface Params { genomforandeReferens: string; @@ -34,20 +40,22 @@ type AvvikelseFormKeys = keyof AvvikelseFormData; changeDetection: ChangeDetectionStrategy.OnPush, }) export class AvvikelseReportFormComponent implements OnInit, OnDestroy { + confirmDialogRef: UiDialogRef; shouldValidate$ = new BehaviorSubject(false); reasonFormName: AvvikelseFormKeys = 'reason'; questionsFormName: AvvikelseFormKeys = 'questions'; reportingDateFormName: AvvikelseFormKeys = 'reportingDate'; - submitIsLoading$ = new BehaviorSubject(false); submitError$ = new BehaviorSubject(null); genomforandeReferens$: Observable = this.activatedRoute.params.pipe( map((params: Params) => +params.genomforandeReferens) ); + avrop: DeltagareAvrop; avrop$: Observable = this.genomforandeReferens$.pipe( switchMap(genomforandeReferens => this.avvikelseReportFormService.fetchAvropInformation$(genomforandeReferens)), + tap(avrop => (this.avrop = avrop)), shareReplay(1) ); @@ -60,8 +68,6 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { chosenReasonId$: Observable; chosenReason$: Observable; questionsForChosenReason$: Observable; - avvikelseSubmitData$: Observable; - confirmDialogIsOpen$ = new BehaviorSubject(false); submittedDate$ = new BehaviorSubject(null); private subscriptions: Subscription[] = []; private todayDateISO = new Date().toISOString().slice(0, 10); @@ -70,11 +76,19 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { [this.reportingDateFormName]: new FormControl(this.todayDateISO, [RequiredValidator('Datum är obligatoriskt')]), [this.questionsFormName]: new FormArray([]), }); - private formData$: Observable = this.avvikelseFormGroup - .valueChanges as Observable; private currentQuestions: AvvikelseQuestion[]; - constructor(private avvikelseReportFormService: AvvikelseReportFormService, private activatedRoute: ActivatedRoute) {} + constructor( + private avvikelseReportFormService: AvvikelseReportFormService, + private activatedRoute: ActivatedRoute, + private uiDialog: UiDialog + ) { + this.chosenReasonId$ = this.reasonFormControl.valueChanges as Observable; + this.chosenReason$ = combineLatest([this.chosenReasonId$, this.reasons$]).pipe( + map(([chosenReasonId, reasons]) => reasons.find(reason => reason.id.toString() === chosenReasonId)), + shareReplay(1) + ); + } get reasonFormControl(): AbstractControl | undefined { return this.avvikelseFormGroup.get(this.reasonFormName); @@ -93,11 +107,6 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { } ngOnInit(): void { - this.chosenReasonId$ = this.reasonFormControl.valueChanges as Observable; - this.chosenReason$ = combineLatest([this.chosenReasonId$, this.reasons$]).pipe( - map(([chosenReasonId, reasons]) => reasons.find(reason => reason.id.toString() === chosenReasonId)) - ); - this.questionsForChosenReason$ = combineLatest([this.chosenReasonId$, this.allAvvikelseQuestions$]).pipe( map(([chosenOrsak, allAvvikelseQuestions]) => { return allAvvikelseQuestions.filter(question => question.id.startsWith(chosenOrsak.toString() + '_')); @@ -105,21 +114,15 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { ); this.subscriptions.push( - this.chosenReason$.subscribe(() => { + this.chosenReason$.subscribe(chosenReason => { this.shouldValidate$.next(false); }), + this.questionsForChosenReason$.subscribe(questions => { this.clearQuestions(); questions.forEach(question => this.addQuestionToForm(question)); }) ); - - this.avvikelseSubmitData$ = combineLatest([this.genomforandeReferens$, this.chosenReasonId$, this.formData$]).pipe( - map(([genomforandeReferens, chosenReason, formData]) => - this.makeAvvikelseSubmitData(genomforandeReferens, chosenReason, formData) - ), - shareReplay(1) - ); } questionIsRequired(question: AvvikelseQuestion): boolean { @@ -138,6 +141,7 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { private _isAfterStartDate(startDate: Date): boolean { return new Date() > startDate; } + private _isBeforeLastPossibleReportDay(endDate: Date): boolean { // Reporting is allowed at latest 5 days past avrop end date. // Because it's workdays and not calendar days we temporarily set this to much more. This date should be fetched from API in the future @@ -158,44 +162,41 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { } } - openConfirmDialog(): void { + openConfirmDialog(avrop: DeltagareAvrop): void { this.shouldValidate$.next(true); markControlsAsDirty(Object.values(this.avvikelseFormGroup.controls)); this.avvikelseFormGroup.markAllAsTouched(); if (this.avvikelseFormGroup.valid) { - this.confirmDialogIsOpen$.next(true); + combineLatest([this.chosenReason$, this.genomforandeReferens$]) + .pipe( + first(), + switchMap(([chosenReason, genomforandeReferens]) => { + const avvikelseSubmitData: AvvikelseReportRequest = this._makeAvvikelseSubmitData( + genomforandeReferens, + chosenReason.id.toString(), + this.avvikelseFormGroup.value as AvvikelseFormData + ); + + const data: AvvikelseConfirmDialogData = { chosenReason, avvikelseSubmitData, avrop }; + + return this.uiDialog.open<{ submitted: Date }>(AvvikelseConfirmDialogComponent, { data }).afterClosed$; + }) + ) + .subscribe(closedResult => { + this.submitError$.next(null); + if (closedResult.data?.submitted) { + this.submittedDate$.next(closedResult.data.submitted); + } + }); } } - submitAndCloseConfirmDialog(): void { - this.submitIsLoading$.next(true); - this.avvikelseSubmitData$.pipe(take(1)).subscribe(avvikelseSubmitData => - this.avvikelseReportFormService.createAvvikelse$(avvikelseSubmitData).subscribe({ - next: () => { - this.submitIsLoading$.next(false); - this.submittedDate$.next(new Date()); - this.confirmDialogIsOpen$.next(false); - }, - error: (customError: CustomError) => { - this.submitError$.next({ ...customError, message: customError.error.message }); - this.submitIsLoading$.next(false); - throw { ...customError, avoidToast: true }; - }, - }) - ); - } - - cancelConfirmDialog(): void { - this.confirmDialogIsOpen$.next(false); - this.submitError$.next(null); - } - ngOnDestroy(): void { this.subscriptions.forEach(subscription => subscription.unsubscribe()); } - private makeAvvikelseSubmitData( + private _makeAvvikelseSubmitData( genomforandeReferens: number, chosenReason: string, formData: AvvikelseFormData @@ -219,6 +220,8 @@ export class AvvikelseReportFormComponent implements OnInit, OnDestroy { private addQuestionToForm(question: AvvikelseQuestion): void { // FormArray doesnt hold any IDs so we need to store these seperately and rebuild structure at submit + // TODO we can actually just put id in the formgroup, as we do in slutredovisning-form-step1.component.ts. That would simplify this file. + this.currentQuestions.push(question); this.questionsFormArray.push( diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.module.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.module.ts index a79c06f..e0d2b98 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.module.ts +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.module.ts @@ -1,4 +1,3 @@ -import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog'; import { DigiNgFormDatepickerModule } from '@af/digi-ng/_form/form-datepicker'; import { CommonModule } from '@angular/common'; import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; @@ -17,10 +16,12 @@ import { ReportDescriptionListModule } from '../../../components/report-descript import { ReportLayoutModule } from '../../../components/report-layout/report-layout.module'; import { AvvikelseReportFormComponent } from './avvikelse-report-form.component'; import { AvvikelseReportFormService } from './avvikelse-report-form.service'; +import { AvvikelseConfirmDialogComponent } from './avvikelse-confirm-dialog/avvikelse-confirm-dialog.component'; +import { UiDialogModule } from '@ui/dialog/ui-dialog.module'; @NgModule({ schemas: [CUSTOM_ELEMENTS_SCHEMA], - declarations: [AvvikelseReportFormComponent], + declarations: [AvvikelseReportFormComponent, AvvikelseConfirmDialogComponent], imports: [ CommonModule, RouterModule.forChild([{ path: '', component: AvvikelseReportFormComponent }]), @@ -34,10 +35,10 @@ import { AvvikelseReportFormService } from './avvikelse-report-form.service'; UiLoaderModule, UiSelectModule, ReportDescriptionListModule, - DigiNgDialogModule, UiTextareaModule, UiLinkButtonModule, PreventDoubleSubmitModule, + UiDialogModule, ], providers: [AvvikelseReportFormService], exports: [AvvikelseReportFormComponent], diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html index 187920f..cc9c5d8 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-handelser-dialog/deltagare-list-handelser-dialog.component.html @@ -1,5 +1,3 @@ -

Händelser för {{deltagare.fullName}}

-

{{deltagare.fullName}}

Genomförandereferens: {{deltagare.genomforandeReferens}}

diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts index 325e656..8e9e12f 100644 --- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts +++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-list/components/deltagare-list-table/deltagare-list-table.component.ts @@ -85,7 +85,9 @@ export class DeltagareListTableComponent { openHandelser(singleDeltagare: DeltagareCompact): void { this.uiDialog.open(this.handelserDialogComponent, { data: singleDeltagare, + heading: 'Händelser för ' + singleDeltagare.fullName, primaryButtonText: 'Stäng', + includeBasicFooter: true, }); } diff --git a/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.html b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.html new file mode 100644 index 0000000..205d2e3 --- /dev/null +++ b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.html @@ -0,0 +1,14 @@ +
+ +
+ +
+ +
+ +
+ +
+ +
+
diff --git a/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.scss b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.scss new file mode 100644 index 0000000..a35b782 --- /dev/null +++ b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.scss @@ -0,0 +1,40 @@ +@import 'variables/shadows'; +@import 'variables/gutters'; + +.ui-dialog-layout { + padding-top: $digi--layout--gutter--s; + display: flex; + flex-direction: column; + gap: $digi--layout--gutter--s; + max-height: 90vh; + &__heading { + flex: 1 1 2rem; + } + &__scrollable-content { + overflow: auto; + flex-grow: 1; + } + + &__close-button { + position: absolute; + top: var(--digi--layout--gutter); + right: var(--digi--layout--gutter--s); + background: transparent; + border: none; + display: flex; + justify-content: center; + align-items: center; + } + + &__close-button-text { + font-size: var(--digi--typography--font-size--s); + } + + &__footer { + flex: 1 0 4rem; + min-height: var(--digi--layout--gutter); + display: flex; + margin-top: $digi--layout--gutter--l; + gap: var(--digi--layout--gutter); + } +} diff --git a/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.spec.ts b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.spec.ts new file mode 100644 index 0000000..9060348 --- /dev/null +++ b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { UiDialogLayoutComponent } from './ui-dialog-layout.component'; + +describe('UiDialogLayoutComponent', () => { + let component: UiDialogLayoutComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ UiDialogLayoutComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(UiDialogLayoutComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.ts b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.ts new file mode 100644 index 0000000..0b11e60 --- /dev/null +++ b/libs/ui/src/dialog/ui-dialog-layout/ui-dialog-layout.component.ts @@ -0,0 +1,11 @@ +import { Component, Input } from '@angular/core'; + +@Component({ + selector: 'ui-dialog-layout', + templateUrl: './ui-dialog-layout.component.html', + styleUrls: ['./ui-dialog-layout.component.scss'], +}) +export class UiDialogLayoutComponent { + @Input() uiHeading: string; + @Input() isLoading = false; +} diff --git a/libs/ui/src/dialog/ui-dialog-ref.ts b/libs/ui/src/dialog/ui-dialog-ref.ts index dc69b69..2639daa 100644 --- a/libs/ui/src/dialog/ui-dialog-ref.ts +++ b/libs/ui/src/dialog/ui-dialog-ref.ts @@ -21,12 +21,18 @@ export class UiDialogRef { overlay.backdropClick().subscribe(() => this._close('backdropClick', null)); } + get includeBasicFooter(): boolean { + return this.config.includeBasicFooter; + } get primaryButtonText(): string { return this.config.primaryButtonText; } get secondaryButtonText(): string { return this.config.secondaryButtonText; } + get heading(): string { + return this.config.heading; + } close(data?: CloseResponseData): void { this._close('close', data); diff --git a/libs/ui/src/dialog/ui-dialog.component.html b/libs/ui/src/dialog/ui-dialog.component.html index fb4db96..dba7126 100644 --- a/libs/ui/src/dialog/ui-dialog.component.html +++ b/libs/ui/src/dialog/ui-dialog.component.html @@ -1,21 +1,25 @@
- - -
+

{{heading}}

+
+ +
-
- +
+ Stäng +
+ - - - + + + - - + + + - +
-