45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import { GridColDef, GridSelectionModel, GridToolbar } from "@mui/x-data-grid";
|
|
import { Skeleton } from "@mui/material";
|
|
|
|
import DataGrid from "@kitUI/datagrid";
|
|
|
|
import type { UsersType } from "@root/api/roles";
|
|
|
|
const columns: GridColDef[] = [
|
|
{ field: "login", headerName: "Логин", width: 100 },
|
|
{ field: "email", headerName: "E-mail", width: 200 },
|
|
{ field: "phoneNumber", headerName: "Номер телефона", width: 200 },
|
|
{ field: "isDeleted", headerName: "Удалено", width: 100 },
|
|
{ field: "createdAt", headerName: "Дата создания", width: 200 },
|
|
];
|
|
|
|
interface Props {
|
|
handleSelectionChange: (selectionModel: GridSelectionModel) => void;
|
|
users: any
|
|
}
|
|
|
|
export default function ServiceUsersDG({ handleSelectionChange, users }: Props) {
|
|
if (!users) {
|
|
return <Skeleton>Loading...</Skeleton>;
|
|
}
|
|
const gridData = users.users.map((user:any) => ({
|
|
login: user.login,
|
|
email: user.email,
|
|
phoneNumber: user.phoneNumber,
|
|
isDeleted: `${user.isDeleted ? "true" : "false"}`,
|
|
createdAt: user.createdAt,
|
|
}));
|
|
|
|
return (
|
|
<DataGrid
|
|
sx={{ maxWidth: "90%", mt: "30px" }}
|
|
getRowId={(users: any) => users.login}
|
|
checkboxSelection={true}
|
|
rows={gridData}
|
|
columns={columns}
|
|
components={{ Toolbar: GridToolbar }}
|
|
onSelectionModelChange={handleSelectionChange}
|
|
/>
|
|
);
|
|
}
|