From b88f9aaf03cd5afddfc289e4bc6c01403874ed74 Mon Sep 17 00:00:00 2001 From: Gmaker689 <1711322114@qq.com> Date: Mon, 25 May 2026 21:02:03 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E9=A6=96=E9=A1=B5=E5=B1=95=E7=A4=BA?= =?UTF-8?q?=E6=9C=80=E8=BF=91=E7=94=9F=E6=88=90=E7=9A=84=E7=B4=A0=E6=9D=90?= =?UTF-8?q?=E7=94=BB=E5=BB=8A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 后端新增 GET /api/v1/assets 接口，返回已完成任务的素材列表（按创建时间倒序） - 前端新增 AssetGallery 组件，网格展示素材缩略图、类型标签和提示词 - HomePage 中工程列表上方展示最近生成素材 --- backend/cmd/main.go | 1 + backend/internal/handler/generate.go | 52 ++++++++++++ frontend/src/api/generate.ts | 5 ++ frontend/src/api/types.ts | 11 +++ frontend/src/components/AssetGallery.tsx | 100 +++++++++++++++++++++++ frontend/src/pages/HomePage.tsx | 3 + 6 files changed, 172 insertions(+) create mode 100644 frontend/src/components/AssetGallery.tsx diff --git a/backend/cmd/main.go b/backend/cmd/main.go index 5d06703..71fea0a 100755 --- a/backend/cmd/main.go +++ b/backend/cmd/main.go @@ -78,6 +78,7 @@ func main() { v1Auth.POST("/generate", handler.Generate) // 素材生成管线 v1Auth.GET("/tasks/:taskId", handler.GetTask) // 查询任务 v1Auth.GET("/tasks/:taskId/assets", handler.GetAssets) // 查询任务素材 + v1Auth.GET("/assets", handler.GetRecentAssets) // 首页最近素材 // 图片编辑 v1Auth.POST("/images/edit", handler.EditImage) // 图片编辑 } diff --git a/backend/internal/handler/generate.go b/backend/internal/handler/generate.go index db6c8c0..a2671fe 100755 --- a/backend/internal/handler/generate.go +++ b/backend/internal/handler/generate.go @@ -306,6 +306,58 @@ func getTaskDBID(ctx context.Context, taskID string) uint { return task.ID } +// RecentAssetItem 首页素材展示项。 +type RecentAssetItem struct { + Key string `json:"key"` + URL string `json:"url"` + Format string `json:"format"` + Prompt string `json:"prompt"` + AssetType string `json:"assetType"` + TaskID string `json:"taskId"` + CreatedAt string `json:"createdAt"` +} + +// GetRecentAssets 获取最近生成的素材列表（已完成任务的全部素材）。 +func GetRecentAssets(c *gin.Context) { + limit := 20 + + var dbRows []struct { + Key string + URL string + Format string + Prompt string + AssetType string + TaskID string + ProjectID uint + CreatedAt string + } + + db.GetDB().WithContext(c.Request.Context()). + Raw(`SELECT a.key, a.url, a.format, t.prompt, t.asset_type as asset_type, + t.external_id as task_id, t.project_id, t.created_at as created_at + FROM assets a + INNER JOIN tasks t ON a.task_id = t.id + WHERE t.status = 'completed' + ORDER BY a.created_at DESC + LIMIT ?`, limit). + Scan(&dbRows) + + result := make([]RecentAssetItem, len(dbRows)) + for i, r := range dbRows { + result[i] = RecentAssetItem{ + Key: r.Key, + URL: storageSvc.GetSignedURL(r.Key), + Format: r.Format, + Prompt: r.Prompt, + AssetType: r.AssetType, + TaskID: r.TaskID, + CreatedAt: r.CreatedAt, + } + } + + c.JSON(http.StatusOK, model.OK(result)) +} + // toTaskResponse 转换任务响应格式。 func toTaskResponse(task *model.Task) model.TaskResponse { return model.TaskResponse{ diff --git a/frontend/src/api/generate.ts b/frontend/src/api/generate.ts index 65e2e47..cf369e0 100755 --- a/frontend/src/api/generate.ts +++ b/frontend/src/api/generate.ts @@ -1,4 +1,9 @@ import { post, get } from './client' +import type { RecentAssetItem } from './types' + +export async function getRecentAssets(): Promise { + return get('/api/v1/assets') +} import type { Asset, AssetsResponse, diff --git a/frontend/src/api/types.ts b/frontend/src/api/types.ts index daad4c4..a4d22a5 100755 --- a/frontend/src/api/types.ts +++ b/frontend/src/api/types.ts @@ -98,6 +98,17 @@ export interface Asset { index: number } +// 首页最近素材 +export interface RecentAssetItem { + key: string + url: string + format: string + prompt: string + assetType: string + taskId: string + createdAt: string +} + // 生成请求 — 对应 POST /api/v1/generate export interface GenerateRequest { projectId: string diff --git a/frontend/src/components/AssetGallery.tsx b/frontend/src/components/AssetGallery.tsx new file mode 100644 index 0000000..87b45e9 --- /dev/null +++ b/frontend/src/components/AssetGallery.tsx @@ -0,0 +1,100 @@ +import { useEffect, useState } from 'react' +import { getRecentAssets } from '../api/generate' +import type { RecentAssetItem } from '../api/types' + +const ASSET_TYPE_LABELS: Record = { + sprite: '精灵', + background: '背景', + ui: 'UI', + animation: '动画', +} + +export default function AssetGallery() { + const [assets, setAssets] = useState([]) + const [loading, setLoading] = useState(true) + + useEffect(() => { + getRecentAssets() + .then(setAssets) + .catch(() => {}) + .finally(() => setLoading(false)) + }, []) + + if (loading) return null + + if (assets.length === 0) return null + + return ( +
+

最近生成

+
+ {assets.map((item, i) => ( +
{ + // navigate to result page — need projectId for URL + // For now just open the image + }} + > +
+ {item.prompt} +
+
+ + {ASSET_TYPE_LABELS[item.assetType] || item.assetType} + +
+

+ {item.prompt} +

+
+ ))} +
+
+ ) +} diff --git a/frontend/src/pages/HomePage.tsx b/frontend/src/pages/HomePage.tsx index 7db0daf..4c647d2 100644 --- a/frontend/src/pages/HomePage.tsx +++ b/frontend/src/pages/HomePage.tsx @@ -2,6 +2,7 @@ import { useEffect, useState } from 'react' import { useProjectListStore } from '../stores/projectList' import { useToastStore } from '../stores/toast' import ProjectCard from '../components/ProjectCard' +import AssetGallery from '../components/AssetGallery' import CreateProjectModal from '../components/CreateProjectModal' import EmptyState from '../components/EmptyState' import Skeleton from '../components/Skeleton' @@ -39,6 +40,8 @@ export default function HomePage() { return (
+ +

我的工程