import { Head } from '@inertiajs/react'; import { AlertTriangle } from 'lucide-react'; import { Download, FoldVertical, ImageDown, Maximize2, Network, UnfoldVertical, ZoomIn, ZoomOut, } from 'lucide-react'; import { useRef } from 'react'; import Heading from '@/components/heading'; import { Button } from '@/components/ui/button'; import { dashboard } from '@/routes'; import { index, pdf } from '@/routes/admin/organization-chart'; import { OrganizationChartCanvas, } from './organization-chart-canvas'; import type { ChartNode, OrganizationChartCanvasHandle, } from './organization-chart-canvas'; type Stats = { total: number; roots: number; synthetic: number; orphans: number; }; export default function OrganizationChartIndex({ nodes, stats, }: { nodes: ChartNode[]; tree: unknown; stats: Stats; }) { const canvasRef = useRef(null); return ( <>
1 ? 's' : ''} · ${stats.roots} racine${stats.roots > 1 ? 's' : ''}`} />
{(stats.synthetic > 0 || stats.orphans > 1) && (
{stats.synthetic > 0 && (

{stats.synthetic} manager {stats.synthetic > 1 ? 's' : ''} sans fiche collaborateur. Créez leur fiche ou rattachez les collaborateurs à un manager existant.

)} {stats.orphans > 1 && (

{stats.orphans} collaborateurs actifs sans manager (plusieurs racines). Vérifiez les rattachements hiérarchiques — une seule direction générale est attendue.

)}
)}
{nodes.length === 0 ? (

Aucun collaborateur actif

L’organigramme se construit automatiquement à partir des rattachements hiérarchiques.

) : ( )}
); } OrganizationChartIndex.layout = { breadcrumbs: [ { title: 'Tableau de bord', href: dashboard() }, { title: 'Organigramme', href: index() }, ], };