Compare commits

..

2 Commits

2 changed files with 74 additions and 54 deletions

View File

@ -4,12 +4,12 @@
<h2>Période</h2>
</li>
<li>
<input type="month" v-model="range.start">
<input type="month" v-model="range.end">
<input type="month" @input="updateStart" v-model="start">
<input type="month" @input="updateEnd" v-model="end">
</li>
<li>
<button @click="setRange6months" :active='selected=="month"'>6 mois</button>
<button @click="setRange1year" :active='selected=="year"'>1 an</button>
<button @click="setRangeFromJanuary" :active='selected=="january"'>Depuis le début de l'année</button>
<button @click="setRange1year" :active='selected=="year"'>Sur 1 an</button>
<button @click="setRangeAll" :active='selected=="all"'>Tout</button>
</li>
</ul>
@ -19,7 +19,7 @@
<script>
import { mapGetters, mapActions } from 'vuex'
import { addMonths, format, parseISO } from 'date-fns'
import { setMonth, addMonths, format, parseISO } from 'date-fns'
const today = new Date();
@ -30,25 +30,46 @@ export default {
data () {
return {
selected: "",
start: "",
end: "",
}
},
computed: {
...mapGetters('travail', {
range: "Range",
range: "range",
monthsDate: "MonthsDate",
})
},
watch: {
range: function (newRange, oldRange) {
this.start = this.range.start
this.end = this.range.end
},
},
mounted () {
this.setRangeFromJanuary()
this.start = this.range.start
this.end = this.range.end
},
methods: {
...mapActions('travail', {
setRange: "setRange",
}),
setRange6months: function () {
const start = addMonths(new Date(), -6)
updateStart: function () {
this.selected = "custom"
this.setRange({start: this.start, end: this.end})
},
updateEnd: function () {
this.selected = "custom"
this.setRange({start: this.start, end: this.end})
},
setRangeFromJanuary: function () {
const start = setMonth(today, 0)
const range = {
start: format(start, 'yyyy-MM'),
end: format(today, 'yyyy-MM'),
}
this.selected = "month"
this.selected = "january"
this.setRange(range)
},
setRange1year: function () {
@ -76,40 +97,39 @@ export default {
</script>
<style scoped>
ul {
list-style-type: none;
padding: 0;
display: flex;
flex-flow: column wrap;
}
ul > * {
margin-top: 10px;
}
li {
list-style-type: none;
display: flex;
flex-flow: row;
justify-content: space-around;
ul {
list-style-type: none;
padding: 0;
display: flex;
flex-flow: column wrap;
}
ul > * {
margin-top: 10px;
}
li {
list-style-type: none;
display: flex;
flex-flow: row;
justify-content: space-around;
}
h2 {
margin: 0;
}
input {
border: none;
color: white;
padding: 15px 32px;
text-align: center;
display: inline-block;
font-size: 16px;
border-radius: 5px;
color: black;
}
button {
flex-basis: 33%;
height: 3rem;
background-color: white;
}
}
h2 {
margin: 0;
}
input {
border: none;
color: white;
padding: 15px 32px;
text-align: center;
display: inline-block;
font-size: 16px;
border-radius: 5px;
color: black;
}
button {
flex-basis: 33%;
height: 3rem;
background-color: white;
}
</style>

View File

@ -76,7 +76,7 @@ const travail = {
},
getters: {
TheEmptyMonth(state) { return { ...state.empty } },
Range(state) { return state.range },
range(state) { return state.range },
MonthsDate(state) {
// Get months inside the range
return Object.keys(state.months).filter(date => (date >= state.range.start) && (date <= state.range.end)).sort().reverse()
@ -101,9 +101,9 @@ const travail = {
// Amount of mounts
return Object.keys(getters.months).length
},
ca: (state) => {
ca: (state, getters) => {
// Total CA (ca_react if sets, ca_retro otherwise)
return Object.values(state.months).map(a => monthCA(a)).reduce(
return Object.values(getters.months).map(a => monthCA(a)).reduce(
(acc, v) => acc + v,
0
)
@ -115,30 +115,30 @@ const travail = {
0
) / getters.count)
},
caTheo: (state) => {
caTheo: (state, getters) => {
// Total theorical CA
return Object.values(state.months).map(a => a.ca_theo).reduce(
return Object.values(getters.months).map(a => a.ca_theo).reduce(
(acc, v) => acc + v,
0
)
},
remuneration: (state) => {
remuneration: (state, getters) => {
// Total remuneration
return Object.values(state.months).map(a => a.remuneration).reduce(
return Object.values(getters.months).map(a => a.remuneration).reduce(
(acc, v) => acc + v,
0
)
},
remunerationMean: (state, getters) => {
// Mean of remuneration
return Math.floor(Object.values(state.months).map(a => a.remuneration).reduce(
return Math.floor(Object.values(getters.months).map(a => a.remuneration).reduce(
(acc, v) => acc + v,
0
) / getters.count)
},
retrocession: (state) => {
retrocession: (state, getters) => {
// Total retrocession
return Object.values(state.months)
return Object.values(getters.months)
.map(a => a.retro)
.reduce(
(acc, v) => acc + v,
@ -148,7 +148,7 @@ const travail = {
retrocessionMean: (state, getters) => {
// Mean of retrocession
return Math.floor(
Object.values(state.months)
Object.values(getters.months)
.map(a => a.retro)
.reduce(
(acc, v) => acc + v,