-
+
@@ -208,11 +229,7 @@
class="msfa__digi-icon periodisk-redovisning-form__activity-check"
aria-hidden="true"
>
-
- {{getActivityMetadata(activity.id).name}}: {{ activity.performedRemotely &&
- activity.performedPhysically ? 'på distans och på plats' : activity.performedRemotely ? 'på
- distans' : 'på plats'}}
-
+
{{getActivityInfoAsString(activity)}}
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.scss
index bd4c4dd..1e0442f 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.scss
@@ -42,18 +42,27 @@
&__no-activities-has-been-conducted-checkbox,
&__activity,
- &__activity-location {
+ &__activity-group {
display: flex;
flex-direction: column;
gap: var(--digi--layout--gutter--s);
}
+ &__activity-hours {
+ ::ng-deep .digi-form-input__content {
+ max-width: 10rem;
+ }
+ }
+
&__no-activities-has-been-conducted-checkbox {
margin-bottom: $digi--layout--gutter--l;
}
- &__activity-location {
- margin-left: var(--digi--layout--gutter);
+ &__activity-details {
+ display: flex;
+ flex-direction: column;
+ gap: var(--digi--layout--gutter);
+ margin-left: 1.875rem;
margin-bottom: var(--digi--layout--gutter--s);
}
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts
index 7b60c2e..6f88a3a 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts
@@ -181,6 +181,7 @@ export class PeriodiskRedovisningFormComponent implements OnInit {
isSelected: new FormControl(),
performedRemotely: new FormControl(),
performedPhysically: new FormControl(),
+ hours: new FormControl(),
},
PeriodiskRedovisningValidator.activityIsValid()
)
@@ -200,14 +201,20 @@ export class PeriodiskRedovisningFormComponent implements OnInit {
): PeriodiskRedovisningRequest {
const { period, hasOfferedJob, hasOfferedLanguageSupport } = formData;
const activities: PeriodiskRedovisningActivityRequest[] = formData.activities
- .map(({ performedPhysically, performedRemotely, isSelected }, index) => ({
+ .map(({ performedPhysically, performedRemotely, isSelected, hours }, index) => ({
id: this.activitiesFormArrayMetadata[index].id,
performedPhysically: performedPhysically ?? false,
performedRemotely: performedRemotely ?? false,
+ hours: +hours,
isSelected,
}))
.filter(activity => activity.isSelected)
- .map(({ id, performedPhysically, performedRemotely }) => ({ id, performedPhysically, performedRemotely }));
+ .map(({ id, performedPhysically, performedRemotely, hours }) => ({
+ id,
+ performedPhysically,
+ performedRemotely,
+ hours,
+ }));
return {
genomforandeReferens,
period,
@@ -226,10 +233,27 @@ export class PeriodiskRedovisningFormComponent implements OnInit {
return this.formControlIsInvalid(activityFormGroup) && !!errors.locationCheckboxes;
}
+ activityHoursIsInvalid(activityFormGroup: AbstractControl): boolean {
+ const errors = activityFormGroup.errors as ActivityFormErrors;
+ return this.formControlIsInvalid(activityFormGroup) && !!errors.hours;
+ }
+
getActivityMetadata(activityId: number): Activity {
return this.activitiesFormArrayMetadata.find(activity => activity.id === activityId);
}
+ getActivityInfoAsString(activity: PeriodiskRedovisningActivityRequest): string {
+ const { name } = this.getActivityMetadata(activity.id);
+ const hours = activity.hours === 1 ? '1 timme' : `${activity.hours} timmar`;
+ const location =
+ activity.performedRemotely && activity.performedPhysically
+ ? 'på distans och på plats'
+ : activity.performedRemotely
+ ? 'på distans'
+ : 'på plats';
+ return `${name}: ${hours} ${location}`;
+ }
+
openChangePeriodDialogIfValuesExist(): void {
const { activities, hasOfferedJob, hasOfferedLanguageSupport, noActivitiesHasBeenConducted } = this.formGroup
.value as PeriodiskRedovisningFormData;
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.model.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.model.ts
index 167f115..61a24d2 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.model.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.model.ts
@@ -2,6 +2,7 @@ export interface PeriodiskRedovisningFormActivity {
isSelected: boolean;
performedRemotely: boolean;
performedPhysically: boolean;
+ hours: string;
}
export interface PeriodiskRedovisningFormData {
@@ -20,4 +21,5 @@ export interface PeriodiskRedovisningFormErrors {
export interface ActivityFormErrors {
locationCheckboxes?: string;
+ hours?: string;
}
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning.validator.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning.validator.ts
index e67f8ff..92f26ae 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning.validator.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning.validator.ts
@@ -36,8 +36,10 @@ export class PeriodiskRedovisningValidator {
static activityIsValid(): ValidatorFn {
return (c: AbstractControl): ActivityFormErrors => {
let errors: ActivityFormErrors;
+ const controlValue = c.value as PeriodiskRedovisningFormActivity;
+
+ const { performedRemotely, performedPhysically, isSelected, hours } = controlValue;
- const { performedRemotely, performedPhysically, isSelected } = c.value as PeriodiskRedovisningFormActivity;
if (isSelected && !performedPhysically && !performedRemotely) {
errors = {
...errors,
@@ -45,6 +47,15 @@ export class PeriodiskRedovisningValidator {
};
}
+ const isValidHours = hours?.length > 0 && Number.isInteger(+hours) && +hours >= 0 && +hours <= 200;
+
+ if (isSelected && !isValidHours) {
+ errors = {
+ ...errors,
+ hours: 'Antal timmar måste vara ett heltal mellan 0 och 200',
+ };
+ }
+
return errors;
};
}
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html
index 2b61e06..d75a5d1 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html
@@ -20,8 +20,7 @@
class="msfa__digi-icon periodisk-redovisning-view__activity-check"
aria-hidden="true"
>
- {{activity.name}}: {{ activity.performedRemotely && activity.performedPhysically ? 'På distans och på
- plats' : activity.performedRemotely ? 'På distans' : 'På plats'}}
+ {{getActivityInfoAsString(activity)}}
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts
index ce26b0d..089e4ae 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts
@@ -2,10 +2,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Params } from '@msfa-models/api/params.model';
import { Avrop } from '@msfa-models/avrop.model';
+import { PeriodiskRedovisning, PeriodiskRedovisningActivity } from '@msfa-models/periodisk-redovisning.model';
import { Observable } from 'rxjs';
import { map, shareReplay, switchMap } from 'rxjs/operators';
import { PeriodiskRedovisningViewService } from './periodisk-redovisning-view.service';
-import { PeriodiskRedovisning } from '@msfa-models/periodisk-redovisning.model';
@Component({
selector: 'msfa-periodisk-redovisning-view',
@@ -34,6 +34,17 @@ export class PeriodiskRedovisningViewComponent {
shareReplay(1)
);
+ getActivityInfoAsString(activity: PeriodiskRedovisningActivity): string {
+ const hours = activity.hours === 1 ? '1 timme' : `${activity.hours} timmar`;
+ const location =
+ activity.performedRemotely && activity.performedPhysically
+ ? 'på distans och på plats'
+ : activity.performedRemotely
+ ? 'på distans'
+ : 'på plats';
+ return `${activity.name}: ${hours} ${location}`;
+ }
+
constructor(
private periodiskRedovisningViewService: PeriodiskRedovisningViewService,
private activatedRoute: ActivatedRoute
diff --git a/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.request.model.ts b/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.request.model.ts
index 1cda0f3..26cc0a3 100644
--- a/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.request.model.ts
+++ b/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.request.model.ts
@@ -2,6 +2,7 @@ export interface PeriodiskRedovisningActivityRequest {
id: number;
performedRemotely: boolean;
performedPhysically: boolean;
+ hours: number;
}
export interface PeriodiskRedovisningRequest {
diff --git a/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.response.model.ts b/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.response.model.ts
index 36d0206..485eeb9 100644
--- a/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.response.model.ts
+++ b/apps/mina-sidor-fa/src/app/shared/models/api/periodisk-redovisning.response.model.ts
@@ -3,6 +3,7 @@ export interface PeriodiskRedovisningActivityResponse {
name: string;
performedRemotely: boolean;
performedPhysically: boolean;
+ hours: number;
}
export interface PeriodiskRedovisningResponse {
@@ -25,18 +26,21 @@ export function mockOnePeriodiskRedovisningResponse(): PeriodiskRedovisningRespo
name: 'Aktivitet 1',
performedRemotely: false,
performedPhysically: true,
+ hours: 25,
},
{
id: 19,
name: 'Aktivitet 2',
performedRemotely: true,
performedPhysically: false,
+ hours: 3,
},
{
id: 31,
name: 'Aktivitet 3',
performedRemotely: true,
performedPhysically: true,
+ hours: 2,
},
],
};
diff --git a/apps/mina-sidor-fa/src/app/shared/models/periodisk-redovisning.model.ts b/apps/mina-sidor-fa/src/app/shared/models/periodisk-redovisning.model.ts
index 17e7b14..afae581 100644
--- a/apps/mina-sidor-fa/src/app/shared/models/periodisk-redovisning.model.ts
+++ b/apps/mina-sidor-fa/src/app/shared/models/periodisk-redovisning.model.ts
@@ -5,6 +5,7 @@ export interface PeriodiskRedovisningActivity {
name: string;
performedRemotely: boolean;
performedPhysically: boolean;
+ hours: number;
}
export interface PeriodiskRedovisning {