Novault/Novault-Frontend-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

-feat 修复json格式问题

Browse Source
This commit is contained in:
12975
2026-01-28 21:48:50 +08:00
parent e163fadd01
commit 303b4ed001
2 changed files with 161 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
src/components/home/DailyInsightCard/DailyInsightCard.tsx
View File

@@ -1,4 +1,3 @@
```typescript
import React, { useState, useEffect } from 'react';
import { Icon } from '@iconify/react';
import { formatCurrency } from '../../../utils/format';
@@ -26,7 +25,7 @@ export const DailyInsightCard: React.FC<DailyInsightCardProps> = ({
lastWeekSpend,
streakDays
}) => {
const [aiData, setAiData] = useState<{spending: string; budget: string} | null>(null);
const [aiData, setAiData] = useState<{ spending: string; budget: string } | null>(null);
const [isAiLoading, setIsAiLoading] = useState(false);
useEffect(() => {
@@ -34,31 +33,31 @@ export const DailyInsightCard: React.FC<DailyInsightCardProps> = ({
if (monthlyBudget === 0 && todaySpend === 0 && yesterdaySpend === 0) return;
const fetchAI = async () => {
setIsAiLoading(true);
try {
const today = new Date().getDate();
const daysInMonth = new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).getDate();
setIsAiLoading(true);
try {
const today = new Date().getDate();
const daysInMonth = new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).getDate();
const result = await getDailyInsight({
todaySpend,
yesterdaySpend,
monthlyBudget,
monthlySpent,
monthProgress: today / daysInMonth,
topCategory,
maxTransaction: maxTransaction ? {
note: maxTransaction.note || '',
amount: maxTransaction.amount
} : undefined,
lastWeekSpend,
streakDays
});
setAiData(result);
} catch (e) {
console.warn('AI insight fetch failed, sticking to local logic');
} finally {
setIsAiLoading(false);
}
const result = await getDailyInsight({
todaySpend,
yesterdaySpend,
monthlyBudget,
monthlySpent,
monthProgress: today / daysInMonth,
topCategory,
maxTransaction: maxTransaction ? {
note: maxTransaction.note || '',
amount: maxTransaction.amount
} : undefined,
lastWeekSpend,
streakDays
});
setAiData(result);
} catch (e) {
console.warn('AI insight fetch failed, sticking to local logic');
} finally {
setIsAiLoading(false);
}
};
const timer = setTimeout(fetchAI, 500);
@@ -76,11 +75,11 @@ export const DailyInsightCard: React.FC<DailyInsightCardProps> = ({
if (Math.abs(diff) < 10) return { text: <span>今天支出 <strong className="daily-insight__highlight">{formatCurrency(today)}</strong>，跟昨天差不多，生活节奏很稳。</span>, type: 'normal' };
if (today < yesterday) {
const percent = Math.round(((yesterday - today) / yesterday) * 100);
return { text: <span>比昨天少花了 <strong className="daily-insight__highlight daily-insight__highlight--success">{percent}%</strong>！这就是进步，省下来的钱可以积少成多。</span>, type: 'success' };
const percent = Math.round(((yesterday - today) / yesterday) * 100);
return { text: <span>比昨天少花了 <strong className="daily-insight__highlight daily-insight__highlight--success">{percent}%</strong>！这就是进步，省下来的钱可以积少成多。</span>, type: 'success' };
} else {
const percent = Math.round(((today - yesterday) / yesterday) * 100);
return { text: <span>比昨天多花了 <strong className="daily-insight__highlight daily-insight__highlight--warning">{percent}%</strong>。如果不是必需品，记得明天稍微控制一下哦。</span>, type: 'warning' };
const percent = Math.round(((today - yesterday) / yesterday) * 100);
return { text: <span>比昨天多花了 <strong className="daily-insight__highlight daily-insight__highlight--warning">{percent}%</strong>。如果不是必需品，记得明天稍微控制一下哦。</span>, type: 'warning' };
}
};
@@ -97,48 +96,47 @@ export const DailyInsightCard: React.FC<DailyInsightCardProps> = ({
if (ratio >= 1) return { text: <span className="daily-insight__highlight daily-insight__highlight--danger">本月预算已耗尽！接下来的每一天都需要极限生存挑战了。</span>, type: 'danger' };
if (ratio > timeRatio + 0.15) {
return { text: <span>进度 <strong className="daily-insight__highlight daily-insight__highlight--warning">{Math.round(ratio*100)}%</strong> (时间 {Math.round(timeRatio*100)}%)。花钱速度有点快了，建议踩踩刹车。</span>, type: 'warning' };
return { text: <span>进度 <strong className="daily-insight__highlight daily-insight__highlight--warning">{Math.round(ratio * 100)}%</strong> (时间 {Math.round(timeRatio * 100)}%)。花钱速度有点快了，建议踩踩刹车。</span>, type: 'warning' };
}
if (ratio < timeRatio - 0.1) {
return { text: <span>进度 <strong className="daily-insight__highlight daily-insight__highlight--success">{Math.round(ratio*100)}%</strong> (时间 {Math.round(timeRatio*100)}%)。控制得非常完美，月底可能有惊喜结余！</span>, type: 'success' };
return { text: <span>进度 <strong className="daily-insight__highlight daily-insight__highlight--success">{Math.round(ratio * 100)}%</strong> (时间 {Math.round(timeRatio * 100)}%)。控制得非常完美，月底可能有惊喜结余！</span>, type: 'success' };
}
return { text: <span>进度 <strong>{Math.round(ratio*100)}%</strong> (时间 {Math.round(timeRatio*100)}%)。目前节奏刚刚好，稳扎稳打。</span>, type: 'normal' };
return { text: <span>进度 <strong>{Math.round(ratio * 100)}%</strong> (时间 {Math.round(timeRatio * 100)}%)。目前节奏刚刚好，稳扎稳打。</span>, type: 'normal' };
};
const spendingInsight = getSpendingInsight(todaySpend, yesterdaySpend);
const budgetInsight = getBudgetInsight(monthlySpent, monthlyBudget);
return (
<div className={`daily - insight - card ${ aiData ? 'daily-insight-card--ai' : '' } `}>
<div className="daily-insight__header">
<Icon icon={aiData ? "solar:magic-stick-3-bold-duotone" : "solar:stars-minimalistic-bold-duotone"} width="20" />
<span>{aiData ? 'AI 每日简报' : '每日简报'}</span>
{isAiLoading && !aiData && <span className="daily-insight__loading-badge">AI 思考中...</span>}
</div>
<div className={`daily-insight-card ${aiData ? 'daily-insight-card--ai' : ''}`}>
<div className="daily-insight__header">
<Icon icon={aiData ? "solar:magic-stick-3-bold-duotone" : "solar:stars-minimalistic-bold-duotone"} width="20" />
<span>{aiData ? 'AI 每日简报' : '每日简报'}</span>
{isAiLoading && !aiData && <span className="daily-insight__loading-badge">AI 思考中...</span>}
</div>
<div className="daily-insight__content">
<div className="daily-insight__section">
<div className="section-header-row">
<span className="daily-insight__title">今日消费</span>
{lastWeekSpend !== undefined && lastWeekSpend > 0 && (
<span className={`week - diff - badge ${ todaySpend <= lastWeekSpend ? 'green' : 'red' } `}>
周同比 {todaySpend <= lastWeekSpend ? '↓' : '↑'}{Math.abs(todaySpend - lastWeekSpend).toFixed(0)}
</span>
)}
</div>
<p className="daily-insight__text animate-fade-in">{spendingInsight.text}</p>
<div className="daily-insight__content">
<div className="daily-insight__section">
<div className="section-header-row">
<span className="daily-insight__title">今日消费</span>
{lastWeekSpend !== undefined && lastWeekSpend > 0 && (
<span className={`week-diff-badge ${todaySpend <= lastWeekSpend ? 'green' : 'red'}`}>
周同比 {todaySpend <= lastWeekSpend ? '↓' : '↑'}{Math.abs(todaySpend - lastWeekSpend).toFixed(0)}
</span>
)}
</div>
<p className="daily-insight__text animate-fade-in">{spendingInsight.text}</p>
</div>
<div className="daily-insight__divider" />
<div className="daily-insight__divider" />
<div className="daily-insight__section">
<span className="daily-insight__title">预算风向标</span>
<p className="daily-insight__text animate-fade-in">{budgetInsight.text}</p>
</div>
</div>
<div className="daily-insight__section">
<span className="daily-insight__title">预算风向标</span>
<p className="daily-insight__text animate-fade-in">{budgetInsight.text}</p>
</div>
</div>
</div>
);
};
```

185
src/services/aiService.ts
View File

@@ -289,45 +289,47 @@ Output Requirements:
// Here we choose to throw so fallback static text appears.
throw error;
}
// Cache storage for daily insight
let dailyInsightCache: {
data: { spending: string; budget: string };
timestamp: number;
contentHash: string;
} | null = null;
}
export interface DailyInsightContext {
todaySpend: number;
yesterdaySpend: number;
monthlyBudget: number;
monthlySpent: number;
monthProgress: number; // 0-1
topCategory?: { name: string; amount: number };
maxTransaction?: { note: string; amount: number };
lastWeekSpend?: number;
streakDays?: number;
// Cache storage for daily insight
let dailyInsightCache: {
data: { spending: string; budget: string };
timestamp: number;
contentHash: string;
} | null = null;
export interface DailyInsightContext {
todaySpend: number;
yesterdaySpend: number;
monthlyBudget: number;
monthlySpent: number;
monthProgress: number; // 0-1
topCategory?: { name: string; amount: number };
maxTransaction?: { note: string; amount: number };
lastWeekSpend?: number;
streakDays?: number;
}
/**
* Get AI-powered daily insight
*/
export async function getDailyInsight(context: DailyInsightContext): Promise<{ spending: string; budget: string }> {
// Hash needs to include new fields
const currentHash = JSON.stringify(context);
const NOW = Date.now();
const CACHE_TTL = 30 * 60 * 1000; // 30 Minutes
// 1. Check Cache
if (dailyInsightCache &&
(NOW - dailyInsightCache.timestamp < CACHE_TTL) &&
dailyInsightCache.contentHash === currentHash) {
return dailyInsightCache.data;
}
/**
* Get AI-powered daily insight
*/
export async function getDailyInsight(context: DailyInsightContext): Promise<{ spending: string; budget: string }> {
// Hash needs to include new fields
const currentHash = JSON.stringify(context);
const NOW = Date.now();
const CACHE_TTL = 30 * 60 * 1000; // 30 Minutes
const weekday = new Date().toLocaleDateString('zh-CN', { weekday: 'long' });
const weekDiff = context.lastWeekSpend !== undefined ? (context.todaySpend - context.lastWeekSpend) : 0;
// 1. Check Cache
if (dailyInsightCache &&
(NOW - dailyInsightCache.timestamp < CACHE_TTL) &&
dailyInsightCache.contentHash === currentHash) {
return dailyInsightCache.data;
}
const weekday = new Date().toLocaleDateString('zh-CN', { weekday: 'long' });
const weekDiff = context.lastWeekSpend !== undefined ? (context.todaySpend - context.lastWeekSpend) : 0;
const prompt = `System: 你是 Novault 首席财务AI，也是用户的贴身管家。你的点评需要非常有温度、有依据。
const prompt = `System: 你是 Novault 首席财务AI，也是用户的贴身管家。你的点评需要非常有温度、有依据。
Context:
- 今天是: ${weekday}
- 连续记账: ${context.streakDays || 0} 天
@@ -351,63 +353,64 @@ Task:
- 结合月度进度，给出具体行动指南。
`;
try {
const response = await sendChatMessage(prompt);
try {
const response = await sendChatMessage(prompt);
if (response.message) {
let content = response.message.trim();
if (response.message) {
let content = response.message.trim();
// Extract JSON object using regex to handle potential markdown or extra text
const jsonMatch = content.match(/\{[\s\S]*\}/);
if (jsonMatch) {
content = jsonMatch[0];
} else {
// Fallback cleanup if regex fails but it might still be JSON-ish
content = content.replace(/^```json\s*/, '').replace(/\s*```$/, '');
}
let parsed;
try {
parsed = JSON.parse(content);
} catch (e) {
console.warn('AI returned invalid JSON, falling back to raw text split or default', content);
// Fallback: simple split if possible or default
parsed = {
spending: content.slice(0, 50) + '...',
budget: 'AI 分析数据格式异常，请稍后再试。'
};
}
const result = {
spending: parsed.spending || '暂无点评',
budget: parsed.budget || '暂无建议'
};
// Update Cache
dailyInsightCache = {
data: result,
timestamp: NOW,
contentHash: currentHash
};
return result;
// Extract JSON object using regex to handle potential markdown or extra text
const jsonMatch = content.match(/\{[\s\S]*\}/);
if (jsonMatch) {
content = jsonMatch[0];
} else {
// Fallback cleanup if regex fails but it might still be JSON-ish
content = content.replace(/^```json\s*/, '').replace(/\s*```$/, '');
}
throw new Error('No insight received');
} catch (error) {
console.error('Failed to get AI insight:', error);
throw error;
}
}
export default {
getSessionId,
clearSession,
sendChatMessage,
transcribeAudio,
confirmTransaction,
cancelSession,
processVoiceInput,
isConfirmationCardComplete,
formatConfirmationCard,
getFinancialAdvice,
};
let parsed;
try {
parsed = JSON.parse(content);
} catch (e) {
console.warn('AI returned invalid JSON, falling back to raw text split or default', content);
// Fallback: simple split if possible or default
parsed = {
spending: content.slice(0, 50) + '...',
budget: 'AI 分析数据格式异常，请稍后再试。'
};
}
const result = {
spending: parsed.spending || '暂无点评',
budget: parsed.budget || '暂无建议'
};
// Update Cache
dailyInsightCache = {
data: result,
timestamp: NOW,
contentHash: currentHash
};
return result;
}
throw new Error('No insight received');
} catch (error) {
console.error('Failed to get AI insight:', error);
throw error;
}
}
export default {
getSessionId,
clearSession,
sendChatMessage,
transcribeAudio,
confirmTransaction,
cancelSession,
processVoiceInput,
isConfirmationCardComplete,
formatConfirmationCard,
getFinancialAdvice,
getDailyInsight,
};