xiaoxia/xiaoxia-saas
1
0
Fork 0
Code Issues 9 Pull Requests 2 Actions Packages Projects Releases 7 Wiki Activity

feat: 封面模板对接后端 CRUD API，移除 mock 数据 #1324

Closed
xiaoxia wants to merge 1 commits from feat/cover-templates-api-integration into develop
pull from: feat/cover-templates-api-integration
merge into: xiaoxia:develop
Conversation 6 Commits 1 Files Changed 5
+196 -72
xiaoxia commented 2026-08-09 17:07:00 +08:00
Owner
Copy Link
Copy Source

改动内容

将封面模板数据从前端硬编码（MOCK_COVER_TEMPLATES）替换为调用后端真实 API。

新增

  • api/cover-templates.ts — 封装 GET/POST/PUT/DELETE /api/v1/cover-templates

修改

  • useStep6Cover.ts — 弹窗打开时 fetch 模板列表，CRUD 操作走 API，增加 loading/error 状态
  • CoverSettingsModal.tsx — 增加 loading/error 状态展示 + 删除按钮（仅非系统模板显示）
  • Step6CoverSettings.tsx — 透传 loading/error/delete 属性
  • constants.ts — 删除 MOCK_COVER_TEMPLATES 硬编码数据（8 个模板）

依赖

  • 需要后端 PR #1323 合并并部署 staging 后，API 可用
  • 响应格式：{ items: CoverTemplate[], total: number }
## 改动内容 将封面模板数据从前端硬编码（MOCK_COVER_TEMPLATES）替换为调用后端真实 API。 ### 新增 - `api/cover-templates.ts` — 封装 GET/POST/PUT/DELETE /api/v1/cover-templates ### 修改 - `useStep6Cover.ts` — 弹窗打开时 fetch 模板列表，CRUD 操作走 API，增加 loading/error 状态 - `CoverSettingsModal.tsx` — 增加 loading/error 状态展示 + 删除按钮（仅非系统模板显示） - `Step6CoverSettings.tsx` — 透传 loading/error/delete 属性 - `constants.ts` — 删除 MOCK_COVER_TEMPLATES 硬编码数据（8 个模板） ### 依赖 - 需要后端 PR #1323 合并并部署 staging 后，API 可用 - 响应格式：`{ items: CoverTemplate[], total: number }`
xiaoxia added the frontendfeature labels 2026-08-09 17:07:00 +08:00
xiaoxia added 1 commit 2026-08-09 17:07:00 +08:00
feat: 封面模板对接后端 CRUD API，移除 mock 数据
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Successful in 45s
Details
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 50s
Details
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Successful in 52s
Details
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
Details
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 1m9s
Details
CI/CD Pipeline / PR Build API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been skipped
Details
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 1m34s
Details
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
Details
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
Details
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 51s
Details
CI/CD Pipeline / Frontend Unit Tests (pull_request) Successful in 19s
Details
AI Code Review / AI Code Review (pull_request) Failing after 1m54s
Details
PR Automation / Auto Approve on CI Green (pull_request) Successful in 1m52s
Details
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m23s
Details
CI/CD Pipeline / Validate - Code Quality (pull_request) Successful in 3m45s
Details
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
Details
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
Details
CI/CD Pipeline / Canary Release to Production (pull_request) Has been skipped
Details
CI/CD Pipeline / CI Gate (pull_request) Successful in 6s
Details
ACR Cleanup / ACR Image Cleanup (pull_request_target) Successful in 44s
Details
Preview Cleanup / Cleanup Preview Environment (pull_request) Successful in 1m15s
Details
c2e2a16ed8 
- 新增 api/cover-templates.ts：封装 GET/POST/PUT/DELETE /cover-templates
- useStep6Cover.ts：弹窗打开时 fetch 模板列表，CRUD 操作走 API
- CoverSettingsModal.tsx：增加 loading/error 状态展示 + 删除按钮（非系统模板）
- Step6CoverSettings.tsx：透传 loading/error/delete 属性
- constants.ts：删除 MOCK_COVER_TEMPLATES 硬编码数据
gitea-actions bot commented 2026-08-09 17:09:18 +08:00
Copy Link
Copy Source

🚀 预览环境已部署

项目 详情
PR号 #1324
预览链接 https://pr-1324.preview.xiaoxiajianji.com
API环境 staging

💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。

🔄 每次提交新代码后预览环境会自动更新。

🗑️ PR 关闭或合并后，预览环境会自动清理。

🚀 **预览环境已部署** | 项目 | 详情 | |------|------| | PR号 | #1324 | | 预览链接 | [https://pr-1324.preview.xiaoxiajianji.com](https://pr-1324.preview.xiaoxiajianji.com) | | API环境 | staging | > 💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。 > > 🔄 每次提交新代码后预览环境会自动更新。 > > 🗑️ PR 关闭或合并后，预览环境会自动清理。
auto-approve-bot commented 2026-08-09 17:09:43 +08:00
Collaborator
Copy Link
Copy Source

【阻塞级判定】

  • 是否存在阻塞级问题：是
  • 阻塞级问题数量：2 个

📊 审查概览

  • 整体评价：需修改
  • 建议级问题数量：2 个

🔴 阻塞级问题（必须修复）

  1. [apps/web/src/pages/generate/hooks/useStep6Cover.ts: 101-125] 缺少用户感知的错误处理

    • 问题类型：逻辑bug
    • 问题描述：在 handleSaveTemplate 和 handleDeleteTemplate 函数中，try...catch 块仅捕获了错误并输出到控制台（console.error），未将错误状态传递给 UI 层。这意味着当 API 请求失败时，用户界面没有任何错误提示，用户会误以为操作成功，导致数据状态与用户认知不一致。
    • 修改建议：应类似 loadTemplates 那样，引入 saveError 或 deleteError 状态，或者在 catch 块中使用 Toast/Alert 组件向用户展示具体的错误信息，确保用户感知到操作失败。

  2. [apps/web/src/pages/generate/hooks/useStep6Cover.ts: 120-123] 删除模板后的回退 ID 硬编码风险

    • 问题类型：逻辑bug
    • 问题描述：当用户删除当前选中的模板时，代码强制将 selectedTemplateId 重置为 "default"。由于代码已从 Mock 数据迁移到真实 API，后端的模板列表中并不一定包含 ID 为 "default" 的模板。如果该 ID 不存在，会导致后续逻辑（如获取 selectedTemplateName）回退到默认值，但实际配置可能丢失或指向一个不存在的模板，导致功能异常。
    • 修改建议：不应硬编码 "default"。应从 coverTemplates 中筛选出第一个可用的模板（例如第一个 is_system 为 true 的模板，或者列表中的第一个模板）作为回退选项；如果列表为空，则应清空选择或提示用户。

💡 改进建议（不阻塞合并）

  1. [apps/web/src/pages/generate/components/cover-settings/CoverSettingsModal.tsx: 77] 使用原生 confirm 阻塞主线程

    • 具体内容：使用了 window.confirm 进行删除确认，这会阻塞浏览器主线程，体验较差。建议替换为项目内的自定义 Modal 确认组件，保持 UI 风格统一且非阻塞。

  2. [apps/web/src/pages/generate/hooks/useStep6Cover.ts: 115-126] 缺少操作中的 Loading 状态保护

    • 具体内容：handleDeleteTemplate 和 handleSaveTemplate 是异步操作，但 Hook 中未提供 isDeleting 或 isSaving 状态。虽然 confirm 会阻塞删除操作，但保存操作没有防抖/Loading 保护，用户可能快速多次点击保存按钮，导致重复发送 API 请求。建议增加 Loading 状态并在按钮上禁用点击。

✅ 良好实践

  • API 层封装清晰，类型定义（CoverTemplateListResponse 等）完善。
  • useStep6Cover Hook 中使用 useCallback 和依赖数组优化了函数引用，避免不必要的子组件渲染。
  • CoverSettingsModal 中正确处理了 loading 和 error 的 UI 展示逻辑，且系统模板（is_system）正确屏蔽了删除按钮，逻辑严密。

🤖 由 AI 代码审查机器人自动生成 | 2026-08-09 09:09:43 | 模型:

### 【阻塞级判定】 - 是否存在阻塞级问题：是 - 阻塞级问题数量：2 个 ### 📊 审查概览 - 整体评价：需修改 - 建议级问题数量：2 个 ### 🔴 阻塞级问题（必须修复） 1. **[apps/web/src/pages/generate/hooks/useStep6Cover.ts: 101-125] 缺少用户感知的错误处理** - 问题类型：逻辑bug - 问题描述：在 `handleSaveTemplate` 和 `handleDeleteTemplate` 函数中，`try...catch` 块仅捕获了错误并输出到控制台（`console.error`），未将错误状态传递给 UI 层。这意味着当 API 请求失败时，用户界面没有任何错误提示，用户会误以为操作成功，导致数据状态与用户认知不一致。 - 修改建议：应类似 `loadTemplates` 那样，引入 `saveError` 或 `deleteError` 状态，或者在 catch 块中使用 Toast/Alert 组件向用户展示具体的错误信息，确保用户感知到操作失败。 2. **[apps/web/src/pages/generate/hooks/useStep6Cover.ts: 120-123] 删除模板后的回退 ID 硬编码风险** - 问题类型：逻辑bug - 问题描述：当用户删除当前选中的模板时，代码强制将 `selectedTemplateId` 重置为 `"default"`。由于代码已从 Mock 数据迁移到真实 API，后端的模板列表中并不一定包含 ID 为 `"default"` 的模板。如果该 ID 不存在，会导致后续逻辑（如获取 `selectedTemplateName`）回退到默认值，但实际配置可能丢失或指向一个不存在的模板，导致功能异常。 - 修改建议：不应硬编码 `"default"`。应从 `coverTemplates` 中筛选出第一个可用的模板（例如第一个 `is_system` 为 true 的模板，或者列表中的第一个模板）作为回退选项；如果列表为空，则应清空选择或提示用户。 ### 💡 改进建议（不阻塞合并） 1. **[apps/web/src/pages/generate/components/cover-settings/CoverSettingsModal.tsx: 77] 使用原生 confirm 阻塞主线程** - 具体内容：使用了 `window.confirm` 进行删除确认，这会阻塞浏览器主线程，体验较差。建议替换为项目内的自定义 Modal 确认组件，保持 UI 风格统一且非阻塞。 2. **[apps/web/src/pages/generate/hooks/useStep6Cover.ts: 115-126] 缺少操作中的 Loading 状态保护** - 具体内容：`handleDeleteTemplate` 和 `handleSaveTemplate` 是异步操作，但 Hook 中未提供 `isDeleting` 或 `isSaving` 状态。虽然 `confirm` 会阻塞删除操作，但保存操作没有防抖/Loading 保护，用户可能快速多次点击保存按钮，导致重复发送 API 请求。建议增加 Loading 状态并在按钮上禁用点击。 ### ✅ 良好实践 - API 层封装清晰，类型定义（`CoverTemplateListResponse` 等）完善。 - `useStep6Cover` Hook 中使用 `useCallback` 和依赖数组优化了函数引用，避免不必要的子组件渲染。 - `CoverSettingsModal` 中正确处理了 `loading` 和 `error` 的 UI 展示逻辑，且系统模板（`is_system`）正确屏蔽了删除按钮，逻辑严密。 --- <sub>🤖 由 AI 代码审查机器人自动生成 | 2026-08-09 09:09:43 | 模型: </sub> <!-- AI_CODE_REVIEW_AUTO_COMMENT -->
auto-approve-bot approved these changes 2026-08-09 17:09:44 +08:00
auto-approve-bot left a comment
Collaborator
Copy Link
Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。
auto-approve-bot approved these changes 2026-08-09 17:09:44 +08:00
auto-approve-bot left a comment
Collaborator
Copy Link
Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。
xiaoxia closed this pull request 2026-08-09 17:15:09 +08:00
xiaoxia commented 2026-08-09 17:15:10 +08:00
Author
Owner
Copy Link
Copy Source

✅ 已 squash merge 到 develop（commit 0de7ad3a）。CI 全绿后合并。

✅ 已 squash merge 到 develop（commit 0de7ad3a）。CI 全绿后合并。
gitea-actions bot commented 2026-08-09 17:16:24 +08:00
Copy Link
Copy Source

🗑️ 预览环境已清理

PR #1324 已关闭或合并，对应的预览环境已被清理。

如有需要，可以重新打开 PR 来重新生成预览环境。

🗑️ **预览环境已清理** PR #1324 已关闭或合并，对应的预览环境已被清理。 > 如有需要，可以重新打开 PR 来重新生成预览环境。
Some checks are pending
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Successful in 45s
Details
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 50s
Details
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Successful in 52s
Details
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
Details
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 1m9s
Details
CI/CD Pipeline / PR Build API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been skipped
Details
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 1m34s
Details
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
Details
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
Details
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 51s
Details
CI/CD Pipeline / Frontend Unit Tests (pull_request) Successful in 19s
Details
AI Code Review / AI Code Review (pull_request) Failing after 1m54s
Details
PR Automation / Auto Approve on CI Green (pull_request) Successful in 1m52s
Details
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m23s
Details
CI/CD Pipeline / Validate - Code Quality (pull_request) Successful in 3m45s
Details
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
Details
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
Details
CI/CD Pipeline / Canary Release to Production (pull_request) Has been skipped
Details
CI/CD Pipeline / CI Gate (pull_request) Successful in 6s
Details
ACR Cleanup / ACR Image Cleanup (pull_request_target) Successful in 44s
Details
Preview Cleanup / Cleanup Preview Environment (pull_request) Successful in 1m15s
Details

Pull request closed

Please reopen this pull request to perform a merge.
Sign in to join this conversation.
Reviewers
No Reviewers
auto-approve-bot
Labels
Clear labels
P0
阻塞性，必须立即处理
 P1
高优先级
 P2
中优先级
 P3
低优先级/后考虑
 architecture
架构设计
 backend
后端相关
 blocked
阻塞中
 bug
Bug修复
 ci-bug
CI本身的bug
 ci-optimization
CI优化类任务
 ci-pipeline
CI流水线/workflow相关
 cleanup
代码清理
 devops
运维/部署/CI
 documentation
文档相关
 feature
新功能
 frontend
前端相关
 question
需要讨论确认
 ready
PR CI通过，可合并
 refactor
代码重构
No Label feature frontend
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
auto-approve-bot xiaoxia
No Assignees
3 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: xiaoxia/xiaoxia-saas#1324
Delete Branch "feat/cover-templates-api-integration"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?