feat(knowledge): 添加知识条目文件上传和下载功能

- 新增文件上传接口支持批量上传知识条目文件 - 实现文件存储路径管理和安全验证机制 - 添加文件下载功能支持知识条目文件导出 - 扩展知识内容类型枚举增加FILE类型 - 扩展知识来源类型枚举增加FILE_UPLOAD类型 - 新增上传请求DTO定义文件验证和元数据配置 - 实现文件上传目录管理和文件名安全处理 - 添加文件扩展名识别和内容类型转换逻辑
2026-01-29 11:17:15 +08:00
parent 3c4b66b451
commit d0b5473068
10 changed files with 511 additions and 87 deletions
--- a/frontend/src/pages/KnowledgeManagement/Detail/KnowledgeSetDetail.tsx
+++ b/frontend/src/pages/KnowledgeManagement/Detail/KnowledgeSetDetail.tsx
@@ -19,12 +19,14 @@ import useFetchData from "@/hooks/useFetchData";
 import {
  deleteKnowledgeItemByIdUsingDelete,
  deleteKnowledgeSetByIdUsingDelete,
+  downloadKnowledgeItemFileUsingGet,
  exportKnowledgeItemsUsingGet,
  queryKnowledgeItemsUsingGet,
  queryKnowledgeSetByIdUsingGet,
 } from "../knowledge-management.api";
 import {
  knowledgeContentTypeOptions,
+  knowledgeSourceTypeOptions,
  knowledgeStatusMap,
  mapKnowledgeItem,
  KnowledgeItemView,
@@ -33,6 +35,7 @@ import {
  KnowledgeItem,
  KnowledgeSet,
  KnowledgeContentType,
+  KnowledgeSourceType,
  KnowledgeStatusType,
 } from "../knowledge-management.model";
 import CreateKnowledgeSet from "../components/CreateKnowledgeSet";
@@ -108,6 +111,12 @@ const KnowledgeSetDetail = () => {
  };

  const isReadableItem = (record: KnowledgeItemView) => {
+    if (
+      record.contentType === KnowledgeContentType.FILE ||
+      record.sourceType === KnowledgeSourceType.FILE_UPLOAD
+    ) {
+      return false;
+    }
    return (
      record.contentType === KnowledgeContentType.TEXT ||
      record.contentType === KnowledgeContentType.MARKDOWN
@@ -115,6 +124,13 @@ const KnowledgeSetDetail = () => {
  };

  const handleReadItem = async (record: KnowledgeItemView) => {
+    if (
+      record.contentType === KnowledgeContentType.FILE ||
+      record.sourceType === KnowledgeSourceType.FILE_UPLOAD
+    ) {
+      message.info("该条目为文件，请使用下载查看");
+      return;
+    }
    setReadItemId(record.id);
    setReadTitle(record.title || "知识条目");

@@ -156,6 +172,16 @@ const KnowledgeSetDetail = () => {
    }
  };

+  const handleDownloadItem = async (record: KnowledgeItemView) => {
+    if (!id) return;
+    try {
+      await downloadKnowledgeItemFileUsingGet(id, record.id, record.sourceFileId);
+    } catch (error) {
+      console.error("下载知识条目文件失败", error);
+      message.error("下载失败，请稍后重试");
+    }
+  };
+
  const statusMeta = knowledgeSet?.status
    ? knowledgeStatusMap[knowledgeSet.status]
    : undefined;
@@ -218,6 +244,10 @@ const KnowledgeSetDetail = () => {
      key: "sourceType",
      width: 140,
      ellipsis: true,
+      render: (sourceType: string) =>
+        knowledgeSourceTypeOptions.find((opt) => opt.value === sourceType)?.label ||
+        sourceType ||
+        "-",
    },
    {
      title: "更新时间",
@@ -232,16 +262,28 @@ const KnowledgeSetDetail = () => {
      width: 200,
      render: (_: unknown, record: KnowledgeItemView) => (
        <div className="flex items-center gap-2">
-          <Tooltip title="阅读">
-            <Button
-              type="text"
-              icon={<EyeOutlined />}
-              onClick={() => handleReadItem(record)}
-              disabled={!isReadableItem(record)}
-              loading={readItemId === record.id}
-              aria-label="阅读"
-            />
-          </Tooltip>
+          {isReadableItem(record) && (
+            <Tooltip title="阅读">
+              <Button
+                type="text"
+                icon={<EyeOutlined />}
+                onClick={() => handleReadItem(record)}
+                loading={readItemId === record.id}
+                aria-label="阅读"
+              />
+            </Tooltip>
+          )}
+          {(record.contentType === KnowledgeContentType.FILE ||
+            record.sourceType === KnowledgeSourceType.FILE_UPLOAD) && (
+            <Tooltip title="下载文件">
+              <Button
+                type="text"
+                icon={<DownloadOutlined />}
+                onClick={() => handleDownloadItem(record)}
+                aria-label="下载文件"
+              />
+            </Tooltip>
+          )}
          <Button
            type="text"
            icon={<EditOutlined />}
--- a/frontend/src/pages/KnowledgeManagement/components/KnowledgeItemEditor.tsx
+++ b/frontend/src/pages/KnowledgeManagement/components/KnowledgeItemEditor.tsx
@@ -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="请输入领域" />
--- a/frontend/src/pages/KnowledgeManagement/knowledge-management.api.ts
+++ b/frontend/src/pages/KnowledgeManagement/knowledge-management.api.ts
@@ -55,6 +55,16 @@ export function deleteKnowledgeItemByIdUsingDelete(setId: string, itemId: string
  return del(`/api/data-management/knowledge-sets/${setId}/items/${itemId}`);
 }

+// 上传知识条目文件
+export function uploadKnowledgeItemsUsingPost(setId: string, data: FormData) {
+  return post(`/api/data-management/knowledge-sets/${setId}/items/upload`, data);
+}
+
+// 下载知识条目文件
+export function downloadKnowledgeItemFileUsingGet(setId: string, itemId: string, fileName?: string) {
+  return download(`/api/data-management/knowledge-sets/${setId}/items/${itemId}/file`, null, fileName || "");
+}
+
 // 导出知识条目
 export function exportKnowledgeItemsUsingGet(setId: string) {
  return download(`/api/data-management/knowledge-sets/${setId}/items/export`);
--- a/frontend/src/pages/KnowledgeManagement/knowledge-management.const.tsx
+++ b/frontend/src/pages/KnowledgeManagement/knowledge-management.const.tsx
@@ -57,11 +57,13 @@ export const knowledgeStatusOptions = Object.values(knowledgeStatusMap).map((ite
 export const knowledgeContentTypeOptions = [
  { label: "文本", value: KnowledgeContentType.TEXT },
  { label: "Markdown", value: KnowledgeContentType.MARKDOWN },
+  { label: "文件", value: KnowledgeContentType.FILE },
 ];

 export const knowledgeSourceTypeOptions = [
  { label: "手工录入", value: KnowledgeSourceType.MANUAL },
  { label: "数据集文件导入", value: KnowledgeSourceType.DATASET_FILE },
+  { label: "文件上传", value: KnowledgeSourceType.FILE_UPLOAD },
 ];

 export type KnowledgeSetView = {
--- a/frontend/src/pages/KnowledgeManagement/knowledge-management.model.ts
+++ b/frontend/src/pages/KnowledgeManagement/knowledge-management.model.ts
@@ -8,11 +8,13 @@ export enum KnowledgeStatusType {
 export enum KnowledgeContentType {
  TEXT = "TEXT",
  MARKDOWN = "MARKDOWN",
+  FILE = "FILE",
 }

 export enum KnowledgeSourceType {
  MANUAL = "MANUAL",
  DATASET_FILE = "DATASET_FILE",
+  FILE_UPLOAD = "FILE_UPLOAD",
 }

 export interface KnowledgeTag {