You've already forked DataMate
feat(knowledge): 添加知识条目文件上传和下载功能
- 新增文件上传接口支持批量上传知识条目文件 - 实现文件存储路径管理和安全验证机制 - 添加文件下载功能支持知识条目文件导出 - 扩展知识内容类型枚举增加FILE类型 - 扩展知识来源类型枚举增加FILE_UPLOAD类型 - 新增上传请求DTO定义文件验证和元数据配置 - 实现文件上传目录管理和文件名安全处理 - 添加文件扩展名识别和内容类型转换逻辑
This commit is contained in:
@@ -3,29 +3,21 @@ import { Button, DatePicker, Form, Input, message, Modal, Select, Upload, Upload
|
||||
import { UploadOutlined } from "@ant-design/icons";
|
||||
import dayjs from "dayjs";
|
||||
import {
|
||||
createKnowledgeItemUsingPost,
|
||||
downloadKnowledgeItemFileUsingGet,
|
||||
updateKnowledgeItemByIdUsingPut,
|
||||
uploadKnowledgeItemsUsingPost,
|
||||
} from "../knowledge-management.api";
|
||||
import {
|
||||
knowledgeContentTypeOptions,
|
||||
knowledgeStatusOptions,
|
||||
} from "../knowledge-management.const";
|
||||
import {
|
||||
KnowledgeContentType,
|
||||
KnowledgeItem,
|
||||
KnowledgeSourceType,
|
||||
KnowledgeStatusType,
|
||||
} from "../knowledge-management.model";
|
||||
import { queryDatasetTagsUsingGet } from "@/pages/DataManagement/dataset.api";
|
||||
|
||||
const FILE_UPLOAD_ACCEPT = ".txt,.md,.markdown";
|
||||
const SUPPORTED_FILE_EXTENSIONS = new Set(["txt", "md", "markdown"]);
|
||||
const MARKDOWN_FILE_EXTENSIONS = new Set(["md", "markdown"]);
|
||||
|
||||
const getFileExtension = (fileName: string) => {
|
||||
const dotIndex = fileName.lastIndexOf(".");
|
||||
return dotIndex > -1 ? fileName.slice(dotIndex + 1).toLowerCase() : "";
|
||||
};
|
||||
|
||||
const stripFileExtension = (fileName: string) => {
|
||||
const dotIndex = fileName.lastIndexOf(".");
|
||||
if (dotIndex <= 0) {
|
||||
@@ -34,9 +26,6 @@ const stripFileExtension = (fileName: string) => {
|
||||
return fileName.slice(0, dotIndex);
|
||||
};
|
||||
|
||||
const resolveContentType = (extension: string) =>
|
||||
MARKDOWN_FILE_EXTENSIONS.has(extension) ? KnowledgeContentType.MARKDOWN : KnowledgeContentType.TEXT;
|
||||
|
||||
export default function KnowledgeItemEditor({
|
||||
open,
|
||||
setId,
|
||||
@@ -55,6 +44,17 @@ export default function KnowledgeItemEditor({
|
||||
const [form] = Form.useForm();
|
||||
const [tagOptions, setTagOptions] = useState<{ label: string; value: string }[]>([]);
|
||||
const [fileList, setFileList] = useState<UploadFile[]>([]);
|
||||
const isMultiFile = fileList.length > 1;
|
||||
const isFileItem =
|
||||
data?.contentType === KnowledgeContentType.FILE ||
|
||||
data?.sourceType === KnowledgeSourceType.FILE_UPLOAD;
|
||||
const contentTypeLabel = !data?.id
|
||||
? "文件"
|
||||
: data?.contentType === KnowledgeContentType.MARKDOWN
|
||||
? "Markdown"
|
||||
: data?.contentType === KnowledgeContentType.TEXT
|
||||
? "文本"
|
||||
: "文件";
|
||||
|
||||
const fetchTags = async () => {
|
||||
try {
|
||||
@@ -79,8 +79,6 @@ export default function KnowledgeItemEditor({
|
||||
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,
|
||||
@@ -94,7 +92,6 @@ export default function KnowledgeItemEditor({
|
||||
} else {
|
||||
form.resetFields();
|
||||
form.setFieldsValue({
|
||||
contentType: KnowledgeContentType.TEXT,
|
||||
status: KnowledgeStatusType.DRAFT,
|
||||
tags: [],
|
||||
});
|
||||
@@ -105,45 +102,60 @@ export default function KnowledgeItemEditor({
|
||||
}
|
||||
}, [open, data, form]);
|
||||
|
||||
const handleFileBeforeUpload = async (file: File) => {
|
||||
const extension = getFileExtension(file.name);
|
||||
if (!SUPPORTED_FILE_EXTENSIONS.has(extension)) {
|
||||
message.error("仅支持 .txt/.md/.markdown 文件");
|
||||
return Upload.LIST_IGNORE;
|
||||
}
|
||||
|
||||
try {
|
||||
const textContent = await file.text();
|
||||
const currentTitle = form.getFieldValue("title");
|
||||
form.setFieldsValue({
|
||||
title: currentTitle || stripFileExtension(file.name),
|
||||
content: textContent,
|
||||
contentType: resolveContentType(extension),
|
||||
});
|
||||
setFileList([
|
||||
const handleFileBeforeUpload = (file: File) => {
|
||||
setFileList((prev) => {
|
||||
const nextList = [
|
||||
...prev,
|
||||
{
|
||||
uid: `${Date.now()}-${file.name}`,
|
||||
name: file.name,
|
||||
status: "done",
|
||||
originFileObj: file,
|
||||
},
|
||||
]);
|
||||
message.success("文件已读取，可继续编辑内容");
|
||||
return false;
|
||||
} catch (error) {
|
||||
console.error("读取文件失败", error);
|
||||
message.error("读取文件失败，请重试");
|
||||
return Upload.LIST_IGNORE;
|
||||
}
|
||||
];
|
||||
if (nextList.length === 1) {
|
||||
const currentTitle = form.getFieldValue("title");
|
||||
if (!currentTitle) {
|
||||
form.setFieldsValue({
|
||||
title: stripFileExtension(file.name),
|
||||
});
|
||||
}
|
||||
}
|
||||
return nextList;
|
||||
});
|
||||
message.success("文件已就绪，可提交创建条目");
|
||||
return false;
|
||||
};
|
||||
|
||||
const handleFileRemove = () => {
|
||||
setFileList([]);
|
||||
const handleFileRemove = (removedFile: UploadFile) => {
|
||||
setFileList((prev) => {
|
||||
const nextList = prev.filter((file) => file.uid !== removedFile.uid);
|
||||
if (!data?.id && nextList.length === 0) {
|
||||
form.setFieldsValue({ title: undefined });
|
||||
}
|
||||
return nextList;
|
||||
});
|
||||
return true;
|
||||
};
|
||||
|
||||
const handleDownloadFile = async () => {
|
||||
if (!data?.id) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await downloadKnowledgeItemFileUsingGet(setId, data.id, data.sourceFileId);
|
||||
} catch (error) {
|
||||
console.error("下载文件失败", error);
|
||||
message.error("下载失败，请稍后重试");
|
||||
}
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
if (!data?.id && fileList.length === 0) {
|
||||
message.warning("请先选择文件");
|
||||
return;
|
||||
}
|
||||
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;
|
||||
@@ -153,19 +165,61 @@ export default function KnowledgeItemEditor({
|
||||
return;
|
||||
}
|
||||
|
||||
const payload = {
|
||||
...values,
|
||||
validFrom,
|
||||
validTo,
|
||||
tags: values.tags || [],
|
||||
};
|
||||
|
||||
if (data?.id) {
|
||||
const payload = {
|
||||
...values,
|
||||
validFrom,
|
||||
validTo,
|
||||
tags: values.tags || [],
|
||||
};
|
||||
await updateKnowledgeItemByIdUsingPut(setId, data.id, payload);
|
||||
message.success("知识条目更新成功");
|
||||
} else {
|
||||
await createKnowledgeItemUsingPost(setId, payload);
|
||||
message.success("知识条目创建成功");
|
||||
if (fileList.length === 0) {
|
||||
message.warning("请先选择文件");
|
||||
return;
|
||||
}
|
||||
|
||||
const formData = new FormData();
|
||||
fileList.forEach((file) => {
|
||||
const origin = file.originFileObj as File | undefined;
|
||||
if (origin) {
|
||||
formData.append("files", origin);
|
||||
}
|
||||
});
|
||||
if (fileList.length === 1 && values.title) {
|
||||
formData.append("title", values.title);
|
||||
}
|
||||
if (values.status) {
|
||||
formData.append("status", values.status);
|
||||
}
|
||||
if (values.tags && Array.isArray(values.tags)) {
|
||||
values.tags.forEach((tag) => formData.append("tags", tag));
|
||||
}
|
||||
if (values.domain) {
|
||||
formData.append("domain", values.domain);
|
||||
}
|
||||
if (values.businessLine) {
|
||||
formData.append("businessLine", values.businessLine);
|
||||
}
|
||||
if (values.owner) {
|
||||
formData.append("owner", values.owner);
|
||||
}
|
||||
if (values.sensitivity) {
|
||||
formData.append("sensitivity", values.sensitivity);
|
||||
}
|
||||
if (validFrom) {
|
||||
formData.append("validFrom", validFrom);
|
||||
}
|
||||
if (validTo) {
|
||||
formData.append("validTo", validTo);
|
||||
}
|
||||
if (values.metadata) {
|
||||
formData.append("metadata", values.metadata);
|
||||
}
|
||||
|
||||
await uploadKnowledgeItemsUsingPost(setId, formData);
|
||||
message.success(`已创建 ${fileList.length} 个知识条目`);
|
||||
}
|
||||
|
||||
form.resetFields();
|
||||
@@ -195,44 +249,54 @@ export default function KnowledgeItemEditor({
|
||||
<Form.Item
|
||||
label="标题"
|
||||
name="title"
|
||||
rules={[{ required: true, message: "请输入标题" }]}
|
||||
rules={[{ required: !isMultiFile, message: "请输入标题" }]}
|
||||
>
|
||||
<Input placeholder="请输入标题" />
|
||||
<Input
|
||||
placeholder={isMultiFile ? "多文件将按文件名自动生成" : "请输入标题"}
|
||||
disabled={readOnly || (!data?.id && isMultiFile)}
|
||||
/>
|
||||
</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>
|
||||
{!data?.id && (
|
||||
<Form.Item label="上传文件" extra="支持 .txt/.md/.markdown，将自动填充标题与内容">
|
||||
<Form.Item label="上传文件" required>
|
||||
<Upload
|
||||
accept={FILE_UPLOAD_ACCEPT}
|
||||
beforeUpload={handleFileBeforeUpload}
|
||||
fileList={fileList}
|
||||
maxCount={1}
|
||||
multiple
|
||||
onRemove={handleFileRemove}
|
||||
showUploadList={{ showPreviewIcon: false }}
|
||||
disabled={readOnly}
|
||||
>
|
||||
<Button icon={<UploadOutlined />}>选择文件</Button>
|
||||
</Upload>
|
||||
<div className="text-xs text-gray-500 mt-1">
|
||||
支持多格式文件；多文件将自动拆分为多个条目
|
||||
</div>
|
||||
</Form.Item>
|
||||
)}
|
||||
{data?.id && isFileItem && (
|
||||
<Form.Item label="文件">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="truncate" title={data.sourceFileId || data.title}>
|
||||
{data.sourceFileId || data.title || "-"}
|
||||
</span>
|
||||
<Button size="small" onClick={handleDownloadFile} disabled={readOnly}>
|
||||
下载
|
||||
</Button>
|
||||
</div>
|
||||
</Form.Item>
|
||||
)}
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<Form.Item label="内容类型">
|
||||
<Input value={contentTypeLabel} disabled />
|
||||
</Form.Item>
|
||||
<Form.Item label="敏感级别" name="sensitivity">
|
||||
<Input placeholder="请输入敏感级别" />
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<Form.Item label="领域" name="domain">
|
||||
<Input placeholder="请输入领域" />
|
||||
|
||||
Reference in New Issue
Block a user