Убарана лишняя буква из index.html, обновлен редактор ролей и view

This commit is contained in:
Александр Сироткин 2022-01-17 21:46:51 +05:00
parent 090c82395c
commit e6264ba638
3 changed files with 52 additions and 35 deletions

View File

@ -17,4 +17,3 @@
<div id="root"></div> <div id="root"></div>
</body> </body>
</html> </html>
ц

View File

@ -7,36 +7,54 @@ import PermissionView from './PermissionView'
export type RoleViewProps = { export type RoleViewProps = {
role?: UserRoleDto role?: UserRoleDto
parentRole?: UserRoleDto
} }
export const RoleView = memo<RoleViewProps>(({ role, parentRole }) => role ? ( export const RoleView = memo<RoleViewProps>(({ role }) => {
<Tooltip const hasIncludedRoles = (role?.roles?.length && role.roles.length > 0) ? 1 : 0
overlayInnerStyle={{ width: '400px' }} const hasPermissions = (role?.permissions?.length && role.permissions.length > 0) ? 1 : 0
title={
<Grid>
<GridItem row={1} col={1}>Название:</GridItem>
<GridItem row={1} col={2}>{role.caption}</GridItem>
<GridItem row={2} col={1}>Роль-родитель:</GridItem> return role ? (
<GridItem row={2} col={2}>{parentRole?.caption ?? 'Отсутствует'}</GridItem> <Tooltip
overlayInnerStyle={{ width: '400px' }}
title={
<Grid>
<GridItem row={1} col={1}>Название:</GridItem>
<GridItem row={1} col={2}>{role.caption}</GridItem>
<GridItem row={3} col={1}>Тип:</GridItem> <GridItem row={2} col={1}>Включённые роли:</GridItem>
<GridItem row={3} col={2}>{role.idType}</GridItem> {hasIncludedRoles ? (
<GridItem row={3} col={1} colSpan={3}>
{role.roles?.map((role, i) => (
<Tag key={i} color={'blue'}>
<RoleView role={role} />
</Tag>
))}
</GridItem>
) : (
<GridItem row={2} col={2}>Отсутствуют</GridItem>
)}
<GridItem row={4} col={1}>Разрешения:</GridItem> <GridItem row={3 + hasIncludedRoles} col={1}>Тип:</GridItem>
<GridItem row={5} col={1} colSpan={3}> <GridItem row={3 + hasIncludedRoles} col={2}>{role.idType}</GridItem>
{role.permissions?.map((permission, i) => (
<Tag key={i} color={'blue'}> <GridItem row={4 + hasIncludedRoles} col={1}>Разрешения:</GridItem>
<PermissionView info={permission} /> {hasPermissions ? (
</Tag> <GridItem row={5 + hasIncludedRoles} col={1} colSpan={3}>
)) ?? '-'} {role.permissions?.map((permission, i) => (
</GridItem> <Tag key={i} color={'blue'}>
</Grid> <PermissionView info={permission} />
} </Tag>
> ))}
{role.caption} </GridItem>
</Tooltip> ) : (
) : ( <GridItem row={4 + hasIncludedRoles} col={2}>Отсутствуют</GridItem>
<Tooltip title={'нет данных'}>-</Tooltip> )}
)) </Grid>
}
>
{role.caption}
</Tooltip>
) : (
<Tooltip title={'нет данных'}>-</Tooltip>
)
})

View File

@ -1,9 +1,9 @@
import { memo, useEffect, useState } from 'react' import { memo, useEffect, useState } from 'react'
import LoaderPortal from '../../components/LoaderPortal' import LoaderPortal from '../../components/LoaderPortal'
import { PermissionView } from '../../components/views' import { PermissionView, RoleView } from '../../components/views'
import { invokeWebApiWrapperAsync } from '../../components/factory' import { invokeWebApiWrapperAsync } from '../../components/factory'
import { EditableTable, makeActionHandler, makeColumn, makeSelectColumn, makeTagColumn } from '../../components/Table' import { EditableTable, makeActionHandler, makeColumn, makeTagColumn } from '../../components/Table'
import { AdminPermissionService, AdminUserRoleService } from '../../services/api' import { AdminPermissionService, AdminUserRoleService } from '../../services/api'
import { arrayOrDefault } from '../../utils' import { arrayOrDefault } from '../../utils'
import { min1 } from '../../utils/validationRules' import { min1 } from '../../utils/validationRules'
@ -20,12 +20,12 @@ export const RoleController = memo(() => {
} }
useEffect(() => { useEffect(() => {
const options = roles?.map((r) => ({ value: r.id, label: r.caption })) ?? []
setColumns([ setColumns([
makeColumn('Название', 'caption', { width: 200, editable: true, formItemRules: min1 }), makeColumn('Название', 'caption', { width: 200, editable: true, formItemRules: min1 }),
makeSelectColumn('Роль-родитель', 'idParent', options, options[0], { makeTagColumn('Включённые роли', 'roles', roles, 'id', 'caption', {
width: 200, width: 200,
editable: true editable: true,
render: (role) => <RoleView role={role} />
}, { allowClear: true }), }, { allowClear: true }),
makeTagColumn('Разрешения', 'permissions', permissions, 'id', 'name', { makeTagColumn('Разрешения', 'permissions', permissions, 'id', 'name', {
editable: true, editable: true,
@ -58,8 +58,8 @@ export const RoleController = memo(() => {
return ( return (
<LoaderPortal show={showLoader}> <LoaderPortal show={showLoader}>
<EditableTable <EditableTable
size={'small'}
bordered bordered
size={'small'}
columns={columns} columns={columns}
dataSource={roles} dataSource={roles}
onRowAdd={makeActionHandler('insert', handlerProps)} onRowAdd={makeActionHandler('insert', handlerProps)}