feat: Treetable filter auf Kind-Knoten anwenden
Der filter-Callback wird jetzt auch auf Kind-Knoten angewendet, nicht nur auf Top-Level-Nodes. Dadurch lässt sich bei hierarchischen Daten (z.B. Tag-Baum) die Suche auf den gesamten Teilbaum verfeinern — nur Knoten, die selbst matchen oder einen matchenden Nachfahren haben, werden gerendert. Abwärtskompatibel: Aufrufer ohne filter-Attribut sind unaffected. Generated by Mistral Vibe. Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
1 parent
44c411e5d7
commit
3361ef16dd
1 file changed
+15
-3
@@ -88,7 +88,9 @@ export const Treetable: m.ClosureComponent<iTreetable> = (vnode) => {
|
|||||||
onRowMarked: onRowMarked,
|
onRowMarked: onRowMarked,
|
||||||
isSelected: isSelected,
|
isSelected: isSelected,
|
||||||
isEven: ((z % 2) == 0),
|
isEven: ((z % 2) == 0),
|
||||||
hasSiblingsWithChildren: topHasSiblingsWithChildren} as iTreerow)
|
hasSiblingsWithChildren: topHasSiblingsWithChildren,
|
||||||
|
filter: vnode.attrs.filter,
|
||||||
|
searchvalue: searchvalue} as iTreerow)
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
return null
|
return null
|
||||||
@@ -114,6 +116,12 @@ interface iTreerow {
|
|||||||
* den Platzhalter-Pfeil nur dann zu rendern, wenn es Nodes mit
|
* den Platzhalter-Pfeil nur dann zu rendern, wenn es Nodes mit
|
||||||
* Pfeil gibt, an denen der Text ausgerichtet werden kann. */
|
* Pfeil gibt, an denen der Text ausgerichtet werden kann. */
|
||||||
hasSiblingsWithChildren?: boolean
|
hasSiblingsWithChildren?: boolean
|
||||||
|
/** Optional: Filter-Funktion, die auch auf Kind-Knoten angewendet wird.
|
||||||
|
* Wenn gesetzt, werden Kind-Knoten nur gerendert, wenn der Filter
|
||||||
|
* für sie true zurückgibt. */
|
||||||
|
filter?: (row: iTreenode, searchvalue: string) => boolean
|
||||||
|
/** Aktueller Suchwert, der an den Filter weitergereicht wird. */
|
||||||
|
searchvalue?: string
|
||||||
}
|
}
|
||||||
let Treerow: m.ClosureComponent<iTreerow> = (vnode) => {
|
let Treerow: m.ClosureComponent<iTreerow> = (vnode) => {
|
||||||
|
|
||||||
@@ -178,7 +186,9 @@ let Treerow: m.ClosureComponent<iTreerow> = (vnode) => {
|
|||||||
// Falls der Trennode Kinder hat und expandiert werden soll, wird rekursiv die Trennode-Komponente für
|
// Falls der Trennode Kinder hat und expandiert werden soll, wird rekursiv die Trennode-Komponente für
|
||||||
// die Child-Nodes aufgerufen, ansonsten wir null zurückgegeben und die Einrückung hört auf
|
// die Child-Nodes aufgerufen, ansonsten wir null zurückgegeben und die Einrückung hört auf
|
||||||
vnode.attrs.treenode.hasChildren && vnode.attrs.treenode.expand
|
vnode.attrs.treenode.hasChildren && vnode.attrs.treenode.expand
|
||||||
? vnode.attrs.treenode.children.map((tn: iTreenode, z) => {
|
? vnode.attrs.treenode.children
|
||||||
|
.filter(tn => !vnode.attrs.filter || vnode.attrs.filter(tn, vnode.attrs.searchvalue || ""))
|
||||||
|
.map((tn: iTreenode, z) => {
|
||||||
return m(Treerow, {
|
return m(Treerow, {
|
||||||
treenode: tn,
|
treenode: tn,
|
||||||
level: vnode.attrs.level + 1,
|
level: vnode.attrs.level + 1,
|
||||||
@@ -186,7 +196,9 @@ let Treerow: m.ClosureComponent<iTreerow> = (vnode) => {
|
|||||||
onRowMarked: vnode.attrs.onRowMarked,
|
onRowMarked: vnode.attrs.onRowMarked,
|
||||||
isSelected: vnode.attrs.isSelected,
|
isSelected: vnode.attrs.isSelected,
|
||||||
isEven: ((z % 2) == 0),
|
isEven: ((z % 2) == 0),
|
||||||
hasSiblingsWithChildren: childHasSiblingsWithChildren
|
hasSiblingsWithChildren: childHasSiblingsWithChildren,
|
||||||
|
filter: vnode.attrs.filter,
|
||||||
|
searchvalue: vnode.attrs.searchvalue
|
||||||
} as iTreerow)
|
} as iTreerow)
|
||||||
})
|
})
|
||||||
: null
|
: null
|
||||||
|
|||||||
Reference in new issue
Block a user