feat: replace action buttons with dropdown menu in test list
Колонка с названием теста теперь занимает всю свободную ширину. Три действия (Открыть, Изменить, Пройти тест) убраны в выпадающее меню по кнопке «…». Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
import { EditOutlined, PlayCircleOutlined, PlusOutlined } from '@ant-design/icons'
|
import { EditOutlined, MoreOutlined, PlayCircleOutlined, PlusOutlined } from '@ant-design/icons'
|
||||||
import { useQuery } from '@tanstack/react-query'
|
import { useQuery } from '@tanstack/react-query'
|
||||||
import { Button, Space, Spin, Table, Tag, Typography } from 'antd'
|
import { Button, Dropdown, Spin, Table, Typography } from 'antd'
|
||||||
import type { ColumnsType } from 'antd/es/table'
|
import type { ColumnsType } from 'antd/es/table'
|
||||||
import { useNavigate } from 'react-router-dom'
|
import { useNavigate } from 'react-router-dom'
|
||||||
|
|
||||||
@@ -58,28 +58,36 @@ export default function TestList() {
|
|||||||
{
|
{
|
||||||
title: '',
|
title: '',
|
||||||
key: 'actions',
|
key: 'actions',
|
||||||
width: 200,
|
width: 60,
|
||||||
|
align: 'center',
|
||||||
render: (_: unknown, record: TestListItem) => (
|
render: (_: unknown, record: TestListItem) => (
|
||||||
<Space>
|
<Dropdown
|
||||||
<Button size="small" onClick={() => navigate(`/tests/${record.id}`)}>
|
menu={{
|
||||||
Открыть
|
items: [
|
||||||
</Button>
|
{
|
||||||
<Button
|
key: 'open',
|
||||||
size="small"
|
label: 'Открыть',
|
||||||
icon={<EditOutlined />}
|
onClick: () => navigate(`/tests/${record.id}`),
|
||||||
onClick={() => navigate(`/tests/${record.id}/edit`)}
|
},
|
||||||
>
|
{
|
||||||
Изменить
|
key: 'edit',
|
||||||
</Button>
|
icon: <EditOutlined />,
|
||||||
<Button
|
label: 'Изменить',
|
||||||
size="small"
|
onClick: () => navigate(`/tests/${record.id}/edit`),
|
||||||
type="primary"
|
},
|
||||||
icon={<PlayCircleOutlined />}
|
{ type: 'divider' },
|
||||||
onClick={() => navigate(`/tests/${record.id}/take`)}
|
{
|
||||||
>
|
key: 'take',
|
||||||
Пройти тест
|
icon: <PlayCircleOutlined />,
|
||||||
</Button>
|
label: 'Пройти тест',
|
||||||
</Space>
|
onClick: () => navigate(`/tests/${record.id}/take`),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}}
|
||||||
|
trigger={['click']}
|
||||||
|
>
|
||||||
|
<Button size="small" icon={<MoreOutlined />} />
|
||||||
|
</Dropdown>
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
@@ -90,7 +98,7 @@ export default function TestList() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div style={{ maxWidth: 1000, margin: '0 auto', padding: 24 }}>
|
<div style={{ maxWidth: 1000, margin: '0 auto', padding: 24 }}>
|
||||||
<Space style={{ width: '100%', justifyContent: 'space-between', marginBottom: 16 }}>
|
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
|
||||||
<Title level={2} style={{ margin: 0 }}>
|
<Title level={2} style={{ margin: 0 }}>
|
||||||
Тесты
|
Тесты
|
||||||
</Title>
|
</Title>
|
||||||
@@ -101,7 +109,7 @@ export default function TestList() {
|
|||||||
>
|
>
|
||||||
Создать тест
|
Создать тест
|
||||||
</Button>
|
</Button>
|
||||||
</Space>
|
</div>
|
||||||
|
|
||||||
<Table
|
<Table
|
||||||
dataSource={tests}
|
dataSource={tests}
|
||||||
|
|||||||
Reference in New Issue
Block a user