58 lines
1.5 KiB
JavaScript
58 lines
1.5 KiB
JavaScript
/* @flow */
|
|
|
|
import Distribution from 'Components/Distribution';
|
|
import PaySlip from 'Components/PaySlip';
|
|
import React, { Component } from 'react';
|
|
import { Trans } from 'react-i18next';
|
|
|
|
type Props = {
|
|
arePreviousAnswers: boolean,
|
|
conversationStarted: boolean,
|
|
startConversation: () => void,
|
|
period: 'mois' | 'année'
|
|
}
|
|
export default class SalaryFirstExplanation extends Component<Props> {
|
|
render() {
|
|
return (
|
|
<>
|
|
<h2>
|
|
<Trans>À quoi servent mes cotisations ?</Trans>
|
|
</h2>
|
|
<Distribution />
|
|
|
|
{!(this.props.arePreviousAnswers && this.props.conversationStarted) && (
|
|
<>
|
|
<h2>
|
|
<Trans>Simulation personnalisée</Trans>
|
|
</h2>
|
|
<p>
|
|
<Trans i18nKey="custom-simulation">
|
|
Il s'agit pour l'instant d'une
|
|
<strong> première estimation</strong> sur la base d'un contrat
|
|
générique. La législation française prévoit une multitude de cas
|
|
particuliers et de règles spécifiques qui modifient
|
|
considérablement les montants de l'embauche.
|
|
</Trans>
|
|
</p>
|
|
<p style={{ textAlign: 'center' }}>
|
|
<button
|
|
className="ui__ button"
|
|
onClick={this.props.startConversation}>
|
|
<Trans>Faire une simulation personnalisée</Trans>
|
|
</button>
|
|
</p>
|
|
</>
|
|
)}
|
|
<h2>
|
|
<Trans>
|
|
{this.props.period === 'mois'
|
|
? 'Fiche de paie mensuelle'
|
|
: 'Détail annuel des cotisations'}
|
|
</Trans>
|
|
</h2>
|
|
<PaySlip />
|
|
</>
|
|
)
|
|
}
|
|
}
|