diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue index 2db78d76..faf3b1ae 100644 --- a/web/src/pages/Edit/components/Edit.vue +++ b/web/src/pages/Edit/components/Edit.vue @@ -11,7 +11,10 @@ - + @@ -231,7 +234,7 @@ export default { this.$bus.$emit('showNoteContent', content, left, top) }, hide: () => { - this.$bus.$emit('hideNoteContent') + // this.$bus.$emit('hideNoteContent') } } }) diff --git a/web/src/pages/Edit/components/NodeNoteContentShow.vue b/web/src/pages/Edit/components/NodeNoteContentShow.vue index c8528e34..45067e11 100644 --- a/web/src/pages/Edit/components/NodeNoteContentShow.vue +++ b/web/src/pages/Edit/components/NodeNoteContentShow.vue @@ -7,6 +7,7 @@ top: this.top + 'px', visibility: show ? 'visible' : 'hidden' }" + @click.stop > @@ -30,20 +31,42 @@ export default { } }, created() { - this.$bus.$on('showNoteContent', (content, left, top) => { - this.editor.setMarkdown(content) - this.left = left - this.top = top - this.show = true - }) - this.$bus.$on('hideNoteContent', () => { - this.show = false - }) + this.$bus.$on('showNoteContent', this.onShowNoteContent) + this.$bus.$on('hideNoteContent', this.hideNoteContent) + document.body.addEventListener('click', this.hideNoteContent) + this.$bus.$on('node_active', this.hideNoteContent) }, mounted() { this.initEditor() }, + beforeDestroy() { + this.$bus.$off('showNoteContent', this.onShowNoteContent) + this.$bus.$off('hideNoteContent', this.hideNoteContent) + document.body.removeEventListener('click', this.hideNoteContent) + this.$bus.$off('node_active', this.hideNoteContent) + }, methods: { + /** + * @Author: 王林25 + * @Date: 2022-11-14 19:56:08 + * @Desc: 显示备注浮层 + */ + onShowNoteContent(content, left, top) { + this.editor.setMarkdown(content) + this.left = left + this.top = top + this.show = true + }, + + /** + * @Author: 王林25 + * @Date: 2022-11-14 19:56:20 + * @Desc: 隐藏备注浮层 + */ + hideNoteContent() { + this.show = false + }, + /** * @Author: 王林25 * @Date: 2022-05-09 11:37:05 @@ -66,5 +89,24 @@ export default { background-color: #fff; padding: 10px; border-radius: 5px; + max-height: 300px; + overflow-y: auto; + + &::-webkit-scrollbar { + width: 7px; + height: 7px; + } + + &::-webkit-scrollbar-thumb { + border-radius: 7px; + background-color: rgba(0, 0, 0, 0.3); + cursor: pointer; + } + + &::-webkit-scrollbar-track { + box-shadow: none; + background: transparent; + display: none; + } }