vietreport-admin/solution-erp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[CLAUDE] FE: DataTable skeleton rows khi loading (thay 'Đang tải…' text đơn giản)
All checks were successful
Deploy SOLUTION_ERP / build-deploy (push) Successful in 2m36s
Details

Browse Source
This commit is contained in:
pqhuy1987
2026-04-21 15:06:40 +07:00
parent 0e5b5cd670
commit c1c23619de
2 changed files with 22 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
fe-admin/src/components/DataTable.tsx
View File

@ -66,16 +66,19 @@ export function DataTable<T>({
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{isLoading && ( {isLoading &&
<tr> Array.from({ length: 5 }).map((_, i) => (
<td colSpan={columns.length} className="px-3 py-8 text-center text-slate-500"> <tr key={`sk-${i}`} className="border-t border-slate-100">
Đang tải… {columns.map(c => (
</td> <td key={c.key} className="px-3 py-3">
</tr> <div className="h-3 animate-pulse rounded bg-slate-100" />
)} </td>
))}
</tr>
))}
{!isLoading && rows.length === 0 && ( {!isLoading && rows.length === 0 && (
<tr> <tr>
<td colSpan={columns.length} className="px-3 py-8 text-center text-slate-500"> <td colSpan={columns.length} className="px-3 py-10 text-center text-sm text-slate-400">
{empty ?? 'Không có dữ liệu'} {empty ?? 'Không có dữ liệu'}
</td> </td>
</tr> </tr>

19
fe-user/src/components/DataTable.tsx
View File

@ -66,16 +66,19 @@ export function DataTable<T>({
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{isLoading && ( {isLoading &&
<tr> Array.from({ length: 5 }).map((_, i) => (
<td colSpan={columns.length} className="px-3 py-8 text-center text-slate-500"> <tr key={`sk-${i}`} className="border-t border-slate-100">
Đang tải… {columns.map(c => (
</td> <td key={c.key} className="px-3 py-3">
</tr> <div className="h-3 animate-pulse rounded bg-slate-100" />
)} </td>
))}
</tr>
))}
{!isLoading && rows.length === 0 && ( {!isLoading && rows.length === 0 && (
<tr> <tr>
<td colSpan={columns.length} className="px-3 py-8 text-center text-slate-500"> <td colSpan={columns.length} className="px-3 py-10 text-center text-sm text-slate-400">
{empty ?? 'Không có dữ liệu'} {empty ?? 'Không có dữ liệu'}
</td> </td>
</tr> </tr>