44 lines
1.8 KiB
TypeScript
44 lines
1.8 KiB
TypeScript
'use client';
|
|
|
|
import { IamSectionCard } from '@/components/iam/IamSectionCard';
|
|
import { useApi } from '@/lib/hooks/use-api';
|
|
import { iamUser } from '@/lib/api/iam';
|
|
import type { IamUser } from '@/lib/api/types/user';
|
|
|
|
export default function IamUserPage() {
|
|
const { data, loading, error } = useApi(() => iamUser.list({ page: '1', page_size: '20' }));
|
|
const rows = data?.items ?? [];
|
|
|
|
return (
|
|
<IamSectionCard title="用户管理" description="对接 GET /api/v1/iam/user/list。">
|
|
{loading ? <p className="text-sm text-neutral-500">加载中…</p> : null}
|
|
{error ? <p className="text-sm text-red-600">{error}</p> : null}
|
|
{!loading && !error ? (
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full min-w-[520px] border-collapse text-sm">
|
|
<thead>
|
|
<tr className="border-b border-neutral-200 text-left text-neutral-600">
|
|
<th className="py-2 pr-2">用户名</th>
|
|
<th className="py-2 pr-2">姓名</th>
|
|
<th className="py-2 pr-2">状态</th>
|
|
<th className="py-2">ID</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{rows.map((r) => (
|
|
<tr key={r.id} className="border-b border-neutral-100">
|
|
<td className="py-2 pr-2">{r.user_name ?? '—'}</td>
|
|
<td className="py-2 pr-2">{r.real_name ?? '—'}</td>
|
|
<td className="py-2 pr-2">{r.status ?? '—'}</td>
|
|
<td className="py-2 font-mono text-xs text-neutral-500">{r.id}</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
{!rows.length ? <p className="mt-2 text-neutral-500">暂无用户</p> : null}
|
|
</div>
|
|
) : null}
|
|
</IamSectionCard>
|
|
);
|
|
}
|