flnxi-Wu/docs/archive/后续修改.txt

📋 待办清单 - 功能优化与改进

以下是一些需要做的改进，按优先级和依赖关系规划一下先后顺序～

═══════════════════════════════════════════════════════════════
🎯 核心功能优化
═══════════════════════════════════════════════════════════════

1. 用户信息同步 📝 ✅
   管理员修改用户信息后，这个用户上传的所有素材信息也要跟着更新
   比如改了用户名，素材里的作者名也要变
   ✅ 已完成：在`/api/admin/users/update`中实现了用户名同步到素材的`authorName`字段
   ✅ 已完成：使用事务确保数据一致性
   ✅ 已完成：前端显示同步成功提示

2. 上传进度优化 ⚡ ✅
   现在上传素材进度条到100%后，还要等一会儿才关闭弹窗
   希望能更流畅，进度到100%就立马关闭
   ✅ 已完成：进度100%后立即显示完成状态（绿色进度条+完成提示）
   ✅ 已完成：添加300ms延迟确保数据保存完成后再关闭
   ✅ 已完成：优化用户体验，显示"上传成功，正在关闭..."提示

3. 多预览图功能 🖼️ ✅
   一个素材可以上传多张预览图
   自动把第一张设为封面预览图
   ✅ 已完成：支持上传最多5张预览图
   ✅ 已完成：第一张预览图自动设为封面
   ✅ 已完成：支持多文件选择和拖拽上传
   ✅ 已完成：预览图列表显示，可单独删除

4. 性能监控导出 📊 ✅
   性能监控页面增加导出CSV表格功能
   方便数据分析和存档
   ✅ 已完成：在系统监控页面添加"导出CSV"按钮
   ✅ 已完成：导出包含所有监控数据（概览、趋势、分布、活动、系统信息）
   ✅ 已完成：支持Excel正确显示中文（添加UTF-8 BOM）

═══════════════════════════════════════════════════════════════
👤 用户相关功能
═══════════════════════════════════════════════════════════════

5. 个人中心 🏠 ✅
   点击头像弹出的菜单里，增加"个人中心"功能
   让用户可以查看和管理自己的信息
   ✅ 已完成：在Header菜单中添加了"个人中心"选项
   ✅ 已完成：创建了个人中心页面（`/profile`）
   ✅ 已完成：显示用户基本信息和上传的素材
   ✅ 已完成：支持在个人中心上传和修改头像

6. 用户头像设置 🎨 ✅
   用户可以自己设置头像
   - 钉钉登录的用户：直接用钉钉头像（能抓到就用，抓不到就算了）
   - 没有头像的用户：和系统LOGO一样，用默认头像策略
   ✅ 已完成：创建了头像上传API（`/api/user/avatar`）
   ✅ 已完成：用户可以在个人中心上传头像
   ✅ 已完成：头像自动压缩和优化
   ✅ 已完成：Header组件中的Avatar组件支持显示用户头像

═══════════════════════════════════════════════════════════════
🎨 首页UI优化
═══════════════════════════════════════════════════════════════

7. 排行榜缩略按钮可拖动 📌 ✅
   首页排行榜关闭后的那个小缩略按钮
   可以拖动，而且记住关闭前的位置
   ✅ 已完成：缩略按钮支持拖动功能
   ✅ 已完成：关闭时保存面板位置作为按钮位置
   ✅ 已完成：位置保存到localStorage，支持恢复
   ✅ 已完成：拖动阈值5px区分点击和拖动操作

8. 素材卡片响应式优化 ✅
   问题：调整浏览器窗口大小时，卡片会变形
   解决：保持卡片比例固定，不要贴边
   ✅ 已完成：卡片比例固定，加了边距，样式统一

9. 素材卡片大小可调 🎚️
   可以设置素材卡片的大小（加个横向滑块）
   展示形式可以改成瀑布流
   考虑到低性能机器，可以动态加载，一次加载多少你看着办
   有更好的想法也可以提出来

10. 素材卡片信息精简 📦 ✅
    现在卡片下方信息太多，占地方
    优化方案：
    - ✅ "作者："文字去掉，直接显示作者名，前面加头像
    - ✅ 文件名和文件大小不显示
    - ✅ 上传时间放到预览图右上角，默认隐藏，鼠标悬停时显示

11. 素材卡片标签系统 🏷️
    在素材名称前面加标签
    比如：点赞榜、精品榜、下载榜、收藏榜等
    样式参考最高权限的显示效果
    要好看，偏向苹果风格，但整体要统一

12. 首页筛选TAG系统 🎯 ✅
    把筛选里的"类型分页"功能放到首页
    用TAG显示，第一个TAG是"全部"
    TAG根据上传模板设置（所以模板管理很重要）
    样式要大气好看，符合整体风格
    ✅ 已完成：创建了 `/api/material-types` API 从模板中提取素材类型
    ✅ 已完成：首页使用TAG形式显示类型筛选，支持点击切换
    ✅ 已完成：使用低饱和度炫彩元素样式，符合整体设计风格

═══════════════════════════════════════════════════════════════
🎛️ 系统管理优化
═══════════════════════════════════════════════════════════════

13. 菜单改名和调整 📋 ✅
    - 点击头像菜单里，"系统设置"改名为"管理"，图标也换一下
    - "外观设置"也移到头像菜单里，前面加个图标
    ✅ 已完成：将"系统设置"改名为"管理"，更换图标（使用滑块图标）
    ✅ 已完成：将"外观设置"移到头像菜单中，添加调色板图标

14. 模板管理整合 🔗 ✅
    现在模板管理已经做好了，要把前后端串起来：
    ✅ 首页上传素材面板：把"素材类型"改成"素材模板"
      列表直接拉取模板管理中的模板名称
    ✅ 选择模板后，界面显示对应模板的字段
    ✅ 系统管理中的分类管理：
      不再用"店铺分类"和"场景类别"
      改用模板管理中的下拉选项文字做分类
    ⚠️ 模板管理的面板逻辑要严格检查，这个很重要！（待后续完善）

15. 系统监控交互增强 📈
    - 用户总数、活跃用户、总素材数、本月新用户、本月新素材
      这些数字可以点击，跳转到对应的数据显示
    - 素材上传趋势卡片前面，增加"当月上传趋势"

═══════════════════════════════════════════════════════════════
✨ UI统一与组件库
═══════════════════════════════════════════════════════════════

16. 统一弹窗系统 ✅
   不要用浏览器自带的弹窗，太丑了
   ✅ 已完成：创建了统一弹窗组件，替换了所有浏览器原生弹窗
   ✅ 已完成：确认、提示、输入弹窗都统一了

17. 素材预览面板统一 ✅
   点击素材后的预览面板要统一，退出逻辑也要统一
   ✅ 已完成：创建了统一的预览组件，样式和退出逻辑都统一了

18. 首页UI统一到三层架构 ✅
   首页的UI要统一到三层架构系统
   ✅ 已完成：按钮、输入框、筛选弹窗等主要组件都统一了
   ✅ 已完成：所有颜色从gray系列改成slate系列，完全统一
   ✅ 已完成：文本、边框、标签样式都统一了

19. 通用组件库创建 ✅
   在统一UI架构内，新增一些通用组件
   ✅ 已完成：创建了Badge组件（徽章，支持多种样式）
   ✅ 已完成：创建了Tag组件（标签，支持多种颜色，已在首页用上了）
   ✅ 已完成：创建了Button组件（按钮，支持多种样式和加载状态）
   ✅ 已完成：创建了Input组件（输入框，支持错误状态和多种尺寸）
   ✅ 已完成：创建了Card组件（卡片，支持多种变体）
   ✅ 已完成：创建了Avatar组件（头像，支持图片和文字头像）
   ✅ 已完成：为所有新创建和重构的文件添加了文件头注释

═══════════════════════════════════════════════════════════════
🎨 视觉设计优化
═══════════════════════════════════════════════════════════════

20. 深浅色主题优化 🌓 ⏳
   优化一下深浅色主题的适配
   确保所有组件在两种模式下都好看
   ✅ 已完成：Header组件迁移到三层架构，使用Avatar组件
   ✅ 已完成：ChangePasswordModal迁移到统一的Modal和Input组件
   ✅ 已完成：DanmakuWidget迁移到三层架构，使用统一的Input和Button组件
   ✅ 已完成：AIChatWidget添加文件头注释，优化样式（gray → slate）
   ✅ 已完成：RankingPanel添加文件头注释，迁移到三层架构
   ✅ 已完成：分享页面和编辑页面添加文件头注释，优化样式（gray → slate）
   ⏳ 进行中：继续优化UploadModal等大型组件

21. 低饱和度炫彩元素 🎨 ✅
   设计语言遵循苹果风格
   重点用低饱和度的炫彩元素
   让界面更有活力但不会太花哨
   ✅ 已完成：添加了accentStyles配置（pink、purple、blue、cyan、emerald、orange、rainbow）
   ✅ 已完成：Tag组件已更新使用低饱和度炫彩元素

═══════════════════════════════════════════════════════════════

22.首页内上传面板的上传进度条以及报错信息和成功提示，放到上传素材那一栏的下方，不要放在整个面板的最下方 ✅
   ✅ 已完成：将上传进度条移到"素材文件"上传区域下方
   ✅ 已完成：将错误信息和成功提示移到"素材文件"上传区域下方


23.外观设置改名为系统设置，且管理内的外观设置删除，和头像下拉菜单里面的外观设置重复了 ✅
   ✅ 已完成：删除管理页面中的"外观设置"Tab
   ✅ 已完成：从AdminTab类型中移除'settings'选项
   ✅ 已完成：外观设置现在仅在头像下拉菜单中可用

24.颜色系统完全统一 ✅
   ✅ 已完成：优化globals.css，将所有gray-替换为slate-
   ✅ 已完成：优化登录/注册页面，将所有gray-替换为slate-
   ✅ 已完成：优化EditMaterialModal，将所有gray-替换为slate-
   ✅ 已完成：所有页面和组件现在完全使用slate系列颜色

25.首页素材卡片内点击“编辑”按钮弹出来的弹出来的弹窗没有统一到统一UI。 ✅
   ✅ 已完成：EditMaterialModal 改为复用全局 `Modal` 组件，交互和样式保持一致

26.首页的“筛选”按钮的内容，没有联动到后台数据 ✅
   ✅ 已完成：筛选弹窗中的项由模板管理里勾选“首页筛选”的字段自动决定（支持店铺/场景/平台等），并实时读取后台数据

27.素材卡片上的上传时间，只显示年月日。点赞按钮不起作用。且我尝试下载了一个素材，理论上这个素材应该是下载榜第一的，但是素材卡片上没有下载榜的角标
   ✅ 已完成：上传时间统一为“yyyy-MM-dd”并放在封面右上角 hover 显示
   ✅ 已完成：点赞按钮重新接入 `/api/materials/like`，支持状态高亮
   ✅ 已完成：根据 `/api/material-rankings` 在封面左上角显示统一 UI 渐变角标（精品/下载/点赞榜）

28.管理员权限的账户可以直接在首页的素材卡片内实现删除素材的功能，按钮可以加在下载按钮前面。普通的用户就看不见这个按钮。这个按钮可以在系统管理内的功能开关内设置普通人员能不能看见这个按钮（打开就是只能管理员看见按钮，关闭是全部人员都能看到按钮），默认是只有管理员权限能看到
   ✅ 已完成：卡片操作区新增“删除”按钮（管理员默认可见，带统一弹窗确认）
   ✅ 已完成：系统设置 → 功能开关中新增“首页删除按钮仅管理员可见”开关，可切换显示范围

29.首页tag排序按照素材数量动态排序
   ✅ 已完成：`/api/upload-templates` 返回 `materialCount`，前端按素材数量降序展示并显示计数
   ✅ 已完成：TAG 条使用统一 UI 样式，支持“全部 + 模板名”展示

30.排行榜缩略按钮可拖动，改完之后，这个状态只能维持一次，拖动之后再拖动，这个就不生效了

31.统一UI标准元素预览界面适配是在哪里，还有后面新添加的新元素会自动加进去吗
   ✅ 已完成：所有统一 UI 组件收敛在 `app/ui-preview/page.tsx`，新增元素接入三层样式后会自动在此页面展示，开发可参照该页面验证

32.首页tag居中排布
   ✅ 已完成：模板 TAG 区域（含吸顶状态）改为 `justify-center`，并移除“素材库”标题保持整体对齐

33.首页筛选内还是和后台的字段对不上
   ✅ 已完成：筛选弹窗实时读取模板管理中标记了“首页筛选”的字段，字段标签、选项与后台保持一致

34.上传素材面板中预览图片，里面的虚位卡片会出现在其他图片的下面，这是不对的，应该是在其他图片的后面
   ✅ 已完成：预览图占位卡片改为与已上传图片同一个网格，始终显示在末尾

35.上传素材面板中预览图片，点击删掉预览图片小按钮之后，这个预览图片是删掉了，但是也会同时弹出选择图片的windows弹窗，这是不对的，冲突了
   ✅ 已完成：删除按钮阻止冒泡，不再触发文件选择弹窗

36.排行榜中数字为0的不上榜
   ✅ 已完成：排行榜数据过滤零值，只有 count > 0 的条目才展示

37.首页TAG，在分类名字后面默认不显示数量，与鼠标交互后才会显示。且全部的tag上面的数字是不对的。现在素材数量是两个，但是显示是0 ✅
   - ✅ TAG 数字默认隐藏，hover/聚焦时平滑显示；“全部”数量直接读取 `/api/materials` 返回的 `totalCount`，确保统计准确

38.首页筛选内还是和后台的字段对不上，比如我在后台的“MD”素材模板中，将“sadfh”设置为了首页筛选，但是首页上的筛选内还是看不到sadfh这个筛选项 ✅
   - ✅ 模板中勾选“首页筛选”的字段会在筛选弹窗动态渲染，对应选项来自模板配置，同时增加了查询参数和后端过滤逻辑

39.psd素材预览窗内还是会有大约1像素的风格 ✅
   - ✅ 移除PSD长图容器边框/分隔线，统一用无缝背景展示

40.预览窗内不显示“作者”，直接显示作者头像以及作者名称。然后首页素材卡片上的几个按钮同样的在打开预览弹窗内显示，且将精品榜的判断逻辑和下载点赞脱离，直接在点开的预览窗口内新增一个精品按钮。点赞的心形图标还是不对，是歪的。 ✅
   - ✅ 预览面板显示头像+姓名、不再出现“作者”标签
   - ✅ 提炼卡片按钮为统一组件，预览弹窗底部复用，含编辑/删除/分享/收藏/点赞/下载
   - ✅ 新增“设为精品”按钮，仅管理员可切换，后端记录 `isPremium` 并供排行榜使用
   - ✅ 心形图标改为对称版本，收藏按钮独立

41.首页素材卡片的三个角标和素材名称不要用同一个框，分开来 ✅
   - ✅ 左上角改为角标行 + 独立标题标签，视觉分离

42.增加收藏功能，将首页素材卡片的上传时间从预览图的右上角挪到右下角，然后在右上角增加收藏按钮。个人的收藏列表可以在个人中心看到。 ✅
   - ✅ 新增收藏API/数据表、卡片右上角收藏钮（支持预览弹窗内操作）
   - ✅ 上传时间移动到右下角
   - ✅ 个人中心新增“我的收藏”列表

43.分类管理中又冒出来许多的奇怪的分类小卡片，之前也是有这个问题的， ✅
   - ✅ 后端解析分类选项时统一去除 `[]` 和 `\"` 的嵌套字符，并在更新时做归一化，异常项不再生成卡片

44.首页上传素材面板内选择上传模板如果是自定义模板的话，素材卡片的用来区分不同素材模板的标不会显示成自定义模板的名字，而是继续使用预制模板的名字
   - ✅已解决

45.首页tag按钮，切换的时候会闪动，越往后的按钮闪动越厉害，应该是和排布有关系

46.自定义模板的问题解决了，现在预制模板的问题又来了，我尝试使用3dmax的预制模板上传素材，但是提示我：模板不存在：builtin-3dmax-material

47，自定义模板的tag按钮里面不显示素材数量












💡 提示：
- ✅ 表示已完成
- ⏳ 表示进行中
- 📝 表示待开始
- 有更好的想法随时提出来～