feat: 新增健康评分弹窗组件,包含玻璃拟态UI和详细指标展示。

This commit is contained in:
2026-01-30 16:23:46 +08:00
parent 9443ef39f3
commit 86f2e69b60
2 changed files with 56 additions and 5 deletions

View File

@@ -451,9 +451,60 @@
color: white;
}
.rule-desc-group p {
margin: 0;
font-size: 0.875rem;
color: var(--health-text-sub);
line-height: 1.5;
}
/* AI Advice & Tips Styling */
.tip-item {
margin-bottom: 0.75rem;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.9);
line-height: 1.5;
padding-left: 0.5rem;
border-left: 2px solid rgba(255, 255, 255, 0.2);
}
.ai-advice-container {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.ai-advice-box {
background: linear-gradient(90deg, rgba(59, 130, 246, 0.1), transparent);
border-left: 3px solid #60a5fa;
padding: 1rem;
border-radius: 0 12px 12px 0;
font-size: 0.9rem;
line-height: 1.6;
color: #93c5fd;
position: relative;
}
.ai-advice-icon {
position: absolute;
top: 1rem;
left: 1rem;
color: #60a5fa;
}
.ai-advice-text {
display: block;
margin-left: 0;
/* Adjusted layout */
text-align: justify;
}
.ai-loading {
margin-top: 1rem;
font-size: 0.85rem;
opacity: 0.7;
font-style: italic;
display: flex;
align-items: center;
gap: 8px;
padding-left: 0.5rem;
}

View File

@@ -85,7 +85,7 @@ export const HealthScoreModal: React.FC<HealthScoreModalProps> = ({
setShowRules(false); // Reset view on close
}
return () => { isMounted = false; };
}, [isOpen, aiAdvice, loadingAdvice, score, totalAssets, totalLiabilities, metrics, tips]);
}, [isOpen, score, totalAssets, totalLiabilities, metrics, tips]);
if (!isOpen) return null;