66 lines
1.3 KiB
Vue
66 lines
1.3 KiB
Vue
<template>
|
|
<section id="selector">
|
|
<month-selector/>
|
|
</section>
|
|
<div id="content">
|
|
<section id="months">
|
|
<create-month/>
|
|
<months-list/>
|
|
</section>
|
|
<section id="stats">
|
|
<ca-on-period/>
|
|
<ca-repartition/>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapActions } from 'vuex'
|
|
import MonthsList from '../components/MonthsUl.vue'
|
|
import CreateMonth from '../components/CreateMonth.vue'
|
|
import MonthSelector from '../components/monthSelector.vue'
|
|
import caOnPeriod from '../components/caOnPeriod.vue'
|
|
import caRepartition from '../components/caRepartition.vue'
|
|
export default {
|
|
name: 'home',
|
|
components: {
|
|
MonthsList: MonthsList,
|
|
CreateMonth: CreateMonth,
|
|
MonthSelector: MonthSelector,
|
|
caOnPeriod: caOnPeriod,
|
|
caRepartition: caRepartition,
|
|
},
|
|
data () {
|
|
return {}
|
|
},
|
|
computed: {
|
|
},
|
|
methods: {
|
|
...mapActions('travail', {
|
|
'loadMonths': 'loadMonths',
|
|
}),
|
|
},
|
|
mounted () {
|
|
this.loadMonths()
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
#selector {
|
|
display: none;
|
|
background-color: gray;
|
|
padding: 10px;
|
|
}
|
|
#content {
|
|
display: grid;
|
|
grid-template-columns: 1fr 3fr;
|
|
margin: 0;
|
|
}
|
|
#content > * {
|
|
margin: 20px;
|
|
}
|
|
#stats {
|
|
}
|
|
</style>
|