From 03402e455915dec29e301f0e26fcb99706c38a5a Mon Sep 17 00:00:00 2001
From: Jerry Yan <792602257@qq.com>
Date: Sat, 24 Jan 2026 16:28:07 +0800
Subject: [PATCH] =?UTF-8?q?fix(annotation):=20=E4=BF=AE=E5=A4=8D=E6=AE=B5?=
 =?UTF-8?q?=E8=90=BD=E5=AF=BC=E8=88=AA=E6=A0=8F=E5=B8=83=E5=B1=80=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 修改段落导航容器为 flex-nowrap 防止换行
- 为段落标签添加 shrink-0 类避免压缩
- 使用 flex-1 min-w-0 优化段落列表容器
- 添加 overflow-x-auto 和 whitespace-nowrap 实现横向滚动
- 为右侧控制区域添加 shrink-0 和 whitespace-nowrap 类
---
 .../Annotate/LabelStudioTextEditor.tsx               | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/DataAnnotation/Annotate/LabelStudioTextEditor.tsx b/frontend/src/pages/DataAnnotation/Annotate/LabelStudioTextEditor.tsx
index 798d4f6..2bbdd9f 100644
--- a/frontend/src/pages/DataAnnotation/Annotate/LabelStudioTextEditor.tsx
+++ b/frontend/src/pages/DataAnnotation/Annotate/LabelStudioTextEditor.tsx
@@ -718,9 +718,12 @@ export default function LabelStudioTextEditor() {
         <div className="flex-1 flex flex-col min-h-0">
           {/* 段落导航栏 */}
           {segmented && segments.length > 0 && (
-            <div className="flex items-center gap-2 px-3 py-2 bg-gray-50 border-b border-gray-200">
-              <Typography.Text style={{ fontSize: 12 }}>段落：</Typography.Text>
-              <div className="flex gap-1 flex-wrap">
+            <div className="flex flex-nowrap items-center gap-2 px-3 py-2 bg-gray-50 border-b border-gray-200">
+              <Typography.Text style={{ fontSize: 12 }} className="shrink-0">
+                段落：
+              </Typography.Text>
+              <div className="flex-1 min-w-0">
+                <div className="flex gap-1 overflow-x-auto whitespace-nowrap">
                 {segments.map((seg) => (
                   <Button
                     key={seg.idx}
@@ -736,8 +739,9 @@ export default function LabelStudioTextEditor() {
                     )}
                   </Button>
                 ))}
+                </div>
               </div>
-              <div className="flex items-center gap-2 ml-auto">
+              <div className="flex items-center gap-2 ml-auto shrink-0 whitespace-nowrap">
                 <Tag color="blue">{currentSegmentIndex + 1} / {segments.length}</Tag>
                 <Typography.Text style={{ fontSize: 12 }}>切段自动保存</Typography.Text>
                 <Switch