复用平台按钮收口生成提交

编辑器生成输入框提交按钮改为 PlatformActionButton。

保留生成器局部尺寸和浅灰覆盖,删除重复原生 submit 基础样式。

补充测试覆盖生成按钮平台按钮 class,并更新 TRACKING。
This commit is contained in:
2026-06-14 14:35:07 +08:00
parent 3f7b0674c0
commit 8157622718
4 changed files with 15 additions and 5 deletions

View File

@@ -96,3 +96,4 @@
- 2026-06-14 组件复用修正:项目卡片预览改为复用 `PlatformMediaFrame`,删除项目页局部预览框比例、图片填充和背景样式;验证命令:`npm run test -- src/components/project/ProjectGalleryView.test.tsx src/components/common/PlatformMediaFrame.test.tsx``npm run typecheck``npm run check:encoding``git diff --check` - 2026-06-14 组件复用修正:项目卡片预览改为复用 `PlatformMediaFrame`,删除项目页局部预览框比例、图片填充和背景样式;验证命令:`npm run test -- src/components/project/ProjectGalleryView.test.tsx src/components/common/PlatformMediaFrame.test.tsx``npm run typecheck``npm run check:encoding``git diff --check`
- 2026-06-14 素材库与画布持久化修正:新增 `editor_asset_folder` / `editor_asset` 账号级素材库表、SpacetimeDB procedure、spacetime-client facade 和 api-server `/api/editor/assets*` BFF编辑器接入文件夹新建 / 折叠 / 重命名 / 删除、素材重命名 / 删除、多文件上传、拖拽定向上传、拖入画布生成图层、素材框选批量删除、图层打组、小地图拖拽、普通滚轮纵向滚动与 Ctrl/Cmd 滚轮缩放。验证命令:`npm run spacetime:generate -- --rust-only``npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/services/image-editor/editorProjectClient.test.ts``npm run typecheck``npm run check:spacetime-schema``npm run check:encoding``cargo check -p spacetime-client -p api-server --manifest-path server-rs/Cargo.toml``git diff --check` - 2026-06-14 素材库与画布持久化修正:新增 `editor_asset_folder` / `editor_asset` 账号级素材库表、SpacetimeDB procedure、spacetime-client facade 和 api-server `/api/editor/assets*` BFF编辑器接入文件夹新建 / 折叠 / 重命名 / 删除、素材重命名 / 删除、多文件上传、拖拽定向上传、拖入画布生成图层、素材框选批量删除、图层打组、小地图拖拽、普通滚轮纵向滚动与 Ctrl/Cmd 滚轮缩放。验证命令:`npm run spacetime:generate -- --rust-only``npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/services/image-editor/editorProjectClient.test.ts``npm run typecheck``npm run check:spacetime-schema``npm run check:encoding``cargo check -p spacetime-client -p api-server --manifest-path server-rs/Cargo.toml``git diff --check`
- 2026-06-14 组件复用修正:编辑器 `EditorIconButton` 改为委托 `PlatformIconButton` 的薄包装,保留编辑器局部 class 与调用方式,但不再维护重复的原生图标按钮可访问性和基础 chrome验证命令`npm run test -- src/components/image-editor/ImageCanvasEditorPrimitives.test.tsx src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/PlatformIconButton.test.tsx``npm run typecheck` - 2026-06-14 组件复用修正:编辑器 `EditorIconButton` 改为委托 `PlatformIconButton` 的薄包装,保留编辑器局部 class 与调用方式,但不再维护重复的原生图标按钮可访问性和基础 chrome验证命令`npm run test -- src/components/image-editor/ImageCanvasEditorPrimitives.test.tsx src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/PlatformIconButton.test.tsx``npm run typecheck`
- 2026-06-14 组件复用修正:编辑器生成输入框的提交按钮改为复用 `PlatformActionButton`,仅保留生成器局部尺寸和 Lovart 式浅灰覆盖,不再直接维护原生 submit 按钮基础 chrome验证命令`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/PlatformActionButton.test.tsx``npm run typecheck`

View File

@@ -733,6 +733,12 @@ describe('ImageCanvasEditorView', () => {
expect(within(generateDialog).getByText('参考图')).toBeTruthy(); expect(within(generateDialog).getByText('参考图')).toBeTruthy();
expect(within(generateDialog).getByRole('button', { name: '生成比例 1:1 2k 1张' })).toBeTruthy(); expect(within(generateDialog).getByRole('button', { name: '生成比例 1:1 2k 1张' })).toBeTruthy();
expect(within(generateDialog).getByRole('button', { name: '生成模型 GPT Image' })).toBeTruthy(); expect(within(generateDialog).getByRole('button', { name: '生成模型 GPT Image' })).toBeTruthy();
expect(within(generateDialog).getByRole('button', { name: '生成' }).className).toContain(
'platform-button',
);
expect(within(generateDialog).getByRole('button', { name: '生成' }).className).toContain(
'image-canvas-editor__generation-submit',
);
expect(screen.queryByRole('toolbar', { name: 'AI画布工具栏' })).toBeNull(); expect(screen.queryByRole('toolbar', { name: 'AI画布工具栏' })).toBeNull();
fireEvent.change(screen.getByLabelText('生成提示词'), { fireEvent.change(screen.getByLabelText('生成提示词'), {

View File

@@ -2839,14 +2839,17 @@ export function ImageCanvasEditorView() {
GPT Im... GPT Im...
<ChevronDown className="h-3 w-3" /> <ChevronDown className="h-3 w-3" />
</button> </button>
<button <PlatformActionButton
type="submit" type="submit"
tone="secondary"
size="xs"
shape="pill"
className="image-canvas-editor__generation-submit" className="image-canvas-editor__generation-submit"
disabled={generateDialog.status === 'generating'} disabled={generateDialog.status === 'generating'}
aria-label="生成" aria-label="生成"
> >
{generateDialog.status === 'generating' ? '生成中' : '12'} {generateDialog.status === 'generating' ? '生成中' : '12'}
</button> </PlatformActionButton>
</div> </div>
{generateDialog.status === 'generating' ? ( {generateDialog.status === 'generating' ? (
<PlatformStatusMessage <PlatformStatusMessage

View File

@@ -4092,7 +4092,6 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
.image-canvas-editor__generation-ratio, .image-canvas-editor__generation-ratio,
.image-canvas-editor__generation-model, .image-canvas-editor__generation-model,
.image-canvas-editor__generation-submit,
.image-canvas-editor__generation-close { .image-canvas-editor__generation-close {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@@ -4120,10 +4119,11 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
.image-canvas-editor__generation-submit { .image-canvas-editor__generation-submit {
min-width: 3.55rem; min-width: 3.55rem;
height: 2.55rem; height: 2.55rem;
gap: 0.15rem; border: 0;
border-radius: 999px;
background: #f0f0f0; background: #f0f0f0;
color: #b6b6b6; color: #b6b6b6;
font-size: 0.82rem;
font-weight: 800;
} }
.image-canvas-editor__generation-submit:not(:disabled) { .image-canvas-editor__generation-submit:not(:disabled) {