From d560cd5944d7ac40913555dac734ab07cff0e66d Mon Sep 17 00:00:00 2001 From: Mael Date: Fri, 26 Apr 2019 12:41:57 +0200 Subject: [PATCH] =?UTF-8?q?Curseur=20pour=20choisir=20la=20r=C3=A9mun?= =?UTF-8?q?=C3=A9ration=20du=20dirigeant=20de=20SASU?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/components/PercentageField.css | 96 +++++++++++++++++++ source/components/PercentageField.js | 33 +++++++ source/components/TargetSelection.js | 10 +- .../simulationConfigs/assimilé.yaml | 3 + source/règles/base.yaml | 27 ++++++ 5 files changed, 168 insertions(+), 1 deletion(-) create mode 100644 source/components/PercentageField.css create mode 100644 source/components/PercentageField.js diff --git a/source/components/PercentageField.css b/source/components/PercentageField.css new file mode 100644 index 000000000..5ef595dc5 --- /dev/null +++ b/source/components/PercentageField.css @@ -0,0 +1,96 @@ +.range { + -webkit-appearance: none; + vertical-align: middle; + outline: none; + border: none; + padding: 0; + background: none; +} + +.range::-webkit-slider-runnable-track { + background-color: white; + height: 6px; + border-radius: 3px; + border: 1px solid transparent; +} + +.range[disabled]::-webkit-slider-runnable-track { + border: 1px solid white; + background-color: transparent; + opacity: 0.4; +} + +.range::-moz-range-track { + background-color: white; + height: 6px; + border-radius: 3px; + border: none; +} + +.range::-ms-track { + color: transparent; + border: none; + background: none; + height: 6px; +} + +.range::-ms-fill-lower { + background-color: white; + border-radius: 3px; +} + +.range::-ms-fill-upper { + background-color: white; + border-radius: 3px; +} + +.range::-ms-tooltip { + display: none; /* display and visibility only */ +} + +.range::-moz-range-thumb { + border-radius: 20px; + height: 18px; + width: 18px; + border: 2px solid white; + background: none; + background-color: var(--colour); + cursor: pointer; +} + +.range:active::-moz-range-thumb { + outline: none; +} + +.range::-webkit-slider-thumb { + -webkit-appearance: none !important; + border-radius: 100%; + border: 2px solid white; + background-color: var(--colour); + cursor: pointer; + height: 18px; + width: 18px; + margin-top: -7px; +} + +.range[disabled]::-webkit-slider-thumb { + background-color: transparent; + border: 1px solid white; +} + +.range:active::-webkit-slider-thumb { + outline: none; +} + +.range::-ms-thumb { + border-radius: 100%; + border: 2px solid white; + background-color: var(--colour); + cursor: pointer; + height: 18px; + width: 18px; +} + +.range:active::-ms-thumb { + border: none; +} diff --git a/source/components/PercentageField.js b/source/components/PercentageField.js new file mode 100644 index 000000000..787e88077 --- /dev/null +++ b/source/components/PercentageField.js @@ -0,0 +1,33 @@ +import React from 'react' +import { debounce } from '../utils' +import './PercentageField.css' + +export default class extends React.Component { + onChange = this.props.debounce + ? debounce(this.props.debounce, this.props.input.onChange) + : this.props.input.onChange + + render() { + let { + input: { value } + } = this.props + + return ( +
+ this.onChange(e.target.value)} + value={value} + type="range" + name="volume" + min="0" + step="0.1" + max="1" + /> + + {value * 100} % + +
+ ) + } +} diff --git a/source/components/TargetSelection.js b/source/components/TargetSelection.js index d6398de10..796cf2e98 100644 --- a/source/components/TargetSelection.js +++ b/source/components/TargetSelection.js @@ -1,6 +1,7 @@ import classNames from 'classnames' import Controls from 'Components/Controls' import InputSuggestions from 'Components/conversation/InputSuggestions' +import PercentageField from 'Components/PercentageField' import PeriodSwitch from 'Components/PeriodSwitch' import withColours from 'Components/utils/withColours' import withLanguage from 'Components/utils/withLanguage' @@ -251,6 +252,9 @@ let CurrencyField = withColours(props => { /> ) }) +let DebouncedPercentageField = props => ( + +) let TargetInputOrValue = withLanguage( ({ @@ -268,8 +272,12 @@ let TargetInputOrValue = withLanguage( {inputIsActive || !target.formule || isEmpty(target.formule) ? ( event.preventDefault()} + component={ + { euros: CurrencyField, pourcentage: DebouncedPercentageField }[ + target.format + ] + } {...(inputIsActive ? { autoFocus: true } : {})} language={language} /> diff --git a/source/components/simulationConfigs/assimilé.yaml b/source/components/simulationConfigs/assimilé.yaml index 9ecc28ebe..d0d2ac7f7 100644 --- a/source/components/simulationConfigs/assimilé.yaml +++ b/source/components/simulationConfigs/assimilé.yaml @@ -1,6 +1,9 @@ objectifs: - entreprise . chiffre d'affaires - entreprise . charges + - entreprise . bénéfice + - entreprise . part du dirigeant + - entreprise . rémunération totale du dirigeant - contrat salarié . cotisations - contrat salarié . réduction ACRE - impôt . neutre diff --git a/source/règles/base.yaml b/source/règles/base.yaml index 0d93899a4..decc59739 100644 --- a/source/règles/base.yaml +++ b/source/règles/base.yaml @@ -2722,6 +2722,33 @@ 5 000 €: 5000 10 000 €: 10000 +- espace: entreprise + + nom: chiffre d'affaires de société + période: flexible + formule: + somme: + - rémunération totale du dirigeant / part du dirigeant + - charges + +- espace: entreprise + nom: part du dirigeant + description: | + C'est la part du chiffre d'affaires après charges qui est allouée à la rémunération du dirigeant. Plus cette part est élevée, plus la rémunération du dirigeant augmente, et plus le bénéfice de l'entreprise diminue ! + question: Quelle part du chiffre d'affaires après charge est allouée à la rémunération du dirigeant ? + format: pourcentage + par défaut: 0.8 + +- espace: entreprise + nom: bénéfice + période: flexible + formule: chiffre d'affaires - charges dont rémunération dirigeant + +- espace: entreprise + nom: charges dont rémunération dirigeant + période: flexible + formule: charges + rémunération totale du dirigeant + - espace: entreprise nom: rémunération totale du dirigeant description: C'est la rémunération "super-brute" du dirigeant, qui inclut toutes les cotisations sociales à payer. C'est aussi la valeur monétaire du travail du dirigeant.