Oppdatert sykemelding-validering og div bugfix

navikt · Aug 30, 2023 · fbe28ec · fbe28ec
1 parent 787823a
commit fbe28ec
Show file tree

Hide file tree

Showing 7 changed files with 97 additions and 62 deletions.
diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/sykdom/form/Form.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/sykdom/form/Form.tsx
@@ -4,7 +4,8 @@ import { erForsteEllerTest, panelError } from '@/components/ui/form/formUtils'
 import { Sykemelding } from './partials/Sykemelding'
 import { validation } from './validation'
 import { FormikProps } from 'formik'
-import { Alert } from '@navikt/ds-react'
+import React from 'react'
+import StyledAlert from '@/components/ui/alert/StyledAlert'
 
 interface SykdomFormProps {
 	formikBag: FormikProps<{}>
@@ -24,10 +25,10 @@ export const SykdomForm = ({ formikBag }: SykdomFormProps) => (
 		>
 			{formikBag.values.sykemelding != null &&
 				formikBag.values.sykemelding.hasOwnProperty('syntSykemelding') && (
-					<Alert variant={'info'} style={{ marginBottom: '20px' }}>
+					<StyledAlert variant={'info'} size={'small'}>
 						Syntetisk sykemelding behandler en stor mengde data for å opprette realistiske
 						sykemeldinger og kan derfor medføre litt lenger bestillingstid.
-					</Alert>
+					</StyledAlert>
 				)}
 			<Sykemelding formikBag={formikBag} />
 		</Panel>

diff --git a/...ontend/src/main/js/src/components/fagsystem/sykdom/form/partials/DetaljertSykemelding.tsx b/...ontend/src/main/js/src/components/fagsystem/sykdom/form/partials/DetaljertSykemelding.tsx
@@ -57,13 +57,13 @@ export const DetaljertSykemelding = ({ formikBag }: SykemeldingForm) => {
 
 	const handleArbeidsgiverChange = (v: Arbeidsgiver) => {
 		formikBag.setFieldValue('sykemelding.detaljertSykemelding.mottaker', {
-			navn: v.navn,
-			orgNr: v.orgnr,
+			navn: v?.navn || null,
+			orgNr: v?.orgnr || null,
 			adresse: {
-				by: v.forretningsAdresse.poststed,
-				gate: v.forretningsAdresse.adresse,
-				land: v.forretningsAdresse.landkode,
-				postnummer: v.forretningsAdresse.postnr,
+				by: v?.forretningsAdresse?.poststed || null,
+				gate: v?.forretningsAdresse?.adresse || null,
+				land: v?.forretningsAdresse?.landkode || null,
+				postnummer: v?.forretningsAdresse?.postnr || null,
 			},
 		})
 	}
@@ -121,25 +121,28 @@ export const DetaljertSykemelding = ({ formikBag }: SykemeldingForm) => {
 				/>
 			</Kategori>
 			<Kategori title="Arbeidsgiver" vis="sykemelding">
-				<OrganisasjonMedArbeidsforholdSelect
-					path="sykemelding.detaljertSykemelding.arbeidsgiver.navn"
-					label="Navn"
-					afterChange={(v: Arbeidsgiver) => handleArbeidsgiverChange(v)}
-					valueNavn={true}
-				/>
-				<FormikSelect
-					name="sykemelding.detaljertSykemelding.arbeidsgiver.yrkesbetegnelse"
-					label="Yrkesbetegnelse"
-					kodeverk={ArbeidKodeverk.Yrker}
-					size="xxxlarge"
-					isClearable={false}
-					optionHeight={50}
-				/>
-				<FormikTextInput
-					name="sykemelding.detaljertSykemelding.arbeidsgiver.stillingsprosent"
-					label="Stillingsprosent"
-					type="number"
-				/>
+				<div className="flexbox--flex-wrap">
+					<OrganisasjonMedArbeidsforholdSelect
+						path="sykemelding.detaljertSykemelding.arbeidsgiver.navn"
+						label="Navn"
+						afterChange={(v: Arbeidsgiver) => handleArbeidsgiverChange(v)}
+						valueNavn={true}
+						isClearable={true}
+					/>
+					<FormikSelect
+						name="sykemelding.detaljertSykemelding.arbeidsgiver.yrkesbetegnelse"
+						label="Yrkesbetegnelse"
+						kodeverk={ArbeidKodeverk.Yrker}
+						size="xxxlarge"
+						isClearable={false}
+						optionHeight={50}
+					/>
+					<FormikTextInput
+						name="sykemelding.detaljertSykemelding.arbeidsgiver.stillingsprosent"
+						label="Stillingsprosent"
+						type="number"
+					/>
+				</div>
 			</Kategori>
 			<FormikDollyFieldArray
 				name="sykemelding.detaljertSykemelding.perioder"
@@ -170,26 +173,29 @@ export const DetaljertSykemelding = ({ formikBag }: SykemeldingForm) => {
 				)}
 			</FormikDollyFieldArray>
 			<Kategori title="Detaljer" vis="sykemelding">
-				<FormikTextInput
-					name="sykemelding.detaljertSykemelding.detaljer.tiltakNav"
-					label="Tiltak fra Nav"
-					size="large"
-				/>
-				<FormikTextInput
-					name="sykemelding.detaljertSykemelding.detaljer.tiltakArbeidsplass"
-					label="Tiltak på arbeidsplass"
-					size="large"
-				/>
-				<FormikTextInput
-					name="sykemelding.detaljertSykemelding.detaljer.beskrivHensynArbeidsplassen"
-					label="Hensyn på arbeidsplass"
-					size="large"
-				/>
-				<FormikCheckbox
-					name="sykemelding.detaljertSykemelding.detaljer.arbeidsforEtterEndtPeriode"
-					label="Arbeidsfør etter endt periode"
-					size="small"
-				/>
+				<div className="flexbox--flex-wrap">
+					<FormikTextInput
+						name="sykemelding.detaljertSykemelding.detaljer.tiltakNav"
+						label="Tiltak fra Nav"
+						size="large"
+					/>
+					<FormikTextInput
+						name="sykemelding.detaljertSykemelding.detaljer.tiltakArbeidsplass"
+						label="Tiltak på arbeidsplass"
+						size="large"
+					/>
+					<FormikTextInput
+						name="sykemelding.detaljertSykemelding.detaljer.beskrivHensynArbeidsplassen"
+						label="Hensyn på arbeidsplass"
+						size="large"
+					/>
+					<FormikCheckbox
+						name="sykemelding.detaljertSykemelding.detaljer.arbeidsforEtterEndtPeriode"
+						label="Arbeidsfør etter endt periode"
+						size="small"
+						checkboxMargin
+					/>
+				</div>
 			</Kategori>
 		</div>
 	)

diff --git a/.../dolly-frontend/src/main/js/src/components/fagsystem/sykdom/form/partials/Sykemelding.tsx b/.../dolly-frontend/src/main/js/src/components/fagsystem/sykdom/form/partials/Sykemelding.tsx
@@ -77,7 +77,7 @@ export const Sykemelding = ({ formikBag }: SykemeldingForm) => {
 	const [typeSykemelding, setTypeSykemelding] = useState(
 		_.get(formikBag.values, 'sykemelding').hasOwnProperty('detaljertSykemelding')
 			? SykemeldingTyper.detaljert
-			: SykemeldingTyper.synt
+			: SykemeldingTyper.synt,
 	)
 
 	const handleToggleChange = (value: SykemeldingTyper) => {
@@ -105,7 +105,7 @@ export const Sykemelding = ({ formikBag }: SykemeldingForm) => {
 			<ToggleGroup
 				size={'small'}
 				onChange={handleToggleChange}
-				defaultValue={SykemeldingTyper.synt}
+				defaultValue={typeSykemelding}
 				style={{ marginBottom: '5px', backgroundColor: '#ffffff' }}
 			>
 				{toggleValues.map((val) => (

diff --git a/...ly-frontend/src/main/js/src/components/fagsystem/sykdom/form/partials/SyntSykemelding.tsx b/...ly-frontend/src/main/js/src/components/fagsystem/sykdom/form/partials/SyntSykemelding.tsx
@@ -24,6 +24,7 @@ export const SyntSykemelding = () => {
 			<OrganisasjonMedArbeidsforholdSelect
 				path="sykemelding.syntSykemelding.orgnummer"
 				label="Organisasjonsnummer"
+				isClearable={true}
 			/>
 		</div>
 	)

diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/sykdom/form/validation.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/sykdom/form/validation.tsx
@@ -2,6 +2,30 @@ import * as Yup from 'yup'
 import { ifPresent, requiredDate, requiredNumber, requiredString } from '@/utils/YupValidations'
 import { testDatoFom, testDatoTom } from '@/components/fagsystem/utils'
 
+const testHarArbeidsforhold = (val) => {
+	return val.test('har-arbeidsforhold', function harArbeidsforhold(selected) {
+		if (!selected) {
+			return true
+		}
+		const values = this?.options?.context
+		const detaljertSykemelding = values?.sykemelding?.detaljertSykemelding
+
+		const valgtArbeidsgiver = detaljertSykemelding
+			? detaljertSykemelding?.mottaker?.orgNr
+			: selected
+
+		const arbeidsgivere = values?.aareg?.map((arbforh) => arbforh?.arbeidsgiver?.orgnummer)
+
+		if (!arbeidsgivere?.includes(valgtArbeidsgiver?.toString())) {
+			return this.createError({
+				message: 'Personen må ha et arbeidsforhold i valgt organisasjon',
+			})
+		}
+
+		return true
+	})
+}
+
 export const validation = {
 	sykemelding: ifPresent(
 		'$sykemelding',
@@ -10,8 +34,8 @@ export const validation = {
 				'$sykemelding.syntSykemelding',
 				Yup.object({
 					startDato: requiredDate,
-					orgnummer: requiredString,
-				})
+					orgnummer: testHarArbeidsforhold(Yup.string().nullable()),
+				}),
 			),
 			detaljertSykemelding: ifPresent(
 				'$sykemelding.detaljertSykemelding',
@@ -27,8 +51,8 @@ export const validation = {
 							Yup.object({
 								diagnose: requiredString,
 								diagnosekode: requiredString,
-							})
-						)
+							}),
+						),
 					),
 					helsepersonell: Yup.object({
 						etternavn: requiredString,
@@ -37,7 +61,7 @@ export const validation = {
 						hprId: requiredString,
 					}),
 					arbeidsgiver: Yup.object({
-						navn: requiredString,
+						navn: testHarArbeidsforhold(Yup.string().nullable()),
 						stillingsprosent: requiredNumber.transform((num) => (isNaN(num) ? undefined : num)),
 						yrkesbetegnelse: requiredString,
 					}),
@@ -46,10 +70,10 @@ export const validation = {
 							aktivitet: Yup.object({}),
 							fom: testDatoFom(requiredDate, 'tom'),
 							tom: testDatoTom(requiredDate, 'fom'),
-						})
+						}),
 					),
-				})
+				}),
 			),
-		})
+		}),
 	),
 }
diff --git a/apps/dolly-frontend/src/main/js/src/components/organisasjonSelect/OrganisasjonLoader.tsx b/apps/dolly-frontend/src/main/js/src/components/organisasjonSelect/OrganisasjonLoader.tsx
@@ -12,6 +12,7 @@ type OrganisasjonLoaderProps = {
 	value: any
 	feil?: any
 	useFormikSelect?: boolean
+	isClearable?: boolean
 }
 
 export const OrganisasjonLoader = ({
@@ -23,6 +24,7 @@ export const OrganisasjonLoader = ({
 	useFormikSelect,
 	feil,
 	value,
+	isClearable = false,
 	...props
 }: OrganisasjonLoaderProps) => {
 	const validEnhetstyper = ['BEDR', 'AAFY']
@@ -32,7 +34,7 @@ export const OrganisasjonLoader = ({
 	const formatLabel = (org) => `${org.orgnummer} (${org.enhetstype}) - ${org.navn}`
 	const organisasjonerSorted = organisasjoner
 		.filter((virksomhet) =>
-			kanHaArbeidsforhold ? validEnhetstyper.includes(virksomhet.enhetstype) : true
+			kanHaArbeidsforhold ? validEnhetstyper.includes(virksomhet.enhetstype) : true,
 		)
 		.sort(function (a, b) {
 			if (a.opprinnelse < b.opprinnelse) {
@@ -62,7 +64,7 @@ export const OrganisasjonLoader = ({
 			options={organisasjonerSorted}
 			size="xlarge"
 			optionHeight={50}
-			isClearable={false}
+			isClearable={isClearable}
 			{...props}
 		/>
 	) : (
@@ -75,7 +77,7 @@ export const OrganisasjonLoader = ({
 			onChange={handleChange}
 			value={value}
 			feil={feil}
-			isClearable={false}
+			isClearable={isClearable}
 			{...props}
 		/>
 	)

diff --git a/...end/src/main/js/src/components/organisasjonSelect/OrganisasjonMedArbeidsforholdSelect.tsx b/...end/src/main/js/src/components/organisasjonSelect/OrganisasjonMedArbeidsforholdSelect.tsx
@@ -9,8 +9,9 @@ type OrganisasjonMedArbeidsforholdSelectProps = {
 	feil?: { feilmelding: string }
 	isDisabled?: boolean
 	defaultValue?: string
+	isClearable?: boolean
 }
 
 export const OrganisasjonMedArbeidsforholdSelect = (
-	props: OrganisasjonMedArbeidsforholdSelectProps
+	props: OrganisasjonMedArbeidsforholdSelectProps,
 ) => <OrganisasjonSelect {...props} kanHaArbeidsforhold={true} />