Feat: display months in home

src/components/months.vue

@@ -0,0 +1,29 @@
+<template>
+<div id="months">
+<ul>
+<li v-for="month in months" :key="month.date">
+{{ month }}
+</li>
+</ul>
+</div>
+
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+export default {
+  name: 'months',
+  props: {
+  },
+  computed: {
+    ...mapGetters({
+        months: "travail/months",
+    })
+  },
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+
+</style>

src/store/travail/index.js

@@ -71,7 +71,9 @@ const travail = {
     },
     getters: {
         count (state) {return state.months.length},
-        months (state) {return state.months},
+        months (state) {
+            return state.months.sort((a, b) => new Date(b.date) - new Date(a.date))
+        },
     },
     mutations: {
     }

src/views/home.vue

@@ -1,24 +1,30 @@
 <template>
 <h1>Home</h1>
-<p> {{ state }} </p>
+<section>
+    <h2> Mois </h2>
+    <months></months>
+</section>
 </template>
 
 <script>
 import { mapGetters, mapActions } from 'vuex'
+import months from '../components/months'
 export default {
     name: 'home',
-    components: {},
+    components: {
+        months: months
+        },
     data () {
         return {}
         },
-  computed: {
+    computed: {
-    ...mapGetters({
+        ...mapGetters({
-        state: "datas/count",
+            state: "datas/count",
-    })
+        })
-  },
+      },
-  methods: {
+      methods: {
-    ...mapActions({
+        ...mapActions({
-    })
+        })
       },
 }
 </script>