Feat: manager case when there is no datas

This commit is contained in:
Bertrand Benjamin 2018-12-03 12:15:22 +01:00
parent 06855a1f5b
commit 9f3cdd4f1b
2 changed files with 46 additions and 33 deletions

View File

@ -27,6 +27,9 @@ export default {
rows: (state) => {
return state.rows.data
},
present: (state) => {
return state.rows.data.length > 0
},
spending_rows: (state, getters) => {
return getters.rows.filter(x => x.Montant < 0)
},

View File

@ -1,43 +1,50 @@
<template>
<div class="import">
<h1>Analyse</h1>
<div class="analysis" v-if="rows">
<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" :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" :value="end" @input="set_end"></b-form-input>
</b-col>
</b-row>
</b-container>
<div class="analysis" v-if="datas_present">
<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" :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" :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_tags_filter([])"></box>
<box @click.native="set_tags_filter(['cash'])" tagname="cash"></box>
<box @click.native="set_tags_filter(['CB'])" tagname="CB"></box>
<box @click.native="set_tags_filter(['virements'])" tagname="virements"></box>
</b-card-group>
<b-card-group deck class="mb-3">
<box @click.native="set_tags_filter([])"></box>
<box @click.native="set_tags_filter(['cash'])" tagname="cash"></box>
<box @click.native="set_tags_filter(['CB'])" tagname="CB"></box>
<box @click.native="set_tags_filter(['virements'])" tagname="virements"></box>
</b-card-group>
<tags-comparison></tags-comparison>
<tags-comparison></tags-comparison>
<b-table striped hover :items="filtered_rows" :fields='fields'>
<template slot="tags" slot-scope="data">
<div v-for="tag in data.item.tags">
<div v-if="tag.name !== 'Tout'">
<font-awesome-icon :icon="tag.icon" class="fa"/>
</div>
</div>
</template>
</b-table>
<b-table striped hover :items="filtered_rows" :fields='fields'>
<template slot="tags" slot-scope="data">
<div v-for="tag in data.item.tags">
<div v-if="tag.name !== 'Tout'">
<font-awesome-icon :icon="tag.icon" class="fa"/>
</div>
</div>
</template>
</b-table>
</div>
<div v-else>
<div class="nodata">
<h1>
<font-awesome-icon icon="dizzy" class="fa"/>
Pas de données
<font-awesome-icon icon="dizzy" class="fa"/>
Pas de données
<font-awesome-icon icon="dizzy" class="fa"/>
</h1>
<p>
Penser à en importer!
</p>
</div>
</div>
</div>
</template>
@ -89,7 +96,7 @@ export default {
...mapGetters({
'csvs': 'datas/csvs',
'tag_filter_rows': 'datas/tag_filter_rows',
'rows': 'datas/rows',
'datas_present': 'datas/present',
'start': 'datas/start',
'end': 'datas/end',
'tags': 'config/tags'
@ -118,7 +125,10 @@ export default {
<style scoped>
.date-selector {
padding: 1rem;
padding: 1rem;
}
.nodata{
text-align: center;
}
</style>