feat: 电商页面 KeepAlive 保活机制,切换页面不再丢失生成状态
通过 display:none 模式实现轻量 KeepAlive,电商页面首次访问后保持挂载, 切换到其他页面再切回时所有右侧面板状态(上传图片、生成进度、结果)完整保留。 同时清理项目中的临时文件和本地冗余图片。 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
import { useCallback, useRef, useState } from "react";
|
||||
|
||||
export type GenStatus = "idle" | "ready" | "generating" | "done" | "failed";
|
||||
|
||||
export interface UseGenerationStatusReturn {
|
||||
status: GenStatus;
|
||||
error: string | null;
|
||||
abortRef: { current: boolean };
|
||||
start: () => void;
|
||||
succeed: () => void;
|
||||
fail: (msg: string) => void;
|
||||
reset: () => void;
|
||||
cancel: () => void;
|
||||
isGenerating: boolean;
|
||||
isFailed: boolean;
|
||||
isIdle: boolean;
|
||||
}
|
||||
|
||||
export function useGenerationStatus(): UseGenerationStatusReturn {
|
||||
const [status, setStatus] = useState<GenStatus>("idle");
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const abortRef = useRef({ current: false });
|
||||
|
||||
const start = useCallback(() => {
|
||||
setStatus("generating");
|
||||
setError(null);
|
||||
abortRef.current = { current: false };
|
||||
}, []);
|
||||
|
||||
const succeed = useCallback(() => setStatus("done"), []);
|
||||
const fail = useCallback((msg: string) => { setStatus("failed"); setError(msg); }, []);
|
||||
const reset = useCallback(() => { setStatus("idle"); setError(null); }, []);
|
||||
const cancel = useCallback(() => { abortRef.current.current = true; }, []);
|
||||
|
||||
return {
|
||||
status, error, abortRef, start, succeed, fail, reset, cancel,
|
||||
isGenerating: status === "generating",
|
||||
isFailed: status === "failed",
|
||||
isIdle: status === "idle",
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user