Feat: display months in home
This commit is contained in:
parent
bdca2dc0a0
commit
caaefc0972
29
src/components/months.vue
Normal file
29
src/components/months.vue
Normal file
@ -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>
|
@ -71,7 +71,9 @@ const travail = {
|
|||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
count (state) {return state.months.length},
|
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: {
|
mutations: {
|
||||||
}
|
}
|
||||||
|
@ -1,13 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<h1>Home</h1>
|
<h1>Home</h1>
|
||||||
<p> {{ state }} </p>
|
<section>
|
||||||
|
<h2> Mois </h2>
|
||||||
|
<months></months>
|
||||||
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { mapGetters, mapActions } from 'vuex'
|
import { mapGetters, mapActions } from 'vuex'
|
||||||
|
import months from '../components/months'
|
||||||
export default {
|
export default {
|
||||||
name: 'home',
|
name: 'home',
|
||||||
components: {},
|
components: {
|
||||||
|
months: months
|
||||||
|
},
|
||||||
data () {
|
data () {
|
||||||
return {}
|
return {}
|
||||||
},
|
},
|
||||||
|
Loading…
Reference in New Issue
Block a user