From 75594aa2aa9ce85fd5ebd668e83c4c423af23f9f Mon Sep 17 00:00:00 2001
From: JOJO <1498581755@qq.com>
Date: Sun, 31 May 2026 17:51:31 +0800
Subject: [PATCH] =?UTF-8?q?fix(ui):=20=E4=BF=AE=E5=A4=8D=20write=5Ffile=20?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9=E5=9C=A8=20diff=20grid=20=E4=B8=8B=E8=A2=AB?=
 =?UTF-8?q?=E6=8C=A4=E6=88=90=E5=A4=9A=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

.diff-line 改为 grid 三列布局后，write_file 仍输出裸文本，整段
被塞进 5ch 宽的首列竖排折行。改为与 edit_file 一致的行号/标记/内容
三 span 结构，内容落在 1fr 列正常换行。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 static/src/components/chat/actions/ToolAction.vue   | 4 ++--
 static/src/components/chat/actions/toolRenderers.ts | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/static/src/components/chat/actions/ToolAction.vue b/static/src/components/chat/actions/ToolAction.vue
index 0c86a32..2a12b3b 100644
--- a/static/src/components/chat/actions/ToolAction.vue
+++ b/static/src/components/chat/actions/ToolAction.vue
@@ -306,8 +306,8 @@ function renderWriteFile(result: any, args: any): string {
   if (result.success && content) {
     html += '<div class="tool-result-diff scrollable">';
     const lines = content.split('\n');
-    lines.forEach((line: string) => {
-      html += `<div class="diff-line diff-add">+ ${escapeHtml(line)}</div>`;
+    lines.forEach((line: string, idx: number) => {
+      html += `<div class="diff-line diff-add"><span class="diff-line-number">${idx + 1}</span><span class="diff-marker">+</span><span class="diff-content">${escapeHtml(line)}</span></div>`;
     });
     html += '</div>';
   }
diff --git a/static/src/components/chat/actions/toolRenderers.ts b/static/src/components/chat/actions/toolRenderers.ts
index 9a21dbb..9f374ce 100644
--- a/static/src/components/chat/actions/toolRenderers.ts
+++ b/static/src/components/chat/actions/toolRenderers.ts
@@ -246,8 +246,8 @@ function renderWriteFile(result: any, args: any): string {
   if (result.success && content) {
     html += '<div class="tool-result-diff scrollable">';
     const lines = content.split('\n');
-    lines.forEach((line: string) => {
-      html += `<div class="diff-line diff-add">+ ${escapeHtml(line)}</div>`;
+    lines.forEach((line: string, idx: number) => {
+      html += `<div class="diff-line diff-add"><span class="diff-line-number">${idx + 1}</span><span class="diff-marker">+</span><span class="diff-content">${escapeHtml(line)}</span></div>`;
     });
     html += '</div>';
   }