From c054c49fa557620f7959b26a059366de1ce2f053 Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Mon, 4 May 2026 13:27:03 +0800
Subject: [PATCH] =?UTF-8?q?whiteboard=E7=BC=96=E8=BE=91=E5=85=83=E7=B4=A0?=
 =?UTF-8?q?=E6=96=87=E6=9C=AC=E6=97=B6=E4=BF=9D=E6=8C=81=E5=9B=BE=E5=BD=A2?=
 =?UTF-8?q?=E5=85=83=E7=B4=A0=E5=8F=AF=E8=A7=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../whiteboard/renderer/BoardRenderer.ts      | 35 ++++++++++---------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/frontend/src/core/features/whiteboard/renderer/BoardRenderer.ts b/frontend/src/core/features/whiteboard/renderer/BoardRenderer.ts
index 41ebc6cff..508109364 100644
--- a/frontend/src/core/features/whiteboard/renderer/BoardRenderer.ts
+++ b/frontend/src/core/features/whiteboard/renderer/BoardRenderer.ts
@@ -254,9 +254,10 @@ export class BoardRenderer {
 
   // ===== 元素绘制 =====
 
-  private drawElement(el: BoardElement, board: BoardModel): void {
+  private drawElement(el: BoardElement, board: BoardModel, skipText = false): void {
     // Skip rendering the element currently being edited (textarea takes over)
-    if (el.id === this.editingId) return
+    // But keep drawing the shape so the textarea has a visible background
+    if (el.id === this.editingId) skipText = true
 
     this.ctx.save()
 
@@ -275,11 +276,11 @@ export class BoardRenderer {
     }
 
     switch (el.type) {
-      case 'rectangle': this.drawRectangle(el); break
-      case 'ellipse': this.drawEllipse(el); break
-      case 'diamond': this.drawDiamond(el); break
+      case 'rectangle': this.drawRectangle(el, skipText); break
+      case 'ellipse': this.drawEllipse(el, skipText); break
+      case 'diamond': this.drawDiamond(el, skipText); break
       case 'text': this.drawTextElement(el); break
-      case 'sticky-note': this.drawStickyNote(el); break
+      case 'sticky-note': this.drawStickyNote(el, skipText); break
       case 'arrow': this.drawArrowElement(el, board); break
       case 'line': this.drawLineElement(el); break
       case 'freehand': this.drawFreehand(el); break
@@ -291,7 +292,7 @@ export class BoardRenderer {
   }
 
   /** 绘制矩形 */
-  private drawRectangle(el: RectangleElement): void {
+  private drawRectangle(el: RectangleElement, skipText = false): void {
     const { x, y, width, height, style } = el
     const radius = Math.min(style.borderRadius ?? 4, width / 2, height / 2)
 
@@ -312,14 +313,14 @@ export class BoardRenderer {
       this.ctx.setLineDash([])
     }
 
-    // 文本
-    if (el.text) {
+    // 文本（编辑时跳过，由 textarea 接管）
+    if (!skipText && el.text) {
       this.drawElementText(el)
     }
   }
 
   /** 绘制椭圆 */
-  private drawEllipse(el: EllipseElement): void {
+  private drawEllipse(el: EllipseElement, skipText = false): void {
     const cx = el.x + el.width / 2
     const cy = el.y + el.height / 2
     const rx = el.width / 2
@@ -341,13 +342,14 @@ export class BoardRenderer {
       this.ctx.setLineDash([])
     }
 
-    if (el.text) {
+    // 文本（编辑时跳过，由 textarea 接管）
+    if (!skipText && el.text) {
       this.drawElementText(el)
     }
   }
 
   /** 绘制菱形 */
-  private drawDiamond(el: DiamondElement): void {
+  private drawDiamond(el: DiamondElement, skipText = false): void {
     const cx = el.x + el.width / 2
     const cy = el.y + el.height / 2
     const hw = el.width / 2
@@ -373,7 +375,8 @@ export class BoardRenderer {
       this.ctx.setLineDash([])
     }
 
-    if (el.text) {
+    // 文本（编辑时跳过，由 textarea 接管）
+    if (!skipText && el.text) {
       this.drawElementText(el)
     }
   }
@@ -418,7 +421,7 @@ export class BoardRenderer {
   }
 
   /** 绘制便利贴 */
-  private drawStickyNote(el: StickyNoteElement): void {
+  private drawStickyNote(el: StickyNoteElement, skipText = false): void {
     const { x, y, width, height, style } = el
 
     // 阴影
@@ -447,8 +450,8 @@ export class BoardRenderer {
     this.ctx.closePath()
     this.ctx.fill()
 
-    // 文本
-    if (el.text) {
+    // 文本（编辑时跳过，由 textarea 接管）
+    if (!skipText && el.text) {
       this.drawElementText(el, 12)
     }
   }