feat(explore): improve article timestamps
This commit is contained in:
@@ -922,6 +922,27 @@
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.explore-article-meta-line {
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.explore-article-meta-line > :first-child {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.explore-article-list-time {
|
||||
flex: 0 0 auto;
|
||||
font-variant-numeric: tabular-nums;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.explore-article-title {
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -407,7 +407,10 @@ export function WorkspaceExplorePage({
|
||||
>
|
||||
<span className={`explore-source-logo ${itemSource.color}`}>{sourceInitial(itemSource.name)}</span>
|
||||
<span className="explore-article-copy">
|
||||
<Text type="secondary">{itemSource.name} · {itemTime(item)}</Text>
|
||||
<span className="explore-article-meta-line">
|
||||
<Text type="secondary">{itemSource.name}</Text>
|
||||
<Text className="explore-article-list-time" type="secondary">{itemTime(item)}</Text>
|
||||
</span>
|
||||
<Text className="explore-article-title">{item.title}</Text>
|
||||
<Text className="explore-article-summary" type="secondary" ellipsis={{ showTooltip: true }}>
|
||||
{item.summary || '暂无摘要'}
|
||||
@@ -565,7 +568,22 @@ function itemTime(item: DatasetItemDTO) {
|
||||
const value = item.publishedAt ?? item.createdAt
|
||||
const parsed = new Date(value)
|
||||
if (Number.isNaN(parsed.getTime())) return ''
|
||||
return new Intl.DateTimeFormat('zh-CN', { dateStyle: 'medium' }).format(parsed)
|
||||
const now = new Date()
|
||||
const today = new Date(now.getFullYear(), now.getMonth(), now.getDate())
|
||||
const itemDate = new Date(parsed.getFullYear(), parsed.getMonth(), parsed.getDate())
|
||||
const dayDifference = Math.round((today.getTime() - itemDate.getTime()) / 86_400_000)
|
||||
const dateLabel = dayDifference === 0
|
||||
? '今天'
|
||||
: dayDifference === 1
|
||||
? '昨天'
|
||||
: new Intl.DateTimeFormat('zh-CN', { month: 'numeric', day: 'numeric' }).format(parsed)
|
||||
const timeLabel = new Intl.DateTimeFormat('zh-CN', {
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
second: '2-digit',
|
||||
hourCycle: 'h23',
|
||||
}).format(parsed)
|
||||
return `${dateLabel} ${timeLabel}`
|
||||
}
|
||||
|
||||
function sourceSubtitle(source: DatasetSourceDTO) {
|
||||
|
||||
Reference in New Issue
Block a user