Feat: change type base to editable and add getters for hightlights and
editable
This commit is contained in:
parent
5eb9837e1c
commit
da86f4b9f1
@ -19,8 +19,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="datas">
|
||||
<li v-for="cara in monthDesc" :key='cara.name'>
|
||||
<label :for='cara.name'>{{ cara.desc }}</label>
|
||||
<li v-for="cara in description" :key='cara.name'>
|
||||
<label :for='cara.name'>{{ cara.label }}</label>
|
||||
<input type="number" v-model.number="monthCopy[cara.name]" id="cara.name" class="value">
|
||||
</li>
|
||||
</div>
|
||||
@ -64,7 +64,7 @@ export default {
|
||||
'lastMonthDate': 'lastMonthDate',
|
||||
}),
|
||||
...mapGetters('config', {
|
||||
'monthDesc': 'monthDesc',
|
||||
'description': 'descEditable',
|
||||
}),
|
||||
formatedDate: function () {
|
||||
return format(this.monthDate, "MMMM YYY", {locale: frLocal} )
|
||||
@ -132,6 +132,10 @@ export default {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
label{
|
||||
text-align: right;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
.value {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@ -14,15 +14,15 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id="display" v-show="!editing">
|
||||
<div class="hightlight" v-for="cara in monthDesc" :key='cara.name'>
|
||||
<label :for='cara.name'>{{ cara.desc }}</label>
|
||||
<div class="hightlight" v-for="cara in descHightlights" :key='cara.name'>
|
||||
<label :for='cara.name'>{{ cara.label }}</label>
|
||||
<span class="value" >{{ cara.output(TheMonth) ?? "∅"}} {{cara.unit}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="edit" v-show="editing">
|
||||
<div v-for="cara in monthDesc" :key='cara.name'>
|
||||
<label :for='cara.name'>{{ cara.desc }}</label>
|
||||
<input type="number" v-model.number="monthCopy[cara.name]" id="cara.name" class="value">
|
||||
<div v-for="cara in descEditable" :key='cara.name' class="cara">
|
||||
<label :for='cara.name'>{{ cara.label }}</label>
|
||||
<input type="number" v-model.number="monthCopy[cara.name]" id="cara.name">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -51,7 +51,8 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('config', {
|
||||
'monthDesc': 'monthHightlightDesc',
|
||||
'descHightlights': 'monthHightlightDesc',
|
||||
'descEditable': 'descEditable',
|
||||
}),
|
||||
rawDate: function () {
|
||||
return parseISO(this.TheDate, "yyyy-MM", new Date())
|
||||
@ -125,6 +126,7 @@ export default {
|
||||
}
|
||||
.value {
|
||||
font-size: 1.5em;
|
||||
text-align: right;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@ -137,5 +139,8 @@ export default {
|
||||
font-size: 0.8em;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.cara {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -17,12 +17,12 @@ const config = {
|
||||
userDir: './userDir/',
|
||||
dataFile: 'datas.csv',
|
||||
caProPercentage: 0.5,
|
||||
monthDesc : [
|
||||
descAll : [
|
||||
{
|
||||
name: 'caTheo',
|
||||
color: '',
|
||||
desc: 'CA "scéances effectuées"',
|
||||
type: 'base',
|
||||
label: 'CA "scéances effectuées"',
|
||||
type: 'editable',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
output: month => month.caTheo,
|
||||
@ -30,8 +30,8 @@ const config = {
|
||||
{
|
||||
name: 'caRetro',
|
||||
color: '',
|
||||
desc: 'CA "Séances facturées"',
|
||||
type: 'base',
|
||||
label: 'CA "Séances facturées"',
|
||||
type: 'editable',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
output: month => month.caRetro,
|
||||
@ -39,8 +39,8 @@ const config = {
|
||||
{
|
||||
name: 'caReact',
|
||||
color: '',
|
||||
desc: 'CA "Séances facturées" réactualisé',
|
||||
type: 'base',
|
||||
label: 'CA "Séances facturées" réactualisé',
|
||||
type: 'editable',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
output: month => month.caReact,
|
||||
@ -48,7 +48,7 @@ const config = {
|
||||
{
|
||||
name: 'sessionQty',
|
||||
color: '',
|
||||
desc: 'Nombre de séances effectuées',
|
||||
label: 'Nombre de séances effectuées',
|
||||
unit: '',
|
||||
hightlight: false,
|
||||
output: month => month.sessionQty,
|
||||
@ -56,8 +56,8 @@ const config = {
|
||||
{
|
||||
name: 'retro',
|
||||
color: '',
|
||||
desc: 'Montant de la rétrocession',
|
||||
type: 'base',
|
||||
label: 'Montant de la rétrocession',
|
||||
type: 'editable',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
output: month => month.retro,
|
||||
@ -65,8 +65,8 @@ const config = {
|
||||
{
|
||||
name: 'remuneration',
|
||||
color: '',
|
||||
desc: 'Rémuneration',
|
||||
type: 'base',
|
||||
label: 'Rémuneration',
|
||||
type: 'editable',
|
||||
unit: '€',
|
||||
hightlight: true,
|
||||
output: month => month.remuneration,
|
||||
@ -74,8 +74,8 @@ const config = {
|
||||
{
|
||||
name: 'proPercentage',
|
||||
color: '',
|
||||
desc: 'Pourcentage du CA pour la partie pro',
|
||||
type: 'base',
|
||||
label: 'Pourcentage du CA pour la partie pro',
|
||||
type: 'editable',
|
||||
unit: '%',
|
||||
hightlight: false,
|
||||
output: month => month.proPercentage,
|
||||
@ -83,7 +83,7 @@ const config = {
|
||||
{
|
||||
name: 'ca',
|
||||
color: '',
|
||||
desc: 'ca',
|
||||
label: 'ca',
|
||||
type: 'compute',
|
||||
unit: '€',
|
||||
hightlight: true,
|
||||
@ -92,7 +92,7 @@ const config = {
|
||||
{
|
||||
name: 'notInvoiced',
|
||||
color: '',
|
||||
desc: 'Non facturé',
|
||||
label: 'Non facturé',
|
||||
type: 'compute',
|
||||
unit: '€',
|
||||
hightlight: true,
|
||||
@ -101,7 +101,7 @@ const config = {
|
||||
{
|
||||
name: 'caPro',
|
||||
color: '',
|
||||
desc: 'CA pour le partie pro',
|
||||
label: 'CA pour le partie pro',
|
||||
type: 'compute',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
@ -110,7 +110,7 @@ const config = {
|
||||
{
|
||||
name: 'caPerso',
|
||||
color: '',
|
||||
desc: 'CA destiné à la rémuneration',
|
||||
label: 'CA destiné à la rémuneration',
|
||||
type: 'compute',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
@ -119,7 +119,7 @@ const config = {
|
||||
{
|
||||
name: 'caPersoUntouch',
|
||||
color: '',
|
||||
desc: 'CA destiné à la rémuneration non reversé',
|
||||
label: 'CA destiné à la rémuneration non reversé',
|
||||
type: 'compute',
|
||||
unit: '€',
|
||||
hightlight: false,
|
||||
@ -131,8 +131,18 @@ const config = {
|
||||
getters: {
|
||||
userDir (state) { return state.userDir },
|
||||
dataFilePath (state) { return path.join(state.userDir, state.dataFile) },
|
||||
monthDesc (state) { return state.monthDesc },
|
||||
monthHightlightDesc (state) { return state.monthDesc.filter(a => a.hightlight) },
|
||||
descAll (state) {
|
||||
// All description of attributes for months
|
||||
return state.descAll
|
||||
},
|
||||
descEditable (state) {
|
||||
// All description of attributes for months
|
||||
return state.descAll.filter(d => d.type == 'editable')
|
||||
},
|
||||
descOf: (state) => (desc) => {
|
||||
return state.descAll.filter(d => d.name == desc)[0]
|
||||
},
|
||||
monthHightlightDesc (state) { return state.descAll.filter(a => a.hightlight) },
|
||||
caProPercentage (state) { return state.caProPercentage },
|
||||
},
|
||||
mutations: {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user