Initial commit device-management

2026-08-25 09:42:00 +07:00
commit 1e80be180e
1159 changed files with 149545 additions and 0 deletions
@@ -0,0 +1,152 @@
+import { Head, Link, usePage } from '@inertiajs/react';
+import {
+    Building2,
+    CheckCircle2,
+    KeyRound,
+    Network,
+    Server,
+    ShieldCheck,
+    UserCheck,
+    Users,
+} from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { dashboard } from '@/routes';
+
+type Props = {
+    role: 'MASTER ADMIN' | 'TENANT ADMIN' | 'TENANT USER';
+    tenant: {
+        id: number;
+        name: string;
+        slug: string;
+        is_active: boolean;
+    } | null;
+    stats: Record<string, number | boolean>;
+};
+
+const roleLabels = {
+    'MASTER ADMIN': 'Master Admin Platform',
+    'TENANT ADMIN': 'Tenant Admin',
+    'TENANT USER': 'Tenant User',
+};
+
+export default function Dashboard({ role, tenant, stats }: Props) {
+    const { auth } = usePage().props;
+    const isMaster = role === 'MASTER ADMIN';
+    const isTenantAdmin = role === 'TENANT ADMIN';
+    const cards = isMaster
+        ? [
+              { label: 'Total Tenant', value: stats.tenants, icon: Building2 },
+              {
+                  label: 'Tenant Aktif',
+                  value: stats.activeTenants,
+                  icon: ShieldCheck,
+              },
+              { label: 'User Tenant', value: stats.users, icon: Users },
+              {
+                  label: 'Lisensi Aktif',
+                  value: stats.activeLicenses,
+                  icon: KeyRound,
+              },
+              {
+                  label: 'Instalasi Terdaftar',
+                  value: stats.installations,
+                  icon: Server,
+              },
+          ]
+        : [
+              { label: 'Total User', value: stats.users, icon: Users },
+              {
+                  label: 'User Aktif',
+                  value: stats.activeUsers,
+                  icon: UserCheck,
+              },
+              { label: 'Total Perangkat', value: stats.devices, icon: Network },
+              {
+                  label: 'Status Tenant',
+                  value: tenant?.is_active ? 'Aktif' : 'Nonaktif',
+                  icon: CheckCircle2,
+              },
+          ];
+
+    return (
+        <>
+            <Head title="Dashboard" />
+            <div className="flex flex-1 flex-col gap-6 p-4 md:p-6">
+                <div className="flex flex-col justify-between gap-4 md:flex-row md:items-end">
+                    <div>
+                        <p className="text-sm font-medium text-primary">
+                            RADIQ NDM · {roleLabels[role]}
+                        </p>
+                        <h1 className="mt-1 text-2xl font-semibold tracking-tight">
+                            Selamat datang, {auth.user.name}
+                        </h1>
+                        <p className="mt-1 text-sm text-muted-foreground">
+                            {isMaster
+                                ? 'Pantau tenant, instalasi, dan lisensi platform.'
+                                : `${tenant?.name ?? 'Tenant'} · ruang kerja pengelolaan perangkat jaringan.`}
+                        </p>
+                    </div>
+                    {isMaster && (
+                        <Button asChild>
+                            <Link href="/administration/tenants">
+                                Kelola Tenant
+                            </Link>
+                        </Button>
+                    )}
+                    {isTenantAdmin && tenant && (
+                        <Button asChild>
+                            <Link
+                                href={`/administration/tenants/${tenant.id}/users`}
+                            >
+                                Kelola Tenant User
+                            </Link>
+                        </Button>
+                    )}
+                </div>
+
+                <div className="grid gap-4 sm:grid-cols-2 xl:grid-cols-5">
+                    {cards.map((card) => (
+                        <Card key={card.label}>
+                            <CardHeader className="flex flex-row items-center justify-between pb-2">
+                                <CardTitle className="text-sm font-medium text-muted-foreground">
+                                    {card.label}
+                                </CardTitle>
+                                <card.icon className="size-5 text-primary" />
+                            </CardHeader>
+                            <CardContent>
+                                <div className="text-3xl font-semibold">
+                                    {String(card.value)}
+                                </div>
+                            </CardContent>
+                        </Card>
+                    ))}
+                </div>
+
+                <Card>
+                    <CardHeader>
+                        <CardTitle>
+                            {isMaster
+                                ? 'Kontrol Platform'
+                                : isTenantAdmin
+                                  ? 'Pengelolaan Tenant'
+                                  : 'Akses Perangkat'}
+                        </CardTitle>
+                    </CardHeader>
+                    <CardContent className="text-sm text-muted-foreground">
+                        {isMaster &&
+                            'Master Admin memiliki kendali tenant dan fondasi lisensi. Aktivasi serta perpanjangan lisensi akan tersedia pada tahap lisensi berikutnya.'}
+                        {isTenantAdmin &&
+                            'Anda adalah akun utama tenant. Anda dapat mengelola Tenant User dan nantinya menetapkan aturan penggunaan perangkat untuk mereka.'}
+                        {role === 'TENANT USER' &&
+                            (stats.canAddDevice
+                                ? 'Anda diizinkan menambahkan dan mengelola perangkat sesuai kebijakan Tenant Admin. Modul perangkat akan tersedia pada tahap berikutnya.'
+                                : 'Akses perangkat Anda mengikuti kebijakan yang ditetapkan oleh Tenant Admin.')}
+                    </CardContent>
+                </Card>
+            </div>
+        </>
+    );
+}
+
+Dashboard.layout = { breadcrumbs: [{ title: 'Dashboard', href: dashboard() }] };