import React, { useState, useEffect } from 'react'; import { Head } from '@inertiajs/react'; import ModalInput from '@/Components/ModalInput'; import { useDispatch } from 'react-redux'; import { setPageTitle } from '@/Components/features/common/headerSlice'; import { CurrencyDollarIcon } from '@heroicons/react/24/outline' export default function ManualPayment({ santri, fields, options }) { const [selectedSantri, setSelectedSantri] = useState(null); const [searchTerm, setSearchTerm] = useState(''); const [filteredSantri, setFilteredSantri] = useState([]); const [selectedPayments, setSelectedPayments] = useState(null); const dispatch = useDispatch(); useEffect(() => { dispatch(setPageTitle("Data Payment")); }, [dispatch]); // console.log(santri.id) useEffect(() => { if (santri) { setFilteredSantri( santri.filter(item => item.nama.toLowerCase().includes(searchTerm.toLowerCase()) || item.nis.toString().includes(searchTerm) ) ); } }, [searchTerm, santri]); const handleSearch = (e) => { setSearchTerm(e.target.value); }; return (
setSelectedSantri(null)} />

Data Pembayaran

Overview
{filteredSantri.length > 0 ? ( filteredSantri.map((item, i) => ( )) ) : ( )}
Nama Nis Status Aksi
Avatar
{item.nama}
{item.level == 1 ? 'Admin' : 'User'}
 {item.nis}
{item.status_santri || "Open"}
Tidak ada data santri.
{santri?.links?.map((link, index) => ( ))}
{selectedPayments && (

Riwayat Pembayaran

{selectedPayments.map((payment, idx) => payment.detail_payments.map((detail) => ( )) )}
Tipe Pembayaran Tahun Bulan Denda Status
{detail.payment_type?.payment_type} {detail.payment_year} {detail.payment_month} {detail.penalty} {detail.status}
{/*
*/}
)}
); }