UserDashboard/components/tables/components-tables-simple.tsx
2025-02-21 19:54:48 +08:00

58 lines
2.4 KiB
TypeScript

'use client';
import IconTrashLines from '@/components/icon/icon-trash-lines';
import PanelCodeHighlight from '@/components/panel-code-highlight';
import Tippy from '@tippyjs/react';
import 'tippy.js/dist/tippy.css';
import React from 'react';
import IconEye from '../icon/icon-eye';
import { formatUnixTimestamp } from "@/utils/helpers"
const ComponentsTablesSimple = ({ tableData = [] }: { tableData: any[] }) => {
return (
<PanelCodeHighlight title="Chint Sites">
<div className="table-responsive mb-5">
<table>
<thead>
<tr>
<th>Site Name</th>
<th>Inverters</th>
<th>Status</th>
<th>Created At</th>
<th>Updated At</th>
<th className="text-center">Action</th>
</tr>
</thead>
<tbody>
{tableData.map((data) => (
<tr key={data.id}>
<td>
<div className="whitespace-nowrap">{data.name}</div>
</td>
<td>{data.deviceQty.inverterQty}</td>
<td>
<div className={`whitespace-nowrap ${ data.status !== 1 ? "text-danger" : "text-success" }`} >
{data.statusLabel}
</div>
</td>
<td>{formatUnixTimestamp(data.createdAt)}</td>
<td>{formatUnixTimestamp(data.updatedAt)}</td>
<td className="text-center">
<Tippy content="Delete">
<button type="button">
<IconTrashLines className="m-auto" />
</button>
</Tippy>
</td>
</tr>
))}
</tbody>
</table>
</div>
</PanelCodeHighlight>
);
};
export default ComponentsTablesSimple;