From beb8f0bb67fd43927b6eeb3b6b8effd018d9d67e Mon Sep 17 00:00:00 2001
From: itsimddc <easyhoo2426@163.com>
Date: Sun, 14 Sep 2025 00:33:29 +0800
Subject: [PATCH 1/3] fix(markdown): use latest version of markdown comp,
 update api usage

---
 package.json                            |  2 +-
 src/components/MarkdownEditor/index.vue | 21 +++++++++++----------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index 02f68e23764..c1418a2fd36 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "screenfull": "4.2.0",
     "script-loader": "0.7.2",
     "sortablejs": "1.8.4",
-    "tui-editor": "1.3.3",
+    "@toast-ui/editor": "3.1.3",
     "vue": "2.6.10",
     "vue-count-to": "1.0.13",
     "vue-router": "3.0.2",
diff --git a/src/components/MarkdownEditor/index.vue b/src/components/MarkdownEditor/index.vue
index 1a8a01ee767..8b3968217f8 100644
--- a/src/components/MarkdownEditor/index.vue
+++ b/src/components/MarkdownEditor/index.vue
@@ -5,10 +5,9 @@
 <script>
 // deps for editor
 import 'codemirror/lib/codemirror.css' // codemirror
-import 'tui-editor/dist/tui-editor.css' // editor ui
-import 'tui-editor/dist/tui-editor-contents.css' // editor content
+import '@toast-ui/editor/dist/toastui-editor.css' // Editor's Style
 
-import Editor from 'tui-editor'
+import Editor from '@toast-ui/editor'
 import defaultOptions from './default-options'
 
 export default {
@@ -62,8 +61,8 @@ export default {
   },
   watch: {
     value(newValue, preValue) {
-      if (newValue !== preValue && newValue !== this.editor.getValue()) {
-        this.editor.setValue(newValue)
+      if (newValue !== preValue && newValue !== this.editor.getMarkdown()) {
+        this.editor.setMarkdown(newValue)
       }
     },
     language(val) {
@@ -85,27 +84,29 @@ export default {
   },
   methods: {
     initEditor() {
+      console.log(this.editorOptions)
       this.editor = new Editor({
         el: document.getElementById(this.id),
         ...this.editorOptions
       })
       if (this.value) {
-        this.editor.setValue(this.value)
+        this.editor.setMarkdown(this.value)
       }
       this.editor.on('change', () => {
-        this.$emit('input', this.editor.getValue())
+        this.$emit('input', this.editor.getMarkdown())
       })
+      this.editor.getMarkdown()
     },
     destroyEditor() {
       if (!this.editor) return
       this.editor.off('change')
-      this.editor.remove()
+      this.editor.destroy()
     },
     setValue(value) {
-      this.editor.setValue(value)
+      this.editor.setMarkdown(value)
     },
     getValue() {
-      return this.editor.getValue()
+      return this.editor.getMarkdown()
     },
     setHtml(value) {
       this.editor.setHtml(value)

From d201243b5ab319358627b5e63ede90eb1dcbf3b3 Mon Sep 17 00:00:00 2001
From: itsimddc <easyhoo2426@163.com>
Date: Sun, 14 Sep 2025 00:33:48 +0800
Subject: [PATCH 2/3] feat(markdown): update default option

---
 .../MarkdownEditor/default-options.js         | 46 +++++++++++--------
 1 file changed, 26 insertions(+), 20 deletions(-)

diff --git a/src/components/MarkdownEditor/default-options.js b/src/components/MarkdownEditor/default-options.js
index 303aa13d377..fd2a817933a 100644
--- a/src/components/MarkdownEditor/default-options.js
+++ b/src/components/MarkdownEditor/default-options.js
@@ -7,25 +7,31 @@ export default {
   usageStatistics: false,
   hideModeSwitch: false,
   toolbarItems: [
-    'heading',
-    'bold',
-    'italic',
-    'strike',
-    'divider',
-    'hr',
-    'quote',
-    'divider',
-    'ul',
-    'ol',
-    'task',
-    'indent',
-    'outdent',
-    'divider',
-    'table',
-    'image',
-    'link',
-    'divider',
-    'code',
-    'codeblock'
+    [
+      'heading',
+      'bold',
+      'italic',
+      'strike'
+    ],
+    [
+      'hr',
+      'quote'
+    ],
+    [
+      'ul',
+      'ol',
+      'task',
+      'indent'
+    ],
+    [
+      'outdent',
+      'table',
+      'image',
+      'link'
+    ],
+    [
+      'code',
+      'codeblock'
+    ]
   ]
 }

From 943d2419ca139905116ffd3ddb3d41f5ecf97803 Mon Sep 17 00:00:00 2001
From: itsimddc <easyhoo2426@163.com>
Date: Sun, 14 Sep 2025 00:35:25 +0800
Subject: [PATCH 3/3] fix(markdown): update markdown demo props usage

---
 src/views/components-demo/markdown.vue | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/views/components-demo/markdown.vue b/src/views/components-demo/markdown.vue
index 25cf3e37639..4e8ef00bae6 100644
--- a/src/views/components-demo/markdown.vue
+++ b/src/views/components-demo/markdown.vue
@@ -20,14 +20,19 @@
       <el-tag class="tag-title">
         Markdown Mode:
       </el-tag>
-      <markdown-editor ref="markdownEditor" v-model="content2" :options="{hideModeSwitch:true,previewStyle:'tab'}" height="200px" />
+      <markdown-editor
+        ref="markdownEditor"
+        v-model="content2"
+        :options="{ hideModeSwitch: true, previewStyle: 'tab' }"
+        height="200px"
+      />
     </div>
 
     <div class="editor-container">
       <el-tag class="tag-title">
         Customize Toolbar:
       </el-tag>
-      <markdown-editor v-model="content3" :options="{ toolbarItems: ['heading','bold','italic']}" />
+      <markdown-editor v-model="content3" :options="{ toolbarItems: [['heading', 'bold', 'italic']] }" />
     </div>
 
     <div class="editor-container">
@@ -92,10 +97,11 @@ export default {
 </script>
 
 <style scoped>
-.editor-container{
+.editor-container {
   margin-bottom: 30px;
 }
-.tag-title{
+
+.tag-title {
   margin-bottom: 5px;
 }
 </style>