46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import { useRoles } from '../hooks/swrHooks'
|
||
import { CreateField } from '../interfaces/create'
|
||
import RoleService from '../services/RoleService'
|
||
import CustomTable from '../components/CustomTable'
|
||
import { Spinner } from '@fluentui/react-components'
|
||
|
||
export default function Roles() {
|
||
const { roles, isError, isLoading } = useRoles()
|
||
|
||
const createFields: CreateField[] = [
|
||
{ key: 'name', headerName: 'Название', type: 'string', required: true, defaultValue: '' },
|
||
{ key: 'description', headerName: 'Описание', type: 'string', required: false, defaultValue: '' },
|
||
]
|
||
|
||
if (isError) return <div>Произошла ошибка при получении данных.</div>
|
||
if (isLoading) return <Spinner />
|
||
|
||
return (
|
||
<div style={{
|
||
width: '100%',
|
||
height: '100%',
|
||
padding: '1rem'
|
||
}} >
|
||
<CustomTable
|
||
createFields={createFields}
|
||
submitHandler={RoleService.createRole}
|
||
data={roles} columns={[
|
||
{
|
||
name: 'id',
|
||
header: 'id',
|
||
type: 'number'
|
||
},
|
||
{
|
||
name: 'name',
|
||
header: 'Название',
|
||
type: 'string'
|
||
},
|
||
{
|
||
name: 'description',
|
||
header: 'Описание',
|
||
type: 'string'
|
||
},
|
||
]} />
|
||
</div>
|
||
)
|
||
} |