feat(FE-321): create ClosingGeneralInformationTable component

This commit is contained in:
ValdiANS
2025-12-06 16:53:54 +07:00
parent 9888dc4356
commit 5bb366026d
@@ -0,0 +1,100 @@
import { ClosingGeneralInformation } from '@/types/api/closing';
interface ClosingGeneralInformationProps {
initialValue?: ClosingGeneralInformation;
}
const ClosingGeneralInformationTable = ({
initialValue,
}: ClosingGeneralInformationProps) => {
return (
<div className='w-full my-4 @container'>
<div className='flex flex-col @sm:flex-row gap-4'>
<div className='w-full'>
<div className='overflow-x-auto'>
<table className='table table-zebra table-sm'>
<tbody>
<tr>
<td>Lokasi</td>
<td>:</td>
<td>{initialValue?.location_name}</td>
</tr>
<tr>
<td>Periode</td>
<td>:</td>
<td>{initialValue?.period}</td>
</tr>
<tr>
<td>Kategori</td>
<td>:</td>
<td>{initialValue?.project_category}</td>
</tr>
<tr>
<td>Populasi</td>
<td>:</td>
<td>{initialValue?.population} Ekor</td>
</tr>
<tr>
<td>Jenis Project</td>
<td>:</td>
<td>{initialValue?.project_type}</td>
</tr>
<tr className='table-row @sm:hidden'>
<td>Kandang Aktif</td>
<td>:</td>
<td>{initialValue?.active_house_count} Kandang</td>
</tr>
<tr className='table-row @sm:hidden'>
<td>Status Pembayaran Penjualan</td>
<td>:</td>
<td>{initialValue?.sales_payment_status}</td>
</tr>
<tr className='table-row @sm:hidden'>
<td>Status Project</td>
<td>:</td>
<td>{initialValue?.project_status}</td>
</tr>
<tr className='table-row @sm:hidden'>
<td>Status Closing</td>
<td>:</td>
<td>{initialValue?.closing_status}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div className='w-full hidden @sm:block'>
<div className='overflow-x-auto'>
<table className='table table-zebra table-sm'>
<tbody>
<tr>
<td>Kandang Aktif</td>
<td>:</td>
<td>{initialValue?.active_house_count} Kandang</td>
</tr>
<tr>
<td>Status Pembayaran Penjualan</td>
<td>:</td>
<td>{initialValue?.sales_payment_status}</td>
</tr>
<tr>
<td>Status Project</td>
<td>:</td>
<td>{initialValue?.project_status}</td>
</tr>
<tr>
<td>Status Closing</td>
<td>:</td>
<td>{initialValue?.closing_status}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
);
};
export default ClosingGeneralInformationTable;