• IanShaw's avatar
    feat(frontend): 前端界面优化与使用统计功能增强 (#46) · 254f1254
    IanShaw authored
    * feat(frontend): 前端界面优化与使用统计功能增强
    
    主要改动:
    
    1. 表格布局统一优化
       - 新增 TablePageLayout 通用布局组件
       - 统一所有管理页面的表格样式和交互
       - 优化 DataTable、Pagination、Select 等通用组件
    
    2. 使用统计功能增强
       - 管理端: 添加完整的筛选和显示功能
       - 用户端: 完善 API Key 列显示
       - 后端: 优化使用统计数据结构和查询
    
    3. 账户组件优化
       - 优化 AccountStatsModal、AccountUsageCell 等组件
       - 统一进度条和统计显示样式
    
    4. 其他改进
       - 完善中英文国际化
       - 统一页面样式和交互体验
       - 优化各视图页面的响应式布局
    
    * fix(test): 修复 stubUsageLogRepo.ListWithFilters 测试 stub
    
    测试用例 GET /api/v1/usage 返回 500 是因为 stub 方法未实现,
    现在正确返回基于 UserID 过滤的日志数据。
    
    * feat(frontend): 统一日期时间显示格式
    
    **主要改动**:
    1. 增强 utils/format.ts:
       - 新增 formatDateOnly() - 格式: YYYY-MM-DD
       - 新增 formatDateTime() - 格式: YYYY-MM-DD HH:mm:ss
    
    2. 全局替换视图中的格式化函数:
       - 移除各视图中的自定义 formatDate 函数
       - 统一导入使用 @/utils/format 中的函数
       - created_at/updated_at 使用 formatDateTime
       - expires_at 使用 formatDateOnly
    
    3. 受影响的视图 (8个):
       - frontend/src/views/user/KeysView.vue
       - frontend/src/views/user/DashboardView.vue
       - frontend/src/views/user/UsageView.vue
       - frontend/src/views/user/RedeemView.vue
       - frontend/src/views/admin/UsersView.vue
       - frontend/src/views/admin/UsageView.vue
       - frontend/src/views/admin/RedeemView.vue
       - frontend/src/views/admin/SubscriptionsView.vue
    
    **效果**:
    - 日期统一显示为 YYYY-MM-DD
    - 时间统一显示为 YYYY-MM-DD HH:mm:ss
    - 提升可维护性,避免格式不一致
    
    * fix(frontend): 补充遗漏的时间格式化统一
    
    **补充修复**(基于 code review 发现的遗漏):
    
    1. 增强 utils/format.ts:
       - 新增 formatTime() - 格式: HH:mm
    
    2. 修复 4 个遗漏的文件:
       - src/views/admin/UsersView.vue
         * 删除 formatExpiresAt(),改用 formatDateTime()
         * 修复订阅过期时间 tooltip 显示格式不一致问题
    
       - src/views/user/ProfileView.vue
         * 删除 formatMemberSince(),改用 formatDate(date, 'YYYY-MM')
         * 统一会员起始时间显示格式
    
       - src/views/user/SubscriptionsView.vue
         * 修改 formatExpirationDate() 使用 formatDateOnly()
         * 保留天数计算逻辑
    
       - src/components/account/AccountStatusIndicator.vue
         * 删除本地 formatTime(),改用 utils/format 中的统一函数
         * 修复 rate limit 和 overload 重置时间显示
    
    **验证**:
    - TypeScript 类型检查通过 ✓
    - 前端构建成功 ✓
    - 所有剩余的 toLocaleString() 都是数字格式化,属于正确用法 ✓
    
    **效果**:
    - 订阅过期时间统一为 YYYY-MM-DD HH:mm:ss
    - 会员起始时间统一为 YYYY-MM
    - 重置时间统一为 HH:mm
    - 消除所有不规范的原生 locale 方法调用
    254f1254
SetupWizardView.vue 23.7 KB