amass/md
1
0
Fork 0
mirror of https://github.com/doocs/md.git synced 2025-01-22 20:04:39 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge 67ef9dc21c into fc1712f948

Browse Source
This commit is contained in:
YangFong 2025-01-06 19:31:36 +08:00 committed by GitHub
commit 43191b3535
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 24 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/views/CodemirrorEditor.vue
View File

@ -170,12 +170,15 @@ watch(isDark, () => {
toRaw(editor.value)?.setOption?.(`theme`, theme)
})
const charCount = ref(0)
// 初始化编辑器
function initEditor() {
const editorDom = document.querySelector<HTMLTextAreaElement>(`#editor`)!
if (!editorDom.value) {
editorDom.value = store.posts[store.currentPostIndex].content
charCount.value = store.posts[store.currentPostIndex].content.replace(/\s/g, ``).length
}
editor.value = CodeMirror.fromTextArea(editorDom, {
mode: `text/x-markdown`,
@ -222,7 +225,9 @@ function initEditor() {
clearTimeout(changeTimer.value)
changeTimer.value = setTimeout(() => {
onEditorRefresh()
store.posts[store.currentPostIndex].content = e.getValue()
const value = e.getValue()
store.posts[store.currentPostIndex].content = value
charCount.value = value.replace(/\s/g, ``).length
}, 300)
})
@ -414,23 +419,28 @@ onMounted(() => {
</ContextMenuContent>
</ContextMenu>
</div>
<div
id="preview"
ref="preview"
:span="isShowCssEditor ? 8 : 12"
class="preview-wrapper flex-1 p-5"
>
<div id="output-wrapper" :class="{ output_night: !backLight }">
<div class="preview border shadow-xl">
<section id="output" v-html="output" />
<div v-if="isCoping" class="loading-mask">
<div class="loading-mask-box">
<div class="loading__img" />
<span>正在生成</span>
<div class="relative flex-1">
<div
id="preview"
ref="preview"
:span="isShowCssEditor ? 8 : 12"
class="preview-wrapper flex-1 p-5"
>
<div id="output-wrapper" :class="{ output_night: !backLight }">
<div class="preview border shadow-xl">
<section id="output" v-html="output" />
<div v-if="isCoping" class="loading-mask">
<div class="loading-mask-box">
<div class="loading__img" />
<span>正在生成</span>
</div>
</div>
</div>
</div>
</div>
<div class="bg-muted absolute bottom-0 left-0 p-2 text-xs shadow">
{{ charCount }} 个字符
</div>
</div>
<CssEditor class="flex-1" />
</div>