You've already forked DataMate
feat(knowledge): 添加知识管理功能模块
- 实现知识集的创建、编辑、删除功能 - 实现知识条目的创建、编辑、删除功能 - 添加知识集详情页面展示功能 - 实现知识条目导入数据集文件功能 - 添加知识管理主页列表展示功能 - 实现知识集和知识条目的状态管理 - 集成标签管理和搜索过滤功能 - 添加知识条目的批量操作支持
This commit is contained in:
@@ -0,0 +1,249 @@
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { Card, Button, Table, Tooltip, Tag, App } from "antd";
|
||||
import { DeleteOutlined, EditOutlined } from "@ant-design/icons";
|
||||
import { useNavigate } from "react-router";
|
||||
import CardView from "@/components/CardView";
|
||||
import { SearchControls } from "@/components/SearchControls";
|
||||
import TagManager from "@/components/business/TagManagement";
|
||||
import useFetchData from "@/hooks/useFetchData";
|
||||
import {
|
||||
deleteKnowledgeSetByIdUsingDelete,
|
||||
queryKnowledgeSetsUsingGet,
|
||||
} from "../knowledge-management.api";
|
||||
import {
|
||||
knowledgeStatusOptions,
|
||||
mapKnowledgeSet,
|
||||
KnowledgeSetView,
|
||||
} from "../knowledge-management.const";
|
||||
import { KnowledgeSet } from "../knowledge-management.model";
|
||||
import CreateKnowledgeSet from "../components/CreateKnowledgeSet";
|
||||
import {
|
||||
createDatasetTagUsingPost,
|
||||
deleteDatasetTagUsingDelete,
|
||||
queryDatasetTagsUsingGet,
|
||||
updateDatasetTagUsingPut,
|
||||
} from "@/pages/DataManagement/dataset.api";
|
||||
|
||||
export default function KnowledgeManagementPage() {
|
||||
const navigate = useNavigate();
|
||||
const { message } = App.useApp();
|
||||
const [viewMode, setViewMode] = useState<"card" | "list">("card");
|
||||
const [isEdit, setIsEdit] = useState(false);
|
||||
const [currentSet, setCurrentSet] = useState<KnowledgeSet | null>(null);
|
||||
const [tags, setTags] = useState<string[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchTags = async () => {
|
||||
const { data } = await queryDatasetTagsUsingGet();
|
||||
setTags(Array.isArray(data) ? data.map((tag) => tag.name) : []);
|
||||
};
|
||||
fetchTags();
|
||||
}, []);
|
||||
|
||||
const filterOptions = useMemo(
|
||||
() => [
|
||||
{
|
||||
key: "status",
|
||||
label: "状态",
|
||||
options: knowledgeStatusOptions,
|
||||
},
|
||||
{
|
||||
key: "tags",
|
||||
label: "标签",
|
||||
mode: "multiple",
|
||||
options: tags.map((tag) => ({ label: tag, value: tag })),
|
||||
},
|
||||
],
|
||||
[tags]
|
||||
);
|
||||
|
||||
const {
|
||||
loading,
|
||||
tableData,
|
||||
searchParams,
|
||||
pagination,
|
||||
fetchData,
|
||||
setSearchParams,
|
||||
handleFiltersChange,
|
||||
handleKeywordChange,
|
||||
} = useFetchData<KnowledgeSetView>(
|
||||
queryKnowledgeSetsUsingGet,
|
||||
mapKnowledgeSet,
|
||||
30000,
|
||||
false,
|
||||
[],
|
||||
0
|
||||
);
|
||||
|
||||
const handleDeleteSet = async (setId: string) => {
|
||||
await deleteKnowledgeSetByIdUsingDelete(setId);
|
||||
message.success("知识集删除成功");
|
||||
fetchData({ pageOffset: 0 });
|
||||
};
|
||||
|
||||
const operations = [
|
||||
{
|
||||
key: "edit",
|
||||
label: "编辑",
|
||||
icon: <EditOutlined />,
|
||||
onClick: (item: KnowledgeSetView) => {
|
||||
setIsEdit(true);
|
||||
setCurrentSet({
|
||||
...(item as unknown as KnowledgeSet),
|
||||
status: item.rawStatus,
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
key: "delete",
|
||||
label: "删除",
|
||||
danger: true,
|
||||
icon: <DeleteOutlined />,
|
||||
confirm: {
|
||||
title: "确认删除",
|
||||
description: "此操作不可撤销，是否继续？",
|
||||
okText: "删除",
|
||||
okType: "danger",
|
||||
cancelText: "取消",
|
||||
},
|
||||
onClick: (item: KnowledgeSetView) => handleDeleteSet(item.id),
|
||||
},
|
||||
];
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: "知识集",
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
fixed: "left" as const,
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
render: (_: unknown, record: KnowledgeSetView) => (
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => navigate(`/data/knowledge-management/detail/${record.id}`)}
|
||||
>
|
||||
{record.name}
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "status",
|
||||
key: "status",
|
||||
width: 120,
|
||||
render: (status: KnowledgeSetView["status"]) => (
|
||||
<Tag color={status?.color}>{status?.label}</Tag>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "领域",
|
||||
dataIndex: "domain",
|
||||
key: "domain",
|
||||
width: 120,
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: "业务线",
|
||||
dataIndex: "businessLine",
|
||||
key: "businessLine",
|
||||
width: 120,
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: "负责人",
|
||||
dataIndex: "owner",
|
||||
key: "owner",
|
||||
width: 120,
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: "更新时间",
|
||||
dataIndex: "updatedAt",
|
||||
key: "updatedAt",
|
||||
width: 180,
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
key: "actions",
|
||||
fixed: "right" as const,
|
||||
width: 140,
|
||||
render: (_: unknown, record: KnowledgeSetView) => (
|
||||
<div className="flex items-center gap-2">
|
||||
{operations.map((op) => (
|
||||
<Tooltip key={op.key} title={op.label}>
|
||||
<Button
|
||||
type="text"
|
||||
icon={op.icon}
|
||||
danger={op.danger}
|
||||
onClick={() => op.onClick(record)}
|
||||
/>
|
||||
</Tooltip>
|
||||
))}
|
||||
</div>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="h-full flex flex-col gap-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<h1 className="text-xl font-bold">知识管理</h1>
|
||||
<div className="flex gap-2 items-center">
|
||||
<TagManager
|
||||
onCreate={createDatasetTagUsingPost}
|
||||
onDelete={(ids: string) => deleteDatasetTagUsingDelete({ ids })}
|
||||
onUpdate={updateDatasetTagUsingPut}
|
||||
onFetch={queryDatasetTagsUsingGet}
|
||||
/>
|
||||
<CreateKnowledgeSet
|
||||
isEdit={isEdit}
|
||||
data={currentSet}
|
||||
onUpdate={() => {
|
||||
fetchData();
|
||||
}}
|
||||
onClose={() => {
|
||||
setIsEdit(false);
|
||||
setCurrentSet(null);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<SearchControls
|
||||
searchTerm={searchParams.keyword}
|
||||
onSearchChange={handleKeywordChange}
|
||||
searchPlaceholder="搜索知识集名称、描述"
|
||||
filters={filterOptions}
|
||||
onFiltersChange={handleFiltersChange}
|
||||
onClearFilters={() => setSearchParams({ ...searchParams, filter: {} })}
|
||||
viewMode={viewMode}
|
||||
onViewModeChange={setViewMode}
|
||||
showViewToggle
|
||||
onReload={fetchData}
|
||||
/>
|
||||
|
||||
{viewMode === "card" ? (
|
||||
<CardView
|
||||
loading={loading}
|
||||
data={tableData}
|
||||
operations={operations}
|
||||
pagination={pagination}
|
||||
onView={(item) => navigate(`/data/knowledge-management/detail/${item.id}`)}
|
||||
/>
|
||||
) : (
|
||||
<Card>
|
||||
<Table
|
||||
loading={loading}
|
||||
scroll={{ x: "max-content", y: "calc(100vh - 20rem)" }}
|
||||
columns={columns}
|
||||
dataSource={tableData}
|
||||
rowKey="id"
|
||||
pagination={pagination}
|
||||
/>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user