Refact: Move back filtering in store
This commit is contained in:
parent
df4c1af893
commit
967557f397
@ -31,29 +31,16 @@ export default {
|
||||
...mapGetters('config', [
|
||||
'postes'
|
||||
]),
|
||||
...mapGetters('datas', [
|
||||
'libelle_filter_rows'
|
||||
]),
|
||||
poste () {
|
||||
return this.postes[this.postename]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
filter_rows () {
|
||||
if (this.poste.words) {
|
||||
if (this.poste.invert) {
|
||||
return this.rows.filter(x => {
|
||||
return this.poste.words.every(v => {
|
||||
return x.Libellé.indexOf(v) < 0
|
||||
})
|
||||
})
|
||||
} else {
|
||||
return this.rows.filter(x => {
|
||||
return this.poste.words.some(v => {
|
||||
return x.Libellé.indexOf(v) >= 0
|
||||
})
|
||||
})
|
||||
}
|
||||
} else {
|
||||
return this.rows
|
||||
}
|
||||
return this.libelle_filter_rows(this.poste.words, this.poste.invert)
|
||||
},
|
||||
total () {
|
||||
return Math.round(
|
||||
@ -78,6 +65,7 @@ export default {
|
||||
}
|
||||
.icon {
|
||||
flex: 40%;
|
||||
align-self: center;
|
||||
}
|
||||
.amount {
|
||||
flex: 50%;
|
||||
|
@ -2,6 +2,10 @@ import { readdir, readFile } from 'fs'
|
||||
import path from 'path'
|
||||
import Papa from 'papaparse'
|
||||
|
||||
var today = new Date()
|
||||
var monthAgo = new Date()
|
||||
monthAgo.setMonth(monthAgo.getMonth() - 1)
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state: {
|
||||
@ -12,6 +16,8 @@ export default {
|
||||
fields: []
|
||||
}
|
||||
},
|
||||
start: monthAgo.toISOString().split('T')[0],
|
||||
end: today.toISOString().split('T')[0]
|
||||
},
|
||||
getters: {
|
||||
csvs: (state) => {
|
||||
@ -19,6 +25,40 @@ export default {
|
||||
},
|
||||
rows: (state) => {
|
||||
return state.rows.data
|
||||
},
|
||||
spending_rows: (state, getters) => {
|
||||
return getters.rows.filter(x => x.Montant < 0)
|
||||
},
|
||||
start: (state) => {
|
||||
return state.start
|
||||
},
|
||||
end: (state) => {
|
||||
return state.end
|
||||
},
|
||||
date_filter_rows: (state, getters) => {
|
||||
var start = new Date(state.start)
|
||||
var end = new Date(state.end)
|
||||
return getters.spending_rows.filter(x => {
|
||||
return (new Date(x.Date) >= start) & (new Date(x.Date) < end)
|
||||
})
|
||||
},
|
||||
libelle_filter_rows: (state, getters) => (words, invert) => {
|
||||
if (!words) {
|
||||
return getters.date_filter_rows
|
||||
}
|
||||
if (invert) {
|
||||
return getters.date_filter_rows.filter(x => {
|
||||
return words.every(v => {
|
||||
return x.Libellé.indexOf(v) < 0
|
||||
})
|
||||
})
|
||||
} else {
|
||||
return getters.date_filter_rows.filter(x => {
|
||||
return words.some(v => {
|
||||
return x.Libellé.indexOf(v) >= 0
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
@ -31,6 +71,12 @@ export default {
|
||||
},
|
||||
APPEND_DATA: (state, { content }) => {
|
||||
state.rows.push(content)
|
||||
},
|
||||
SET_START: (state, { start }) => {
|
||||
state.start = start
|
||||
},
|
||||
SET_END: (state, { end }) => {
|
||||
state.end = end
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
@ -65,6 +111,12 @@ export default {
|
||||
context.commit('SET_DATA', { data: parsed })
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
set_start (context, start) {
|
||||
context.commit('SET_START', { start })
|
||||
},
|
||||
set_end (context, end) {
|
||||
context.commit('SET_END', { end })
|
||||
},
|
||||
}
|
||||
}
|
||||
|
@ -4,33 +4,31 @@
|
||||
<b-container fluid>
|
||||
<b-row class="date-selector">
|
||||
<b-col sm="1"><label for="start"> Entre </label> </b-col>
|
||||
<b-col sm="3"><b-form-input id="start" type="date" v-model="start"></b-form-input></b-col>
|
||||
<b-col sm="3">
|
||||
<b-form-input id="start" type="date" :value="start" @input="set_start"></b-form-input>
|
||||
</b-col>
|
||||
<b-col sm="1"><label for="end"> et </label></b-col>
|
||||
<b-col sm="3"><b-form-input id="end" type="date" v-model="end"></b-form-input></b-col>
|
||||
<b-col sm="3"><label for="spending"> Uniquement les dépenses </label></b-col>
|
||||
<b-col sm="1"><b-form-checkbox id="spending" v-model="spending"></b-form-checkbox></b-col>
|
||||
<b-col sm="3">
|
||||
<b-form-input id="end" type="date" :value="end" @input="set_end"></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
|
||||
<b-card-group deck class="mb-3">
|
||||
<box @click.native="set_poste('total')" postename="total" :rows="date_rows"></box>
|
||||
<box @click.native="set_poste('cash')" postename="cash" :rows="date_rows"></box>
|
||||
<box @click.native="set_poste('CB')" postename="CB" :rows="date_rows"></box>
|
||||
<box @click.native="set_poste('other')" postename="other" :rows="date_rows"></box>
|
||||
<box @click.native="set_poste('total')" postename="total"></box>
|
||||
<box @click.native="set_poste('cash')" postename="cash"></box>
|
||||
<box @click.native="set_poste('CB')" postename="CB"></box>
|
||||
<box @click.native="set_poste('other')" postename="other"></box>
|
||||
</b-card-group>
|
||||
|
||||
<b-table striped hover :items="filter_rows" :fields='fields'></b-table>
|
||||
<b-table striped hover :items="filtered_rows(poste.words, poste.invert)" :fields='fields'></b-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import { mapGetters, mapActions } from 'vuex'
|
||||
import box from '../components/box'
|
||||
|
||||
var today = new Date()
|
||||
var monthAgo = new Date()
|
||||
monthAgo.setMonth(monthAgo.getMonth() - 1)
|
||||
|
||||
export default {
|
||||
name: 'home',
|
||||
components: {
|
||||
@ -53,10 +51,7 @@ export default {
|
||||
sortable: true
|
||||
}
|
||||
],
|
||||
spending: true,
|
||||
poste: {},
|
||||
start: monthAgo.toISOString().split('T')[0],
|
||||
end: today.toISOString().split('T')[0]
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
@ -66,49 +61,22 @@ export default {
|
||||
computed: {
|
||||
...mapGetters({
|
||||
'csvs': 'datas/csvs',
|
||||
'rows': 'datas/rows',
|
||||
'filtered_rows': 'datas/libelle_filter_rows',
|
||||
'start': 'datas/start',
|
||||
'end': 'datas/end',
|
||||
'postes': 'config/postes'
|
||||
}),
|
||||
date_rows () {
|
||||
return this.filter_date(this.filter_spending(this.rows))
|
||||
},
|
||||
filter_rows () {
|
||||
return this.filter_poste(this.date_rows)
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
...mapActions('datas', [
|
||||
'set_start',
|
||||
'set_end'
|
||||
]),
|
||||
update_start (e) {
|
||||
},
|
||||
table_date_format (date) {
|
||||
return date
|
||||
},
|
||||
filter_spending (rows) {
|
||||
return rows.filter(x => x.Montant < 0)
|
||||
},
|
||||
filter_date (rows) {
|
||||
var start = new Date(this.start)
|
||||
var end = new Date(this.end)
|
||||
return rows.filter(x => {
|
||||
return (new Date(x.Date) >= start) & (new Date(x.Date) < end)
|
||||
})
|
||||
},
|
||||
filter_poste (rows) {
|
||||
if (this.poste.words) {
|
||||
if (this.poste.invert) {
|
||||
return rows.filter(x => {
|
||||
return this.poste.words.every(v => {
|
||||
return x.Libellé.indexOf(v) < 0
|
||||
})
|
||||
})
|
||||
} else {
|
||||
return rows.filter(x => {
|
||||
return this.poste.words.some(v => {
|
||||
return x.Libellé.indexOf(v) >= 0
|
||||
})
|
||||
})
|
||||
}
|
||||
} else {
|
||||
return rows
|
||||
}
|
||||
},
|
||||
set_poste (postename) {
|
||||
this.poste = this.postes[postename]
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user