66 lines
1.3 KiB
Vue
66 lines
1.3 KiB
Vue
<template>
|
|
<h1>Home</h1>
|
|
<button @click="writeData" ></button>
|
|
<section id="selector">
|
|
<month-selector>
|
|
</month-selector>
|
|
</section>
|
|
<div id="content">
|
|
<section id="months">
|
|
<h2> Mois </h2>
|
|
<create-month></create-month>
|
|
<months-list></months-list>
|
|
</section>
|
|
<section id="stats">
|
|
<h2>Résumé</h2>
|
|
<highlights></highlights>
|
|
</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 Highlights from '../components/hightlights.vue'
|
|
export default {
|
|
name: 'home',
|
|
components: {
|
|
MonthsList: MonthsList,
|
|
CreateMonth: CreateMonth,
|
|
MonthSelector: MonthSelector,
|
|
highlights: Highlights,
|
|
},
|
|
data () {
|
|
return {}
|
|
},
|
|
computed: {
|
|
},
|
|
methods: {
|
|
...mapActions('config', {
|
|
'loadData': 'loadData',
|
|
'writeData': 'writeData',
|
|
}),
|
|
},
|
|
mounted () {
|
|
this.loadData()
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
#content {
|
|
display: inline-flex;
|
|
flex-direction: row;
|
|
background-color: red;
|
|
margin: 0;
|
|
}
|
|
#content > * {
|
|
margin: 10px;
|
|
}
|
|
#months {
|
|
flex-basis: 60%;
|
|
}
|
|
</style>
|