add tags filter in LibraryList & LibraryMap

This commit is contained in:
axolotle
2021-06-14 17:00:18 +02:00
parent fb7aa12bd9
commit 3c324e0a3c
3 changed files with 17 additions and 8 deletions
+5 -4
View File
@@ -18,10 +18,9 @@
</template>
<script>
// FIXME let events bubble
import { mapGetters } from 'vuex'
import { searchInNode } from '@/store/utils'
import { searchInNode, tagsInNode } from '@/store/utils'
import { NodeView } from '@/components/nodes'
@@ -33,14 +32,16 @@ export default {
},
computed: {
...mapGetters(['orderedTextsDepart', 'search']),
...mapGetters(['orderedTextsDepart', 'search', 'tags']),
filteredNodes () {
if (!this.orderedTextsDepart) return {}
const nodesGroups = {}
const search = this.search.toLowerCase()
Object.entries(this.orderedTextsDepart).forEach(([char, nodes]) => {
const filteredNodes = nodes.filter(node => searchInNode(search, node))
const filteredNodes = nodes
.filter(node => tagsInNode(this.tags, node.tags))
.filter(node => searchInNode(search, node))
if (filteredNodes.length) {
nodesGroups[char] = filteredNodes
}
+5 -3
View File
@@ -21,7 +21,7 @@ import { randomUniform } from 'd3'
import { forceSimulation, forceCollide, forceManyBody } from 'd3-force'
import { mapGetters } from 'vuex'
import { searchInNode } from '@/store/utils'
import { searchInNode, tagsInNode } from '@/store/utils'
import { MapZoom } from '@/components/layouts'
import { NodeView } from '@/components/nodes'
@@ -42,13 +42,15 @@ export default {
},
computed: {
...mapGetters(['search']),
...mapGetters(['search', 'tags']),
filteredNodes () {
if (!this.nodes) return
const search = this.search.toLowerCase()
this.nodes.forEach(node => {
Object.assign(node, { hidden: !searchInNode(search, node.data) })
Object.assign(node, {
hidden: !(tagsInNode(this.tags, node.data.tags) && searchInNode(search, node.data))
})
})
return this.nodes
}
+7 -1
View File
@@ -124,10 +124,16 @@ export function searchInNode (search, node) {
if (key === 'authors') {
match = node[key].some(author => author.name.toLowerCase().includes(search))
} else {
console.log(node[key].toLowerCase(), search)
match = node[key].toLowerCase().includes(search)
}
if (match) return true
}
return false
}
export function tagsInNode (tags, nodeTags) {
if (tags.length === 0) return true
if (!nodeTags || nodeTags.length === 0) return false
return tags.every(tag => nodeTags.some(nodeTag => nodeTag.name === tag))
}