import { Form, Head, Link } from '@inertiajs/react'; import { CheckCircle2, Clock3, CreditCard, Server } from 'lucide-react'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; type Plan = { code: string; name: string; deployment: string; price: number; max_devices: number; max_users: number; }; type License = { plan: string; status: string; max_devices: number | null; max_users: number | null; expires_at: string | null; grace_until: string | null; }; type Order = { uuid: string; plan_code: string; gateway: string; status: string; total: number; currency: string; checkout_url: string | null; created_at: string; }; const money = (value: number) => new Intl.NumberFormat('id-ID', { style: 'currency', currency: 'IDR', maximumFractionDigits: 0, }).format(value); export default function BillingIndex({ installation, license, plans, orders, gateways, pendingOrder, }: { installation: { deployment_type: string; status: string }; license: License | null; plans: Plan[]; orders: Order[]; gateways: string[]; pendingOrder: Pick | null; }) { return ( <>

RADIQ NDM · BILLING

Lisensi & Tagihan

Pilih paket, checkout, dan pantau masa berlaku lisensi tenant.

{pendingOrder && (

Pembayaran masih pending

{pendingOrder.plan_code} · {money(pendingOrder.total)}. Selesaikan order ini sebelum membuat perpanjangan baru.

 )}
Paket aktif

{license?.plan ?? 'Belum aktif'}

Status {license?.status ?? installation.status}

Batas perangkat

{license?.max_devices ?? '—'}

Berlaku sampai

{license?.plan === 'cloud_free' ? 'Selama paket tersedia' : license?.expires_at ? new Date( license.expires_at, ).toLocaleDateString('id-ID') : '—'}

Pilih paket bulanan

{plans.map((plan) => (
{plan.name} {license?.plan === plan.code && ( )}

{plan.price === 0 ? 'Gratis' : money(plan.price)} {plan.price > 0 && '/bulan'}

  • ✓ {plan.max_devices} perangkat
  • ✓ {plan.max_users} user aplikasi
  • ✓ Users Perangkat tanpa batas
{plan.price > 0 && (
)} ))}
Riwayat checkout {orders.length === 0 ? (

Belum ada checkout.

) : (
{orders.map((order) => (

{order.plan_code} ·{' '} {money(order.total)}

{new Date( order.created_at, ).toLocaleString('id-ID')}{' '} · {order.gateway}

{order.status} {order.status === 'pending' && ( )}
))}
)}
Checkout berada di Tenant Admin. Payment gateway dapat diganti tanpa mengubah data order atau proses lisensi.
); } BillingIndex.layout = { breadcrumbs: [{ title: 'Lisensi & Tagihan', href: '/billing' }], };