makecindy / makecindy/cindy

窄窗口下「用量历史」表格首列与相邻列及表头发生重叠

Open
#3,546 2 comments 0 reactions 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
2.7k
Forks
395
Avg merge
21h 48m
Merged PRs (30d)
776

Description

**提交人**: dingyanji
**客户端版本**: 0.1.66

---

## 现象

在 Cindy「设置 → 用量历史」页面中,当窗口或设置内容区域收窄到较小尺寸时,表格内容出现响应式布局异常:

- 「按模型」和「按 Agent」表格的第一列内容与第二列数字内容相互挤压、覆盖或粘连,名称及标签变得难以辨认。
- 第一列表头与第二列表头之间间距不足,文字可能互相覆盖。
- 首列的省略号显示不稳定,首列内部的名称和标签仍可能争抢空间并影响后续列。

正常宽度下不明显,主要发生在窄窗口或设置页面可用宽度不足的边界场景。

## 复现步骤

1. 打开 Cindy,进入「设置 → 用量历史」。
2. 分别查看「按模型」和「按 Agent」表格。
3. 将窗口宽度逐步收窄,或使设置页面的可用内容区域变窄。
4. 观察第一列、第二列及对应表头的排版。

## 期望行为

- 第一列在空间不足时可靠地显示省略号,不覆盖第二列。
- 模型名/Agent 名与其标签之间保持可读间距。
- 各列表头独立显示,不互相重叠。
- 数字列保持完整可读;如整体空间不足,应通过表格横向滚动查看,而不是让列内容相互覆盖。

## 实际行为

在窄窗口下,第一列与第二列可能发生重叠,表头也可能互相覆盖;首列文本、标签和相邻 Token 数值出现粘连或难以辨认。现有截断处理未能在该尺寸下稳定避免列内容冲突。

## 复现频率

每次达到会触发布局问题的窄窗口尺寸时都能复现。

## 已尝试

已在包含 PR #3446 相关首列截断调整的版本上验证;该调整缓解了超长首列撑宽表格的问题,但上述窄窗口重叠仍然存在。

## 截图

已提供两张经过检查的页面截图作为复现证据:

1. 「按 Agent」表在窄内容区域下,表头及首行内容发生明显重叠。
2. 「按模型」表在窄内容区域下,多行名称、标签与数值列相互覆盖。

截图仅用于展示布局问题;正文不记录其中具体的模型名、Agent 名或其他非必要内容。
---
**版本区域**: CN
**OS**: win32 x64 (10.0.19045)
**Harness**: Codex
**Model ID**: ` codex/gpt-5.6-sol `
**界面语言**: zh-CN

Contributor guide

Open the contributing guide

Research direction

Start at Settings → Usage History and reproduce the layout at progressively narrower widths in both the “By Model” and “By Agent” tables. Trace the table implementation and existing first-column truncation adjustment associated with PR #3446. Done means the first column truncates without covering adjacent columns, headers remain separate, numeric columns stay readable, and insufficient space can be viewed by horizontal scrolling.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
65/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.