mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-29 07:53:23 +00:00
feat: gestion des no data dans les table [#33]
This commit is contained in:
@ -14,6 +14,7 @@ const Table = ({
|
||||
selectedRows,
|
||||
isSelectable = false,
|
||||
defaultTheme = 'bg-emerald-50', // Blanc cassé pour les lignes paires
|
||||
emptyMessage = null,
|
||||
}) => {
|
||||
const handlePageChange = (newPage) => {
|
||||
onPageChange(newPage);
|
||||
@ -35,49 +36,55 @@ const Table = ({
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{data?.map((row, rowIndex) => (
|
||||
<tr
|
||||
key={rowIndex}
|
||||
className={`
|
||||
${isSelectable ? 'cursor-pointer' : ''}
|
||||
${
|
||||
selectedRows?.includes(row.id)
|
||||
? 'bg-emerald-200 text-white'
|
||||
: rowIndex % 2 === 0
|
||||
? `${defaultTheme}`
|
||||
: 'bg-stone-50' // Blanc cassé pour les lignes impaires
|
||||
}
|
||||
${isSelectable ? 'hover:bg-emerald-100' : ''}
|
||||
`}
|
||||
onClick={() => {
|
||||
if (isSelectable && onRowClick) {
|
||||
if (selectedRows?.includes(row.id)) {
|
||||
onRowClick({ deselected: true, row });
|
||||
} else {
|
||||
onRowClick(row);
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
{columns.map((column, colIndex) => (
|
||||
<td
|
||||
key={colIndex}
|
||||
className={`py-2 px-4 border-b border-gray-300 text-center text-sm ${
|
||||
{data && data.length > 0 ? (
|
||||
data.map((row, rowIndex) => (
|
||||
<tr
|
||||
key={rowIndex}
|
||||
className={`
|
||||
${isSelectable ? 'cursor-pointer' : ''}
|
||||
${
|
||||
selectedRows?.includes(row.id)
|
||||
? 'text-white'
|
||||
: 'text-gray-700'
|
||||
}`}
|
||||
>
|
||||
{renderCell
|
||||
? renderCell(row, column.name)
|
||||
: column.transform(row)}
|
||||
</td>
|
||||
))}
|
||||
? 'bg-emerald-200 text-white'
|
||||
: rowIndex % 2 === 0
|
||||
? `${defaultTheme}`
|
||||
: 'bg-stone-50'
|
||||
}
|
||||
${isSelectable ? 'hover:bg-emerald-100' : ''}
|
||||
`}
|
||||
onClick={() => {
|
||||
if (isSelectable && onRowClick) {
|
||||
if (selectedRows?.includes(row.id)) {
|
||||
onRowClick({ deselected: true, row });
|
||||
} else {
|
||||
onRowClick(row);
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
{columns.map((column, colIndex) => (
|
||||
<td
|
||||
key={colIndex}
|
||||
className={`py-2 px-4 border-b border-gray-300 text-center text-sm ${
|
||||
selectedRows?.includes(row.id)
|
||||
? 'text-white'
|
||||
: 'text-gray-700'
|
||||
}`}
|
||||
>
|
||||
{renderCell
|
||||
? renderCell(row, column.name)
|
||||
: column.transform(row)}
|
||||
</td>
|
||||
))}
|
||||
</tr>
|
||||
))
|
||||
) : (
|
||||
<tr>
|
||||
<td colSpan={columns.length}>{emptyMessage}</td>
|
||||
</tr>
|
||||
))}
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
{itemsPerPage > 0 && (
|
||||
{itemsPerPage > 0 && data && data.length > 0 && (
|
||||
<Pagination
|
||||
currentPage={currentPage}
|
||||
totalPages={totalPages}
|
||||
|
||||
Reference in New Issue
Block a user