feat(canvas): 自由画布 - 增强空白起点、外观设置与节点连接体验 (#356)

This commit is contained in:
vv-get-ti
2026-08-31 06:49:43 +08:00
committed by GitHub
parent cc4aa736ff
commit 151e99f8d9
22 changed files with 925 additions and 113 deletions

View File

@@ -14,6 +14,34 @@ description: 影策已实现功能的手工验证清单与未确认边界
- [ ] 在存在图片、视频和文本长任务时发送 SIGTERM,确认 readiness 立即返回 503、新任务被拒绝、已领取任务在宽限期内完成,超时后租约可由重启实例恢复。
- [ ] 构建带版本参数的前后端镜像,确认 `/api/system/version`、管理后台版本、OCI Commit 和 Release Tag 一致。
## 自由空白画布与画布外观
- [x] 新建画布引导新增“自由空白画布”主入口;进入后显示中央空白起始框和加号,不创建占位节点。
- [x] 中央加号复用底部工具栏的添加命令,当前浏览器已确认文本、绘图、分镜、背板、文件夹、图片、视频、导演台、音频、工作流、上传文件和素材库入口完整显示。
- [x] 自由起点按画布持久化,当前浏览器刷新后仍停留在自由空白起始框;浅色、深色两种主题已完成常规桌面尺寸验收。
- [x] 浅色画布固定为 `#EDEEEE`,深色画布固定为中性灰 `#262626`;原项目的节点、起始框、工具浮层、边框和阴影颜色保持不变。
- [x] 画布外观增加“自定义”主题,可调整背景颜色、背景明亮度、网格颜色和网格强度;不开放节点、工具浮层、边框和阴影任意改色。
- [x] 自定义主题增加“浅色界面/深色界面”,复用原项目对应的节点和工具浮层样式;切换界面样式不覆盖自定义画布和网格颜色。
- [x] 原“网格透明度”改名为“网格强度”,保持 `0%` 最淡、`100%` 最明显。
- [x] 颜色选择器与合法的 `#RRGGBB` 输入实时写入当前画布;点击面板外只关闭面板,不撤销刚才的颜色。
- [x] HEX 输入支持三位/六位、可带或不带 `#`;输入编辑不会被父级状态覆盖,选择新背景色时明亮度归零以精确显示输入色。
- [x] 删除背景透明度控件并忽略旧存储字段;背景明亮度改为沿 OKLCH 亮度轴调整,`0%` 精确保留输入色码。
- [x] 自定义主题继承进入前的浅色或深色基础界面;同一基础主题可以恢复上次自定义配置,跨深浅主题则重新继承。
- [x] 第一次进入或重置自定义主题时,明亮度默认为 `0%`、网格颜色默认为 `#B6B3B3`、网格强度默认为 `70%`;已有用户保存值不被覆盖。
- [x] 当前画布外观随画布项目保存;“保存为默认”写入当前浏览器并按账号 scope 隔离,不跨设备同步。
- [x] 深色点阵和线稿网格同步调整为 `rgba(205,205,205,0.28)`,浅色网格与网格图层渲染透明度保持既有值,并有专项回归断言。
- [x] 自由空白画布与外观专项自动化测试通过,前端生产构建通过。
- [ ] 在用户当前登录的 Edge 中验收颜色选择器、十六进制输入、明亮度调节、深浅主题继承和本机账号默认值。
- [ ] 在窄屏和触屏尺寸检查三张起始卡、中央起始框、加号菜单的换行、滚动与点击目标;确认菜单不遮挡底部工具栏。
- [ ] 由产品验收浅色/深色固定底色,以及原节点和工具浮层恢复后的最终视觉观感。
- [ ] 从自由起点分别新建每种内置节点和插件节点,并从上传、素材库各导入一次素材,确认第一个节点创建后起始框消失且刷新后节点数据不丢失。
## 画布拖线创建节点落点
- [x] 从普通节点连接端拖到空白处创建节点时,松手点改为新节点靠近来源一侧的边缘中点;单击快捷创建和批量连接仍保留原布局。位置计算与批量连接专项测试、TypeScript 检查和前端生产构建通过。
- [ ] 分别从节点右侧输出端和左侧输入端拖线创建图片、视频、文本与音频节点,确认新节点向松手点外侧展开,连线落在边缘中点且不会回头遮挡拖线区域。
- [ ] 单击连接加号创建节点,确认仍自动放在相邻位置并保留 96px 间距;使用批量连接创建节点,确认原有落点和连接关系不变。
## 素材库网格密度
- [x] 素材库桌面端缩小卡片并改为每行 6 张;新增素材占首格,默认每页 35 项,可切换 70/105 项,首屏正好组成 6×6 完整网格;中窄屏按 4/3/1 列收敛,前端生产构建通过。