Fix(Categorie): filter table on categories

src/components/card_categorie.vue

@@ -33,7 +33,7 @@ export default {
       'categories'
     ]),
     ...mapGetters('datas', [
-      'tag_filter_rows'
+      'categorie_filter_rows'
     ]),
     categorie () {
       return this.categories[this.categoriename.toLowerCase()]
@@ -41,7 +41,7 @@ export default {
   },
   methods: {
     filter_rows () {
-      return this.tag_filter_rows([this.categorie.name])
+      return this.categorie_filter_rows([this.categorie.name])
     },
     total () {
       return total(this.filter_rows())

src/libs/data_processing.js

@@ -1,17 +1,17 @@
 import moment from 'moment'
-export function appendTag (row, keywords, field = 'Libellé') {
+export function appendKeywordField (row, toField, keywords, fromField = 'Libellé') {
-  // Append row.tag
+  // Append row[toField] base on keywords
   // if row.libellé contains one of words and not invert it gets tagged
   // if row.libellé contains no words and invert it gets tagged
   // according to keywords [{name: string, words: [], invert: bool}]
-  row.tags = keywords.filter(k => {
+  row[toField] = keywords.filter(k => {
-    return strContains(row[field], k.words, k.invert)
+    return strContains(row[fromField], k.words, k.invert)
   })
 }
 
 function strContains (string, words, invert) {
   // Does a string contain one of words or the opposite
-  if (!words) {
+  if (words.length === 0) {
     return true
   }
   if (invert) {
@@ -35,19 +35,19 @@ export function total (rows, field = 'Montant') {
   return Math.round(sum)
 }
 
-export function tagFilter (rows, tags, invert = false) {
+export function keywordFilter (rows, field, keywords, invert = false) {
-  // filter rows by tags
+  // filter rows by keywords in rows[field]
   // invert inverts the selection
   return rows.filter(row => {
     if (invert) {
-      return tags.some(t => {
+      return keywords.some(kwd => {
-        return row.tags.map(t => t.name.toLowerCase())
+        return row[field].map(k => k.name.toLowerCase())
-          .indexOf(t.toLowerCase()) < 0
+          .indexOf(kwd.toLowerCase()) < 0
       })
     } else {
-      return tags.every(t => {
+      return keywords.every(kwd => {
-        return row.tags.map(t => t.name.toLowerCase())
+        return row[field].map(k => k.name.toLowerCase())
-          .indexOf(t.toLowerCase()) > -1
+          .indexOf(kwd.toLowerCase()) > -1
       })
     }
   })

src/store/modules/datas.js

@@ -3,7 +3,7 @@ import Vue from 'vue'
 import path from 'path'
 import Papa from 'papaparse'
 import moment from 'moment'
-import { appendTag, formatDate, tagFilter } from '../../libs/data_processing'
+import { appendKeywordField, formatDate, keywordFilter } from '../../libs/data_processing'
 
 export default {
   namespaced: true,
@@ -69,11 +69,33 @@ export default {
         rows = getters.spending_rows
       }
       if (tags.length > 0) {
-        return tagFilter(rows, tags, invert)
+        return keywordFilter(rows, 'tags', tags, invert)
       } else {
         if (invert) {
           return rows.filter(r => {
-            return r.tags.map(t => t.name.toLowerCase()).toString() === ['cb'].toString()
+            return r.tags.length === 0
+          })
+        } else {
+          return rows
+        }
+      }
+    },
+    categorie_filter_rows: (state, getters) => (categories, invert, dateFilter = true) => {
+      // return rows filtered by categories
+      // by default it filters rows by date
+      // to disable date filtering set date_filter to false
+      var rows
+      if (dateFilter) {
+        rows = getters.date_filter_rows
+      } else {
+        rows = getters.spending_rows
+      }
+      if (categories.length > 0) {
+        return keywordFilter(rows, 'categorie', categories, invert)
+      } else {
+        if (invert) {
+          return rows.filter(r => {
+            return r.categories.length === 0
           })
         } else {
           return rows
@@ -103,7 +125,6 @@ export default {
       // Set of month
       return [...new Set(getters.rows.map(x => moment(x.Date).format('MMMM YYYY')))]
     }
-
   },
   mutations: {
     CLEAR_DATA: (state) => {
@@ -158,9 +179,11 @@ export default {
     },
     clean_store_data (context, { filename, parsed }) {
       var tags = Object.values(context.rootGetters['config/tags'])
+      var categories = Object.values(context.rootGetters['config/categories'])
       parsed.data = parsed.data.filter(x => x.Libellé !== undefined)
       parsed.data.forEach(row => {
-        appendTag(row, tags, 'Libellé')
+        appendKeywordField(row, 'tags', tags, 'Libellé')
+        appendKeywordField(row, 'categorie', categories, 'Libellé')
         formatDate(row, 'Date')
       })
 

src/views/home.vue

@@ -21,7 +21,7 @@
         </b-container>
 
         <b-card-group deck class="mb-3" v-for="categorie in categories">
-            <card-categorie @click.native="set_tag_filter(categorie.words)" :categoriename="categorie.name"></card-categorie>
+            <card-categorie @click.native="set_categories_filter([categorie.name])" :categoriename="categorie.name"></card-categorie>
         </b-card-group>
 
         <tags-comparison></tags-comparison>
@@ -92,13 +92,13 @@ export default {
         variant: 'info',
         icon: 'file-invoice-dollar'
       },
-      tags_filter: []
+      categories_filter: []
     }
   },
   computed: {
     ...mapGetters({
       'csvs': 'datas/csvs',
-      'tag_filter_rows': 'datas/tag_filter_rows',
+      'categorie_filter_rows': 'datas/categorie_filter_rows',
       'datas_present': 'datas/present',
       'month': 'datas/month',
       'months': 'datas/months',
@@ -106,17 +106,17 @@ export default {
       'categories': 'config/categories'
     }),
     filtered_rows () {
-      return this.tag_filter_rows(this.tags_filter)
+      return this.categorie_filter_rows(this.categories_filter)
-    },
+    }
   },
   methods: {
     ...mapActions('datas', [
       'next_month',
-      'prev_month',
+      'prev_month'
     ]),
-    set_tags_filter (tagnames) {
+    set_categories_filter (categorienames) {
-      this.tags_filter = tagnames
+      this.categories_filter = categorienames
-    },
+    }
   }
 }
 </script>