feat: 新增 DailyInsightCard 组件,用于展示每日消费洞察、预算分析及AI生成简报。
This commit is contained in:
@@ -90,8 +90,25 @@ export const DailyInsightCard: React.FC<DailyInsightCardProps> = ({
|
||||
return () => clearTimeout(timer);
|
||||
}, [todaySpend, yesterdaySpend, monthlyBudget, monthlySpent, topCategory, maxTransaction, lastWeekSpend, streakDays, budgetRemaining, daysRemaining, weeklyTotal, avgDailySpend, top3Categories, todayTransactionCount, last7DaysSpend, recentTransactions]);
|
||||
|
||||
// Helper to render text with newlines and bolding
|
||||
const FormattedText = ({ text }: { text: string }) => {
|
||||
return (
|
||||
<>
|
||||
{text.split('\n').map((line, i) => (
|
||||
<span key={i} style={{ display: 'block', marginBottom: line.trim() ? '0.5em' : '0' }}>
|
||||
{line.split(/(\*\*.*?\*\*)/).map((part, j) =>
|
||||
part.startsWith('**') && part.endsWith('**') ?
|
||||
<strong key={j} className="daily-insight__highlight">{part.slice(2, -2)}</strong> :
|
||||
part
|
||||
)}
|
||||
</span>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const getSpendingInsight = (today: number, yesterday: number) => {
|
||||
if (aiData) return { text: <span>{aiData.spending}</span>, type: 'ai' };
|
||||
if (aiData) return { text: <FormattedText text={aiData.spending} />, type: 'ai' };
|
||||
|
||||
if (today === 0) return { text: "今天还没有花钱,保持这种“零消费”状态就是最大的赚钱!", type: 'success' };
|
||||
|
||||
@@ -110,7 +127,7 @@ export const DailyInsightCard: React.FC<DailyInsightCardProps> = ({
|
||||
};
|
||||
|
||||
const getBudgetInsight = (spent: number, total: number) => {
|
||||
if (aiData) return { text: <span>{aiData.budget}</span>, type: 'ai' };
|
||||
if (aiData) return { text: <FormattedText text={aiData.budget} />, type: 'ai' };
|
||||
|
||||
if (total === 0) return { text: "您还没有设置月度预算,建议去设置一个。", type: 'normal' };
|
||||
|
||||
|
||||
Reference in New Issue
Block a user