43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { useEffect, useState } from "react"
|
|
import { Box, Button } from "@mui/material"
|
|
import DataTable from "../components/DataTable"
|
|
import { GridColDef } from "@mui/x-data-grid"
|
|
import UserService from "../services/UserService"
|
|
|
|
export default function Users() {
|
|
const [users, setUsers] = useState<any>(null)
|
|
|
|
const getUsers = async () => {
|
|
await UserService.getUsers().then(response => {
|
|
setUsers(response.data)
|
|
})
|
|
}
|
|
|
|
const columns: GridColDef[] = [
|
|
{ field: 'id', headerName: 'ID', type: "number", width: 70 },
|
|
{ field: 'email', headerName: 'Email', width: 130 },
|
|
{ field: 'login', headerName: 'Логин', width: 130 },
|
|
{ field: 'phone', headerName: 'Телефон', width: 90 },
|
|
{ field: 'name', headerName: 'Имя', width: 90 },
|
|
{ field: 'surname', headerName: 'Фамилия', width: 90 },
|
|
{ field: 'is_active', headerName: 'Активен', type: "boolean", width: 90 },
|
|
{
|
|
field: 'role_id',
|
|
headerName: 'Роль',
|
|
valueGetter: (value, row) => `${value}`,
|
|
width: 90
|
|
},
|
|
];
|
|
|
|
return (
|
|
<Box>
|
|
<Button onClick={() => getUsers()}>
|
|
Get users
|
|
</Button>
|
|
|
|
{users &&
|
|
<DataTable rows={users} columns={columns}/>
|
|
}
|
|
</Box>
|
|
)
|
|
} |