Merged
Conversation
Contributor
wucm667
commented
Feb 13, 2026
- 添加 title 属性,鼠标悬停时显示完整数值
- 添加 truncate 类防止数值溢出
- 优化长数值的显示效果

- 添加 title 属性,鼠标悬停时显示完整数值 - 添加 truncate 类防止数值溢出 - 优化长数值的显示效果
Contributor
There was a problem hiding this comment.
Pull request overview
该 PR 旨在修复 StatCard 在展示超长数值时的溢出问题,通过在 UI 上截断显示并提供悬停查看完整值的方式改善可读性。
Changes:
- 为
.stat-value增加truncate样式,避免长数值撑破布局 - 在
StatCard的数值元素上增加title属性,支持 hover 显示完整内容
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| frontend/src/style.css | 给统计卡片数值样式增加 truncate 以减少溢出 |
| frontend/src/components/common/StatCard.vue | 给数值增加 title tooltip 展示完整值 |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| .stat-value { | ||
| @apply text-2xl font-bold text-gray-900 dark:text-white; | ||
| @apply text-2xl font-bold text-gray-900 dark:text-white truncate; |
There was a problem hiding this comment.
truncate alone often won’t actually ellipsize inside a flex row because flex items default to min-width: auto (can’t shrink below content). Since .stat-value is rendered as a flex item next to the trend <span>, long values may still overflow instead of truncating. Consider adding min-w-0 (and optionally flex-1 / max-w-full) to .stat-value or to the flex container’s children so truncation reliably works.
Suggested change
| @apply text-2xl font-bold text-gray-900 dark:text-white truncate; | |
| @apply text-2xl font-bold text-gray-900 dark:text-white truncate min-w-0 max-w-full; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.