selfrelease
006fd7de7e
- 新增 useCompanyName hook 和 CompanyNameTag 组件 - 20+ investor 页面添加 CompanyNameTag 显示企业名 - 表格型页面（agents/agreements/board/weak-signals/talents/reports）新增企业列 - 卡片型页面（risks/synergies/sentinels/alpha/exit-signals/okrs/aars/events/tasks/pre-mortems/nudges/product-diagnostics/peer-circles）添加企业名标签 - customer-success 改用 CompanyNameTag 替代手动 company_name 显示 - PlanCard 组件添加企业名标签 - 编译验证通过
72 lines
3.0 KiB
TypeScript
72 lines
3.0 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import { useScopeEffect } from "@/lib/company-scope";
|
|
import { CompanyNameTag } from "@/components/shared/CompanyNameTag";
|
|
import { listTalents } from "@/lib/api-v2";
|
|
import { PageContainer, Badge } from "@/components/shared/PageContainer";
|
|
import { LoadingSpinner } from "@/components/shared/LoadingSpinner";
|
|
import { EmptyState } from "@/components/shared/EmptyState";
|
|
|
|
/** 人才项。 */
|
|
interface Talent {
|
|
company_id?: string;
|
|
name: string;
|
|
current_role: string;
|
|
performance_rating?: string;
|
|
potential_rating?: string;
|
|
nine_box?: string;
|
|
status: string;
|
|
}
|
|
|
|
export default function TalentsPage() {
|
|
const [items, setItems] = useState<Talent[]>([]);
|
|
const [isLoading, setIsLoading] = useState(true);
|
|
|
|
useScopeEffect(() => {
|
|
listTalents()
|
|
.then((resp) => setItems((resp.data as Talent[]) ?? []))
|
|
.catch(() => setItems([]))
|
|
.finally(() => setIsLoading(false));
|
|
});
|
|
|
|
return (
|
|
<PageContainer title="人才引力场" description="人才流动预测 + 主动推荐 + 9-Box 矩阵">
|
|
{isLoading ? (
|
|
<LoadingSpinner />
|
|
) : items.length === 0 ? (
|
|
<EmptyState description="暂无人才数据" />
|
|
) : (
|
|
<div className="overflow-x-auto rounded-lg border border-gray-200">
|
|
<table className="min-w-full divide-y divide-gray-200 text-sm">
|
|
<thead className="bg-gray-50">
|
|
<tr>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">企业</th>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">姓名</th>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">当前职位</th>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">绩效</th>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">潜力</th>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">9-Box</th>
|
|
<th className="px-4 py-2 text-left font-medium text-gray-500">状态</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="divide-y divide-gray-100 bg-white">
|
|
{items.map((item, i) => (
|
|
<tr key={i}>
|
|
<td className="px-4 py-2"><CompanyNameTag companyId={item.company_id} /></td>
|
|
<td className="px-4 py-2 text-gray-900">{item.name}</td>
|
|
<td className="px-4 py-2 text-gray-600">{item.current_role}</td>
|
|
<td className="px-4 py-2 text-gray-600">{item.performance_rating ?? "-"}</td>
|
|
<td className="px-4 py-2 text-gray-600">{item.potential_rating ?? "-"}</td>
|
|
<td className="px-4 py-2"><Badge color="blue">{item.nine_box ?? "-"}</Badge></td>
|
|
<td className="px-4 py-2"><Badge color={item.status === "active" ? "green" : "gray"}>{item.status}</Badge></td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)}
|
|
</PageContainer>
|
|
);
|
|
}
|