diff --git a/src/AvtaleOversikt/Filtrering/TiltakstypeFilter.tsx b/src/AvtaleOversikt/Filtrering/TiltakstypeFilter.tsx index 1fa592a69..3f1f05b46 100644 --- a/src/AvtaleOversikt/Filtrering/TiltakstypeFilter.tsx +++ b/src/AvtaleOversikt/Filtrering/TiltakstypeFilter.tsx @@ -1,13 +1,16 @@ import { Filter } from '@/AvtaleOversikt/Filtrering/Filter'; import { useFilter } from '@/AvtaleOversikt/Filtrering/useFilter'; +import { Feature, FeatureToggleContext } from '@/FeatureToggleProvider'; import { OptionProps } from '@/komponenter/form/SelectInput'; import { TiltaksType } from '@/types/avtale'; import { Radio, RadioGroup } from '@navikt/ds-react'; -import React, { FunctionComponent } from 'react'; +import React, { FunctionComponent, useContext } from 'react'; export type FiltreringMedBeslutterProps = { erBeslutter: boolean }; const TiltakstypeFilter: FunctionComponent = (props) => { const { endreFilter, filtre } = useFilter(); + const contex = useContext(FeatureToggleContext); + const vtaoAktivert = contex[Feature.VtaoTiltakToggle]; const alleTiltakstyperBeslutter: OptionProps[] = [ { value: '', label: 'Alle' }, @@ -24,7 +27,8 @@ const TiltakstypeFilter: FunctionComponent = (props { value: 'SOMMERJOBB', label: 'Sommerjobb' }, { value: 'MENTOR', label: 'Mentor' }, { value: 'INKLUDERINGSTILSKUDD', label: 'Inkluderingstilskudd' }, - ]; + vtaoAktivert ? { value: 'VTAO', label: 'VTA-oppfølging' } : null, + ].filter((x) => x !== null) as OptionProps[]; const tiltakstyper = props.erBeslutter ? alleTiltakstyperBeslutter : alleTiltakstyper; diff --git a/src/AvtaleSide/steg/BeregningTilskudd/BeregningVTAOTilskuddSteg.less b/src/AvtaleSide/steg/BeregningTilskudd/BeregningVTAOTilskuddSteg.less new file mode 100644 index 000000000..2385bc983 --- /dev/null +++ b/src/AvtaleSide/steg/BeregningTilskudd/BeregningVTAOTilskuddSteg.less @@ -0,0 +1,57 @@ +@import (reference) '../../../tiltak_variabler.less'; + +.beregningTilskuddSteg { + &__valuta-input { + width: 50%; + & > .input { + margin-top: 1rem; + } + } + + &__alert { + margin-top: 1rem; + } + + &__tilskuddsprosent-heading, + &__tilskuddsprosent { + margin-bottom: 1.25rem; + } + + &__rad { + margin-bottom: 2rem; + } + + &__tjenestepensjon, + &__arbeidsgiveravgift { + .navds-form-field { + & > input, + & > div { + width: 55%; + } + } + } + + &__lonn-tittel { + padding-bottom: 0.5rem; + } + + &__otpSats { + position: relative; + + &--label { + position: absolute; + bottom: 0.675rem; + left: 3rem; + } + } + + &__lonn-per-mnd-seksjon { + &:nth-child(n) { + margin-bottom: 0.5rem; + + & > ul { + margin: 0.5rem 0; + } + } + } +} diff --git a/src/AvtaleSide/steg/BeregningTilskudd/BeregningVTAOTilskuddSteg.tsx b/src/AvtaleSide/steg/BeregningTilskudd/BeregningVTAOTilskuddSteg.tsx new file mode 100644 index 000000000..1e38e8f20 --- /dev/null +++ b/src/AvtaleSide/steg/BeregningTilskudd/BeregningVTAOTilskuddSteg.tsx @@ -0,0 +1,59 @@ +import { AvtaleContext } from '@/AvtaleProvider'; +import { InnloggetBrukerContext } from '@/InnloggingBoundary/InnloggingBoundary'; +import SkjemaTittel from '@/komponenter/form/SkjemaTittel'; +import Innholdsboks from '@/komponenter/Innholdsboks/Innholdsboks'; +import LagreKnapp from '@/komponenter/LagreKnapp/LagreKnapp'; +import VerticalSpacer from '@/komponenter/layout/VerticalSpacer'; +import BEMHelper from '@/utils/bem'; +import { Column, Row } from '@/komponenter/NavGrid/Grid'; +import { BodyShort, Heading, TextField } from '@navikt/ds-react'; +import { FunctionComponent, useContext } from 'react'; +import VisningTilskuddsperioder from '@/AvtaleSide/steg/BeregningTilskudd/visningTilskuddsperioder/VisningTilskuddsperioder'; +import HenteKontonummer from '@/komponenter/form/henteKontornummer/HenteKontonummer'; +import './BeregningTilskuddSteg.less'; +import AvtaleStatus from '@/AvtaleSide/AvtaleStatus/AvtaleStatus'; +import VisueltDisabledInputFelt from '@/komponenter/VisueltDisabledInputFelt/VisueltDisabledInputFelt'; +import VisningTilskuddsperioderVtao from './visningTilskuddsperioder/VisningTilskuddsperioderVtao'; + +const cls = BEMHelper('beregningTilskuddSteg'); + +const BeregningTilskuddSteg: FunctionComponent = () => { + const innloggetBruker = useContext(InnloggetBrukerContext); + + const { avtale, lagreAvtale } = useContext(AvtaleContext); + + return ( + <> + + + Beregning av tilskudd + + Hvor mye dekker tilskuddet? + + + Arbeidsgiveren får et tilskudd fra NAV for varig tilrettelagt arbeid. Tilskuddssatsen er 6 808 + kroner per måned. Satsen settes årlig av departementet og avtale- og refusjonsløsningen vil + automatisk oppdateres når det kommer nye satser. + + +
+ +
+ + + + + + + + + + + ); +}; + +export default BeregningTilskuddSteg; diff --git a/src/AvtaleSide/steg/BeregningTilskudd/visningTilskuddsperioder/InfoRundtTilskuddsperioder.tsx b/src/AvtaleSide/steg/BeregningTilskudd/visningTilskuddsperioder/InfoRundtTilskuddsperioder.tsx index 7084608cc..0769a4712 100644 --- a/src/AvtaleSide/steg/BeregningTilskudd/visningTilskuddsperioder/InfoRundtTilskuddsperioder.tsx +++ b/src/AvtaleSide/steg/BeregningTilskudd/visningTilskuddsperioder/InfoRundtTilskuddsperioder.tsx @@ -2,6 +2,8 @@ import React from 'react'; import { formatterDato, NORSK_DATO_FORMAT } from '@/utils/datoUtils'; import { Button } from '@navikt/ds-react'; import BEMHelper from '@/utils/bem'; +import moment from 'moment'; +import { formatterPenger } from '@/utils/PengeUtils'; interface Props { className: string; @@ -10,6 +12,7 @@ interface Props { antallAktiveTilskuddsperioder: number; setVisAllePerioder: (value: React.SetStateAction) => void; visAllePerioder: boolean; + tiltakstype: string; } const InfoRundtTilskuddsperioder: React.FC = ({ @@ -19,6 +22,7 @@ const InfoRundtTilskuddsperioder: React.FC = ({ antallAktiveTilskuddsperioder, setVisAllePerioder, visAllePerioder, + tiltakstype, }: Props) => { if (!(gjeldendeInnholdStartdato && gjeldendeInnholdSluttdato)) return null; @@ -26,9 +30,21 @@ const InfoRundtTilskuddsperioder: React.FC = ({ return ( <>
- Avtalen varer fra {formatterDato(gjeldendeInnholdStartdato, NORSK_DATO_FORMAT)} til{' '} - {formatterDato(gjeldendeInnholdSluttdato, NORSK_DATO_FORMAT)}. Det tilsvarer{' '} - {antallAktiveTilskuddsperioder} tilskuddsperioder. + {tiltakstype === 'VTAO' ? ( + <> + Avtalen varer i {moment(gjeldendeInnholdSluttdato).diff(gjeldendeInnholdStartdato, 'years')}{' '} + {'år.'} +
+ Det tilsvarer en refusjon til arbeisgiver på ca {formatterPenger(6808 * 12)} i året og totalt{' '} + {formatterPenger(antallAktiveTilskuddsperioder * 6808)} kr for hele perioden . + + ) : ( + <> + Avtalen varer fra {formatterDato(gjeldendeInnholdStartdato, NORSK_DATO_FORMAT)} til{' '} + {formatterDato(gjeldendeInnholdSluttdato, NORSK_DATO_FORMAT)}. Det tilsvarer{' '} + {antallAktiveTilskuddsperioder} tilskuddsperioder. + + )}
{!visAllePerioder && (