diff --git a/adminfront/src/features/tenants/routes/TenantOrgChartPage.tsx b/adminfront/src/features/tenants/routes/TenantOrgChartPage.tsx index ed8cbcd3..10500ab1 100644 --- a/adminfront/src/features/tenants/routes/TenantOrgChartPage.tsx +++ b/adminfront/src/features/tenants/routes/TenantOrgChartPage.tsx @@ -91,6 +91,18 @@ export function TenantOrgChartPage() { return { rootNodes: roots, usersMap: uMap }; }, [tenantsQuery.data, usersQuery.data]); + const [selectedDept, setSelectedDept] = React.useState("전체"); + + const depts = React.useMemo(() => { + return rootNodes.map((n) => n.name).sort(); + }, [rootNodes]); + + React.useEffect(() => { + if (selectedDept !== "전체" && !depts.includes(selectedDept)) { + setSelectedDept("전체"); + } + }, [selectedDept, depts]); + const buildHierarchy = (tNode: TenantNode, depth: number): OrgNode => { const slug = tNode.slug.toLowerCase(); const members = usersMap.get(slug) || []; @@ -208,6 +220,11 @@ export function TenantOrgChartPage() { const totalUniqueUsers = usersQuery.data?.items?.filter((u) => u.status === "active").length || 0; + const targetNodes = + selectedDept === "전체" + ? rootNodes + : rootNodes.filter((n) => n.name === selectedDept); + return (
@@ -220,6 +237,23 @@ export function TenantOrgChartPage() {
+ {["전체", ...depts].map((d) => ( + + ))}
총 {totalUniqueUsers}명
@@ -251,7 +285,7 @@ export function TenantOrgChartPage() {
- {rootNodes.map((tNode) => { + {targetNodes.map((tNode) => { const orgNode = buildHierarchy(tNode, 0); return (