From 0c23ff6527d310101e521bb6015ae1267207b0ce Mon Sep 17 00:00:00 2001 From: wanglin2 <1013335014@qq.com> Date: Fri, 24 Jan 2025 19:46:18 +0800 Subject: [PATCH] update --- .../core/render/node/quickCreateChildBtn.js | 85 +++++++++++++++++++ 1 file changed, 85 insertions(+) create mode 100644 simple-mind-map/src/core/render/node/quickCreateChildBtn.js diff --git a/simple-mind-map/src/core/render/node/quickCreateChildBtn.js b/simple-mind-map/src/core/render/node/quickCreateChildBtn.js new file mode 100644 index 00000000..257cb883 --- /dev/null +++ b/simple-mind-map/src/core/render/node/quickCreateChildBtn.js @@ -0,0 +1,85 @@ +import btnsSvg from '../../../svg/btns' +import { SVG, Circle, G } from '@svgdotjs/svg.js' + +function initQuickCreateChildBtn() { + this._quickCreateChildBtn = null + this._showQuickCreateChildBtn = false +} + +// 显示按钮 +function showQuickCreateChildBtn() { + if (this.getChildrenLength() > 0) return + // 创建按钮 + if (this._quickCreateChildBtn) { + this.group.add(this._quickCreateChildBtn) + } else { + const { quickCreateChildBtnIcon, expandBtnStyle, expandBtnSize } = + this.mindMap.opt + const { icon, style } = quickCreateChildBtnIcon + let { color, fill } = expandBtnStyle || { + color: '#808080', + fill: '#fff' + } + color = style.color || color + // 图标节点 + const iconNode = SVG(icon || btnsSvg.quickCreateChild).size( + expandBtnSize, + expandBtnSize + ) + iconNode.css({ + cursor: 'pointer' + }) + iconNode.x(0).y(-expandBtnSize / 2) + this.style.iconNode(iconNode, color) + // 填充节点 + const fillNode = new Circle().size(expandBtnSize) + fillNode.x(0).y(-expandBtnSize / 2) + fillNode.fill({ color: fill }).css({ + cursor: 'pointer' + }) + // 容器节点 + this._quickCreateChildBtn = new G() + this._quickCreateChildBtn.add(fillNode).add(iconNode) + this._quickCreateChildBtn.on('click', e => { + e.stopPropagation() + this.mindMap.emit('quick_create_btn_click', this) + const { customQuickCreateChildBtnClick } = this.mindMap.opt + if (typeof customQuickCreateChildBtnClick === 'function') { + customQuickCreateChildBtnClick(this) + return + } + this.mindMap.execCommand('INSERT_CHILD_NODE', true, [this]) + }) + this._quickCreateChildBtn.on('dblclick', e => { + e.stopPropagation() + }) + this._quickCreateChildBtn.addClass('smm-quick-create-child-btn') + this.group.add(this._quickCreateChildBtn) + } + this._showQuickCreateChildBtn = true + // 更新按钮 + this.renderer.layout.renderExpandBtn(this, this._quickCreateChildBtn) +} + +// 移除按钮 +function removeQuickCreateChildBtn() { + if (this._quickCreateChildBtn && this._showQuickCreateChildBtn) { + this._quickCreateChildBtn.remove() + this._showQuickCreateChildBtn = false + } +} + +// 隐藏按钮 +function hideQuickCreateChildBtn() { + const { isActive } = this.getData() + if (!isActive) { + this.removeQuickCreateChildBtn() + } +} + +export default { + initQuickCreateChildBtn, + showQuickCreateChildBtn, + removeQuickCreateChildBtn, + hideQuickCreateChildBtn +}