From 2b25e28cb839c2c2bb57e71bb3a4b66f68c83e1c Mon Sep 17 00:00:00 2001 From: wanglin2 <1013335014@qq.com> Date: Tue, 8 Apr 2025 21:57:01 +0800 Subject: [PATCH] =?UTF-8?q?Demo:=E4=BF=AE=E5=A4=8D=E6=BF=80=E6=B4=BB?= =?UTF-8?q?=E8=8A=82=E7=82=B9,=E7=A7=BB=E5=8A=A8=E7=94=BB=E5=B8=83?= =?UTF-8?q?=E5=B0=B1=E5=85=B3=E9=97=AD=E4=BE=A7=E8=BE=B9=E6=A0=8F=E7=9A=84?= =?UTF-8?q?=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Edit/components/AssociativeLineStyle.vue | 4 +- .../pages/Edit/components/LinkNodeSelect.vue | 3 + .../pages/Edit/components/NodeIconToolbar.vue | 2 +- .../pages/Edit/components/NodeNoteSidebar.vue | 3 + .../pages/Edit/components/NodeOuterFrame.vue | 11 +--- web/src/pages/Edit/components/Outline.vue | 65 +------------------ web/src/pages/Edit/components/OutlineEdit.vue | 3 + .../pages/Edit/components/OutlineSidebar.vue | 2 +- web/src/pages/Edit/components/Sidebar.vue | 2 +- web/src/style/outlineTree.less | 62 ++++++++++++++++++ 10 files changed, 82 insertions(+), 75 deletions(-) create mode 100644 web/src/style/outlineTree.less diff --git a/web/src/pages/Edit/components/AssociativeLineStyle.vue b/web/src/pages/Edit/components/AssociativeLineStyle.vue index f67c5cce..8c177cbb 100644 --- a/web/src/pages/Edit/components/AssociativeLineStyle.vue +++ b/web/src/pages/Edit/components/AssociativeLineStyle.vue @@ -298,7 +298,9 @@ export default { }, associativeLineDeactivate() { - this.setActiveSidebar('') + if (this.activeSidebar === 'associativeLineStyle') { + this.setActiveSidebar(null) + } this.activeLineNode = null this.activeLineToNode = null this.style = { diff --git a/web/src/pages/Edit/components/LinkNodeSelect.vue b/web/src/pages/Edit/components/LinkNodeSelect.vue index e35a5693..f8e1e5f7 100644 --- a/web/src/pages/Edit/components/LinkNodeSelect.vue +++ b/web/src/pages/Edit/components/LinkNodeSelect.vue @@ -172,3 +172,6 @@ export default { overflow: auto; } + diff --git a/web/src/pages/Edit/components/NodeIconToolbar.vue b/web/src/pages/Edit/components/NodeIconToolbar.vue index 6a2c993a..b4c10e79 100644 --- a/web/src/pages/Edit/components/NodeIconToolbar.vue +++ b/web/src/pages/Edit/components/NodeIconToolbar.vue @@ -76,7 +76,7 @@ export default { this.updatePos() this.showNodeIconToolbar = true if (this.activeSidebar === 'nodeIconSidebar') { - this.setActiveSidebar('') + this.setActiveSidebar(null) } }, diff --git a/web/src/pages/Edit/components/NodeNoteSidebar.vue b/web/src/pages/Edit/components/NodeNoteSidebar.vue index eaca4a7e..1b391916 100644 --- a/web/src/pages/Edit/components/NodeNoteSidebar.vue +++ b/web/src/pages/Edit/components/NodeNoteSidebar.vue @@ -55,6 +55,9 @@ export default { ...mapMutations(['setActiveSidebar']), onNodeActive(...args) { + if (this.activeSidebar !== 'noteSidebar') { + return + } const nodes = [...args[1]] if (nodes.length > 0) { if (nodes[0] !== this.node) { diff --git a/web/src/pages/Edit/components/NodeOuterFrame.vue b/web/src/pages/Edit/components/NodeOuterFrame.vue index 51f15284..8e3f9813 100644 --- a/web/src/pages/Edit/components/NodeOuterFrame.vue +++ b/web/src/pages/Edit/components/NodeOuterFrame.vue @@ -435,19 +435,11 @@ export default { }, created() { this.mindMap.on('outer_frame_active', this.onOuterFrameActive) - this.mindMap.on('scale', this.hide) - this.mindMap.on('translate', this.hide) - this.mindMap.on('svg_mousedown', this.hide) - this.mindMap.on('expand_btn_click', this.hide) this.mindMap.on('outer_frame_delete', this.hide) this.mindMap.on('outer_frame_deactivate', this.hide) }, beforeDestroy() { this.mindMap.off('outer_frame_active', this.onOuterFrameActive) - this.mindMap.off('scale', this.hide) - this.mindMap.off('translate', this.hide) - this.mindMap.off('svg_mousedown', this.hide) - this.mindMap.off('expand_btn_click', this.hide) this.mindMap.off('outer_frame_delete', this.hide) this.mindMap.off('outer_frame_deactivate', this.hide) }, @@ -510,6 +502,9 @@ export default { }, hide() { + if (this.activeSidebar !== 'nodeOuterFrameStyle') { + return + } this.setActiveSidebar(null) } } diff --git a/web/src/pages/Edit/components/Outline.vue b/web/src/pages/Edit/components/Outline.vue index 4a91d913..93bc1cce 100644 --- a/web/src/pages/Edit/components/Outline.vue +++ b/web/src/pages/Edit/components/Outline.vue @@ -351,67 +351,6 @@ export default { } } - diff --git a/web/src/pages/Edit/components/OutlineEdit.vue b/web/src/pages/Edit/components/OutlineEdit.vue index 093aff8b..488d810e 100644 --- a/web/src/pages/Edit/components/OutlineEdit.vue +++ b/web/src/pages/Edit/components/OutlineEdit.vue @@ -363,3 +363,6 @@ export default { } } + diff --git a/web/src/pages/Edit/components/OutlineSidebar.vue b/web/src/pages/Edit/components/OutlineSidebar.vue index 92776093..7415eeb8 100644 --- a/web/src/pages/Edit/components/OutlineSidebar.vue +++ b/web/src/pages/Edit/components/OutlineSidebar.vue @@ -71,7 +71,7 @@ export default { ...mapMutations(['setIsOutlineEdit', 'setActiveSidebar']), onChangeToOutlineEdit() { - this.setActiveSidebar('') + this.setActiveSidebar(null) this.setIsOutlineEdit(true) }, diff --git a/web/src/pages/Edit/components/Sidebar.vue b/web/src/pages/Edit/components/Sidebar.vue index d760d35a..1ca3ba3d 100644 --- a/web/src/pages/Edit/components/Sidebar.vue +++ b/web/src/pages/Edit/components/Sidebar.vue @@ -60,7 +60,7 @@ export default { close() { this.show = false - this.setActiveSidebar('') + this.setActiveSidebar(null) }, getEl() { diff --git a/web/src/style/outlineTree.less b/web/src/style/outlineTree.less new file mode 100644 index 00000000..0e761a88 --- /dev/null +++ b/web/src/style/outlineTree.less @@ -0,0 +1,62 @@ +.outlineTree { + &.isDark { + background-color: #262a2e; + + .customNode { + color: #fff; + } + + &.el-tree--highlight-current { + /deep/ .el-tree-node.is-current > .el-tree-node__content { + background-color: hsla(0, 0%, 100%, 0.05) !important; + } + } + + /deep/ .el-tree-node__content:hover, + .el-upload-list__item:hover { + background-color: hsla(0, 0%, 100%, 0.02) !important; + } + + /deep/ .el-tree-node__content { + .el-tree-node__expand-icon { + color: #fff; + + &.is-leaf { + &::after { + background-color: #fff; + } + } + } + } + } + + /deep/ .el-tree-node > .el-tree-node__children { + overflow: inherit; + } + + /deep/ .el-tree-node__content { + height: auto; + margin: 5px 0; + + .el-tree-node__expand-icon { + color: #262a2e; + + &.is-leaf { + color: transparent; + position: relative; + + &::after { + background-color: #262a2e; + position: absolute; + content: ''; + width: 5px; + height: 5px; + border-radius: 50%; + left: 10px; + top: 50%; + transform: translateY(-50%); + } + } + } + } +}