feat(knowledge): 添加知识管理功能模块

- 实现知识集的创建、编辑、删除功能
- 实现知识条目的创建、编辑、删除功能
- 添加知识集详情页面展示功能
- 实现知识条目导入数据集文件功能
- 添加知识管理主页列表展示功能
- 实现知识集和知识条目的状态管理
- 集成标签管理和搜索过滤功能
- 添加知识条目的批量操作支持
This commit is contained in:
2026-01-21 11:48:36 +08:00
parent da6c7860cb
commit 34fa184b69
8 changed files with 1356 additions and 0 deletions

View File

@@ -0,0 +1,327 @@
import { useCallback, useEffect, useMemo, useState } from "react";
import {
App,
Breadcrumb,
Button,
Card,
Descriptions,
Empty,
Table,
Tag,
} from "antd";
import { DeleteOutlined, EditOutlined, PlusOutlined } from "@ant-design/icons";
import { useNavigate, useParams } from "react-router";
import DetailHeader from "@/components/DetailHeader";
import { SearchControls } from "@/components/SearchControls";
import useFetchData from "@/hooks/useFetchData";
import {
deleteKnowledgeItemByIdUsingDelete,
deleteKnowledgeSetByIdUsingDelete,
queryKnowledgeItemsUsingGet,
queryKnowledgeSetByIdUsingGet,
} from "../knowledge-management.api";
import {
knowledgeContentTypeOptions,
knowledgeStatusMap,
mapKnowledgeItem,
KnowledgeItemView,
} from "../knowledge-management.const";
import {
KnowledgeItem,
KnowledgeSet,
KnowledgeStatusType,
} from "../knowledge-management.model";
import CreateKnowledgeSet from "../components/CreateKnowledgeSet";
import KnowledgeItemEditor from "../components/KnowledgeItemEditor";
import ImportKnowledgeItemsDialog from "../components/ImportKnowledgeItemsDialog";
import { formatDate } from "@/utils/unit";
const KnowledgeSetDetail = () => {
const navigate = useNavigate();
const { message } = App.useApp();
const { id } = useParams<{ id: string }>();
const [knowledgeSet, setKnowledgeSet] = useState<KnowledgeSet | null>(null);
const [showEdit, setShowEdit] = useState(false);
const [itemEditorOpen, setItemEditorOpen] = useState(false);
const [currentItem, setCurrentItem] = useState<KnowledgeItem | null>(null);
const fetchKnowledgeSet = useCallback(async () => {
if (!id) return;
const { data } = await queryKnowledgeSetByIdUsingGet(id);
setKnowledgeSet(data);
}, [id]);
useEffect(() => {
fetchKnowledgeSet();
}, [fetchKnowledgeSet]);
const {
loading,
tableData: items,
searchParams,
pagination,
fetchData,
setSearchParams,
handleFiltersChange,
handleKeywordChange,
} = useFetchData<KnowledgeItemView>(
(params) => (id ? queryKnowledgeItemsUsingGet(id, params) : Promise.resolve({ data: [] })),
mapKnowledgeItem,
30000,
false,
[],
0
);
const isReadOnly =
knowledgeSet?.status === KnowledgeStatusType.ARCHIVED ||
knowledgeSet?.status === KnowledgeStatusType.DEPRECATED;
const handleDeleteSet = async () => {
if (!knowledgeSet) return;
await deleteKnowledgeSetByIdUsingDelete(knowledgeSet.id);
message.success("知识集已删除");
navigate("/data/knowledge-management");
};
const handleDeleteItem = async (item: KnowledgeItemView) => {
if (!id) return;
await deleteKnowledgeItemByIdUsingDelete(id, item.id);
message.success("知识条目已删除");
fetchData();
};
const statusMeta = knowledgeSet?.status
? knowledgeStatusMap[knowledgeSet.status]
: undefined;
const statistics = useMemo(
() => [
{
key: "items",
icon: <PlusOutlined className="text-blue-500" />,
label: "条目数",
value: pagination.total || 0,
},
{
key: "updated",
icon: <EditOutlined className="text-gray-500" />,
label: "更新时间",
value: knowledgeSet?.updatedAt ? formatDate(knowledgeSet.updatedAt) : "-",
},
],
[pagination.total, knowledgeSet?.updatedAt]
);
const itemColumns = [
{
title: "标题",
dataIndex: "title",
key: "title",
fixed: "left" as const,
width: 220,
ellipsis: true,
},
{
title: "状态",
dataIndex: "status",
key: "status",
width: 120,
render: (status: KnowledgeItemView["status"]) => (
<Tag color={status?.color}>{status?.label}</Tag>
),
},
{
title: "类型",
dataIndex: "contentType",
key: "contentType",
width: 120,
render: (contentType: string) =>
knowledgeContentTypeOptions.find((opt) => opt.value === contentType)?.label ||
contentType,
},
{
title: "负责人",
dataIndex: "owner",
key: "owner",
width: 120,
ellipsis: true,
},
{
title: "来源",
dataIndex: "sourceType",
key: "sourceType",
width: 140,
ellipsis: true,
},
{
title: "更新时间",
dataIndex: "updatedAt",
key: "updatedAt",
width: 180,
ellipsis: true,
},
{
title: "操作",
key: "actions",
width: 140,
render: (_: unknown, record: KnowledgeItemView) => (
<div className="flex items-center gap-2">
<Button
type="text"
icon={<EditOutlined />}
onClick={() => {
setCurrentItem({
...(record as unknown as KnowledgeItem),
status: record.rawStatus,
});
setItemEditorOpen(true);
}}
disabled={isReadOnly || record.rawStatus === KnowledgeStatusType.ARCHIVED || record.rawStatus === KnowledgeStatusType.DEPRECATED}
/>
<Button
type="text"
danger
icon={<DeleteOutlined />}
onClick={() => handleDeleteItem(record)}
disabled={isReadOnly}
/>
</div>
),
},
];
return (
<div className="h-full flex flex-col">
<div className="mb-4">
<Breadcrumb>
<Breadcrumb.Item>
<a onClick={() => navigate("/data/knowledge-management")}></a>
</Breadcrumb.Item>
<Breadcrumb.Item>{knowledgeSet?.name || "-"}</Breadcrumb.Item>
</Breadcrumb>
</div>
<DetailHeader
data={{
name: knowledgeSet?.name,
description: knowledgeSet?.description,
status: statusMeta,
tags: knowledgeSet?.tags,
}}
statistics={statistics}
operations={[
{
key: "edit",
label: "编辑",
icon: <EditOutlined />,
onClick: () => setShowEdit(true),
danger: false,
},
{
key: "delete",
label: "删除",
icon: <DeleteOutlined />,
danger: true,
confirm: {
title: "确认删除该知识集吗?",
description: "删除后将无法恢复,请谨慎操作。",
cancelText: "取消",
okText: "删除",
okType: "danger",
onConfirm: () => handleDeleteSet(),
},
},
]}
/>
<CreateKnowledgeSet
showBtn={false}
isEdit={showEdit}
data={knowledgeSet}
onUpdate={() => {
setShowEdit(false);
fetchKnowledgeSet();
}}
onClose={() => setShowEdit(false)}
/>
<Card className="mt-4">
<Descriptions column={2} size="small">
<Descriptions.Item label="领域">{knowledgeSet?.domain || "-"}</Descriptions.Item>
<Descriptions.Item label="业务线">{knowledgeSet?.businessLine || "-"}</Descriptions.Item>
<Descriptions.Item label="负责人">{knowledgeSet?.owner || "-"}</Descriptions.Item>
<Descriptions.Item label="敏感级别">{knowledgeSet?.sensitivity || "-"}</Descriptions.Item>
<Descriptions.Item label="有效期">
{knowledgeSet?.validFrom || "-"} ~ {knowledgeSet?.validTo || "-"}
</Descriptions.Item>
<Descriptions.Item label="来源类型">{knowledgeSet?.sourceType || "-"}</Descriptions.Item>
</Descriptions>
</Card>
<div className="flex-1 border-card p-6 mt-4">
<div className="flex items-center justify-between mb-4 gap-3">
<SearchControls
searchTerm={searchParams.keyword}
onSearchChange={handleKeywordChange}
searchPlaceholder="搜索标题或内容"
filters={[]}
onFiltersChange={handleFiltersChange}
onClearFilters={() => setSearchParams({ ...searchParams, filter: { type: [], status: [], tags: [] } })}
showViewToggle={false}
showReload={false}
/>
<div className="flex items-center gap-2">
<Button
type="primary"
icon={<PlusOutlined />}
onClick={() => {
setCurrentItem(null);
setItemEditorOpen(true);
}}
disabled={isReadOnly}
>
</Button>
<ImportKnowledgeItemsDialog
setId={id || ""}
onImported={fetchData}
disabled={isReadOnly}
/>
</div>
</div>
{items.length === 0 ? (
<Empty description="暂无知识条目" />
) : (
<Table
loading={loading}
columns={itemColumns}
dataSource={items}
rowKey="id"
pagination={pagination}
scroll={{ y: "calc(100vh - 36rem)" }}
/>
)}
</div>
<KnowledgeItemEditor
open={itemEditorOpen}
setId={id || ""}
data={currentItem}
readOnly={isReadOnly}
onCancel={() => {
setItemEditorOpen(false);
setCurrentItem(null);
}}
onSuccess={() => {
setItemEditorOpen(false);
setCurrentItem(null);
fetchData();
}}
/>
</div>
);
};
export default KnowledgeSetDetail;

View File

@@ -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>
);
}

View File

@@ -0,0 +1,201 @@
import { useEffect, useState } from "react";
import { Button, DatePicker, Form, Input, message, Modal, Select } from "antd";
import { PlusOutlined } from "@ant-design/icons";
import dayjs from "dayjs";
import {
createKnowledgeSetUsingPost,
updateKnowledgeSetByIdUsingPut,
} from "../knowledge-management.api";
import {
knowledgeSourceTypeOptions,
knowledgeStatusOptions,
} from "../knowledge-management.const";
import {
KnowledgeSet,
KnowledgeStatusType,
} from "../knowledge-management.model";
import { queryDatasetTagsUsingGet } from "@/pages/DataManagement/dataset.api";
export default function CreateKnowledgeSet({
isEdit,
data,
showBtn = true,
onUpdate,
onClose,
}: {
isEdit?: boolean;
showBtn?: boolean;
data?: Partial<KnowledgeSet> | null;
onUpdate: () => void;
onClose: () => void;
}) {
const [open, setOpen] = useState(false);
const [form] = Form.useForm();
const [tagOptions, setTagOptions] = useState<{ label: string; value: string }[]>([]);
const fetchTags = async () => {
try {
const { data: tagData } = await queryDatasetTagsUsingGet();
const options = Array.isArray(tagData)
? tagData.map((tag) => ({ label: tag.name, value: tag.name }))
: [];
setTagOptions(options);
} catch (error) {
console.error("获取标签失败", error);
}
};
useEffect(() => {
if (open) {
fetchTags();
}
}, [open]);
useEffect(() => {
if (isEdit && data) {
setOpen(true);
form.setFieldsValue({
name: data.name,
description: data.description,
status: data.status ?? KnowledgeStatusType.DRAFT,
domain: data.domain,
businessLine: data.businessLine,
owner: data.owner,
validFrom: data.validFrom ? dayjs(data.validFrom) : null,
validTo: data.validTo ? dayjs(data.validTo) : null,
sourceType: data.sourceType,
sensitivity: data.sensitivity,
tags: data.tags?.map((tag) => tag.name) || [],
metadata: data.metadata,
});
}
}, [isEdit, data, form]);
const handleSubmit = async () => {
try {
const values = await form.validateFields();
const validFrom = values.validFrom ? values.validFrom.format("YYYY-MM-DD") : undefined;
const validTo = values.validTo ? values.validTo.format("YYYY-MM-DD") : undefined;
if (validFrom && validTo && dayjs(validFrom).isAfter(dayjs(validTo))) {
message.warning("有效期开始不能晚于结束时间");
return;
}
const payload = {
...values,
validFrom,
validTo,
tags: values.tags || [],
};
if (isEdit && data?.id) {
await updateKnowledgeSetByIdUsingPut(data.id, payload);
message.success("知识集更新成功");
} else {
await createKnowledgeSetUsingPost(payload);
message.success("知识集创建成功");
}
setOpen(false);
form.resetFields();
onUpdate();
} catch {
message.error("操作失败,请重试");
}
};
const handleClose = () => {
setOpen(false);
form.resetFields();
onClose?.();
};
const isReadOnly =
data?.status === KnowledgeStatusType.ARCHIVED ||
data?.status === KnowledgeStatusType.DEPRECATED;
return (
<>
{showBtn && (
<Button
type="primary"
icon={<PlusOutlined />}
onClick={() => {
form.resetFields();
form.setFieldsValue({ status: KnowledgeStatusType.DRAFT, tags: [] });
setOpen(true);
}}
>
</Button>
)}
<Modal
title={isEdit ? "编辑知识集" : "创建知识集"}
open={open}
okText="确定"
cancelText="取消"
onCancel={handleClose}
onOk={handleSubmit}
maskClosable={false}
width={720}
okButtonProps={{ disabled: isReadOnly }}
>
<Form form={form} layout="vertical" disabled={isReadOnly}>
<div className="grid grid-cols-2 gap-4">
<Form.Item
label="知识集名称"
name="name"
rules={[{ required: true, message: "请输入知识集名称" }]}
>
<Input placeholder="请输入知识集名称" />
</Form.Item>
<Form.Item label="状态" name="status">
<Select options={knowledgeStatusOptions} />
</Form.Item>
</div>
<Form.Item label="描述" name="description">
<Input.TextArea placeholder="请输入知识集描述" rows={3} />
</Form.Item>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="领域" name="domain">
<Input placeholder="请输入领域" />
</Form.Item>
<Form.Item label="业务线" name="businessLine">
<Input placeholder="请输入业务线" />
</Form.Item>
</div>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="负责人" name="owner">
<Input placeholder="请输入负责人" />
</Form.Item>
<Form.Item label="敏感级别" name="sensitivity">
<Input placeholder="请输入敏感级别" />
</Form.Item>
</div>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="有效期开始" name="validFrom">
<DatePicker className="w-full" />
</Form.Item>
<Form.Item label="有效期结束" name="validTo">
<DatePicker className="w-full" />
</Form.Item>
</div>
<Form.Item label="来源类型" name="sourceType">
<Select options={knowledgeSourceTypeOptions} />
</Form.Item>
<Form.Item label="标签" name="tags">
<Select
mode="tags"
options={tagOptions}
placeholder="请选择或输入标签"
/>
</Form.Item>
<Form.Item label="扩展元数据" name="metadata">
<Input.TextArea placeholder="请输入元数据(JSON)" rows={3} />
</Form.Item>
</Form>
</Modal>
</>
);
}

View File

@@ -0,0 +1,97 @@
import { useState } from "react";
import { Button, Form, Modal, message, Select } from "antd";
import { PlusOutlined } from "@ant-design/icons";
import DatasetFileTransfer from "@/components/business/DatasetFileTransfer";
import { Dataset, DatasetFile } from "@/pages/DataManagement/dataset.model";
import {
importKnowledgeItemsUsingPost,
} from "../knowledge-management.api";
import { knowledgeStatusOptions } from "../knowledge-management.const";
import { KnowledgeStatusType } from "../knowledge-management.model";
export default function ImportKnowledgeItemsDialog({
setId,
onImported,
disabled,
}: {
setId: string;
onImported: () => void;
disabled?: boolean;
}) {
const [open, setOpen] = useState(false);
const [form] = Form.useForm();
const [selectedFilesMap, setSelectedFilesMap] = useState<Record<string, DatasetFile>>({});
const [selectedDataset, setSelectedDataset] = useState<Dataset | null>(null);
const handleSubmit = async () => {
if (!selectedDataset) {
message.warning("请先选择数据集");
return;
}
const fileIds = Object.keys(selectedFilesMap);
if (fileIds.length === 0) {
message.warning("请至少选择一个文件");
return;
}
const values = await form.validateFields();
try {
await importKnowledgeItemsUsingPost(setId, {
datasetId: selectedDataset.id,
fileIds,
status: values.status || undefined,
});
message.success("导入成功");
setOpen(false);
setSelectedFilesMap({});
setSelectedDataset(null);
form.resetFields();
onImported();
} catch {
message.error("导入失败,请重试");
}
};
return (
<>
<Button
icon={<PlusOutlined />}
onClick={() => {
form.resetFields();
form.setFieldsValue({ status: KnowledgeStatusType.DRAFT });
setOpen(true);
}}
disabled={disabled}
>
</Button>
<Modal
title="导入数据集文件"
open={open}
onCancel={() => {
setOpen(false);
setSelectedFilesMap({});
setSelectedDataset(null);
}}
onOk={handleSubmit}
okText="确定"
cancelText="取消"
width={1000}
maskClosable={false}
>
<Form form={form} layout="vertical">
<Form.Item label="条目状态" name="status">
<Select options={knowledgeStatusOptions} />
</Form.Item>
</Form>
<DatasetFileTransfer
open={open}
selectedFilesMap={selectedFilesMap}
onSelectedFilesChange={setSelectedFilesMap}
onDatasetSelect={setSelectedDataset}
/>
</Modal>
</>
);
}

View File

@@ -0,0 +1,198 @@
import { useEffect, useState } from "react";
import { DatePicker, Form, Input, message, Modal, Select } from "antd";
import dayjs from "dayjs";
import {
createKnowledgeItemUsingPost,
updateKnowledgeItemByIdUsingPut,
} from "../knowledge-management.api";
import {
knowledgeContentTypeOptions,
knowledgeStatusOptions,
} from "../knowledge-management.const";
import {
KnowledgeContentType,
KnowledgeItem,
KnowledgeStatusType,
} from "../knowledge-management.model";
import { queryDatasetTagsUsingGet } from "@/pages/DataManagement/dataset.api";
export default function KnowledgeItemEditor({
open,
setId,
data,
onCancel,
onSuccess,
readOnly,
}: {
open: boolean;
setId: string;
data?: Partial<KnowledgeItem> | null;
readOnly?: boolean;
onCancel: () => void;
onSuccess: () => void;
}) {
const [form] = Form.useForm();
const [tagOptions, setTagOptions] = useState<{ label: string; value: string }[]>([]);
const fetchTags = async () => {
try {
const { data: tagData } = await queryDatasetTagsUsingGet();
const options = Array.isArray(tagData)
? tagData.map((tag) => ({ label: tag.name, value: tag.name }))
: [];
setTagOptions(options);
} catch (error) {
console.error("获取标签失败", error);
}
};
useEffect(() => {
if (open) {
fetchTags();
}
}, [open]);
useEffect(() => {
if (open) {
if (data?.id) {
form.setFieldsValue({
title: data.title,
content: data.content,
contentType: data.contentType ?? KnowledgeContentType.TEXT,
status: data.status ?? KnowledgeStatusType.DRAFT,
domain: data.domain,
businessLine: data.businessLine,
owner: data.owner,
sensitivity: data.sensitivity,
validFrom: data.validFrom ? dayjs(data.validFrom) : null,
validTo: data.validTo ? dayjs(data.validTo) : null,
tags: data.tags?.map((tag) => tag.name) || [],
metadata: data.metadata,
});
} else {
form.resetFields();
form.setFieldsValue({
contentType: KnowledgeContentType.TEXT,
status: KnowledgeStatusType.DRAFT,
tags: [],
});
}
}
}, [open, data, form]);
const handleSubmit = async () => {
try {
const values = await form.validateFields();
const validFrom = values.validFrom ? values.validFrom.format("YYYY-MM-DD") : undefined;
const validTo = values.validTo ? values.validTo.format("YYYY-MM-DD") : undefined;
if (validFrom && validTo && dayjs(validFrom).isAfter(dayjs(validTo))) {
message.warning("有效期开始不能晚于结束时间");
return;
}
const payload = {
...values,
validFrom,
validTo,
tags: values.tags || [],
};
if (data?.id) {
await updateKnowledgeItemByIdUsingPut(setId, data.id, payload);
message.success("知识条目更新成功");
} else {
await createKnowledgeItemUsingPost(setId, payload);
message.success("知识条目创建成功");
}
form.resetFields();
onSuccess();
} catch {
message.error("操作失败,请重试");
}
};
const title = data?.id ? "编辑知识条目" : "新建知识条目";
return (
<Modal
title={title}
open={open}
onCancel={onCancel}
onOk={handleSubmit}
okText="确定"
cancelText="取消"
width={860}
maskClosable={false}
okButtonProps={{ disabled: readOnly }}
>
<Form form={form} layout="vertical" disabled={readOnly}>
<div className="grid grid-cols-2 gap-4">
<Form.Item
label="标题"
name="title"
rules={[{ required: true, message: "请输入标题" }]}
>
<Input placeholder="请输入标题" />
</Form.Item>
<Form.Item label="状态" name="status">
<Select options={knowledgeStatusOptions} />
</Form.Item>
</div>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="内容类型" name="contentType">
<Select options={knowledgeContentTypeOptions} />
</Form.Item>
<Form.Item label="敏感级别" name="sensitivity">
<Input placeholder="请输入敏感级别" />
</Form.Item>
</div>
<Form.Item
label="内容"
name="content"
rules={[{ required: true, message: "请输入内容" }]}
>
<Input.TextArea rows={8} placeholder="请输入内容" />
</Form.Item>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="领域" name="domain">
<Input placeholder="请输入领域" />
</Form.Item>
<Form.Item label="业务线" name="businessLine">
<Input placeholder="请输入业务线" />
</Form.Item>
</div>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="负责人" name="owner">
<Input placeholder="请输入负责人" />
</Form.Item>
<Form.Item label="标签" name="tags">
<Select
mode="tags"
options={tagOptions}
placeholder="请选择或输入标签"
/>
</Form.Item>
</div>
<div className="grid grid-cols-2 gap-4">
<Form.Item label="有效期开始" name="validFrom">
<DatePicker className="w-full" />
</Form.Item>
<Form.Item label="有效期结束" name="validTo">
<DatePicker className="w-full" />
</Form.Item>
</div>
<Form.Item label="扩展元数据" name="metadata">
<Input.TextArea placeholder="请输入元数据(JSON)" rows={3} />
</Form.Item>
{data?.sourceType && (
<div className="grid grid-cols-2 gap-4 text-sm text-gray-500">
<div>{data.sourceType}</div>
<div>{data.sourceFileId || "-"}</div>
</div>
)}
</Form>
</Modal>
);
}

View File

@@ -0,0 +1,56 @@
import { get, post, put, del } from "@/utils/request";
// 知识集列表
export function queryKnowledgeSetsUsingGet(params?: Record<string, unknown>) {
return get("/api/data-management/knowledge-sets", params);
}
// 创建知识集
export function createKnowledgeSetUsingPost(data: Record<string, unknown>) {
return post("/api/data-management/knowledge-sets", data);
}
// 获取知识集详情
export function queryKnowledgeSetByIdUsingGet(setId: string) {
return get(`/api/data-management/knowledge-sets/${setId}`);
}
// 更新知识集
export function updateKnowledgeSetByIdUsingPut(setId: string, data: Record<string, unknown>) {
return put(`/api/data-management/knowledge-sets/${setId}`, data);
}
// 删除知识集
export function deleteKnowledgeSetByIdUsingDelete(setId: string) {
return del(`/api/data-management/knowledge-sets/${setId}`);
}
// 知识条目列表
export function queryKnowledgeItemsUsingGet(setId: string, params?: Record<string, unknown>) {
return get(`/api/data-management/knowledge-sets/${setId}/items`, params);
}
// 创建知识条目
export function createKnowledgeItemUsingPost(setId: string, data: Record<string, unknown>) {
return post(`/api/data-management/knowledge-sets/${setId}/items`, data);
}
// 导入知识条目(数据集文件)
export function importKnowledgeItemsUsingPost(setId: string, data: Record<string, unknown>) {
return post(`/api/data-management/knowledge-sets/${setId}/items/import`, data);
}
// 获取知识条目详情
export function queryKnowledgeItemByIdUsingGet(setId: string, itemId: string) {
return get(`/api/data-management/knowledge-sets/${setId}/items/${itemId}`);
}
// 更新知识条目
export function updateKnowledgeItemByIdUsingPut(setId: string, itemId: string, data: Record<string, unknown>) {
return put(`/api/data-management/knowledge-sets/${setId}/items/${itemId}`, data);
}
// 删除知识条目
export function deleteKnowledgeItemByIdUsingDelete(setId: string, itemId: string) {
return del(`/api/data-management/knowledge-sets/${setId}/items/${itemId}`);
}

View File

@@ -0,0 +1,160 @@
import React from "react";
import {
CheckCircleOutlined,
ClockCircleOutlined,
CloseCircleOutlined,
FolderOpenOutlined,
} from "@ant-design/icons";
import { BookOpen } from "lucide-react";
import { formatDateTime } from "@/utils/unit";
import {
KnowledgeContentType,
KnowledgeItem,
KnowledgeSet,
KnowledgeSourceType,
KnowledgeStatusType,
} from "./knowledge-management.model";
export type KnowledgeStatusMeta = {
label: string;
value: KnowledgeStatusType;
color: string;
icon: React.ReactNode;
};
export const knowledgeStatusMap: Record<KnowledgeStatusType, KnowledgeStatusMeta> = {
[KnowledgeStatusType.DRAFT]: {
label: "草稿",
value: KnowledgeStatusType.DRAFT,
color: "#a1a1a1",
icon: <ClockCircleOutlined />,
},
[KnowledgeStatusType.PUBLISHED]: {
label: "已发布",
value: KnowledgeStatusType.PUBLISHED,
color: "#409f17",
icon: <CheckCircleOutlined />,
},
[KnowledgeStatusType.ARCHIVED]: {
label: "已归档",
value: KnowledgeStatusType.ARCHIVED,
color: "#6b7280",
icon: <FolderOpenOutlined />,
},
[KnowledgeStatusType.DEPRECATED]: {
label: "已废弃",
value: KnowledgeStatusType.DEPRECATED,
color: "#d97706",
icon: <CloseCircleOutlined />,
},
};
export const knowledgeStatusOptions = Object.values(knowledgeStatusMap).map((item) => ({
label: item.label,
value: item.value,
}));
export const knowledgeContentTypeOptions = [
{ label: "文本", value: KnowledgeContentType.TEXT },
{ label: "Markdown", value: KnowledgeContentType.MARKDOWN },
];
export const knowledgeSourceTypeOptions = [
{ label: "手工录入", value: KnowledgeSourceType.MANUAL },
{ label: "数据集文件导入", value: KnowledgeSourceType.DATASET_FILE },
];
export type KnowledgeSetView = {
id: string;
name: string;
description?: string;
status: KnowledgeStatusMeta | null;
rawStatus: KnowledgeStatusType;
tags: KnowledgeSet["tags"];
domain?: string;
businessLine?: string;
owner?: string;
validFrom?: string;
validTo?: string;
sourceType?: KnowledgeSet["sourceType"];
sensitivity?: string;
metadata?: string;
createdAt?: string;
updatedAt?: string;
type: string;
icon?: React.ReactNode;
iconColor?: string;
statistics?: { label: string; value: string | number }[];
};
export type KnowledgeItemView = {
id: string;
setId: string;
title: string;
content: string;
contentType: KnowledgeContentType;
status: KnowledgeStatusMeta | null;
rawStatus: KnowledgeStatusType;
tags: KnowledgeItem["tags"];
domain?: string;
businessLine?: string;
owner?: string;
validFrom?: string;
validTo?: string;
sourceType?: KnowledgeItem["sourceType"];
sensitivity?: string;
sourceDatasetId?: string;
sourceFileId?: string;
metadata?: string;
createdAt?: string;
updatedAt?: string;
};
export function mapKnowledgeSet(data: KnowledgeSet): KnowledgeSetView {
return {
id: data.id,
name: data.name,
description: data.description,
status: knowledgeStatusMap[data.status] ?? null,
rawStatus: data.status,
tags: data.tags || [],
domain: data.domain,
businessLine: data.businessLine,
owner: data.owner,
validFrom: data.validFrom,
validTo: data.validTo,
sourceType: data.sourceType,
sensitivity: data.sensitivity,
metadata: data.metadata,
createdAt: data.createdAt ? formatDateTime(data.createdAt) : "",
updatedAt: data.updatedAt ? formatDateTime(data.updatedAt) : "",
type: "知识集",
icon: <BookOpen className="w-6 h-6" />,
iconColor: "#3b82f6",
};
}
export function mapKnowledgeItem(data: KnowledgeItem): KnowledgeItemView {
return {
id: data.id,
setId: data.setId,
title: data.title,
content: data.content,
contentType: data.contentType,
status: knowledgeStatusMap[data.status] ?? null,
rawStatus: data.status,
tags: data.tags || [],
domain: data.domain,
businessLine: data.businessLine,
owner: data.owner,
validFrom: data.validFrom,
validTo: data.validTo,
sourceType: data.sourceType,
sensitivity: data.sensitivity,
sourceDatasetId: data.sourceDatasetId,
sourceFileId: data.sourceFileId,
metadata: data.metadata,
createdAt: data.createdAt ? formatDateTime(data.createdAt) : "",
updatedAt: data.updatedAt ? formatDateTime(data.updatedAt) : "",
};
}

View File

@@ -0,0 +1,68 @@
export enum KnowledgeStatusType {
DRAFT = "DRAFT",
PUBLISHED = "PUBLISHED",
ARCHIVED = "ARCHIVED",
DEPRECATED = "DEPRECATED",
}
export enum KnowledgeContentType {
TEXT = "TEXT",
MARKDOWN = "MARKDOWN",
}
export enum KnowledgeSourceType {
MANUAL = "MANUAL",
DATASET_FILE = "DATASET_FILE",
}
export interface KnowledgeTag {
id: string;
name: string;
color?: string;
description?: string;
usageCount?: number;
}
export interface KnowledgeSet {
id: string;
name: string;
description?: string;
status: KnowledgeStatusType;
tags: KnowledgeTag[];
domain?: string;
businessLine?: string;
owner?: string;
validFrom?: string;
validTo?: string;
sourceType?: KnowledgeSourceType;
sensitivity?: string;
metadata?: string;
createdAt?: string;
updatedAt?: string;
createdBy?: string;
updatedBy?: string;
}
export interface KnowledgeItem {
id: string;
setId: string;
title: string;
content: string;
contentType: KnowledgeContentType;
status: KnowledgeStatusType;
tags: KnowledgeTag[];
domain?: string;
businessLine?: string;
owner?: string;
validFrom?: string;
validTo?: string;
sourceType?: KnowledgeSourceType;
sensitivity?: string;
sourceDatasetId?: string;
sourceFileId?: string;
metadata?: string;
createdAt?: string;
updatedAt?: string;
createdBy?: string;
updatedBy?: string;
}