Feat: manager case when there is no datas
This commit is contained in:
		| @@ -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) | ||||
|     }, | ||||
|   | ||||
| @@ -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> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user