refactor(ui): align Files page with consistency baseline (ui-consistency ticket 03)

Delete confirmations already existed (d7514f4), so no behavior fix was
needed. Switch empty states to antd Empty (table + category tree) and
apply the 20-row pagination standard.
This commit is contained in:
sinohqb 2026-08-05 15:40:54 +08:00
parent 15d0d127ae
commit 2e78c4befd
4 changed files with 26 additions and 40 deletions

View File

@ -5,10 +5,10 @@
**Blocked by:** 01
**Acceptance criteria:**
- [ ] 删除分类、删除文件均有 Popconfirm 确认(行为修正,记录在提交信息
- [ ] 上传/下载交互保持不变,外壳对齐 PageWrapper 标准
- [ ] 空态 Empty无分类/无文件时)
- [ ] `tsc --noEmit` 通过
- [x] 删除分类、删除文件均有 Popconfirm 确认(核实发现 d7514f4 已有确认,票据前提过时,无需行为修正)
- [x] 上传/下载交互保持不变,外壳对齐 PageWrapper 标准
- [x] 空态 Empty无分类/无文件时)
- [x] `tsc --noEmit` 通过
- [ ] t480 走查:分类树 CRUD + 上传下载 golden path
**检查点**:本票完成后暂停,评审 FormDrawer/usePolling API 与三页走查结果,用户确认后再继续 0408。

View File

@ -5,7 +5,7 @@ import {
FolderOutlined,
PlusOutlined,
} from '@ant-design/icons'
import { Button, Popconfirm, Tooltip, Tree } from 'antd'
import { Button, Empty, Popconfirm, Tooltip, Tree } from 'antd'
import type { DataNode } from 'antd/es/tree'
import type { FileCategory } from '../../api'
import { colors, fontSizes } from '../../tokens'
@ -109,15 +109,23 @@ export default function FileCategoryTree({
</Tooltip>
</div>
<div className="files-category-scroll">
<Tree
defaultExpandAll
treeData={treeData}
selectedKeys={[selectedCategoryId ?? ALL_FILES_KEY]}
onSelect={(keys) => {
const key = keys[0]?.toString()
onSelect(!key || key === ALL_FILES_KEY ? null : key)
}}
/>
{categories.length === 0 ? (
<Empty
description="暂无分类,点击右上角新建"
image={Empty.PRESENTED_IMAGE_SIMPLE}
style={{ marginTop: 24 }}
/>
) : (
<Tree
defaultExpandAll
treeData={treeData}
selectedKeys={[selectedCategoryId ?? ALL_FILES_KEY]}
onSelect={(keys) => {
const key = keys[0]?.toString()
onSelect(!key || key === ALL_FILES_KEY ? null : key)
}}
/>
)}
</div>
</aside>
)

View File

@ -3,11 +3,10 @@ import {
DownloadOutlined,
FileOutlined,
FolderOutlined,
InboxOutlined,
ReloadOutlined,
UploadOutlined,
} from '@ant-design/icons'
import { Button, Grid, Popconfirm, Space, Table, Tag, Tooltip } from 'antd'
import { Button, Empty, Grid, Popconfirm, Space, Table, Tag, Tooltip } from 'antd'
import type { ColumnsType } from 'antd/es/table'
import { useMemo } from 'react'
import type { FileCategory, FileRecord } from '../../api'
@ -192,19 +191,12 @@ export default function FileTable({
rowKey="id"
loading={loading}
scroll={screens.md ? { x: 900 } : undefined}
pagination={files.length > 10 ? {
pageSize: 15,
showSizeChanger: true,
pageSizeOptions: ['15', '30', '50'],
pagination={files.length > 20 ? {
pageSize: 20,
showTotal: (total) => `${total} 个文件`,
} : false}
locale={{
emptyText: (
<div className="files-empty">
<InboxOutlined />
<span></span>
</div>
),
emptyText: <Empty description="暂无文件" image={Empty.PRESENTED_IMAGE_SIMPLE} />,
}}
/>
</div>

View File

@ -326,20 +326,6 @@ body {
display: none;
}
.files-empty {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
padding: 40px;
color: #8c8c8c;
}
.files-empty .anticon {
font-size: 40px;
color: #bfbfbf;
}
.files-upload-category {
display: grid;
grid-template-columns: auto minmax(0, 1fr);