✨ Formattage du code
mama
parent
eee7ec7eec
commit
a06e1860ec
|
|
@ -3,7 +3,6 @@ import R from "ramda"
|
|||
import classNames from "classnames"
|
||||
import {
|
||||
rules,
|
||||
decodeRuleName,
|
||||
disambiguateRuleReference
|
||||
} from "Engine/rules.js"
|
||||
import { analyseSituation } from "Engine/traverse"
|
||||
|
|
@ -12,8 +11,7 @@ import "./Examples.css"
|
|||
export default class Examples extends Component {
|
||||
runExamples() {
|
||||
let { rule } = this.props,
|
||||
{exemples=[]} = rule
|
||||
|
||||
{ exemples = [] } = rule
|
||||
|
||||
return exemples.map(ex => {
|
||||
// les variables dans les tests peuvent être exprimées relativement à l'espace de nom de la règle,
|
||||
|
|
@ -25,12 +23,14 @@ export default class Examples extends Component {
|
|||
R.fromPairs
|
||||
)(ex.situation)
|
||||
|
||||
let runExemple = analyseSituation(rules, rule.name)(v => exempleSituation[v]),
|
||||
let runExemple = analyseSituation(rules, rule.name)(
|
||||
v => exempleSituation[v]
|
||||
),
|
||||
exempleValue = runExemple.nodeValue
|
||||
|
||||
return {
|
||||
...ex,
|
||||
ok: Math.abs( ex['valeur attendue'] - exempleValue ) < .1, //TODO on peut sûrement faire mieux...
|
||||
ok: Math.abs(ex["valeur attendue"] - exempleValue) < 0.1, //TODO on peut sûrement faire mieux...
|
||||
rule: runExemple
|
||||
}
|
||||
})
|
||||
|
|
@ -38,49 +38,64 @@ export default class Examples extends Component {
|
|||
|
||||
render() {
|
||||
let examples = this.runExamples(),
|
||||
focusedExample = R.path(['focusedExample', 'nom'])(this.props),
|
||||
{inject, situationExists , showValues} = this.props
|
||||
focusedExample = R.path(["focusedExample", "nom"])(this.props),
|
||||
{ inject, situationExists, showValues } = this.props
|
||||
|
||||
if (!examples.length) return null
|
||||
return (
|
||||
<div id="examples">
|
||||
<h2 className="subtitled">Exemples de calcul</h2>
|
||||
<p className="subtitle">Cliquez sur un exemple pour le visualiser</p>
|
||||
{R.isEmpty(examples) ?
|
||||
<p><i className="fa fa-exclamation-triangle" aria-hidden="true"></i><em>Cette règle manque d'exemples...</em></p>
|
||||
: <ul>{
|
||||
examples.map(({nom, ok, rule, 'valeur attendue': expected}) =>
|
||||
<li key={nom} className={classNames("example", {ok, selected: focusedExample == nom})}
|
||||
onClick={() => focusedExample == nom ? false : inject({nom, ok, rule})}
|
||||
>
|
||||
<span> {
|
||||
ok ?
|
||||
<i className="fa fa-check-circle" aria-hidden="true"></i>
|
||||
: <i className="fa fa-times" aria-hidden="true"></i>
|
||||
}</span>
|
||||
{R.isEmpty(examples) ? (
|
||||
<p>
|
||||
<i className="fa fa-exclamation-triangle" aria-hidden="true" />
|
||||
<em>Cette règle manque d'exemples...</em>
|
||||
</p>
|
||||
) : (
|
||||
<ul>
|
||||
{examples.map(({ nom, ok, rule, "valeur attendue": expected }) => (
|
||||
<li
|
||||
key={nom}
|
||||
className={classNames("example", {
|
||||
ok,
|
||||
selected: focusedExample == nom
|
||||
})}
|
||||
onClick={() =>
|
||||
focusedExample == nom ? false : inject({ nom, ok, rule })}
|
||||
>
|
||||
<span>
|
||||
{" "}
|
||||
{ok ? (
|
||||
<i className="fa fa-check-circle" aria-hidden="true" />
|
||||
) : (
|
||||
<i className="fa fa-times" aria-hidden="true" />
|
||||
)}
|
||||
</span>
|
||||
<span className="name">{nom}</span>
|
||||
{!ok && focusedExample == nom &&
|
||||
<div className="ko">
|
||||
Ce test ne passe pas
|
||||
{showValues && <span>
|
||||
: le résultat attendu était {' '}
|
||||
<span className="expected">{expected}</span>
|
||||
</span>}
|
||||
</div>
|
||||
}
|
||||
{!ok &&
|
||||
focusedExample == nom && (
|
||||
<div className="ko">
|
||||
Ce test ne passe pas
|
||||
{showValues && (
|
||||
<span>
|
||||
: le résultat attendu était {" "}
|
||||
<span className="expected">{expected}</span>
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</li>
|
||||
)
|
||||
}
|
||||
))}
|
||||
</ul>
|
||||
}
|
||||
{(situationExists && focusedExample) && <div>
|
||||
<button
|
||||
id="injectSituation"
|
||||
onClick={() => inject()}>
|
||||
Revenir à votre situation
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
)}
|
||||
{situationExists &&
|
||||
focusedExample && (
|
||||
<div>
|
||||
<button id="injectSituation" onClick={() => inject()}>
|
||||
Revenir à votre situation
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,20 +1,17 @@
|
|||
import React, { Component } from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import {connect} from 'react-redux'
|
||||
import {formValueSelector} from 'redux-form'
|
||||
import R from 'ramda'
|
||||
import './Rule.css'
|
||||
import {rules, decodeRuleName, nameLeaf} from 'Engine/rules.js'
|
||||
import mockSituation from 'Engine/mockSituation.yaml'
|
||||
import {analyseSituation} from 'Engine/traverse'
|
||||
import {START_CONVERSATION} from '../../actions'
|
||||
import possiblesDestinataires from 'Règles/ressources/destinataires/destinataires.yaml'
|
||||
import {capitalise0} from '../../utils'
|
||||
import References from './References'
|
||||
import Algorithm from './Algorithm'
|
||||
import Examples from './Examples'
|
||||
import Helmet from 'react-helmet'
|
||||
import {humanFigure} from './RuleValueVignette'
|
||||
import React, { Component } from "react"
|
||||
import { connect } from "react-redux"
|
||||
import R from "ramda"
|
||||
import "./Rule.css"
|
||||
import { rules, decodeRuleName, nameLeaf } from "Engine/rules.js"
|
||||
import { analyseSituation } from "Engine/traverse"
|
||||
import { START_CONVERSATION } from "../../actions"
|
||||
import possiblesDestinataires from "Règles/ressources/destinataires/destinataires.yaml"
|
||||
import { capitalise0 } from "../../utils"
|
||||
import References from "./References"
|
||||
import Algorithm from "./Algorithm"
|
||||
import Examples from "./Examples"
|
||||
import Helmet from "react-helmet"
|
||||
import { humanFigure } from "./RuleValueVignette"
|
||||
|
||||
@connect(
|
||||
state => ({
|
||||
|
|
@ -22,44 +19,44 @@ import {humanFigure} from './RuleValueVignette'
|
|||
form: state.form
|
||||
}),
|
||||
dispatch => ({
|
||||
startConversation: rootVariable => dispatch({type: START_CONVERSATION, rootVariable}),
|
||||
startConversation: rootVariable =>
|
||||
dispatch({ type: START_CONVERSATION, rootVariable })
|
||||
})
|
||||
)
|
||||
export default class Rule extends Component {
|
||||
state = {
|
||||
example: null, showValues: true
|
||||
example: null,
|
||||
showValues: true
|
||||
}
|
||||
componentWillReceiveProps(nextProps){
|
||||
let get = R.path(['match', 'params', 'name'])
|
||||
componentWillReceiveProps(nextProps) {
|
||||
let get = R.path(["match", "params", "name"])
|
||||
if (get(nextProps) !== get(this.props)) {
|
||||
this.setRule(get(nextProps))
|
||||
this.setState({example: null, showValues: true})
|
||||
this.setState({ example: null, showValues: true })
|
||||
}
|
||||
}
|
||||
setRule(name){
|
||||
this.rule = analyseSituation(rules, nameLeaf(decodeRuleName(name)))(this.props.situationGate)
|
||||
setRule(name) {
|
||||
this.rule = analyseSituation(rules, nameLeaf(decodeRuleName(name)))(
|
||||
this.props.situationGate
|
||||
)
|
||||
}
|
||||
componentWillMount(){
|
||||
let {
|
||||
match: {params: {name}}
|
||||
} = this.props
|
||||
componentWillMount() {
|
||||
let { match: { params: { name } } } = this.props
|
||||
|
||||
this.setRule(name)
|
||||
}
|
||||
render() {
|
||||
|
||||
// if (!rule) {
|
||||
// this.props.router.push('/404')
|
||||
// return null
|
||||
// }
|
||||
|
||||
let
|
||||
conversationStarted = !R.isEmpty(this.props.form),
|
||||
let conversationStarted = !R.isEmpty(this.props.form),
|
||||
situationExists = conversationStarted || this.state.example != null
|
||||
|
||||
let
|
||||
{type, name, titre, description} = this.rule,
|
||||
situationOrExampleRule = R.path(['example', 'rule'])(this.state) || this.rule,
|
||||
let { type, name, titre, description } = this.rule,
|
||||
situationOrExampleRule =
|
||||
R.path(["example", "rule"])(this.state) || this.rule,
|
||||
ruleValue = situationOrExampleRule.nodeValue
|
||||
|
||||
return (
|
||||
|
|
@ -74,37 +71,50 @@ export default class Rule extends Component {
|
|||
</h1>
|
||||
<section id="rule-meta">
|
||||
<div id="meta-paragraph">
|
||||
<p>
|
||||
{description}
|
||||
</p>
|
||||
<p>{description}</p>
|
||||
</div>
|
||||
{this.renderDestinataire(R.path([type, 'destinataire'])(this.rule))}
|
||||
{this.renderDestinataire(R.path([type, "destinataire"])(this.rule))}
|
||||
{this.renderReferences(this.rule)}
|
||||
</section>
|
||||
<div id="ruleValue" style={{visibility: situationExists ? 'visible' : 'hidden'}}>
|
||||
<div
|
||||
id="ruleValue"
|
||||
style={{ visibility: situationExists ? "visible" : "hidden" }}
|
||||
>
|
||||
<h2>Résultat</h2>
|
||||
<p>
|
||||
{ruleValue == 0
|
||||
? 'Règle non applicable'
|
||||
? "Règle non applicable"
|
||||
: ruleValue == null
|
||||
? 'Situation incomplète'
|
||||
: humanFigure(2)(ruleValue) + ' €'}
|
||||
? "Situation incomplète"
|
||||
: humanFigure(2)(ruleValue) + " €"}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<section id="rule-calc">
|
||||
<Algorithm traversedRule={situationOrExampleRule} showValues={situationExists} />
|
||||
<Algorithm
|
||||
traversedRule={situationOrExampleRule}
|
||||
showValues={situationExists}
|
||||
/>
|
||||
<Examples
|
||||
situationExists={conversationStarted}
|
||||
rule={this.rule}
|
||||
focusedExample={this.state.example}
|
||||
showValues={this.state.showValues}
|
||||
inject={example => this.setState({example, showValues: true})}/>
|
||||
inject={example => this.setState({ example, showValues: true })}
|
||||
/>
|
||||
</section>
|
||||
<button
|
||||
id="reportError">
|
||||
<a href={"mailto:contact@embauche.beta.gouv.fr?subject=Erreur dans une règle " + name}>
|
||||
<i className="fa fa-exclamation-circle" aria-hidden="true" style={{marginRight: '.6em'}}></i>Signaler une erreur
|
||||
<button id="reportError">
|
||||
<a
|
||||
href={
|
||||
"mailto:contact@embauche.beta.gouv.fr?subject=Erreur dans une règle " +
|
||||
name
|
||||
}
|
||||
>
|
||||
<i
|
||||
className="fa fa-exclamation-circle"
|
||||
aria-hidden="true"
|
||||
style={{ marginRight: ".6em" }}
|
||||
/>Signaler une erreur
|
||||
</a>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -113,35 +123,43 @@ export default class Rule extends Component {
|
|||
|
||||
renderDestinataire(destinataire) {
|
||||
if (!destinataire) return null
|
||||
let
|
||||
destinataireData = possiblesDestinataires[destinataire]
|
||||
let destinataireData = possiblesDestinataires[destinataire]
|
||||
|
||||
return <div id="destinataire">
|
||||
<h2>Destinataire</h2>
|
||||
{!destinataireData ?
|
||||
<p>Non renseigné</p>
|
||||
:
|
||||
<div>
|
||||
<a href={destinataireData.lien} target="_blank">
|
||||
{destinataireData.image &&
|
||||
<img src={require('Règles/ressources/destinataires/' + destinataireData.image)} /> }
|
||||
{!destinataireData.image &&
|
||||
<div id="calligraphy">{destinataire}</div>
|
||||
}
|
||||
</a>
|
||||
{destinataireData.nom && <div id="destinataireName">{destinataireData.nom}</div>}
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>
|
||||
return (
|
||||
<div id="destinataire">
|
||||
<h2>Destinataire</h2>
|
||||
{!destinataireData ? (
|
||||
<p>Non renseigné</p>
|
||||
) : (
|
||||
<div>
|
||||
<a href={destinataireData.lien} target="_blank">
|
||||
{destinataireData.image && (
|
||||
<img
|
||||
src={require("Règles/ressources/destinataires/" +
|
||||
destinataireData.image)}
|
||||
/>
|
||||
)}
|
||||
{!destinataireData.image && (
|
||||
<div id="calligraphy">{destinataire}</div>
|
||||
)}
|
||||
</a>
|
||||
{destinataireData.nom && (
|
||||
<div id="destinataireName">{destinataireData.nom}</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
renderReferences({'références': refs}) {
|
||||
renderReferences({ références: refs }) {
|
||||
if (!refs) return null
|
||||
|
||||
return <div>
|
||||
<h2>Références</h2>
|
||||
<References refs={refs}/>
|
||||
</div>
|
||||
return (
|
||||
<div>
|
||||
<h2>Références</h2>
|
||||
<References refs={refs} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue