feat(ux): Toast 通知系统,替换内联错误/成功提示

新增 toast store 和 Toast 组件,风格保存成功/失败显示 toast,
素材生成失败显示 toast,Layout 中全局渲染。
This commit is contained in:
2026-05-24 21:26:19 +08:00
parent aaf846a60d
commit e880a80c51
6 changed files with 153 additions and 0 deletions
+9
View File
@@ -2,6 +2,7 @@ import { useEffect } from 'react'
import { useNavigate, useParams } from 'react-router-dom'
import { useTaskStore } from '../stores/task'
import { useGenerationStore } from '../stores/generation'
import { useToastStore } from '../stores/toast'
import GenerateForm from '../components/GenerateForm'
import ProgressBar from '../components/ProgressBar'
@@ -9,6 +10,7 @@ export default function GeneratePage() {
const { projectId = 'proj-default' } = useParams()
const navigate = useNavigate()
const { assetType, reset: resetTask } = useTaskStore()
const addToast = useToastStore(s => s.addToast)
const {
status,
stage,
@@ -25,6 +27,13 @@ export default function GeneratePage() {
return () => resetGeneration()
}, [resetGeneration])
// 失败时显示 toast
useEffect(() => {
if (status === 'failed') {
addToast({ type: 'error', message: '素材生成失败,请重试' })
}
}, [status, addToast])
// 完成后自动跳转
useEffect(() => {
if (status === 'completed' && taskId) {