Files
electron-4/src/renderer/public/tree/newFuzzySearch.js

159 lines
4.9 KiB
JavaScript
Raw Normal View History

2025-08-29 09:35:52 +08:00
/*
* treeId:节点树ID
* keyword:模糊查询输入框的id#keyword
* notSearchType:不参与查询的节点类型
* typeSonNode:不参与查询的节点的子孙节点是否也不参与匹配默认为false即子节点参与匹配
* */
2025-10-11 16:09:11 +08:00
window.newFuzzySearch = function (
2025-08-29 09:35:52 +08:00
treeId,
keyword,
notSearchType = [],
typeSonNode = false,
2025-10-11 16:09:11 +08:00
dispatch = ''
2025-08-29 09:35:52 +08:00
) {
//获取所有节点数据
2025-10-11 16:09:11 +08:00
let zTreeObj = $.fn.zTree.getZTreeObj(treeId)
let idKey = zTreeObj.setting.data.simpleData.idKey
let nodes = zTreeObj.getNodes()
2025-08-29 09:35:52 +08:00
//过滤掉不要的
function getCustomNodes(allNodes) {
// let allNode = JSON.parse(JSON.stringify(allNodes))
2025-10-11 16:09:11 +08:00
let notSearchTypeNodesIds = []
2025-08-29 09:35:52 +08:00
if (notSearchType.length) {
allNodes.forEach((allNodeItem) => {
2025-09-04 20:11:36 +08:00
if (notSearchType.includes(allNodeItem.sourceType)) {
2025-10-11 16:09:11 +08:00
notSearchTypeNodesIds.push(allNodeItem[idKey])
2025-08-29 09:35:52 +08:00
}
2025-10-11 16:09:11 +08:00
})
2025-08-29 09:35:52 +08:00
//typeSonNode为true时循环notSearchType类型的节点找出其子节点
2025-10-11 16:09:11 +08:00
let res = []
2025-08-29 09:35:52 +08:00
if (typeSonNode) {
notSearchTypeNodesIds.forEach((id, index) => {
2025-10-11 16:09:11 +08:00
let nodes = zTreeObj.transformToArray(zTreeObj.getNodeByParam(idKey, id, null))
2025-08-29 09:35:52 +08:00
nodes.forEach((item) => {
2025-10-11 16:09:11 +08:00
res.push(item[idKey])
})
})
notSearchTypeNodesIds = res
2025-08-29 09:35:52 +08:00
}
}
2025-10-11 16:09:11 +08:00
let res = []
2025-08-29 09:35:52 +08:00
allNodes.forEach((item, index) => {
if (!notSearchTypeNodesIds.includes(item[idKey])) {
// console.log(index)
2025-10-11 16:09:11 +08:00
res.push(item)
2025-08-29 09:35:52 +08:00
}
2025-10-11 16:09:11 +08:00
})
allNodes = res
return allNodes
2025-08-29 09:35:52 +08:00
}
/*let allNodes = zTreeObj.transformToArray(nodes);
let nodeChildren = getCustomNodes(allNodes)*/
// console.log("nodeChildren", nodeChildren)
// console.log("allNodes", allNodes)
//隐藏所有节点
function hideAllNode(allNodes) {
if (!allNodes || !Array.isArray(allNodes)) {
2025-10-11 16:09:11 +08:00
console.warn('hideAllNode: allNodes 参数无效')
return
2025-08-29 09:35:52 +08:00
}
2025-10-11 16:09:11 +08:00
let nodeChildren = getCustomNodes(allNodes)
2025-08-29 09:35:52 +08:00
if (nodeChildren && nodeChildren.length > 0) {
2025-10-11 16:09:11 +08:00
zTreeObj.hideNodes(nodeChildren)
2025-08-29 09:35:52 +08:00
}
}
//模糊匹配所有符合的节点
function search(contrast, allNodes) {
if (!allNodes || !Array.isArray(allNodes)) {
2025-10-11 16:09:11 +08:00
console.warn('search: allNodes 参数无效')
return
2025-08-29 09:35:52 +08:00
}
2025-10-11 16:09:11 +08:00
let nodeChildren = getCustomNodes(allNodes)
2025-08-29 09:35:52 +08:00
if (!nodeChildren) {
2025-10-11 16:09:11 +08:00
return
2025-08-29 09:35:52 +08:00
}
2025-10-11 16:09:11 +08:00
hideAllNode(allNodes)
2025-08-29 09:35:52 +08:00
nodeChildren.forEach((item) => {
if (item.oldname) {
2025-10-11 16:09:11 +08:00
item.sourceName = item.oldname
zTreeObj.updateNode(item)
2025-08-29 09:35:52 +08:00
}
if (contrast) {
2025-10-11 16:09:11 +08:00
if ((item.sourceName || '').indexOf(contrast) > -1) {
console.log('sourceName包含关键字')
console.log(item)
console.log(item.sourceName)
2025-08-29 09:35:52 +08:00
2025-10-11 16:09:11 +08:00
item.oldname = item.sourceName
item.highlight = true
let F = new RegExp(contrast, 'gi')
item.sourceName = item.oldname.replace(F, function (h) {
let str = '<span style="color: whitesmoke;background-color: darkred;">' + h + '</span>'
return str
})
2025-08-29 09:35:52 +08:00
// let a = item.name
// a = '<span style="color: whitesmoke;background-color: darkred;">' + a + "</span>"
// item.name = a
2025-10-11 16:09:11 +08:00
zTreeObj.setting.view.nameIsHTML = true
item.checked = true
2025-08-29 09:35:52 +08:00
// zTreeObj.setting.view.fontCss["color"] = "#8B0000"
2025-10-11 16:09:11 +08:00
zTreeObj.updateNode(item)
zTreeObj.showNode(item)
showNodePath(item)
2025-08-29 09:35:52 +08:00
}
/*zTreeObj.updateNode(item);
zTreeObj.showNode(item);
showNodePath(item)*/
}
2025-10-11 16:09:11 +08:00
})
2025-08-29 09:35:52 +08:00
/*let searchNodes = zTreeObj.getNodesByParamFuzzy('name', contrast);
console.log('searchNodes', searchNodes)
searchNodes.forEach(function (node) {
node.checked = true
zTreeObj.showNode(node);
showNodePath(node)
})*/
2025-10-11 16:09:11 +08:00
zTreeObj.expandAll(true)
2025-08-29 09:35:52 +08:00
}
//将查找到的节点父节点按路径设置为显示
function showNodePath(node) {
2025-10-11 16:09:11 +08:00
let parrentNodes = node.getPath()
2025-08-29 09:35:52 +08:00
parrentNodes &&
2025-10-11 16:09:11 +08:00
parrentNodes.forEach(function (node) {
zTreeObj.showNode(node)
})
2025-08-29 09:35:52 +08:00
}
window.treeSearchCb = (value = undefined) => {
2025-10-11 16:09:11 +08:00
let inputValue = value || ''
2025-08-29 09:35:52 +08:00
// console.log("搜索值", inputValue)
2025-10-11 16:09:11 +08:00
nodes = zTreeObj.getNodes()
let allNodes = zTreeObj.transformToArray(nodes)
let nodeChildren = getCustomNodes(allNodes)
console.log('nodeChildren', nodeChildren)
search(inputValue, allNodes)
2025-08-29 09:35:52 +08:00
//当查询条件为空时,显示所有节点
2025-10-11 16:09:11 +08:00
console.log('inputValue', inputValue)
if ((inputValue == null || inputValue === '') && nodeChildren.length >= 0) {
nodeChildren.forEach(function (node) {
2025-08-29 09:35:52 +08:00
// node.checked = false
2025-10-11 16:09:11 +08:00
zTreeObj.showNode(node)
})
2025-08-29 09:35:52 +08:00
// zTreeObj.expandAll(false);
}
2025-10-11 16:09:11 +08:00
}
if (dispatch == '') {
2025-08-29 09:35:52 +08:00
//input框值改变时
2025-10-11 16:09:11 +08:00
$(keyword).bind('input propertychange', treeSearchCb)
2025-08-29 09:35:52 +08:00
} else {
// $(dispatch).bind('click', treeSearchCb)
}
2025-10-11 16:09:11 +08:00
}