fix: clean knowledge base table layout
Some checks failed
Deploy Admin Frontend / build-and-deploy (push) Failing after 6s

This commit is contained in:
WangDL 2026-05-22 16:04:35 +08:00
parent 95d8d3cbb4
commit c235f4822d

View File

@ -1,7 +1,7 @@
import { useState } from 'react' import { useState } from 'react'
import { useQuery, useQueryClient } from '@tanstack/react-query' import { useQuery, useQueryClient } from '@tanstack/react-query'
import { Table, Tag, Typography, Button, Space, App } from 'antd' import { Table, Tag, Typography, Button, Space, App } from 'antd'
import { ReloadOutlined, EyeOutlined, DeleteOutlined } from '@ant-design/icons' import { ReloadOutlined, DeleteOutlined } from '@ant-design/icons'
import { getKnowledgeBases, deleteKnowledgeBase, type KnowledgeBase } from '@/services/knowledge-api' import { getKnowledgeBases, deleteKnowledgeBase, type KnowledgeBase } from '@/services/knowledge-api'
import dayjs from 'dayjs' import dayjs from 'dayjs'
@ -23,32 +23,28 @@ function KBPage() {
onOk: async () => { await deleteKnowledgeBase(kb.id); qc.invalidateQueries({ queryKey: ['knowledge-bases'] }); message.success('已删除') }, onOk: async () => { await deleteKnowledgeBase(kb.id); qc.invalidateQueries({ queryKey: ['knowledge-bases'] }); message.success('已删除') },
}) })
const columns = [
{ title: '名称', dataIndex: 'title', ellipsis: true, render: (t: string, r: KnowledgeBase) => <a onClick={() => message.info(`ID: ${r.id}`)}>{t}</a> },
{ title: '用户', dataIndex: ['user', 'nickname'], width: 120, render: (_: any, r: KnowledgeBase) => r.user?.nickname || r.user?.email || '-' },
{ title: '知识点', dataIndex: 'itemCount', width: 80, align: 'center' as const },
{ title: '状态', dataIndex: 'status', width: 80, render: (s: string) => <Tag color={s === 'active' ? 'green' : 'default'}>{s}</Tag> },
{ title: '创建时间', dataIndex: 'createdAt', width: 160, render: (d: string) => dayjs(d).format('YYYY-MM-DD HH:mm') },
{
title: '操作', width: 100,
render: (_: any, r: KnowledgeBase) => (
<Space>
<Button type="link" size="small" icon={<EyeOutlined />}></Button>
<Button type="link" size="small" danger icon={<DeleteOutlined />} onClick={() => handleDelete(r)} />
</Space>
),
},
]
return ( return (
<div> <div>
<div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 16 }}> <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
<Title level={5} style={{ margin: 0 }}></Title> <Title level={5} style={{ margin: 0 }}></Title>
<Button icon={<ReloadOutlined />} onClick={() => qc.invalidateQueries({ queryKey: ['knowledge-bases'] })}></Button> <Button icon={<ReloadOutlined />} onClick={() => qc.invalidateQueries({ queryKey: ['knowledge-bases'] })}></Button>
</div> </div>
<Table <Table<KnowledgeBase>
dataSource={data?.items || []} columns={columns} rowKey="id" loading={isLoading} dataSource={data?.items || []} loading={isLoading} rowKey="id"
pagination={{ current: page, pageSize, total: data?.total || 0, showSizeChanger: true, showTotal: t => `${t}`, onChange: (p, ps) => { setPage(p); setPageSize(ps) } }} pagination={{ current: page, pageSize, total: data?.total || 0, showSizeChanger: true, showTotal: t => `${t}`, onChange: (p, ps) => { setPage(p); setPageSize(ps) } }}
columns={[
{ title: '名称', dataIndex: 'title', width: 200, ellipsis: true },
{ title: '用户', width: 120, render: (_, r) => r.user?.nickname || r.user?.email || '-' },
{ title: '知识点', dataIndex: 'itemCount', width: 80, align: 'center' },
{ title: '状态', dataIndex: 'status', width: 80, render: (s: string) => <Tag color={s === 'active' ? 'green' : 'default'}>{s}</Tag> },
{ title: '创建时间', dataIndex: 'createdAt', width: 170, render: (d: string) => dayjs(d).format('YYYY-MM-DD HH:mm') },
{
title: '操作', width: 80, align: 'center',
render: (_, r) => (
<Button type="link" size="small" danger icon={<DeleteOutlined />} onClick={() => handleDelete(r)} />
),
},
]}
/> />
</div> </div>
) )