From 0197f890189f6d68657a541a822c4647e8d2737d Mon Sep 17 00:00:00 2001
From: selfrelease <freedak.ipad@gmail.com>
Date: Sun, 19 Jul 2026 21:52:40 +0800
Subject: [PATCH] =?UTF-8?q?feat(dashboard):=20add=20company=20filter=20?=
 =?UTF-8?q?=E2=80=94=20switch=20between=20portfolio=20overview=20and=20sin?=
 =?UTF-8?q?gle=20company=20view?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/app/(investor)/dashboard/page.tsx     | 49 +++++++++++++++----
 .../components/dashboard/HealthHeatmap.tsx    |  9 ++--
 2 files changed, 46 insertions(+), 12 deletions(-)

diff --git a/frontend/src/app/(investor)/dashboard/page.tsx b/frontend/src/app/(investor)/dashboard/page.tsx
index 86b73df..afcf255 100644
--- a/frontend/src/app/(investor)/dashboard/page.tsx
+++ b/frontend/src/app/(investor)/dashboard/page.tsx
@@ -4,6 +4,7 @@ import { useEffect, useState } from "react";
 import { Building2, Heart, AlertTriangle, FileText, TrendingUp, TrendingDown, Minus } from "lucide-react";
 import Link from "next/link";
 import { getDashboardSummary, type DashboardSummary } from "@/lib/dashboard";
+import { listCompanies, type Company } from "@/lib/companies";
 import { LoadingSpinner } from "@/components/shared/LoadingSpinner";
 import { EmptyState } from "@/components/shared/EmptyState";
 import { HealthScoreBadge } from "@/components/shared/HealthScoreBadge";
@@ -14,13 +15,19 @@ import { HealthHeatmap, HealthTrends } from "@/components/dashboard/HealthHeatma
  */
 export default function InvestorDashboardPage() {
   const [summary, setSummary] = useState<DashboardSummary | null>(null);
+  const [companies, setCompanies] = useState<Company[]>([]);
+  const [selectedCompanyId, setSelectedCompanyId] = useState<string>("");
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
     async function load() {
       try {
-        const resp = await getDashboardSummary();
-        if (resp.data) setSummary(resp.data);
+        const [summaryResp, companiesResp] = await Promise.all([
+          getDashboardSummary(),
+          listCompanies({ page_size: 100 }),
+        ]);
+        if (summaryResp.data) setSummary(summaryResp.data);
+        if (companiesResp.data?.items) setCompanies(companiesResp.data.items);
       } catch {
         // ignore
       } finally {
@@ -76,11 +83,35 @@ export default function InvestorDashboardPage() {
     },
   ];
 
+  // 筛选后的评分列表
+  const filteredScores = selectedCompanyId
+    ? summary?.recent_scores.filter((s) => s.company_id === selectedCompanyId) ?? []
+    : summary?.recent_scores ?? [];
+
+  // 选中的企业名称
+  const selectedCompany = companies.find((c) => c.id === selectedCompanyId);
+
   return (
     <div className="space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold text-foreground">投资机构驾驶舱</h1>
-        <p className="mt-1 text-sm text-muted-foreground">Portfolio 全局健康度与风险概览</p>
+      <div className="flex items-center justify-between">
+        <div>
+          <h1 className="text-2xl font-bold text-foreground">投资机构驾驶舱</h1>
+          <p className="mt-1 text-sm text-muted-foreground">
+            {selectedCompany ? `${selectedCompany.name} — 企业健康度概览` : "Portfolio 全局健康度与风险概览"}
+          </p>
+        </div>
+
+        {/* 企业筛选器 */}
+        <select
+          value={selectedCompanyId}
+          onChange={(e) => setSelectedCompanyId(e.target.value)}
+          className="rounded-md border bg-white px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-[var(--investor-primary)]"
+        >
+          <option value="">全部企业</option>
+          {companies.map((c) => (
+            <option key={c.id} value={c.id}>{c.name}</option>
+          ))}
+        </select>
       </div>
 
       {/* KPI 卡片 */}
@@ -113,9 +144,9 @@ export default function InvestorDashboardPage() {
           </Link>
         </div>
 
-        {summary && summary.recent_scores.length > 0 ? (
+        {filteredScores.length > 0 ? (
           <div className="space-y-3">
-            {summary.recent_scores.map((score) => (
+            {filteredScores.map((score) => (
               <div key={score.id} className="flex items-center justify-between border-b pb-3 last:border-0 last:pb-0">
                 <div className="flex items-center gap-3">
                   <HealthScoreBadge score={Math.round(score.total_score)} />
@@ -156,10 +187,10 @@ export default function InvestorDashboardPage() {
       <div className="space-y-4">
         <div className="rounded-lg border bg-white p-5 shadow-sm">
           <h2 className="mb-4 text-lg font-semibold">健康度热力图</h2>
-          <HealthHeatmap />
+          <HealthHeatmap companyId={selectedCompanyId || undefined} />
         </div>
         <div className="rounded-lg border bg-white p-5 shadow-sm">
-          <HealthTrends />
+          <HealthTrends companyId={selectedCompanyId || undefined} />
         </div>
       </div>
     </div>
diff --git a/frontend/src/components/dashboard/HealthHeatmap.tsx b/frontend/src/components/dashboard/HealthHeatmap.tsx
index 4cf38e2..6736a75 100644
--- a/frontend/src/components/dashboard/HealthHeatmap.tsx
+++ b/frontend/src/components/dashboard/HealthHeatmap.tsx
@@ -155,16 +155,19 @@ export function HealthTrends({ companyId }: { companyId?: string }) {
     </div>
   );
 }
-export function HealthHeatmap() {
+export function HealthHeatmap({ companyId }: { companyId?: string }) {
   const [data, setData] = useState<HeatmapRow[]>([]);
   const [loading, setLoading] = useState(true);
 
   useEffect(() => {
     apiFetch<HeatmapRow[]>("/dashboard/heatmap")
-      .then((res) => setData((res.data as HeatmapRow[]) || []))
+      .then((res) => {
+        const rows = (res.data as HeatmapRow[]) || [];
+        setData(companyId ? rows.filter((r) => r.company_id === companyId) : rows);
+      })
       .catch(() => {})
       .finally(() => setLoading(false));
-  }, []);
+  }, [companyId]);
 
   if (loading) return <LoadingSpinner />;
   if (!data.length) return <EmptyState title="暂无热力图数据" />;