refactor(chat): 优化时间戳显示和处理
- 移除了对 createdAtTimestamp 的引用,改为使用 createdAt - 添加了对时间戳的格式化处理,支持字符串和数字类型的时间戳 - 增加了时间戳的有效性检查 - 调整了时间戳的显示位置和样式
This commit is contained in:
parent
009d16d5c3
commit
a101fc182b
|
@ -21,9 +21,9 @@
|
||||||
<el-avatar :src="userAvatarUrl" :size="40" class="avatar" />
|
<el-avatar :src="userAvatarUrl" :size="40" class="avatar" />
|
||||||
<div class="message-content">
|
<div class="message-content">
|
||||||
<div class="message-text-wrapper">
|
<div class="message-text-wrapper">
|
||||||
<!-- <div v-if="message.createdAt" class="message-timestamp">
|
<div v-if="message.createdAt" class="message-timestamp">
|
||||||
{{ formatTimestamp(message.createdAtTimestamp) }}
|
{{ formatTimestamp(message.createdAt) }}
|
||||||
</div> -->
|
</div>
|
||||||
<div class="message-text">{{ message.question }}</div>
|
<div class="message-text">{{ message.question }}</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 改进建议部分 -->
|
<!-- 改进建议部分 -->
|
||||||
|
@ -55,9 +55,9 @@
|
||||||
<el-avatar :src="customAvatarUrl" :size="40" class="avatar" />
|
<el-avatar :src="customAvatarUrl" :size="40" class="avatar" />
|
||||||
<div class="message-content">
|
<div class="message-content">
|
||||||
<div class="message-text-wrapper">
|
<div class="message-text-wrapper">
|
||||||
<!-- <div v-if="message.createdAt" class="message-timestamp">
|
<div v-if="message.createdAt" class="message-timestamp">
|
||||||
{{ formatTimestamp(message.createdAtTimestamp) }}
|
{{ formatTimestamp(message.createdAt) }}
|
||||||
</div> -->
|
</div>
|
||||||
<div class="message-text">
|
<div class="message-text">
|
||||||
<span v-html="message.kehu"></span>
|
<span v-html="message.kehu"></span>
|
||||||
<span v-if="message.respondingType === 'kehu'" class="typing-indicator">
|
<span v-if="message.respondingType === 'kehu'" class="typing-indicator">
|
||||||
|
@ -310,9 +310,20 @@ const toggleSummary = () => {
|
||||||
|
|
||||||
// 格式化时间戳
|
// 格式化时间戳
|
||||||
const formatTimestamp = (timestamp) => {
|
const formatTimestamp = (timestamp) => {
|
||||||
console.log('%c timestamp:', 'color: #2196F3; font-weight: bold', timestamp)
|
|
||||||
if (!timestamp) return ''
|
if (!timestamp) return ''
|
||||||
const date = new Date(timestamp)
|
|
||||||
|
// 检查时间戳是否为字符串,如果是则转换为数字
|
||||||
|
const timestampNum = typeof timestamp === 'string' ? parseInt(timestamp) : timestamp
|
||||||
|
|
||||||
|
// 检查时间戳是否为毫秒级,如果不是则转换为毫秒
|
||||||
|
const date = new Date(timestampNum.toString().length === 10 ? timestampNum * 1000 : timestampNum)
|
||||||
|
|
||||||
|
// 检查日期是否有效
|
||||||
|
if (isNaN(date.getTime())) {
|
||||||
|
console.error('Invalid timestamp:', timestamp)
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
return date.toLocaleString('zh-CN', {
|
return date.toLocaleString('zh-CN', {
|
||||||
year: 'numeric',
|
year: 'numeric',
|
||||||
month: '2-digit',
|
month: '2-digit',
|
||||||
|
@ -561,6 +572,9 @@ html.dark .background-section .background-content {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
}
|
}
|
||||||
|
.message-timestamp {
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.assistant {
|
&.assistant {
|
||||||
|
@ -865,6 +879,7 @@ html.dark .background-section .background-content {
|
||||||
top: -20px;
|
top: -20px;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: opacity 0.2s ease;
|
transition: opacity 0.2s ease;
|
||||||
|
width: max-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-text-wrapper {
|
.message-text-wrapper {
|
||||||
|
|
Loading…
Reference in New Issue