时间格式修改说明.md
1.77 KB
用户管理时间格式修改说明
修改内容
将用户管理列表中的创建时间格式从 ISO 格式改为更易读的格式:
-
修改前:
2025-09-23T17:49:06 -
修改后:
2025-09-23 17:49:06
技术实现
1. 添加时间格式化函数
// 格式化时间显示
const formatDateTime = (dateTime: string | undefined): string => {
if (!dateTime) return ''
// 将 ISO 格式的时间字符串转换为可读格式
// 例如: 2025-09-23T17:49:06 -> 2025-09-23 17:49:06
return dateTime.replace('T', ' ')
}
2. 修改模板显示
<!-- 修改前 -->
<td>{{ user.createTime }}</td>
<!-- 修改后 -->
<td>{{ formatDateTime(user.createTime) }}</td>
功能特点
- 空值处理: 如果时间字段为空或未定义,返回空字符串
-
简单替换: 使用
replace('T', ' ')将 ISO 格式中的T替换为空格 - 类型安全: 使用 TypeScript 确保类型安全
- 性能优化: 简单的字符串替换,性能开销很小
影响范围
- 用户管理列表: 创建时间列显示格式已修改
-
其他时间字段: 目前只修改了
createTime字段 - 搜索功能: 时间搜索功能不受影响
测试方法
- 打开用户管理页面
- 查看用户列表中的"创建时间"列
- 确认时间格式显示为
2025-09-23 17:49:06而不是2025-09-23T17:49:06
扩展说明
如果需要修改其他时间字段(如 updateTime),可以按照相同的方式:
<td>{{ formatDateTime(user.updateTime) }}</td>
注意事项
- 这个修改只影响前端显示,不影响后端数据存储格式
- 时间搜索功能仍然使用原始的 ISO 格式
- 如果后端返回的时间格式发生变化,这个函数仍然可以正常工作