Added more information inside confirmation-dialogs when submitting reports

This commit is contained in:
Erik Tiekstra
2021-10-11 10:20:12 +02:00
parent 947b39068d
commit 8bcd591a08
9 changed files with 106 additions and 40 deletions

View File

@@ -1,5 +1,9 @@
## 2.1.1 (2021-10-11)
### Features
- **reporting:** Added more information inside confirmation-dialogs when submitting reports. [TV-744](https://jira.arbetsformedlingen.se/browse/TV-744)
### Bug Fixes
- **reporting:** Added better a11y texts for "Avbryt" buttons inside reporting pages. [TV-740](https://jira.arbetsformedlingen.se/browse/TV-740)

View File

@@ -7,8 +7,6 @@
<dl>
<dt>Namn</dt>
<dd>{{avrop.fullName}}</dd>
</dl>
<dl>
<dt>Personnummer</dt>
<dd>
<msfa-hide-text

View File

@@ -90,35 +90,54 @@
</div>
</form>
</ng-template>
</msfa-report-layout>
<digi-ng-dialog
[afActive]="confirmDialogIsOpen$ | async"
(afOnPrimaryClick)="submitAndCloseConfirmDialog()"
(afOnInactive)="cancelConfirmDialog()"
afHeadingLevel="h2"
afPrimaryButtonText="Skicka in"
afSecondaryButtonText="Avbryt"
(afOnSecondaryClick)="cancelConfirmDialog()"
afHeading="Vill du skicka in Avvikelserapport (avvikelse)"
afAriaLabel="Förhandsgranska och skicka in Avvikelserapport (avvikelse)"
id="confirmAvvikelserapport"
>
<dl>
<dt>Orsak till avvikelse:</dt>
<dd>{{(chosenReason$ | async)?.name }}</dd>
<ng-container *ngIf="avvikelseSubmitData$ | async; let avvikelseSubmitData; else loadingRef">
<ng-container *ngFor="let question of avvikelseSubmitData.avvikelseAlternativ.frageformular">
<dt>{{getCurrentQuestionFromId(question.fraga).name}}</dt>
<dd>{{question.svar.length === 0 ? 'Inget svar' : question.svar }}</dd>
<digi-ng-dialog
[afActive]="confirmDialogIsOpen$ | async"
(afOnPrimaryClick)="submitAndCloseConfirmDialog()"
(afOnInactive)="cancelConfirmDialog()"
afHeadingLevel="h2"
afPrimaryButtonText="Skicka in"
afSecondaryButtonText="Avbryt"
(afOnSecondaryClick)="cancelConfirmDialog()"
afHeading="Vill du skicka in Avvikelserapport (avvikelse)"
afAriaLabel="Förhandsgranska och skicka in Avvikelserapport (avvikelse)"
id="confirmAvvikelserapport"
>
<dl>
<dt>Namn</dt>
<dd>{{avrop.fullName}}</dd>
<dt>Personnummer</dt>
<dd>
<msfa-hide-text
symbols="********-****"
[changingText]="avrop.ssn"
ariaLabelType="Personnummer"
></msfa-hide-text>
</dd>
<dt>Tjänst</dt>
<dd>{{avrop.tjanst}}</dd>
<dt>Startdatum</dt>
<dd>
<digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time>
</dd>
<dt>Slutdatum</dt>
<dd>
<digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
</dd>
<dt>Orsak till avvikelse:</dt>
<dd>{{(chosenReason$ | async)?.name }}</dd>
<ng-container *ngIf="avvikelseSubmitData$ | async; let avvikelseSubmitData; else loadingRef">
<ng-container *ngFor="let question of avvikelseSubmitData.avvikelseAlternativ.frageformular">
<dt>{{getCurrentQuestionFromId(question.fraga).name}}</dt>
<dd>{{question.svar.length === 0 ? 'Inget svar' : question.svar }}</dd>
</ng-container>
<dt>Dag för avvikelse:</dt>
<dd>{{avvikelseSubmitData.avvikelseAlternativ.rapporteringsdatum }}</dd>
</ng-container>
<dt>Dag för avvikelse:</dt>
<dd>{{avvikelseSubmitData.avvikelseAlternativ.rapporteringsdatum }}</dd>
</ng-container>
</dl>
</dl>
<msfa-loader *ngIf="submitIsLoading$ | async"></msfa-loader>
</digi-ng-dialog>
<msfa-loader *ngIf="submitIsLoading$ | async"></msfa-loader>
</digi-ng-dialog>
</msfa-report-layout>
</msfa-layout>
<ng-template #skeletonRef>
<digi-ng-skeleton-base [afCount]="3" afText="Laddar data för avvikelserapport"></digi-ng-skeleton-base>

View File

@@ -1,22 +1,23 @@
import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog';
import { DigiNgFormDatepickerModule } from '@af/digi-ng/_form/form-datepicker';
import { DigiNgFormInputModule } from '@af/digi-ng/_form/form-input';
import { DigiNgFormRadiobuttonGroupModule } from '@af/digi-ng/_form/form-radiobutton-group';
import { DigiNgFormSelectModule } from '@af/digi-ng/_form/form-select';
import { DigiNgFormTextareaModule } from '@af/digi-ng/_form/form-textarea';
import { DigiNgProgressProgressbarModule } from '@af/digi-ng/_progress/progressbar';
import { DigiNgSkeletonBaseModule } from '@af/digi-ng/_skeleton/skeleton-base';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/confirm-dialog.module';
import { HideTextModule } from '@msfa-shared/components/hide-text/hide-text.module';
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { LoaderModule } from '@msfa-shared/components/loader/loader.module';
import { ReportLayoutModule } from '../components/report-layout/report-layout.module';
import { DeltagareAvvikelserapportComponent } from './deltagare-avvikelserapport.component';
import { DeltagareAvvikelserapportService } from './deltagare-avvikelserapport.service';
import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
import { DigiNgSkeletonBaseModule } from '@af/digi-ng/_skeleton/skeleton-base';
import { DigiNgFormSelectModule } from '@af/digi-ng/_form/form-select';
import { LoaderModule } from '@msfa-shared/components/loader/loader.module';
import { DigiNgFormInputModule } from '@af/digi-ng/_form/form-input';
import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog';
@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
@@ -36,6 +37,7 @@ import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog';
DigiNgSkeletonBaseModule,
DigiNgFormSelectModule,
LoaderModule,
HideTextModule,
DigiNgFormInputModule,
DigiNgDialogModule,
],

View File

@@ -105,6 +105,23 @@
(confirmDialogChanged)="closeConfirmDialogAndProceed($event, genomforandeReferens)"
>
<dl>
<dt>Namn</dt>
<dd>{{avrop.fullName}}</dd>
<dt>Personnummer</dt>
<dd>
<msfa-hide-text
symbols="********-****"
[changingText]="avrop.ssn"
ariaLabelType="Personnummer"
></msfa-hide-text>
</dd>
<dt>Tjänst</dt>
<dd>{{avrop.tjanst}}</dd>
<dt>Avser period</dt>
<dd>
<digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time> -
<digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
</dd>
<dt>Deltar arbetssökande på distans?</dt>
<dd>{{gpFormGroup.value.distance ? 'Ja' : 'Nej'}}</dd>
<dt>Aktiviteter</dt>

View File

@@ -8,6 +8,7 @@ import { ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/confirm-dialog.module';
import { HideTextModule } from '@msfa-shared/components/hide-text/hide-text.module';
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { LoaderModule } from '@msfa-shared/components/loader/loader.module';
import { ReportLayoutModule } from '../components/report-layout/report-layout.module';
@@ -27,6 +28,7 @@ import { DeltagareGemensamPlaneringComponent } from './deltagare-gemensam-planer
ConfirmDialogModule,
BackLinkModule,
LoaderModule,
HideTextModule,
DigiNgSkeletonBaseModule,
DigiNgFormCheckboxModule,
],

View File

@@ -276,10 +276,28 @@
(confirmDialogChanged)="closeConfirmDialogAndProceed($event, genomforandeReferens)"
>
<dl *ngIf="reasons$ | async as reasons">
<ng-container *ngIf="reasons$ | async as reasons">
<dt>Orsak till frånvaro</dt>
<dd>{{getReasonNameFromValue(reasons, reasonFormControl.value)}}</dd>
</ng-container>
<dt>Namn</dt>
<dd>{{avrop.fullName}}</dd>
<dt>Personnummer</dt>
<dd>
<msfa-hide-text
symbols="********-****"
[changingText]="avrop.ssn"
ariaLabelType="Personnummer"
></msfa-hide-text>
</dd>
<dt>Tjänst</dt>
<dd>{{avrop.tjanst}}</dd>
<dt>Startdatum</dt>
<dd>
<digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time>
</dd>
<dt>Slutdatum</dt>
<dd>
<digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
</dd>
<dt>Orsak till frånvaro</dt>
<dd>{{getReasonNameFromValue(reasons, reasonFormControl.value)}}</dd>
<ng-container *ngIf="showOtherKnownReasonsSelect">
<ng-container *ngIf="otherKnownReasons$ | async as otherKnownReasons">
<dt>Annan känd orsak</dt>

View File

@@ -11,6 +11,7 @@ import { ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/confirm-dialog.module';
import { HideTextModule } from '@msfa-shared/components/hide-text/hide-text.module';
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { LoaderModule } from '@msfa-shared/components/loader/loader.module';
import { ReportLayoutModule } from '../components/report-layout/report-layout.module';
@@ -29,6 +30,7 @@ import { FranvaroReportService } from './franvaro-report.service';
LoaderModule,
BackLinkModule,
ConfirmDialogModule,
HideTextModule,
DigiNgFormSelectModule,
DigiNgFormDatepickerModule,
DigiNgFormRadiobuttonGroupModule,

View File

@@ -1,5 +1,9 @@
## 2.1.1 (2021-10-11)
### Features
- **reporting:** Added more information inside confirmation-dialogs when submitting reports. [TV-744](https://jira.arbetsformedlingen.se/browse/TV-744)
### Bug Fixes
- **reporting:** Added better a11y texts for "Avbryt" buttons inside reporting pages. [TV-740](https://jira.arbetsformedlingen.se/browse/TV-740)