diff --git a/CHANGELOG.md b/CHANGELOG.md index 33ceedfc316cd1a060f29dd81bdb01f3665b6a3e..33511221894c90d690ce0ef1d163f9b915af14a7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ ## [Unreleased] +### Changed + +- markdown编辑器支持Esc按键关闭全屏 + ## [0.7.39-alpha.0] - 2025-03-24 ### Fixed diff --git a/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx b/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx index 57fec9b2b827d7ecbe957eb298f89f13f44df435..8ecf9f202480bfec6f218bb5551d99bc03e25b39 100644 --- a/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx +++ b/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx @@ -3,6 +3,7 @@ import { nextTick, onMounted, onUnmounted, + onBeforeUnmount, Ref, ref, watch, @@ -180,13 +181,30 @@ const IBizMarkDown: any = defineComponent({ if (cherryClass.contains('fullscreen')) { fullscreenNode.appendChild(createCherryIcon('fullscreen')); fullscreenNode.title = ibiz.i18n.t('editor.markdown.fullscreen'); + parentElement?.blur(); + parentElement.removeAttribute('tabindex'); cherryClass.remove('fullscreen'); } else { fullscreenNode.appendChild(createCherryIcon('minscreen')); cherryClass.add('fullscreen'); + parentElement.setAttribute('tabindex', '-1'); + parentElement?.focus(); fullscreenNode.title = ibiz.i18n.t('editor.markdown.minimize'); } - editor.value.editor.editor.refresh(); + } + }; + + // 处理监听键盘事件 + const handleKeyUp = (e: KeyboardEvent) => { + e.stopPropagation(); + if (e.key === 'Escape') { + // 关闭全屏 + if ( + editor.value?.editor.options.editorDom.parentElement.classList.contains( + 'fullscreen', + ) + ) + onFullscreen(); } }; @@ -343,6 +361,11 @@ const IBizMarkDown: any = defineComponent({ onMounted(() => { editorInit(); calcMarkDownStyle(); + markDownBox.value?.addEventListener('keydown', handleKeyUp.bind(this)); + }); + + onBeforeUnmount(() => { + markDownBox.value?.removeEventListener('keydown', handleKeyUp.bind(this)); }); onUnmounted(() => {