Commit d4ed917e1b9da936a82100b37feb5248f58c070e
1 parent
c72d1b10
fix: make message timeline timestamps visible - show absolute time + relative, stronger CSS contrast
Showing
1 changed file
with
20 additions
and
2 deletions
web/src/views/CompanyDashboard.vue
| @@ -430,7 +430,7 @@ | @@ -430,7 +430,7 @@ | ||
| 430 | <span class="timeline-role-badge" :class="msg.role"> | 430 | <span class="timeline-role-badge" :class="msg.role"> |
| 431 | {{ msg.role === 'user' ? '收到指令' : '产出回复' }} | 431 | {{ msg.role === 'user' ? '收到指令' : '产出回复' }} |
| 432 | </span> | 432 | </span> |
| 433 | - <span class="timeline-time">{{ formatTimeline(msg.timestamp) }}</span> | 433 | + <span class="timeline-time">🕐 {{ formatTimelineAbsolute(msg.timestamp) }}</span> |
| 434 | <span v-if="msg.taskId" class="timeline-task-badge">📌 {{ msg.taskId }}</span> | 434 | <span v-if="msg.taskId" class="timeline-task-badge">📌 {{ msg.taskId }}</span> |
| 435 | </div> | 435 | </div> |
| 436 | <div class="timeline-conv-title">{{ msg.conversationTitle }}</div> | 436 | <div class="timeline-conv-title">{{ msg.conversationTitle }}</div> |
| @@ -950,6 +950,20 @@ function formatTimeline(ts) { | @@ -950,6 +950,20 @@ function formatTimeline(ts) { | ||
| 950 | return d.toLocaleString('zh-CN', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }) | 950 | return d.toLocaleString('zh-CN', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }) |
| 951 | } | 951 | } |
| 952 | 952 | ||
| 953 | +function formatTimelineAbsolute(ts) { | ||
| 954 | + if (!ts) return '' | ||
| 955 | + const d = new Date(ts) | ||
| 956 | + const time = d.toLocaleString('zh-CN', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' }) | ||
| 957 | + const now = new Date() | ||
| 958 | + const diffMs = now.getTime() - d.getTime() | ||
| 959 | + let relative = '' | ||
| 960 | + if (diffMs < 60000) relative = '刚刚' | ||
| 961 | + else if (diffMs < 3600000) relative = `${Math.floor(diffMs / 60000)}分钟前` | ||
| 962 | + else if (diffMs < 86400000) relative = `${Math.floor(diffMs / 3600000)}小时前` | ||
| 963 | + else relative = `${Math.floor(diffMs / 86400000)}天前` | ||
| 964 | + return `${time}（${relative}）` | ||
| 965 | +} | ||
| 966 | + | ||
| 953 | onMounted(() => { | 967 | onMounted(() => { |
| 954 | loadCompanies() | 968 | loadCompanies() |
| 955 | loadTemplates() | 969 | loadTemplates() |
| @@ -1641,7 +1655,11 @@ function closeDropdown() { | @@ -1641,7 +1655,11 @@ function closeDropdown() { | ||
| 1641 | .timeline-role-badge.user { background: rgba(59,130,246,0.12); color: var(--blue-text, #60a5fa); } | 1655 | .timeline-role-badge.user { background: rgba(59,130,246,0.12); color: var(--blue-text, #60a5fa); } |
| 1642 | .timeline-role-badge.assistant { background: rgba(16,185,129,0.12); color: var(--accent-light); } | 1656 | .timeline-role-badge.assistant { background: rgba(16,185,129,0.12); color: var(--accent-light); } |
| 1643 | 1657 | ||
| 1644 | -.timeline-time { font-size: 10px; color: var(--text-faint); } | 1658 | +.timeline-time { |
| 1659 | + font-size: 11px; color: var(--text-secondary); font-weight: 500; | ||
| 1660 | + padding: 1px 6px; border-radius: 4px; | ||
| 1661 | + background: var(--bg-surface-hover); | ||
| 1662 | +} | ||
| 1645 | .timeline-task-badge { | 1663 | .timeline-task-badge { |
| 1646 | font-size: 10px; padding: 1px 6px; border-radius: 4px; | 1664 | font-size: 10px; padding: 1px 6px; border-radius: 4px; |
| 1647 | background: rgba(251,191,36,0.1); color: var(--yellow-text, #fbbf24); | 1665 | background: rgba(251,191,36,0.1); color: var(--yellow-text, #fbbf24); |