import { Button } from '@/components/ui/button'; import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from '@/components/ui/card'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { useAuthBreadcrumb } from '@/hooks/use-auth-breadcrumb'; import AppLayout from '@/layouts/app-layout'; import { Head, router } from '@inertiajs/react'; import { ChangeEvent, useState } from 'react'; import { toast, Toaster } from 'sonner'; export default function ImportData() { const breadcrumbs = useAuthBreadcrumb(); // 🔹 State untuk tiap file const [files, setFiles] = useState<{ program: File | null; kegiatan: File | null; subkegiatan: File | null; rekening: File | null; subrekening: File | null; satuan: File | null; sakip: File | null; pegawai: File | null; }>({ program: null, kegiatan: null, subkegiatan: null, rekening: null, subrekening: null, satuan: null, sakip: null, pegawai: null, }); // 🔹 State loading per tombol const [loading, setLoading] = useState<{ program: boolean; kegiatan: boolean; subkegiatan: boolean; rekening: boolean; subrekening: boolean; satuan: boolean; sakip: boolean; pegawai: boolean; }>({ program: false, kegiatan: false, subkegiatan: false, rekening: false, subrekening: false, satuan: false, sakip: false, pegawai: false, }); const [fileInputKey, setFileInputKey] = useState(Date.now()); const handleFileChange = ( e: ChangeEvent, type: | 'program' | 'kegiatan' | 'subkegiatan' | 'rekening' | 'subrekening' | 'satuan' | 'sakip' | 'pegawai', ) => { if (e.target.files && e.target.files.length > 0) { setFiles((prev) => ({ ...prev, [type]: e.target.files![0] })); } }; const handleUpload = ( type: | 'program' | 'kegiatan' | 'subkegiatan' | 'rekening' | 'subrekening' | 'satuan' | 'sakip' | 'pegawai', ) => { if (!files[type]) { return toast.error(`Silakan pilih file ${type} terlebih dahulu`, { id: 'jika-error', style: { background: '#FF4D4F', color: '#fff' }, }); } setLoading((prev) => ({ ...prev, [type]: true })); router.post( route(`import.${type}`), { file: files[type] }, { forceFormData: true, onSuccess: () => { toast.success(`Data ${type} berhasil diimport!`, { id: 'jika-success', style: { background: '#52C41A', color: '#fff' }, }); setFiles((prev) => ({ ...prev, [type]: null })); setFileInputKey(Date.now()); }, onError: (errors) => { console.error(errors); return toast.error(`Gagal import data ${type}`, { id: 'jika-error', style: { background: '#FF4D4F', color: '#fff' }, }); }, onFinish: () => { setLoading((prev) => ({ ...prev, [type]: false })); }, }, ); }; return (

Import Data

Halaman ini digunakan untuk mengelola data yang akan diimport

{/* Import Program */} Program Pilih file dengan tipe xlsx
handleFileChange(e, 'program') } />
{/* Import Kegiatan */} Kegiatan Pilih file dengan tipe xlsx
handleFileChange(e, 'kegiatan') } />
{/* Import Sub Kegiatan */} Sub Kegiatan Pilih file dengan tipe xlsx
handleFileChange(e, 'subkegiatan') } />
{/* Import Sub Kegiatan */} Rekening Pilih file dengan tipe xlsx
handleFileChange(e, 'rekening') } />
{/* Import Sub Kegiatan */} Sub Rekening Pilih file dengan tipe xlsx
handleFileChange(e, 'subrekening') } />
{/* Import Satuan */} Satuan Pilih file dengan tipe xlsx
handleFileChange(e, 'satuan') } />
{/* Import Sakip */} Sakip Pilih file dengan tipe xlsx
handleFileChange(e, 'sakip') } />
{/* Import pegawai */} pegawai Pilih file dengan tipe xlsx
handleFileChange(e, 'pegawai') } />
); }