🎨 amélioration de l'affichage des règles
Johan Girod
parent
40560361f1
commit
ae96be0635
|
|
@ -121,10 +121,6 @@
|
|||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.mecanism .conditions > ul > li {
|
||||
margin-bottom: 0.6em;
|
||||
}
|
||||
|
||||
.leaf .situationValue {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -157,31 +153,42 @@
|
|||
.mecanism.inversion li {
|
||||
margin-top: 0.6em;
|
||||
}
|
||||
.mecanism.minimum > ul,
|
||||
.mecanism.maximum > ul {
|
||||
list-style: disc;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.composantes .composanteName::first-letter {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.mecanism ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.mecanism {
|
||||
border: 1px solid;
|
||||
max-width: 100%;
|
||||
border-radius: 3px;
|
||||
padding: 1em;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 2em;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
flex: 1;
|
||||
}
|
||||
#rule-rules.showValues .mecanism {
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
.mecanism-result {
|
||||
position: absolute;
|
||||
display: none;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
border-top: 1px solid;
|
||||
border-left: 1px solid;
|
||||
border-top-left-radius: 0.3rem;
|
||||
border-color: inherit;
|
||||
padding: 0.1rem 0.6rem;
|
||||
}
|
||||
#rule-rules.showValues .mecanism-result {
|
||||
display: initial;
|
||||
}
|
||||
.mecanism .mecanism {
|
||||
flex: initial;
|
||||
}
|
||||
.mecanism + .mecanism {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.mecanism .key::first-letter {
|
||||
|
|
|
|||
|
|
@ -83,6 +83,9 @@ ul {
|
|||
list-style: '› ';
|
||||
padding-left: 0.7rem;
|
||||
}
|
||||
ol {
|
||||
padding-left: 1.1rem;
|
||||
}
|
||||
li {
|
||||
padding: 0.2em 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ export default function ProductView(nodeValue, explanation) {
|
|||
justifyContent: 'center'
|
||||
}}>
|
||||
<div style={{ fontSize: '1.6rem', margin: '0 1rem' }}> × </div>
|
||||
<div>{makeJsx(explanation.taux)}</div>
|
||||
{makeJsx(explanation.taux)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,12 @@
|
|||
import React from 'react'
|
||||
import { InlineMecanism, Node } from './common'
|
||||
import { makeJsx } from '../evaluation'
|
||||
import './Variations.css'
|
||||
import classNames from 'classnames'
|
||||
import writtenNumbers from '../../locales/writtenNumbers.yaml'
|
||||
import withLanguage from 'Components/utils/withLanguage'
|
||||
import { Trans } from 'react-i18next'
|
||||
import { ShowValuesConsumer } from 'Components/rule/ShowValuesContext'
|
||||
import withLanguage from 'Components/utils/withLanguage'
|
||||
import React, { useState } from 'react'
|
||||
import emoji from 'react-easy-emoji'
|
||||
import { useState } from 'react'
|
||||
import { Trans } from 'react-i18next'
|
||||
import writtenNumbers from '../../locales/writtenNumbers.yaml'
|
||||
import { makeJsx } from '../evaluation'
|
||||
import { InlineMecanism, Node } from './common'
|
||||
import './Variations.css'
|
||||
|
||||
let Comp = withLanguage(function Variations({
|
||||
language,
|
||||
|
|
@ -30,61 +28,59 @@ let Comp = withLanguage(function Variations({
|
|||
<p>
|
||||
<Trans>Cette règle présente</Trans>{' '}
|
||||
{writtenNumbers[language][explanation.length]}{' '}
|
||||
<InlineMecanism name="variations" /> :
|
||||
<InlineMecanism name="variations" />
|
||||
</p>
|
||||
<ul>
|
||||
{explanation.map(({ condition, consequence, satisfied }, i) => (
|
||||
<li
|
||||
className={classNames('variation', {
|
||||
satisfied: showValues && satisfied
|
||||
})}
|
||||
key={i}>
|
||||
{showValues &&
|
||||
(!satisfied && !(expandedVariation === i)) ? (
|
||||
<p style={{ opacity: '0.6' }}>
|
||||
non applicable{' '}
|
||||
<ol>
|
||||
{explanation.map(({ condition, consequence, satisfied }, i) =>
|
||||
showValues && (!satisfied && !(expandedVariation === i)) ? (
|
||||
<li style={{ opacity: '0.6' }}>
|
||||
non applicable{' '}
|
||||
<button
|
||||
className="ui__ link-button"
|
||||
onClick={() =>
|
||||
toggleVariation(expandedVariation !== i ? i : null)
|
||||
}>
|
||||
détails {emoji(' ▶️')}
|
||||
</button>
|
||||
</li>
|
||||
) : (
|
||||
<li>
|
||||
{expandedVariation === i && (
|
||||
<button
|
||||
className="ui__ link-button"
|
||||
onClick={() =>
|
||||
toggleVariation(expandedVariation !== i ? i : null)
|
||||
}>
|
||||
détails {emoji(' ▶️')}
|
||||
onClick={() => toggleVariation(null)}>
|
||||
replier {emoji(' 🔽')}
|
||||
</button>
|
||||
</p>
|
||||
) : (
|
||||
<>
|
||||
{expandedVariation === i && (
|
||||
<button
|
||||
className="ui__ link-button"
|
||||
onClick={() => toggleVariation(null)}>
|
||||
replier {emoji(' 🔽')}
|
||||
</button>
|
||||
)}
|
||||
<div className="condition">
|
||||
{condition && (
|
||||
<span>
|
||||
<Trans>Si</Trans> {makeJsx(condition)}
|
||||
</span>
|
||||
)}
|
||||
<div className="consequence">
|
||||
<span className="consequenceType">
|
||||
{condition ? (
|
||||
<Trans>Alors</Trans>
|
||||
) : (
|
||||
<Trans>Sinon</Trans>
|
||||
)}{' '}
|
||||
:
|
||||
</span>
|
||||
<span className="consequenceContent">
|
||||
{consequence && makeJsx(consequence)}
|
||||
</span>
|
||||
)}
|
||||
<div className="condition">
|
||||
{condition && (
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
alignItems: 'baseline'
|
||||
}}>
|
||||
<Trans>Si :</Trans> {makeJsx(condition)}
|
||||
</div>
|
||||
)}
|
||||
<div className="consequence">
|
||||
<span className="consequenceType">
|
||||
{condition ? (
|
||||
<Trans>Alors</Trans>
|
||||
) : (
|
||||
<Trans>Sinon</Trans>
|
||||
)}{' '}
|
||||
:
|
||||
</span>
|
||||
<span className="consequenceContent">
|
||||
{consequence && makeJsx(consequence)}
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
)}
|
||||
</ol>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import classNames from 'classnames'
|
||||
import withLanguage from 'Components/utils/withLanguage'
|
||||
import withSitePaths from 'Components/utils/withSitePaths'
|
||||
import { sort, compose, contains, toPairs, pipe } from 'ramda'
|
||||
import { compose, contains, isNil, pipe, sort, toPairs } from 'ramda'
|
||||
import React, { Component } from 'react'
|
||||
import { Trans } from 'react-i18next'
|
||||
import { connect } from 'react-redux'
|
||||
|
|
@ -45,23 +45,33 @@ export class Node extends Component {
|
|||
<div
|
||||
className={classNames(classes, 'node', { inline })}
|
||||
style={termDefinition ? { borderColor: mecanismColours(name) } : {}}>
|
||||
{name && (
|
||||
{name && !inline && (
|
||||
<span className="nodeHead">
|
||||
{!inline && (
|
||||
<LinkButton
|
||||
className="name"
|
||||
style={
|
||||
termDefinition ? { background: mecanismColours(name) } : {}
|
||||
}
|
||||
data-term-definition={termDefinition}>
|
||||
<Trans>{name}</Trans>
|
||||
</LinkButton>
|
||||
)}
|
||||
<NodeValuePointer data={value} />
|
||||
<LinkButton
|
||||
className="name"
|
||||
style={
|
||||
termDefinition ? { background: mecanismColours(name) } : {}
|
||||
}
|
||||
data-term-definition={termDefinition}>
|
||||
<Trans>{name}</Trans>
|
||||
</LinkButton>
|
||||
</span>
|
||||
)}
|
||||
{child}
|
||||
{!name && <NodeValuePointer data={value} />}
|
||||
{child}{' '}
|
||||
{name ? (
|
||||
!isNil(value) && (
|
||||
<div className="mecanism-result">
|
||||
<NodeValuePointer data={value} />
|
||||
</div>
|
||||
)
|
||||
) : (
|
||||
<>
|
||||
{value !== true && value !== false && !isNil(value) && (
|
||||
<span className="operator"> = </span>
|
||||
)}
|
||||
<NodeValuePointer data={value} />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -868,6 +868,7 @@
|
|||
|
||||
- espace: contrat salarié . cotisations
|
||||
nom: salariales
|
||||
titre: cotisations salariales
|
||||
format: euros
|
||||
période: flexible
|
||||
formule:
|
||||
|
|
@ -884,7 +885,7 @@
|
|||
|
||||
- espace: contrat salarié . cotisations
|
||||
nom: patronales
|
||||
titre: Cotisations patronales
|
||||
titre: cotisations patronales
|
||||
période: flexible
|
||||
format: euros
|
||||
formule:
|
||||
|
|
@ -1446,8 +1447,6 @@
|
|||
références:
|
||||
Fiche service-public.fr: https://www.service-public.fr/professionnels-entreprises/vosdroits/F23547
|
||||
|
||||
|
||||
|
||||
- espace: entreprise
|
||||
nom: effectif
|
||||
question: Quel est l'effectif de l'entreprise ?
|
||||
|
|
@ -2629,7 +2628,6 @@
|
|||
période: flexible
|
||||
formule: impôt sur le revenu après décote
|
||||
|
||||
|
||||
- nom: revenu net de cotisations
|
||||
période: flexible
|
||||
formule:
|
||||
|
|
@ -2781,7 +2779,8 @@
|
|||
|
||||
C'est le revenu net de cotisations du travailleur indépendant.
|
||||
|
||||
Attention, **notre calcul est fait au régime de croisière** : l'indépendant qui se lance paiera pendant ses 2 premières années un forfait relativement réduit de cotisations sociales. Il devra ensuite régulariser cette situation par rapport au revenu qu'il a vraiment touché.
|
||||
Attention, **notre calcul est fait au régime de croisière**:
|
||||
l'indépendant qui se lance paiera pendant ses 2 premières années un forfait relativement réduit de cotisations sociales. Il devra ensuite régulariser cette situation par rapport au revenu qu'il a vraiment touché.
|
||||
|
||||
Il faut donc voir ce calcul comme *le montant qui devra de toute façon être payé* à court terme après 2 ans d'exercice.
|
||||
formule:
|
||||
|
|
@ -2791,7 +2790,6 @@
|
|||
- revenu net
|
||||
- entreprise . chiffre d'affaires
|
||||
|
||||
|
||||
- espace: entreprise
|
||||
nom: catégorie d'activité
|
||||
question: Quelle est votre catégorie d'activité ?
|
||||
|
|
@ -2809,8 +2807,6 @@
|
|||
Comment déterminer la nature de l'activité d'une entreprise ?: https://www.service-public.fr/professionnels-entreprises/vosdroits/F32887
|
||||
Spécifiquement pour les auto-entrepreneurs: https://www.shine.fr/blog/categorie-activite-auto-entrepreneur
|
||||
|
||||
|
||||
|
||||
- espace: entreprise . catégorie d'activité
|
||||
nom: libérale
|
||||
description: |
|
||||
|
|
@ -2868,7 +2864,6 @@
|
|||
références:
|
||||
page impots.gouv.fr: https://www.impots.gouv.fr/portail/professionnel/achatvente-de-biens
|
||||
|
||||
|
||||
- espace: entreprise . catégorie d'activité . service ou vente
|
||||
nom: prestation de service
|
||||
description: |
|
||||
|
|
@ -2876,11 +2871,10 @@
|
|||
références:
|
||||
page impots.gouv.fr: https://www.impots.gouv.fr/portail/professionnel/prestations-entre-assujettis
|
||||
|
||||
|
||||
- espace: entreprise . catégorie d'activité
|
||||
nom: restauration ou hébergement
|
||||
applicable si: service ou vente = 'prestation de service'
|
||||
description: Vos bénéfices sont classés en BIC - fourniture de logement ou de nourriture.
|
||||
description: Vos bénéfices sont classés en BIC - fourniture de logement ou de nourriture.
|
||||
question: Est-ce une activité de restauration ou d'hébergement ?
|
||||
par défaut: non
|
||||
|
||||
|
|
@ -2901,7 +2895,6 @@
|
|||
références:
|
||||
Liste des activités libérales: https://bpifrance-creation.fr/encyclopedie/trouver-proteger-tester-son-idee/verifiertester-son-idee/liste-professions-liberales
|
||||
|
||||
|
||||
- espace: entreprise . catégorie d'activité . libérale reglementée
|
||||
nom: type d'activité libérale reglementée
|
||||
formule:
|
||||
|
|
@ -2946,8 +2939,6 @@
|
|||
- Sage-femme
|
||||
- Vétérinaire
|
||||
|
||||
|
||||
|
||||
- espace: entreprise
|
||||
nom: rattachée à la CIPAV
|
||||
# TODO implémenter un nouveau mécanisme
|
||||
|
|
@ -2983,9 +2974,6 @@
|
|||
- ≠ rattachée à la CIPAV
|
||||
note: D'autres conditions d'exclusions existent, il faudra les compléter, mais la question de la catégorie d'activité doit avant être complétée.
|
||||
|
||||
|
||||
|
||||
|
||||
- nom: indépendant
|
||||
par défaut: non
|
||||
question: Activité à la sécurité sociale des indépendants ?
|
||||
|
|
@ -3243,7 +3231,6 @@
|
|||
fiche URSSAF: https://www.urssaf.fr/portail/home/independant/mes-cotisations/quelles-cotisations/la-contribution-a-la-formation-p/base-de-calcul-et-taux-de-la-con.html
|
||||
brève URSSAF pour les artisans: https://www.urssaf.fr/portail/home/actualites/toute-lactualite-independant/transfert-du-recouvrement-de-la.html
|
||||
|
||||
|
||||
- espace: indépendant . cotisations et contributions . formation professionnelle
|
||||
nom: assiette
|
||||
période: flexible
|
||||
|
|
@ -3259,7 +3246,6 @@
|
|||
références:
|
||||
secu-independants.fr: https://www.secu-independants.fr/cotisations/calcul-des-cotisations/cotisations-minimales/
|
||||
|
||||
|
||||
- espace: indépendant . cotisations
|
||||
nom: allocations familiales
|
||||
période: flexible
|
||||
|
|
@ -3362,7 +3348,6 @@
|
|||
alors: 0.2%
|
||||
- sinon: 0.44%
|
||||
|
||||
|
||||
- espace: auto entrepreneur
|
||||
nom: contribution formation professionnelle
|
||||
titre: Contribution à la formation professionnelle
|
||||
|
|
@ -3444,7 +3429,6 @@
|
|||
formule: plafond sécurité sociale temps plein / impôt . abattement . taux inversé
|
||||
période: flexible
|
||||
|
||||
|
||||
- espace: auto entrepreneur . impôt
|
||||
nom: abattement
|
||||
période: flexible
|
||||
|
|
@ -3453,7 +3437,6 @@
|
|||
assiette: base des cotisations
|
||||
taux: taux
|
||||
|
||||
|
||||
- espace: auto entrepreneur . impôt . abattement
|
||||
nom: taux inversé
|
||||
description: C'est le taux à appliquer pour savoir ce qu'il reste après application de l'abattement
|
||||
|
|
|
|||
Loading…
Reference in New Issue