Ajout du recap expert

pull/2077/head
Jérémy Rialland 2022-03-17 12:46:57 +01:00 committed by Johan Girod
parent cfd14b3436
commit dbfb97436b
2 changed files with 127 additions and 69 deletions

View File

@ -1,6 +1,7 @@
import { EngineContext } from '@/components/utils/EngineContext'
import { Spacing } from '@/design-system/layout'
import { H3 } from '@/design-system/typography/heading'
import { Li, Ul } from '@/design-system/typography/list'
import { baseParagraphStyle } from '@/design-system/typography/paragraphs'
import { Grid } from '@mui/material'
import { DottedNames } from 'exoneration-covid'
@ -12,15 +13,14 @@ import Engine, {
} from 'publicodes'
import { useContext } from 'react'
import { Trans, useTranslation } from 'react-i18next'
import styled from 'styled-components'
import styled, { css } from 'styled-components'
import { Row, Table, Tbody, Th, Thead, Tr } from './Table'
const Json = (props: any) => (
<pre css={{ overflow: 'auto' }}>{JSON.stringify(props, null, 2)}</pre>
)
const Recap = styled.div`
background: ${({ theme }) => theme.colors.bases.primary[600]};
background: ${({ theme }) => {
const colorPalette = theme.colors.bases.primary
return css`linear-gradient(60deg, ${colorPalette[800]} 0%, ${colorPalette[600]} 100%);`
}};
border-radius: 0.25rem;
padding: 1.5rem;
${baseParagraphStyle}
@ -56,6 +56,14 @@ const Total = styled.div`
margin-bottom: 0.5rem;
`
const RecapExpert = styled(Ul)`
border-radius: 0.25rem;
padding: 1.5rem;
padding-top: 0;
${baseParagraphStyle}
line-height: 1.5rem;
`
const getTotalByMonth = (engine: Engine<DottedNames>) => {
type ParsedSituation = typeof engine.parsedSituation
@ -130,7 +138,6 @@ export const FormulaireS1S1Bis = ({
const LFSS600 = engine.evaluate('LFSS 600')
const LFSS300 = engine.evaluate('LFSS 300')
const LFR1 = engine.evaluate('LFR1')
const exoS2 = engine.evaluate('exonération S2')
const total = engine.evaluate('montant total')
const totalByMonth = getTotalByMonth(engine)
@ -162,6 +169,15 @@ export const FormulaireS1S1Bis = ({
e.parents[0].name === 'mois'
)
const monthsCount = Object.entries(totalByMonth).reduce(
(acc, [, node]) => {
'dottedName' in node && node.dottedName?.includes('LFSS') && acc.LFSS++
'dottedName' in node && node.dottedName?.includes('LFR1') && acc.LFR1++
return acc
},
{ LFSS: 0, LFR1: 0 }
)
let emptyMonthIndex: number[] = []
let isAnyRowShowed = false
@ -344,13 +360,40 @@ export const FormulaireS1S1Bis = ({
</Grid>
</Recap>
<Json
LFSS600={formatValue(LFSS600)}
LFSS300={formatValue(LFSS300)}
LFR1={formatValue(LFR1)}
exoS2={formatValue(exoS2)}
total={formatValue(total)}
/>
<Trans>
<H3>Résumé</H3>
<RecapExpert>
<Li>
Secteur d'activité dont relève l'activité principale :{' '}
<Bold as="span">{engine.evaluate('secteur').nodeValue}</Bold>
</Li>
<Li>
Activité exercée en{' '}
<Bold as="span">
{engine.evaluate("lieu d'exercice").nodeValue}
</Bold>
</Li>
<Li>
Début d'activité :{' '}
<Bold as="span">
{engine.evaluate("début d'activité").nodeValue}
</Bold>
</Li>
<Li>
Nombres de mois pour lesquels vous remplissez les conditions
d'éligibilité
<Ul>
<Li>
LFSS : <Bold as="span">{monthsCount.LFSS.toString()} mois</Bold>
</Li>
<Li>
LFR1 : <Bold as="span">{monthsCount.LFR1.toString()} mois</Bold>
</Li>
</Ul>
</Li>
</RecapExpert>
</Trans>
</>
)
}

View File

@ -64,80 +64,95 @@ export default function ExonérationCovid() {
const step2 = rootDottedNames.every((names) => params[names])
return (
<>
<EngineProvider value={exoCovidEngine}>
{step2 ? (
<>
<FormulaireS1S1Bis onChange={updateSituation} />
</>
) : (
<>
<EngineProvider value={exoCovidEngine}>
{step2 ? (
<>
<FormulaireS1S1Bis onChange={updateSituation} />
</>
) : (
<>
<Grid item xs={12}>
<H3>{exoCovidEngine.getRule('secteur').rawNode.question}</H3>
</Grid>
<Grid item xs={8}>
<RuleInput
dottedName={'secteur'}
onChange={(value) => updateSituation('secteur', value)}
/>
</Grid>
<Grid item xs={12}>
<H3>
{exoCovidEngine.getRule("début d'activité").rawNode.question}
</H3>
<Spacing sm />
</Grid>
<Grid item xs={12} sm={6}>
<RuleInput
dottedName="début d'activité"
onChange={(value) => updateSituation("début d'activité", value)}
/>
</Grid>
<Spacing sm />
<Grid item xs={12} sm={6}>
<RuleInput
dottedName="début d'activité"
onChange={(value) => updateSituation("début d'activité", value)}
/>
</Grid>
<Grid item xs={12}>
<H3>
{exoCovidEngine.getRule("lieu d'exercice").rawNode.question}
</H3>
</Grid>
<Grid item xs={12}>
<RuleInput
dottedName="lieu d'exercice"
onChange={(value) => updateSituation("lieu d'exercice", value)}
/>
</>
)}
<Spacing lg />
<Grid container justifyContent={step2 ? '' : 'end'}>
<Grid item xs={6} sm="auto">
{step2 ? (
<Button
size="XS"
to={{
pathname: location.pathname,
search: '',
}}
onClick={setStep1Situation}
>
<Trans>Précédent</Trans>
</Button>
) : (
<Button
size="XS"
isDisabled={!rootDottedNames.every((names) => situation[names])}
to={() => {
rootDottedNames.forEach((key) =>
searchParams.append(key, situation[key]?.toString() ?? '')
)
return {
pathname: location.pathname,
search: searchParams.toString(),
}
}}
>
<Trans>Suivant</Trans>
</Button>
)}
</Grid>
</Grid>
</>
)}
<Spacing lg />
</EngineProvider>
</>
<Spacing lg />
<Grid container>
<Grid item xs></Grid>
</Grid>
<Grid container justifyContent={step2 ? '' : 'end'}>
<Grid item xs={6} sm="auto">
{step2 ? (
<Button
size="XS"
to={{
pathname: location.pathname,
search: '',
}}
onClick={setStep1Situation}
>
<Trans>Précédent</Trans>
</Button>
) : (
<Button
size="XS"
isDisabled={!rootDottedNames.every((names) => situation[names])}
to={() => {
rootDottedNames.forEach((key) =>
searchParams.append(key, situation[key]?.toString() ?? '')
)
return {
pathname: location.pathname,
search: searchParams.toString(),
}
}}
>
<Trans>Suivant</Trans>
</Button>
)}
</Grid>
</Grid>
<Spacing lg />
</EngineProvider>
)
}