feat(ui): Add toggle button for associative line visibility#1350
feat(ui): Add toggle button for associative line visibility#1350mike-lsadigital wants to merge 1 commit intowanglin2:mainfrom
Conversation
Adds a toolbar button in NavigatorToolbar that allows users to show/hide all associative lines with a single click. This is useful when viewing complex mind maps where associative lines may clutter the view. Changes: - AssociativeLine.js: Added toggleAllLinesVisibility(), hideAllLines(), showAllLines(), and getLinesVisibility() methods - NavigatorToolbar.vue: Added toggle button with tooltip - en_us.js, zh_cn.js: Added translations for tooltips Co-authored-by: Cursor <cursoragent@cursor.com>
|
@MonkeyCode-AI review 一下 |
|
MonkeyCode-AI 正在分析任务... |
MonkeyCode-AI
left a comment
MonkeyCode-AI
left a comment
There was a problem hiding this comment.
我是 MonkeyCode AI 编程助手，你可以在 GitHub 仓库的 PR 中 at @MonkeyCode-AI 来呼唤我。
任务执行细节请参考: https://monkeycode-ai.com
代码审查结果
新增“关联线显示/隐藏”功能整体可用，但存在状态初始化/重渲染后失效、与拖拽逻辑冲突、以及 UI 状态不同步等问题，需完善后再合入。
| 🚨 Critical | 💡 Suggestion | |
|---|---|---|
| 2 | 3 | 1 |
|
|
||
| // Toggle visibility of all associative lines | ||
| // Returns the new visibility state (true = visible, false = hidden) | ||
| toggleAllLinesVisibility() { |
There was a problem hiding this comment.
Caution
🚨 使用未初始化的 _linesHidden，初始可见状态不确定
toggleAllLinesVisibility()/getLinesVisibility() 依赖 this._linesHidden，但构造函数中未初始化。undefined 会被当作 false，使首次 toggle 行为虽然看起来可用，但状态来源不明确，外部读取 getLinesVisibility() 也可能不稳定。
建议: 在构造函数中显式初始化 this._linesHidden = false，确保状态确定性。
| } | ||
|
|
||
| // Hide all associative lines and their labels | ||
| hideAllLines() { |
There was a problem hiding this comment.
Caution
🚨 隐藏后触发 renderAllLines 会重新绘制并显示线条，导致“隐藏状态”无法维持
hideAllLines() 仅对当前 lineList 执行 hide()。但插件在 node_tree_render_end / data_change 时会 renderAllLines()，而 renderAllLines() 会 removeAllLines() 并重新 drawLine()，新创建元素默认显示，导致隐藏状态在重渲染后失效。
建议: 在 renderAllLines() 结束后或 drawLine() 中根据 _linesHidden 对新创建元素执行 hide()；控制点也需保持隐藏。
| } | ||
|
|
||
| // Show all associative lines and their labels | ||
| showAllLines() { |
There was a problem hiding this comment.
Warning
控制点显示通常依赖 activeLine/交互状态。当前 showAllLines() 调用 this.showControls()，可能在无激活线或拖拽中把本应隐藏的控制点显示出来，并与 onNodeDragging/onNodeDragend 的 hideControls/showControls 交错导致状态异常。
建议: showAllLines() 仅负责线条元素显示；控制点是否显示应由 activeLine/交互状态决定（例如仅在 activeLine 存在且非拖拽时显示）。
| } | ||
|
|
||
| // Hide all associative lines and their labels | ||
| hideAllLines() { |
There was a problem hiding this comment.
Warning
onNodeDragging 会 hide() 线条；onNodeDragend 会 show() 线条。若用户已 hideAllLines() 全局隐藏，拖拽后 onNodeDragend 会强制 show()，破坏全局隐藏状态。
建议: 在 onNodeDragend 中根据 _linesHidden 决定是否恢复显示（若全局隐藏则保持隐藏）。
| a.click() | ||
| }, | ||
|
|
||
| toggleAssociativeLines() { |
There was a problem hiding this comment.
Warning
组件本地 state 默认为 true，仅在点击按钮时更新。若其他入口调用 hideAllLines()/showAllLines()，或重渲染导致可见性变化，按钮状态会与实际不一致。PR 已新增 associative_line_visibility_change 事件，但 UI 未监听同步。
建议: 挂载时读取 mindMap.associativeLine.getLinesVisibility() 初始化，并监听 mindMap 的 associative_line_visibility_change 更新 showAssociativeLines；销毁时解绑。
| " | ||
| placement="top" | ||
| > | ||
| <div |
There was a problem hiding this comment.
Tip
💡 模板中 <div 与 class 行存在多余空格/格式问题
3 participants
Summary
Changes
simple-mind-map/src/plugins/AssociativeLine.js:
toggleAllLinesVisibility()- toggles visibility and returns new statehideAllLines()- hides all lines and emits eventshowAllLines()- shows all lines and emits eventgetLinesVisibility()- returns current visibility stateassociative_line_visibility_changeevent on toggleweb/src/pages/Edit/components/NavigatorToolbar.vue:
iconlianjiexianiconweb/src/lang/en_us.js, zh_cn.js:
showAssociativeLinesandhideAssociativeLinestranslationsTest plan
Made with Cursor