91 lines
5.5 KiB
JavaScript
91 lines
5.5 KiB
JavaScript
import React, { useState } from 'react';
|
|
import { Head } from '@inertiajs/react';
|
|
import ModalInput from '@/Components/ModalInput';
|
|
import Layout from '@/Components/Layout'
|
|
|
|
|
|
export default function ManualPayment({ santri, penalty, bill, fields, options }) {
|
|
const [selectedSantri, setSelectedSantri] = useState(null);
|
|
// console.log(LeftSidebar)
|
|
return (
|
|
<div className='text-red-500'>
|
|
{/* <Layout /> */}
|
|
<Head title="Manual Payment" />
|
|
<ModalInput showPayments={true} fields={fields} options={options} tableName='payments' initialData={selectedSantri} onClose={() => setSelectedSantri(null)} />
|
|
{santri && santri.length > 0 ? santri.map((item, i) => (
|
|
<div key={i} className="p-4 border-b">
|
|
<p>Nis: {item.user.nis}</p>
|
|
<p><strong>Santri:</strong> {item.nama}</p>
|
|
|
|
{item.payments && item.payments.length > 0 ? (
|
|
<div className="ml-4">
|
|
<p className="font-semibold">Payments:</p>
|
|
{item.payments.map((payment) => (
|
|
<div key={payment.id} className="ml-4">
|
|
{payment.detail_payments.map((detail) => (
|
|
<div key={detail.id}>
|
|
<p>{detail.penalty ? `Denda: Rp ${detail.penalty}` : 'Tidak ada denda'}</p>
|
|
<p>{detail.status}</p>
|
|
|
|
<label htmlFor="my_modal_7" className="btn">show pembayaran</label>
|
|
|
|
<input type="checkbox" id="my_modal_7" className="modal-toggle" />
|
|
<div className="modal" role="dialog">
|
|
<div className="modal-box">
|
|
<h3 className="text-lg font-bold">data pembayaran</h3>
|
|
<p className="py-4">{detail.payment_type?.payment_type}</p>
|
|
<div className="overflow-x-auto">
|
|
<table className="table">
|
|
<thead>
|
|
<tr>
|
|
<th>tipe pembayaran</th>
|
|
<th>tahun</th>
|
|
<th>bulan</th>
|
|
<th>denda</th>
|
|
<th>status pemabayaran</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<th>{detail.payment_type?.payment_type}</th>
|
|
<td className='text-center'>{detail.payment_year}</td>
|
|
<td className='text-center'>{detail.payment_month}</td>
|
|
<td className='text-center'>{detail.penalty}</td>
|
|
<td className='text-center'>
|
|
<div className='p-2 bg-red-600 text-white rounded-md'>
|
|
{detail.status}
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<label className="modal-backdrop" htmlFor="my_modal_7">Close</label>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
))}
|
|
</div>
|
|
) : <p className="ml-4 text-gray-500">Tidak ada pembayaran.</p>}
|
|
|
|
<div>
|
|
<button className='btn btn-accent text-white mt-2' onClick={() => {
|
|
setSelectedSantri({
|
|
id: item.id,
|
|
nama: item.nama,
|
|
alamat: item.alamat,
|
|
status_santri: item.status_santri,
|
|
role_santri: item.role_santri,
|
|
nis: item.user?.nis
|
|
})
|
|
document.getElementById('modal_input').checked = true
|
|
}}>Bayar</button>
|
|
</div>
|
|
</div>
|
|
)) : <p>Tidak ada data santri.</p>}
|
|
</div>
|
|
);
|
|
}
|