From 6c0c5f0c81a7aaf6d7454c1e677d069f3c687d63 Mon Sep 17 00:00:00 2001
From: thzxx <1440196015@qq.com>
Date: Fri, 24 Jul 2026 13:08:10 +0800
Subject: [PATCH] fix(core): readonly mode should not disable all toolbar
 buttons

- CSS: replace pointer-events:none on entire toolbar with per-button disabled style
- _updateModeButtons: add readonly mode handling, keep mode-switch/fullscreen/undo/redo enabled
- setReadOnly: call _updateModeButtons to sync button states
---
 src/core.js   | 27 ++++++++++++++++++---------
 src/styles.js |  6 +++++-
 2 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/core.js b/src/core.js
index 0499edb..c3229f8 100644
--- a/src/core.js
+++ b/src/core.js
@@ -1069,7 +1069,7 @@ class MarkdownEditor {
 
   _updateModeButtons() {
     const isPreview = this._mode === 'preview';
-    const isEdit = this._mode === 'edit';
+    const isReadonly = this.config.readOnly;
 
     this.toolbarEl.querySelectorAll('.me-btn').forEach((b) => {
       const mode = b.dataset.mode;
@@ -1082,17 +1082,25 @@ class MarkdownEditor {
         return;
       }
 
+      // fullscreen 始终可用
+      if (action === 'fullscreen') {
+        b.disabled = false;
+        return;
+      }
+
+      // readonly 模式：禁用编辑操作按钮，保留 undo/redo
+      if (isReadonly) {
+        b.disabled = !(action === 'undo' || action === 'redo');
+        return;
+      }
+
       // preview 模式：禁用编辑操作按钮
       if (isPreview) {
-        // undo/redo 在 preview 下也可用
-        if (action === 'undo' || action === 'redo' || action === 'fullscreen') {
-          b.disabled = false;
-        } else {
-          b.disabled = true;
-        }
-      } else {
-        b.disabled = false;
+        b.disabled = !(action === 'undo' || action === 'redo');
+        return;
       }
+
+      b.disabled = false;
     });
   }
 
@@ -1245,6 +1253,7 @@ class MarkdownEditor {
     this.config.readOnly = !!readOnly;
     if (this.textarea) this.textarea.readOnly = !!readOnly;
     if (this.el) this.el.classList.toggle('me-readonly', !!readOnly);
+    this._updateModeButtons();
     return this;
   }
 
diff --git a/src/styles.js b/src/styles.js
index c3c3c6d..4da6b1a 100644
--- a/src/styles.js
+++ b/src/styles.js
@@ -358,7 +358,11 @@ const generateCSS = () => {
       opacity: 0.88;
     }
     .me-wrapper.me-readonly .me-toolbar {
-      opacity: 0.45; pointer-events: none;
+      opacity: 0.75;
+    }
+    /* readonly 模式下编辑按钮禁用样式（JS 设置 disabled 属性触发） */
+    .me-wrapper.me-readonly .me-btn:disabled {
+      opacity: 0.3; cursor: not-allowed; pointer-events: none;
     }
 
     /* ============ 高亮标记 ============ */