feat(聊天窗口): 优化消息时间显示格式并调整样式
重构消息时间格式化逻辑,提取为公共工具函数 formatWechatTime 移除聊天窗口中的分隔线样式,调整消息间距 更新构建产物文件引用路径
This commit is contained in:
@@ -1,5 +1,53 @@
|
||||
import { Modal } from "antd-mobile";
|
||||
import { getSetting } from "@/store/module/settings";
|
||||
export function formatWechatTime(timestamp) {
|
||||
// 处理时间戳(兼容秒级/毫秒级)
|
||||
const date = new Date(
|
||||
timestamp.toString().length === 10 ? timestamp * 1000 : timestamp,
|
||||
);
|
||||
const now = new Date();
|
||||
|
||||
// 获取消息时间的年月日时分
|
||||
const messageYear = date.getFullYear();
|
||||
const messageMonth = date.getMonth();
|
||||
const messageDate = date.getDate();
|
||||
const messageHour = date.getHours().toString().padStart(2, "0");
|
||||
const messageMinute = date.getMinutes().toString().padStart(2, "0");
|
||||
|
||||
// 获取当前时间的年月日
|
||||
const nowYear = now.getFullYear();
|
||||
const nowMonth = now.getMonth();
|
||||
const nowDate = now.getDate();
|
||||
|
||||
// 创建当天0点的时间对象,用于比较是否同一天
|
||||
const today = new Date(nowYear, nowMonth, nowDate, 0, 0, 0);
|
||||
const yesterday = new Date(today);
|
||||
yesterday.setDate(yesterday.getDate() - 1);
|
||||
const weekAgo = new Date(today);
|
||||
weekAgo.setDate(weekAgo.getDate() - 6); // 7天前(包括今天)
|
||||
|
||||
// 消息日期(不含时间)
|
||||
const messageDay = new Date(messageYear, messageMonth, messageDate, 0, 0, 0);
|
||||
|
||||
// 当天消息:只显示时分
|
||||
if (messageDay.getTime() === today.getTime()) {
|
||||
return `${messageHour}:${messageMinute}`;
|
||||
}
|
||||
|
||||
// 昨天消息:显示"昨天 时分"
|
||||
if (messageDay.getTime() === yesterday.getTime()) {
|
||||
return `昨天 ${messageHour}:${messageMinute}`;
|
||||
}
|
||||
|
||||
// 一周内消息:显示"星期X 时分"
|
||||
if (messageDay.getTime() >= weekAgo.getTime()) {
|
||||
const weekdays = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
|
||||
return `${weekdays[date.getDay()]} ${messageHour}:${messageMinute}`;
|
||||
}
|
||||
|
||||
// 超过一周:显示"年月日 时分"
|
||||
return `${messageYear}年${messageMonth + 1}月${messageDate}日 ${messageHour}:${messageMinute}`;
|
||||
}
|
||||
/**
|
||||
* 通用js调用弹窗,Promise风格
|
||||
* @param content 弹窗内容
|
||||
|
||||
Reference in New Issue
Block a user