openSourceRemote/mind-map
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化 getCustomNodeContent

Browse Source
This commit is contained in:
KuroSago 2025-05-12 15:44:39 +08:00
parent b5bb540036
commit 3da1407bb4
1 changed files with 34 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
web3/packages/mind-map/src/store/helpers/addCustomContentToNode.ts
View File

@ -1,5 +1,6 @@
import { useMindMapStore } from "../index"; import { useMindMapStore } from "../index";
import type MindMapNode from "simple-mind-map/types/src/core/render/node/MindMapNode"; import type MindMapNode from "simple-mind-map/types/src/core/render/node/MindMapNode";
import { throttle, asyncRun } from 'simple-mind-map/src/utils';
const ICON_PLUS = const ICON_PLUS =
'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0zM1.5 8a6.5 6.5 0 1 1 13 0a6.5 6.5 0 0 1-13 0zM8 4a.75.75 0 0 1 .75.75V7h2.25a.75.75 0 0 1 0 1.5H8.75v2.25a.75.75 0 0 1-1.5 0V8.5H5a.75.75 0 0 1 0-1.5h2.25V4.75A.75.75 0 0 1 8 4z" clip-rule="evenodd"/></svg>'; '<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0zM1.5 8a6.5 6.5 0 1 1 13 0a6.5 6.5 0 0 1-13 0zM8 4a.75.75 0 0 1 .75.75V7h2.25a.75.75 0 0 1 0 1.5H8.75v2.25a.75.75 0 0 1-1.5 0V8.5H5a.75.75 0 0 1 0-1.5h2.25V4.75A.75.75 0 0 1 8 4z" clip-rule="evenodd"/></svg>';
@ -20,8 +21,8 @@ export function getCustomNodeContent(
addChild?: (node: MindMapNode) => void; addChild?: (node: MindMapNode) => void;
edit?: (node: MindMapNode) => void; edit?: (node: MindMapNode) => void;
} = { } = {
allowRemoveWithChildren: false, allowRemoveWithChildren: false,
} }
) { ) {
// 按钮配置 // 按钮配置
const buttonConfig = { const buttonConfig = {
@ -133,36 +134,36 @@ export function getCustomNodeContent(
const mindMap = getMindMapInstance(); const mindMap = getMindMapInstance();
// 注册节点激活事件和数据更新事件 // 注册节点激活事件和数据更新事件
if (mindMap) { // 节点激活状态变化处理
// 节点激活状态变化处理 mindMap && mindMap.on(
mindMap.on( "node_active",
"node_active", throttle((_: MindMapNode, activeNodeList: MindMapNode[]) => {
(_: MindMapNode, activeNodeList: MindMapNode[]) => { const isActive = activeNodeList.some(
const isActive = activeNodeList.some( (activeNode) => activeNode.uid === node.uid
(activeNode) => activeNode.uid === node.uid );
);
// 如果激活状态改变，更新按钮组的可见性 // 如果激活状态改变，更新按钮组的可见性
if (nodeActiveState[node.uid] !== isActive) { if (nodeActiveState[node.uid] !== isActive) {
nodeActiveState[node.uid] = isActive; nodeActiveState[node.uid] = isActive;
const container = nodeElements[node.uid]; const container = nodeElements[node.uid];
if (container) { if (container) {
container.style.display = isActive ? "flex" : "none"; container.style.display = isActive ? "flex" : "none";
// 在激活时更新按钮状态 // 在激活时更新按钮状态
if (isActive) updateButtonsVisibility(container, node) if (isActive) updateButtonsVisibility(container, node);
}
} }
} }
); }, 90, null)
);
// 节点数据变化处理（当添加/删除子节点时） // 节点数据变化处理（当添加/删除子节点时）
mindMap.on("node_data_change", (changedNode: MindMapNode) => { mindMap && mindMap.on("node_data_change", throttle((changedNode: MindMapNode) => {
if (changedNode.uid === node.uid) { if (changedNode.uid === node.uid) {
const container = nodeElements[node.uid]; const container = nodeElements[node.uid];
if (container && nodeActiveState[node.uid]) updateButtonsVisibility(container, node); if (container && nodeActiveState[node.uid]) {
asyncRun(() => updateButtonsVisibility(container, node));
} }
}); }
} }, 90, null));
// 更新按钮的可见性 // 更新按钮的可见性
function updateButtonsVisibility(container: HTMLElement, node: MindMapNode) { function updateButtonsVisibility(container: HTMLElement, node: MindMapNode) {