Feat: basic datafile

Feat: chart delta et banque
Feat: CA chart!!
2021-08-10 11:19:03 +02:00 · 2021-08-10 11:17:53 +02:00 · 2021-08-10 10:46:05 +02:00 · 2021-08-10 09:16:21 +02:00 · 2021-08-09 14:43:24 +02:00 · 2021-08-09 14:07:42 +02:00
9 changed files with 312 additions and 125 deletions
--- a/package.json
+++ b/package.json
@ -13,6 +13,7 @@
  },
  "main": "background.js",
  "dependencies": {
+    "chart.js": "2.9.4",
    "core-js": "^3.6.5",
    "date-fns": "^2.23.0",
    "papaparse": "^5.3.1",
--- a/src/components/graphs/RevenusChart.vue
+++ b/src/components/graphs/RevenusChart.vue
@ -0,0 +1,92 @@
+<template>
+  <div>
+    <canvas id="revenus-chart"></canvas>
+  </div>
+</template>
+
+<script>
+import Chart from 'chart.js'
+import { mapGetters } from 'vuex'
+import { monthCA, caPersoUntouch, caPerso, remuneration } from '../../lib/months'
+
+export default {
+    name: 'RevenusChart',
+    data() {
+        return {
+        }
+    },
+    watch: {
+        months: function () {
+            const ctx = document.getElementById('revenus-chart');
+            new Chart(ctx, this.graphDatas);
+        },
+    },
+    computed: {
+        ...mapGetters('config', {
+            caProPercentage: 'caProPercentage',
+        }),
+        ...mapGetters('travail', {
+            months: "months",
+        }),
+        graphDatas: function () {
+            var datas = {
+                type: "bar",
+                data: {
+                    labels: Object.keys(this.months),
+                    datasets: [ 
+                        {
+                            type: "bar",
+                            label: "Difference CA perso et remuneration",
+                            data: Object.values(this.months).map(a => caPerso({bar: a}, this.caProPercentage) - remuneration({bar:a})),
+                            backgroundColor: "red",
+                            borderColor: "light-red",
+                            borderWidth: 3
+                        },
+                        {
+                            type: "bar",
+                            label: "CA",
+                            data: Object.values(this.months).map(a => monthCA(a)),
+                            backgroundColor: "rgba(54,73,93,.5)",
+                            borderColor: "#36495d",
+                            borderWidth: 3
+                        },
+                        {
+                            type: "line",
+                            label: "Banque",
+                            data: this.untouchEvo,
+                            backgroundColor: "rgba(71, 183,132,.5)",
+                            borderColor: "#47b784",
+                            borderWidth: 3
+                        },
+                    ],
+                },
+                options: {
+                    responsive: true,
+                    lineTension: 1,
+                    scales: {
+                      yAxes: [
+                        {
+                          ticks: {
+                            beginAtZero: true,
+                            padding: 25
+                          }
+                        }
+                      ]
+                    }
+                }
+            }
+            return datas
+        },
+        untouchEvo: function () {
+            const cumulativeArray = (arr => value => {arr.push(value); return [...arr];})([]);
+            return Object.values(this.months).map(cumulativeArray).map(a => caPersoUntouch(a, this.caProPercentage))
+        },
+    },
+    methods: {
+    },
+    mounted() {
+        const ctx = document.getElementById('revenus-chart');
+        new Chart(ctx, this.graphDatas);
+    }
+}
+</script>
--- a/src/components/hightlights.vue
+++ b/src/components/hightlights.vue
@ -48,11 +48,41 @@
            <li>Rétrocession moyenne</li>
        </ul>
    </div>
+    <div class="hightlight">
+        <ul>
+            <li>{{ caPro }}</li>
+            <li> CA pour la partie pro ({{ caProPercentage*100}}% du CA)</li>
+        </ul>
+    </div>
+    <div class="hightlight">
+        <ul>
+            <li>{{ caPerso }}</li>
+            <li> CA pour la partie perso</li>
+        </ul>
+    </div>
+    <div class="hightlight">
+        <ul>
+            <li>{{ caPersoUntouch }}</li>
+            <li> CA perso non utilisé pour se rémunérer</li>
+        </ul>
+    </div>
 </div>
 </template>

 <script>
 import { mapGetters } from 'vuex'
+import { caTotal,
+    caMean,
+    caTheo,
+    remuneration,
+    remunerationMean,
+    retrocession,
+    retrocessionMean,
+    caPro,
+    caPerso,
+    caPersoUntouch 
+} from '../lib/months'
+
 export default {
    name: 'Hightlights',
    components: {
@ -61,15 +91,23 @@ export default {
        return {}
        },
    computed: {
+        ...mapGetters('config', {
+            caProPercentage: 'caProPercentage',
+        }),
        ...mapGetters('travail', {
-            ca: "ca",
-            caMean: "caMean",
-            caTheo: "caTheo",
-            remuneration: "remuneration",
-            remunerationMean: "remunerationMean",
-            retrocession: "retrocession",
-            retrocessionMean: "retrocessionMean",
-        })
+            months: "months",
+        }),
+        ca: function () {return caTotal(this.months)},
+        caMean: function () {return caMean(this.months)},
+        caTheo: function () {return caTheo(this.months)},
+        remuneration: function () {return remuneration(this.months)},
+        remunerationMean: function () {return remunerationMean(this.months)},
+        retrocession: function () {return retrocession(this.months)},
+        retrocessionMean: function () {return retrocessionMean(this.months)},
+        caPro: function () {return caPro(this.months, this.caProPercentage)},
+        caPerso: function () {return caPerso(this.months, this.caProPercentage)},
+        caPersoUntouch: function () {return caPersoUntouch(this.months, this.caProPercentage)},
+
      },
      mounted () {
      },
--- a/src/lib/months.js
+++ b/src/lib/months.js
@ -0,0 +1,78 @@
+
+export function monthCA(month) {
+    // Extract the CA of the month
+    if (month.ca_react) {
+        return month.ca_react
+    } else {
+        return month.ca_retro
+    }
+}
+
+export function count (months) {
+    // Count how many months there are
+    return Object.keys(months).length
+}
+
+export function caTotal (months) {
+    // Total CA (ca_react if sets, ca_retro otherwise)
+    return Object.values(months).map(a => monthCA(a)).reduce(
+        (acc, v) => acc + v
+        ,0
+    )
+}
+
+export function caMean (months) {
+    return caTotal(months) / count(months)
+}
+
+
+export function caTheo (months) {
+    // Total theorical CA
+    return Object.values(months).map(a => a.ca_theo).reduce(
+        (acc, v) => acc + v,
+        0
+    )
+}
+
+export function remuneration (months) {
+    // Total remuneration
+    return Object.values(months).map(a => a.remuneration).reduce(
+        (acc, v) => acc + v,
+        0
+    )
+}
+
+export function remunerationMean (months) {
+    // Mean of remuneration
+    return Math.floor(remuneration(months) / count(months))
+}
+
+export function retrocession (months) {
+    // Total retrocession
+    return Object.values(months)
+        .map(a => a.retro)
+        .reduce(
+            (acc, v) => acc + v,
+            0
+        )
+}
+
+export function retrocessionMean (months) {
+    // Mean of retrocession
+    return Math.floor(retrocession(months) / count(months))
+}
+
+export function caPro (months, keepPercent) {
+    // Part of the CA to keep for professional use
+    return caTotal(months) * keepPercent
+}
+
+export function caPerso (months, keepPercent) {
+    // Part of the CA to keep for personal use
+    return caTotal(months) - caPro(months, keepPercent)
+}
+
+export function caPersoUntouch (months, keepPercent) {
+    // Part of the personnal use CA that haven't been use
+    return caPerso(months, keepPercent) - remuneration(months)
+}
--- a/src/store/config/index.js
+++ b/src/store/config/index.js
@ -8,12 +8,14 @@ const config = {
        return {
            //userDir: '~/.config/sousmargot/',
            userDir: './userDir/',
-            dataFile: 'datas.csv'
+            dataFile: 'datas.csv',
+            caProPercentage: 0.5,
        }
    },
    getters: {
        userDir (state) { return state.userDir },
        dataFilePath (state) { return path.join(state.userDir, state.dataFile) },
+        caProPercentage (state) { return state.caProPercentage },
    },
    mutations: {
    },
@ -39,4 +41,3 @@ const config = {
 }

 export default config
-
--- a/src/store/travail/index.js
+++ b/src/store/travail/index.js
@ -1,13 +1,6 @@
 import { readFile } from 'fs'
 import Papa from 'papaparse'

-function monthCA(month) {
-    if (month.ca_react) {
-        return month.ca_react
-    } else {
-        return month.ca_retro
-    }
-}

 const travail = {
    namespaced: true,
@ -22,54 +15,54 @@ const travail = {
                remuneration: 0, // rémunération décidée
            },
            months: {
-                //"2021-01": {
-                //    ca_theo: null, // ca théorique basé sur les séances effectuées
-                //    nbr_seances: null, // Nombre de séances effectuées sur le mois
-                //    ca_retro: 6747, // ca au moment de la rétrocession
-                //    ca_react: null, // ca réactualisé
-                //    retro: 893, // montant de la rétrocession
-                //    remuneration: 2000, // rémunération décidée
-                //},
-                //"2021-02": {
-                //    ca_theo: null, // ca théorique basé sur les séances effectuées
-                //    nbr_seances: null, // Nombre de séances effectuées sur le mois
-                //    ca_retro: 5183, // ca au moment de la rétrocession
-                //    ca_react: null, // ca réactualisé
-                //    retro: 665, // montant de la rétrocession
-                //    remuneration: 1500, // rémunération décidée
-                //},
-                //"2021-03": {
-                //    ca_theo: null, // ca théorique basé sur les séances effectuées
-                //    nbr_seances: null, // Nombre de séances effectuées sur le mois
-                //    ca_retro: 7088, // ca au moment de la rétrocession
-                //    ca_react: null, // ca réactualisé
-                //    retro: 855, // montant de la rétrocession
-                //    remuneration: 2000, // rémunération décidée
-                //},
-                //"2021-04": {
-                //    ca_theo: null, // ca théorique basé sur les séances effectuées
-                //    nbr_seances: null, // Nombre de séances effectuées sur le mois
-                //    ca_retro: 4194, // ca au moment de la rétrocession
-                //    ca_react: 5630, // ca réactualisé
-                //    retro: 627, // montant de la rétrocession
-                //    remuneration: 2000, // rémunération décidée
-                //},
-                //"2021-05": {
-                //    ca_theo: null, // ca théorique basé sur les séances effectuées
-                //    nbr_seances: null, // Nombre de séances effectuées sur le mois
-                //    ca_retro: 5564, // ca au moment de la rétrocession
-                //    ca_react: 6335, // ca réactualisé
-                //    retro: 699, // montant de la rétrocession
-                //    remuneration: 2800, // rémunération décidée
-                //},
-                //"2021-06": {
-                //    ca_theo: null, // ca théorique basé sur les séances effectuées
-                //    nbr_seances: null, // Nombre de séances effectuées sur le mois
-                //    ca_retro: 5442, // ca au moment de la rétrocession
-                //    ca_react: 6335, // ca réactualisé
-                //    retro: 638, // montant de la rétrocession
-                //    remuneration: 2800, // rémunération décidée
-                //},
+                "2021-01": {
+                    ca_theo: null, // ca théorique basé sur les séances effectuées
+                    nbr_seances: null, // Nombre de séances effectuées sur le mois
+                    ca_retro: 6747, // ca au moment de la rétrocession
+                    ca_react: null, // ca réactualisé
+                    retro: 893, // montant de la rétrocession
+                    remuneration: 2000, // rémunération décidée
+                },
+                "2021-02": {
+                    ca_theo: null, // ca théorique basé sur les séances effectuées
+                    nbr_seances: null, // Nombre de séances effectuées sur le mois
+                    ca_retro: 5183, // ca au moment de la rétrocession
+                    ca_react: null, // ca réactualisé
+                    retro: 665, // montant de la rétrocession
+                    remuneration: 1500, // rémunération décidée
+                },
+                "2021-03": {
+                    ca_theo: null, // ca théorique basé sur les séances effectuées
+                    nbr_seances: null, // Nombre de séances effectuées sur le mois
+                    ca_retro: 7088, // ca au moment de la rétrocession
+                    ca_react: null, // ca réactualisé
+                    retro: 855, // montant de la rétrocession
+                    remuneration: 2000, // rémunération décidée
+                },
+                "2021-04": {
+                    ca_theo: null, // ca théorique basé sur les séances effectuées
+                    nbr_seances: null, // Nombre de séances effectuées sur le mois
+                    ca_retro: 4194, // ca au moment de la rétrocession
+                    ca_react: 5630, // ca réactualisé
+                    retro: 627, // montant de la rétrocession
+                    remuneration: 2000, // rémunération décidée
+                },
+                "2021-05": {
+                    ca_theo: null, // ca théorique basé sur les séances effectuées
+                    nbr_seances: null, // Nombre de séances effectuées sur le mois
+                    ca_retro: 5564, // ca au moment de la rétrocession
+                    ca_react: 6335, // ca réactualisé
+                    retro: 699, // montant de la rétrocession
+                    remuneration: 2800, // rémunération décidée
+                },
+                "2021-06": {
+                    ca_theo: null, // ca théorique basé sur les séances effectuées
+                    nbr_seances: null, // Nombre de séances effectuées sur le mois
+                    ca_retro: 5442, // ca au moment de la rétrocession
+                    ca_react: 6335, // ca réactualisé
+                    retro: 638, // montant de la rétrocession
+                    remuneration: 2800, // rémunération décidée
+                },
            },
            range: {
                start: "2021-01",
@ -109,54 +102,6 @@ const travail = {
            // Amount of mounts
            return Object.keys(getters.months).length 
        },
-        ca: (state, getters) => {
-            // Total CA (ca_react if sets, ca_retro otherwise)
-            const a = Object.values(getters.months).map(a => monthCA(a)).reduce(
-                (acc, v) => acc + v
-                ,0
-            )
-            return a
-        },
-        caMean: (state, getters) => {
-            // Mean of CA
-            if (getters.count > 0) {
-                return Math.floor(getters.ca / getters.count)
-            } else {
-                return "..."
-            }
-        },
-        caTheo: (state, getters) => {
-            // Total theorical CA
-            return Object.values(getters.months).map(a => a.ca_theo).reduce(
-                (acc, v) => acc + v,
-                0
-            )
-        },
-        remuneration: (state, getters) => {
-            // Total remuneration
-            return Object.values(getters.months).map(a => a.remuneration).reduce(
-                (acc, v) => acc + v,
-                0
-            )
-        },
-        remunerationMean: (state, getters) => {
-            // Mean of remuneration
-            return Math.floor(getters.remuneration / getters.count)
-        },
-        retrocession: (state, getters) => {
-            // Total retrocession
-            return Object.values(getters.months)
-                .map(a => a.retro)
-                .reduce(
-                    (acc, v) => acc + v,
-                    0
-                )
-        },
-        retrocessionMean: (state, getters) => {
-            // Mean of retrocession
-            return Math.floor(getters.retrocession / getters.count
-            )
-        },
    },
    mutations: {
        cleanMonths (state) {
--- a/src/views/home.vue
+++ b/src/views/home.vue
@ -1,19 +1,18 @@
 <template>
 <h1>Home</h1>
-<button @click="writeData" ></button>
+<revenus-chart/>
 <section id="selector">
-   <month-selector> 
-   </month-selector> 
+   <month-selector/> 
 </section>
 <div id="content">
    <section id="months">
        <h2> Mois </h2>
-        <create-month></create-month>
-        <months-list></months-list>
+        <create-month/>
+        <months-list/>
    </section>
    <section id="stats">
        <h2>Résumé</h2>
-        <highlights></highlights> 
+        <highlights/>
    </section>
 </div>
 </template>
@ -24,6 +23,7 @@ import MonthsList from '../components/MonthsUl.vue'
 import CreateMonth from '../components/CreateMonth.vue'
 import MonthSelector from '../components/monthSelector.vue'
 import Highlights from '../components/hightlights.vue'
+import RevenusChart from '../components/graphs/RevenusChart.vue'
 export default {
    name: 'home',
    components: {
@ -31,6 +31,7 @@ export default {
        CreateMonth: CreateMonth,
        MonthSelector: MonthSelector,
        highlights: Highlights,
+        RevenusChart: RevenusChart,
    },
    data () {
        return {}
@ -38,15 +39,12 @@ export default {
    computed: {
    },
    methods: {
-        ...mapActions('config', {
-            'writeData': 'writeData',
-        }),
        ...mapActions('travail', {
            'loadMonths': 'loadMonths',
        }),
    },
    mounted () {
-        this.loadMonths()
+        //this.loadMonths()
    }, 
 }
 </script>
--- a/userDir/datas.csv
+++ b/userDir/datas.csv
@ -1 +1,7 @@
-ca_theo, nbr_seances, ca_retro, ca_react, retro, remuneration,
+ca_theo,nbr_seances,ca_retro,ca_react,retro,remuneration,date
+,,6747,,893,2000,2021-01
+,,5183,,665,1500,2021-02
+,,7088,,855,2000,2021-03
+,,4194,5630,627,2000,2021-04
+,,5564,6335,699,2800,2021-05
+,,5442,6335,638,2800,2021-06
--- a/yarn.lock
+++ b/yarn.lock
@ -2774,6 +2774,29 @@ chardet@^0.7.0:
  resolved "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz"
  integrity sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==

+chart.js@2.9.4:
+  version "2.9.4"
+  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.4.tgz#0827f9563faffb2dc5c06562f8eb10337d5b9684"
+  integrity sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==
+  dependencies:
+    chartjs-color "^2.1.0"
+    moment "^2.10.2"
+
+chartjs-color-string@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
+  integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
+  dependencies:
+    color-name "^1.0.0"
+
+chartjs-color@^2.1.0:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
+  integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
+  dependencies:
+    chartjs-color-string "^0.6.0"
+    color-convert "^1.9.3"
+
 check-types@^8.0.3:
  version "8.0.3"
  resolved "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz"
@ -2987,7 +3010,7 @@ collection-visit@^1.0.0:
    map-visit "^1.0.0"
    object-visit "^1.0.0"

-color-convert@^1.9.0, color-convert@^1.9.1:
+color-convert@^1.9.0, color-convert@^1.9.1, color-convert@^1.9.3:
  version "1.9.3"
  resolved "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz"
  integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
@ -6723,6 +6746,11 @@ mkdirp@^1.0.3, mkdirp@^1.0.4:
  resolved "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz"
  integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==

+moment@^2.10.2:
+  version "2.29.1"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
+  integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
+
 move-concurrently@^1.0.1:
  version "1.0.1"
  resolved "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz"
Author	SHA1	Message	Date
Bertrand Benjamin	e7eb6f87b1	Feat: basic datafile	2021-08-10 11:19:03 +02:00
Bertrand Benjamin	6c006a15fe	Feat: chart delta et banque	2021-08-10 11:17:53 +02:00
Bertrand Benjamin	cb39fbe5dd	Feat: CA chart!!	2021-08-10 10:46:05 +02:00
Bertrand Benjamin	a3cd3864ce	Feat: clean home	2021-08-10 09:16:21 +02:00
Bertrand Benjamin	78bb4cb1ff	Feat: functionnalize months calculus	2021-08-09 14:43:24 +02:00
Bertrand Benjamin	c47062ce86	Feat: add hightlights	2021-08-09 14:07:42 +02:00