feat: add configurable platform appearance (#385)

This commit is contained in:
likeraylee
2026-09-02 20:33:25 +08:00
committed by GitHub
parent a6504c0e00
commit 5dd515b8ab
31 changed files with 2795 additions and 153 deletions

View File

@@ -19,6 +19,12 @@ description: 影策后端核心持久化表与状态边界
版本 3 会将 `wardrobe`、`weapon`、`accessory` 迁移为 `prop`,将 `style` 迁移为 `material`,并把原先归入 `other` 的图片、视频、音频和 3D 模型迁移为 `material`。迁移只合并重复的待确认候选:保留最早记录,其余标记为 `ignored`;已经确认的资产不会被自动删除或归并。
## 平台外观配置
平台外观复用既有 `system_settings` 表,不新增结构迁移。键 `appearance` 的 JSON 值使用版本化合同;版本 3 保存品牌名称、英文品牌标识、登录页主标题与可选说明文案、浅色与可选深色 Logo 资源 ID、Logo 外框开关、登录页视频资源 ID、可选封面资源 ID 和预留皮肤 ID。只配置一套 Logo 时,公开投影会在浅色和深色主题复用同一资源;旧版本缺少深色 Logo 与外框字段时分别回退到单 Logo 和启用外框,不改变既有视觉。资源元数据和文件仍分别由 `resources` 表与当前资源存储承担。恢复默认外观时删除这条设置记录并回到内置值,不级联删除已经上传的资源。
公开接口只投影品牌名、英文品牌标识、登录页公开文案、深浅主题使用的稳定 slot 资源 URL、Logo 外框状态、配置状态和修订标识,不返回内部资源 ID、对象路径或存储凭据。管理员保存新配置前,服务层会校验文本长度与安全字符、资源为就绪状态、类型与 slot 匹配,且新绑定资源由当前管理员上传;两套 Logo、视频和封面中任何正在使用的资源都会进入管理员删除保护。品牌变更同时写入 `admin_audit_events`。
## 账号认证与密码找回
| 表 | 用途 | 关键边界 |

View File

@@ -5,6 +5,21 @@ description: 影策当前已实现的核心工作台能力与使用入口
# 功能清单
## 平台外观管理
管理员可以在“系统配置 → 外观管理”统一设置平台品牌名称、英文品牌标识、浅色与深色 Logo、Logo 外框、登录页主标题、可选说明文案、品牌视频和可选视频封面。Logo 可以只上传任意一套并自动复用,也可以分别为浅色与深色界面上传;工作台和管理后台导航中的圆角矩形外框可以通过统一开关单独禁用,禁用后 Logo 会等比放大到原外框的可用区域,但导航占位不变。品牌名称和对应主题 Logo 会应用到登录页、工作台导航、管理后台、浏览器标题以及创作与素材库的主要品牌文案;登录、注册和找回密码共享同一套左侧品牌文案与影片。
前端入口在加载 React 应用之前先读取 `GET /api/public/appearance`。初始 HTML 不包含内置品牌名、Logo 或默认 favicon;只有公开配置成功或明确回退到内置外观后才渲染应用,避免自定义品牌访问时先闪现“影策”。自定义视频未设置封面时保持纯色背景直至视频首帧就绪,不复用内置视频封面。
浅色 Logo、深色 Logo、视频和封面通过后台专用上传接口进入现有资源存储,并由稳定的公开 slot URL 读取;公开响应不暴露资源 ID。正在使用的外观资源会阻止管理员从资源管理页直接删除。英文品牌标识可作为对象存储路径前缀建议,但不会自动覆盖已经保存的前缀或改写历史资源。“恢复影策默认”会删除外观配置记录并立即恢复全部内置品牌值和默认 Logo 外框,同时保留已经上传的素材文件。配置保留 `schemaVersion` 和 `skinId`,当前只开放 `classic`,后续皮肤库可在同一边界增加颜色、字体、圆角和组件密度包。
### 相关实现
- `backend/internal/service/appearance.go`:外观配置校验、公开投影、资源绑定与媒体类型校验。
- `backend/internal/handler/appearance.go`:公开读取、公开资源流和管理员读写/上传接口。
- `web/src/services/appearance-bootstrap.ts`:应用渲染前的公开外观解析与安全回退。
- `web/src/pages/admin/settings/appearance-settings-page.tsx`:外观管理、草稿预览与原子保存流程。
## 邮箱找回密码
登录页在密码字段标题行提供“忘记密码?”入口。已配置账户邮件服务时,本地密码账号可以通过绑定邮箱获取 6 位验证码,并在 10 分钟内设置新密码;发送接口对存在和不存在的邮箱返回相同结果,避免公开账号状态。

View File

@@ -5,6 +5,21 @@ description: 影策已实现功能的手工验证清单与未确认边界
# 待测试
## 平台外观管理
管理后台已新增“系统配置 → 外观管理”,并让公开品牌配置在应用渲染前完成解析;以下真实浏览器与媒体场景需要持续确认:
- [x] 后端专项与全量测试通过,覆盖内置默认值、管理员权限、资源类型/归属、公开 URL 不泄漏资源 ID、媒体字节嗅探、删除保护与路由注册。
- [x] 前端专项测试、后台回归测试、TypeScript 检查和生产构建通过,覆盖初始 HTML 品牌中立、自定义视频不回退内置封面、不安全 URL 回退、单 Logo 深浅主题复用、双 Logo 主题选择、外框关闭与登录场景固定使用深色 Logo。
- [ ] 使用管理员账号依次保存品牌名、英文品牌标识、登录页标题/说明、浅色 PNG/WebP Logo、可选深色 Logo、外框开关、MP4/WebM 视频与封面,确认工作台和登录页立即更新,刷新后保持一致。
- [ ] 分别只上传浅色 Logo、只上传深色 Logo、同时上传两套 Logo,并切换浅色/深色主题,确认单图自动复用、双图按主题选择;开启“禁用 Logo 后面的圆角矩形外框”后确认工作台和管理后台导航只显示等比放大到原外框可用区域的 Logo,布局不跳动。
- [ ] 在“对象存储”中点击“使用品牌标识”,确认只更新当前路径前缀草稿;未点击或未保存时保留服务端已有前缀,历史资源读取不受影响。
- [ ] 保存一套自定义品牌后点击“恢复影策默认”,确认品牌名称、英文标识、Logo、登录页文案和媒体立即恢复内置值,自定义素材文件仍保留在存储资源中。
- [ ] 清空浏览器缓存并以慢速网络打开 `/login`、`/register` 和 `/forgot-password`,确认加载阶段不出现内置品牌名、Logo、favicon 或视频封面闪烁。
- [ ] 更换品牌视频但不上传封面,确认首帧出现前只显示中性深色背景;再配置封面,确认只显示当前自定义封面。
- [ ] 在存储资源页尝试删除当前浅色 Logo、深色 Logo、视频和封面,确认显示“外观”引用并保留文件;解除绑定后可正常删除。
- [ ] 将公开配置接口模拟为超时或 5xx,确认 4 秒内结束等待并完整回退内置外观,应用仍可进入。
## 画布导入同步、素材回收站与历史
- [x] 画布压缩包导入会先校验媒体完整性,并统一通过远端同步入口上传资源;失败时保持脏状态和自动重试,不再把浏览器本地 storage key 误报为已同步。

View File

@@ -1140,3 +1140,15 @@
- 验证结果:八个目标源码/样式/记录文件通过定向 Prettier;全量 `npx tsc --noEmit` 为 0 错误;Vite 8.1.5 生产构建成功转换 12,695 个模块并在约 4.63 秒完成,仅保留项目既有的大分块提示。使用现有已登录 Chrome 会话访问当前源码开发服务;账号真实项目数为 0,未创建或修改测试项目。五个详情 URL 均以不存在项目做只读错误态检查,稳定显示“项目不可用”和返回操作;亮色与暗色分别覆盖 1280×800、1440×900、1920×1080 三档真实 CSS 视口,文档和 main 横向溢出均为 0,错误表面宽 760px,亮色为 `rgb(255,255,255)`、暗色为 `rgb(26,29,32)`。有数据态、归档态、章节编辑态和五页业务动作因真实账号无项目且禁止写业务数据,以完整 JSX/CSS 结构检查、历史状态机核对、全量类型和生产构建作为验证边界;没有伪造接口或业务记录。控制台仅出现批次 132 已记录的 Ant `App cssVar` 与 `Modal maskClosable` 既有警告,没有本批运行错误。
- 潜在影响:项目详情首屏增加约 76~86px 当前视图身份层,章节编辑区可用高度相应减少但仍由单一 flex 区域内部滚动;设置和资产页新增一级表面与细边界,1920px 下内容不再无限拉伸。顶部项目状态与当前 view 更醒目,页面 h1→h2→说明顺序稳定。接口请求、业务状态、路由、数据、权限和移动端均不变。
- 逐项回滚:修改前八个原件、SHA-256、校验文件和恢复步骤位于 `.local/ui-change-backups/batch-133/MANIFEST.md` 与 `MANIFEST.sha256`。回滚前先保留后续修改,再按原相对路径逐项恢复并运行 `shasum -a 256 -c MANIFEST.sha256`;完整回滚最后恢复本记录。不需要初始化、提交或依赖 Git。
## 批次 134:外观管理 Logo 外框开关与无框尺寸统一
- 日期时间:2026-09-02 17:04:34 +0800
- 目的:修复“禁用 Logo 后面的圆角矩形外框”复选框与后台现有布尔设置视觉不一致的问题,并让关闭外框后的品牌 Logo 等比放大到原外框可用区域;保持原导航占位、深浅 Logo 选择、品牌加载时序、接口和保存方式不变。
- 修改前状况:外观管理单独使用 Ant Checkbox,而登录注册、功能开放等后台布尔设置已经统一使用主题化 Ant Switch;页面只给 Checkbox 外层文字加样式,控件自身状态与其他模块不一致。关闭外框仅清除容器背景、边框、圆角和阴影,实际 Logo 仍保持 `size-5`,因此在 32~38px 导航容器内显得偏小;44px 预览容器也仍固定显示 28px Logo。
- 涉及文件:`web/src/pages/admin/settings/appearance-settings-page.tsx`、`web/src/styles/admin-ui.css`、`web/src/styles/globals.css`、`web/test/appearance-bootstrap.test.ts`、`docs/content/docs/overview/features.mdx`、`docs/content/docs/progress/pending-test.mdx`、`docs/design/admin-ui-change-log.md`。未修改后端、外观 schema、API、数据库、上传与重置逻辑、导航容器尺寸或操作人现有品牌配置。
- 具体改动:外框选项复用后台已有 Ant Switch 和集中主题 token,采用“说明文案 + 当前状态文字 + 右侧开关”的现有设置行方向,开启表示禁用外框,`checked` 与 `logoFrameEnabled` 继续按反向关系转换;补充 `aria-label` 和说明关联。关闭外框时,共享 `BrandLogoFrame` 的直接图片或 SVG 子元素宽高提升到容器 `100%`,继续由 `object-fit: contain` 等比适配,因此工作台 32px、管理后台 32~38px 及折叠态均复用各自原容器,不发生布局跳动;深浅模式预览同步由 28px 放大到完整 44px 可用区域。窄屏选项行改为上下排列,状态与开关仍保持两端对齐。
- 修改前基线:`appearance-settings-page.tsx` 为 `a9e133fb76e046b8775f284279f054e78d86fda8f1bfa08f73bb54a9c9c82447`,`admin-ui.css` 为 `c0fa61947300287f059ae3b0f987d685c4ab9b52f620923ee8f8713d0dbdcd88`,`globals.css` 为 `7c6cdba67750029ee959055a8d70e013c0cadfd05aaaf7dd398b42ea6f83ac48`,`appearance-bootstrap.test.ts` 为 `23f02b574541bd09c31785bf72d80d9968f9d14e70a7cfc6ecf643dcc7866ff9`,两份功能文档分别为 `7d7b0b46252a9c7a9787d99e7b6018b14ef8df189f7a0332f66f00804d89f537` 与 `4d58b9eb3db6110c30e12a6e41d371c6680fd51655bd11525c679b7cf03fbf10`;原件保存在 `.local/ui-change-backups/batch-134/`。
- 验证结果:目标文件定向 Prettier 与 `git diff --check` 通过;固定 Bun 1.3.13、提交的 `bun.lock` 和干净依赖环境运行外观、后台、对象存储与找回密码四组专项测试,23 项全部通过、194 个断言无失败,TypeScript `tsc --noEmit` 为 0 错误。生产 Docker 多阶段构建转换 13,499 个模块并成功生成镜像,只保留项目既有的大分块提示。独立前端烟测返回 200,确认初始 HTML 不含内置品牌与 `/logo.svg`,新尺寸选择器已进入打包 CSS;真实管理员页面的深浅主题截图仍按 `docs/content/docs/progress/pending-test.mdx` 保留为人工验证项,不伪造登录态或业务配置。
- 潜在影响:关闭外框后,宽或高较小、透明留白较多的 Logo 会在原容器范围内明显变大,但仍保持自身比例且不会溢出;如素材文件本身带有透明边距,视觉内容不会强制裁切到满边。开关仍属于外观页面草稿,需要点击原有“保存修改”才写入服务端;没有改成即时保存。
- 逐项回滚:先使用 `.local/ui-change-backups/batch-134/` 中对应原件逐项恢复本批六个源码/文档文件,再恢复本台账并执行其 `MANIFEST.sha256` 校验;恢复前如文件已包含后续批次,先复制当前版本。本批不依赖 Git 历史做本地回滚。