43 lines
1.0 KiB
TypeScript
43 lines
1.0 KiB
TypeScript
|
import DT, { type Config, type ConfigColumns } from 'datatables.net-dt'
|
||
|
|
import DataTable from 'datatables.net-react'
|
||
|
|
import React from 'react'
|
||
|
|
|
||
|
|
export type UiTableProperties = {
|
||
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||
|
|
data: any[]
|
||
|
|
columns: ConfigColumns[]
|
||
|
|
slots?: any // eslint-disable-line @typescript-eslint/no-explicit-any
|
||
|
|
options?: Config
|
||
|
|
title: string
|
||
|
|
}
|
||
|
|
|
||
|
|
export const UiTable: React.FC<UiTableProperties> = ({
|
||
|
|
data,
|
||
|
|
columns,
|
||
|
|
slots,
|
||
|
|
options,
|
||
|
|
title,
|
||
|
|
}) => {
|
||
|
|
DataTable.use(DT)
|
||
|
|
return (
|
||
|
|
<div className="rounded-lg bg-white p-5 shadow-md">
|
||
|
|
<h3 className="py-1 font-semibold text-[#4C5CA0]">{title}</h3>
|
||
|
|
<div className="rounded-lg">
|
||
|
|
<DataTable
|
||
|
|
className="cell-border"
|
||
|
|
data={data}
|
||
|
|
columns={columns}
|
||
|
|
slots={slots}
|
||
|
|
options={{
|
||
|
|
paging: true,
|
||
|
|
searching: true,
|
||
|
|
ordering: true,
|
||
|
|
info: true,
|
||
|
|
...options,
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|