From 693e08d67b08933b60c498fd240174a9c9473e70 Mon Sep 17 00:00:00 2001
From: zhaoxi <zhaoxi5699@gmail.com>
Date: Sun, 19 Jul 2026 14:56:47 +0800
Subject: [PATCH] =?UTF-8?q?fix(editor):=20=E4=BF=AE=E5=A4=8D=E8=8D=89?=
 =?UTF-8?q?=E7=A8=BF=E8=A2=AB=E9=BB=98=E8=AE=A4=E6=96=87=E6=9C=AC=E8=A6=86?=
 =?UTF-8?q?=E7=9B=96=E7=9A=84=E6=95=B0=E6=8D=AE=E4=B8=A2=E5=A4=B1=20bug=20?=
 =?UTF-8?q?=E4=B8=8E=E7=BC=96=E8=BE=91=E5=99=A8=E6=97=A0=E6=B3=95=E6=BB=9A?=
 =?UTF-8?q?=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 编辑器初始化等待文章和草稿两个查询都返回，此前草稿接口先返回
  空内容时会用默认文本初始化并被自动保存覆盖真实草稿
- CodeMirror 容器加 min-h-0（flex 子项默认 min-height:auto 会被
  内容撑开），并约束 .cm-editor 高度为 100% 使内部滚动生效
- 修复规则必须放在 @layer 外，否则被 Tailwind 当作未使用样式裁剪
---
 frontend/src/index.css                        |  6 ++++++
 frontend/src/pages/admin/AdminProfilePage.tsx |  2 +-
 frontend/src/pages/admin/EditorPage.tsx       | 10 ++++++----
 3 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/frontend/src/index.css b/frontend/src/index.css
index 17836fa..09080de 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -285,3 +285,9 @@
     @apply shadow-[0_0_0_3px_rgba(129,140,248,0.2)];
   }
 }
+
+/* CodeMirror 编辑器内部滚动（必须是无层级的普通 CSS，
+   放在 @layer 里会被 Tailwind 当作未使用样式裁剪掉） */
+.cm-editor {
+  height: 100%;
+}
diff --git a/frontend/src/pages/admin/AdminProfilePage.tsx b/frontend/src/pages/admin/AdminProfilePage.tsx
index 6711602..7a3eec8 100644
--- a/frontend/src/pages/admin/AdminProfilePage.tsx
+++ b/frontend/src/pages/admin/AdminProfilePage.tsx
@@ -234,7 +234,7 @@ export function AdminProfilePage() {
             theme={theme === 'dark' ? oneDark : 'light'}
             extensions={[markdown()]}
             onChange={(value) => setContent(value)}
-            className="flex-1 text-sm"
+            className="flex-1 min-h-0 text-sm"
             basicSetup={{ lineNumbers: true, highlightActiveLineGutter: true, highlightActiveLine: true, foldGutter: false }}
           />
         </div>
diff --git a/frontend/src/pages/admin/EditorPage.tsx b/frontend/src/pages/admin/EditorPage.tsx
index 549a0c0..6ea801b 100644
--- a/frontend/src/pages/admin/EditorPage.tsx
+++ b/frontend/src/pages/admin/EditorPage.tsx
@@ -53,14 +53,16 @@ export function EditorPage() {
     enabled: isEdit,
   });
 
-  const { data: draft } = useQuery({
+  const { data: draft, isLoading: draftLoading } = useQuery({
     queryKey: ['admin-draft', id],
     queryFn: () => api.getDraft(id!),
     enabled: isEdit,
   });
 
+  // 必须等文章和草稿两个查询都返回后再初始化，
+  // 否则会先用默认文本渲染，自动保存随即覆盖掉真实草稿（数据丢失）
   useEffect(() => {
-    if (!initialized && (post || draft)) {
+    if (!initialized && !isLoading && !draftLoading && (post || draft)) {
       setTitle(post?.title || '');
       setSlug(post?.slug || '');
       setSummary(post?.summary || '');
@@ -70,7 +72,7 @@ export function EditorPage() {
       setContentMd(md);
       setInitialized(true);
     }
-  }, [post, draft, initialized]);
+  }, [post, draft, isLoading, draftLoading, initialized]);
 
   // 自动保存草稿
   useEffect(() => {
@@ -356,7 +358,7 @@ export function EditorPage() {
               theme={theme === 'dark' ? oneDark : 'light'}
               extensions={[markdown()]}
               onChange={(value) => setContentMd(value)}
-              className="flex-1 text-sm"
+              className="flex-1 min-h-0 text-sm"
               basicSetup={{
                 lineNumbers: true,
                 highlightActiveLineGutter: true,