✨ Déplacement de la vue Barème dans un fichier
parent
cf1610cf66
commit
d04d0ebe69
|
@ -0,0 +1,77 @@
|
|||
import React from 'react'
|
||||
import { Node } from './common'
|
||||
import { makeJsx } from '../evaluation'
|
||||
import { Trans } from 'react-i18next'
|
||||
|
||||
export default function Barème(nodeValue, explanation) {
|
||||
return (
|
||||
<Node
|
||||
classes="mecanism barème"
|
||||
name="barème"
|
||||
value={nodeValue}
|
||||
child={
|
||||
<ul className="properties">
|
||||
<li key="assiette">
|
||||
<span className="key">
|
||||
<Trans>assiette</Trans>:{' '}
|
||||
</span>
|
||||
<span className="value">{makeJsx(explanation.assiette)}</span>
|
||||
</li>
|
||||
<li key="multiplicateur">
|
||||
<span className="key">
|
||||
<Trans>multiplicateur des tranches</Trans>:{' '}
|
||||
</span>
|
||||
<span className="value">
|
||||
{makeJsx(explanation['multiplicateur des tranches'])}
|
||||
</span>
|
||||
</li>
|
||||
<table className="tranches">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Trans>Tranches de l'assiette</Trans>
|
||||
</th>
|
||||
<th>
|
||||
<Trans>Taux</Trans>
|
||||
</th>
|
||||
</tr>
|
||||
{explanation.tranches.map(
|
||||
({
|
||||
'en-dessous de': maxOnly,
|
||||
'au-dessus de': minOnly,
|
||||
de: min,
|
||||
à: max,
|
||||
taux
|
||||
}) => (
|
||||
<tr
|
||||
key={min || minOnly || 0}
|
||||
style={{
|
||||
fontWeight:
|
||||
explanation.assiette.nodeValue >
|
||||
explanation['multiplicateur des tranches'].nodeValue *
|
||||
min &&
|
||||
max &&
|
||||
explanation.assiette.nodeValue <
|
||||
explanation['multiplicateur des tranches'].nodeValue *
|
||||
max
|
||||
? ' bold'
|
||||
: ''
|
||||
}}>
|
||||
<td key="tranche">
|
||||
{maxOnly
|
||||
? '< ' + maxOnly
|
||||
: minOnly
|
||||
? '> ' + minOnly
|
||||
: `${min} - ${max}`}
|
||||
</td>
|
||||
<td key="taux"> {makeJsx(taux)} </td>
|
||||
</tr>
|
||||
)
|
||||
)}
|
||||
</thead>
|
||||
</table>
|
||||
</ul>
|
||||
}
|
||||
/>
|
||||
)
|
||||
}
|
|
@ -51,6 +51,7 @@ import {
|
|||
import 'react-virtualized/styles.css'
|
||||
import Somme from './mecanismViews/Somme'
|
||||
import Allègement from './mecanismViews/Allègement'
|
||||
import Barème from './mecanismViews/Barème'
|
||||
import buildSelectionView from './mecanismViews/Selection'
|
||||
import uniroot from './uniroot'
|
||||
|
||||
|
@ -762,80 +763,9 @@ export let mecanismScale = (recurse, k, v) => {
|
|||
},
|
||||
evaluate = evaluateObject(objectShape, effect)
|
||||
|
||||
let jsx = (nodeValue, explanation) => (
|
||||
<Node
|
||||
classes="mecanism barème"
|
||||
name="barème"
|
||||
value={nodeValue}
|
||||
child={
|
||||
<ul className="properties">
|
||||
<li key="assiette">
|
||||
<span className="key">
|
||||
<Trans>assiette</Trans>:{' '}
|
||||
</span>
|
||||
<span className="value">{makeJsx(explanation.assiette)}</span>
|
||||
</li>
|
||||
<li key="multiplicateur">
|
||||
<span className="key">
|
||||
<Trans>multiplicateur des tranches</Trans>:{' '}
|
||||
</span>
|
||||
<span className="value">
|
||||
{makeJsx(explanation['multiplicateur des tranches'])}
|
||||
</span>
|
||||
</li>
|
||||
<table className="tranches">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Trans>Tranches de l'assiette</Trans>
|
||||
</th>
|
||||
<th>
|
||||
<Trans>Taux</Trans>
|
||||
</th>
|
||||
</tr>
|
||||
{explanation.tranches.map(
|
||||
({
|
||||
'en-dessous de': maxOnly,
|
||||
'au-dessus de': minOnly,
|
||||
de: min,
|
||||
à: max,
|
||||
taux
|
||||
}) => (
|
||||
<tr
|
||||
key={min || minOnly || 0}
|
||||
style={{
|
||||
fontWeight:
|
||||
explanation.assiette.nodeValue >
|
||||
explanation['multiplicateur des tranches'].nodeValue *
|
||||
min &&
|
||||
max &&
|
||||
explanation.assiette.nodeValue <
|
||||
explanation['multiplicateur des tranches'].nodeValue *
|
||||
max
|
||||
? ' bold'
|
||||
: ''
|
||||
}}>
|
||||
<td key="tranche">
|
||||
{maxOnly
|
||||
? '< ' + maxOnly
|
||||
: minOnly
|
||||
? '> ' + minOnly
|
||||
: `${min} - ${max}`}
|
||||
</td>
|
||||
<td key="taux"> {makeJsx(taux)} </td>
|
||||
</tr>
|
||||
)
|
||||
)}
|
||||
</thead>
|
||||
</table>
|
||||
</ul>
|
||||
}
|
||||
/>
|
||||
)
|
||||
|
||||
return {
|
||||
evaluate,
|
||||
jsx,
|
||||
jsx: Barème,
|
||||
explanation,
|
||||
category: 'mecanism',
|
||||
name: 'barème',
|
||||
|
|
Loading…
Reference in New Issue