feat: 添加分析进度提示

- 显示当前分析步骤:调用服务/调用AI/生成结果
- 提升用户体验,便于定位问题

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jowe
2026-03-28 10:00:43 +08:00
parent 72eba93f55
commit 3072815881

View File

@@ -13,6 +13,7 @@ export function FormPage({ onSubmit, onBack }: FormPageProps) {
const [gender, setGender] = useState<'male' | 'female'>('male'); const [gender, setGender] = useState<'male' | 'female'>('male');
const [birthPlace, setBirthPlace] = useState(''); const [birthPlace, setBirthPlace] = useState('');
const [isAnalyzing, setIsAnalyzing] = useState(false); const [isAnalyzing, setIsAnalyzing] = useState(false);
const [analyzeStep, setAnalyzeStep] = useState('');
const [errorMessage, setErrorMessage] = useState(''); const [errorMessage, setErrorMessage] = useState('');
const handleSubmit = async (e: React.FormEvent) => { const handleSubmit = async (e: React.FormEvent) => {
@@ -21,6 +22,7 @@ export function FormPage({ onSubmit, onBack }: FormPageProps) {
setIsAnalyzing(true); setIsAnalyzing(true);
setErrorMessage(''); setErrorMessage('');
setAnalyzeStep('正在调用分析服务...');
const input: UserInput = { const input: UserInput = {
birthDate, birthDate,
@@ -30,7 +32,9 @@ export function FormPage({ onSubmit, onBack }: FormPageProps) {
}; };
try { try {
setAnalyzeStep('正在调用 AI 模型分析...');
const result = await requestFortuneAnalysis(input); const result = await requestFortuneAnalysis(input);
setAnalyzeStep('正在生成分析结果...');
onSubmit(input, result); onSubmit(input, result);
} catch (error) { } catch (error) {
setErrorMessage( setErrorMessage(
@@ -38,6 +42,7 @@ export function FormPage({ onSubmit, onBack }: FormPageProps) {
); );
} finally { } finally {
setIsAnalyzing(false); setIsAnalyzing(false);
setAnalyzeStep('');
} }
}; };
@@ -161,7 +166,7 @@ export function FormPage({ onSubmit, onBack }: FormPageProps) {
{isAnalyzing ? ( {isAnalyzing ? (
<span className="loading-state"> <span className="loading-state">
<span className="loading-dot"></span> <span className="loading-dot"></span>
... {analyzeStep || '分析中...'}
</span> </span>
) : ( ) : (
'开始分析' '开始分析'