refactor(components): 更新标签组件类型定义和数据处理逻辑

- 修改 Tag 接口定义，将 id 和 color 字段改为可选类型
- 更新 onAddTag 回调函数参数类型，从对象改为字符串
- 在 AddTagPopover 组件中添加 useCallback 优化数据获取逻辑
- 调整标签去重逻辑，支持 id 或 name 任一字段匹配
- 更新 DetailHeader 组件的数据类型定义和泛型约束
- 添加 parseMetadata 工具函数用于解析元数据
- 实现 isAnnotationItem 函数判断注释类型数据
- 优化知识库详情页的标签处理和数据类型转换

frontend/src/components/AddTagPopover.tsx

@@ -1,17 +1,17 @@
 import { Button, Input, Popover, theme, Tag, Empty } from "antd";
 import { PlusOutlined } from "@ant-design/icons";
-import { useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 
 interface Tag {
-  id: number;
+  id?: string | number;
   name: string;
-  color: string;
+  color?: string;
 }
 
 interface AddTagPopoverProps {
   tags: Tag[];
   onFetchTags?: () => Promise<Tag[]>;
-  onAddTag?: (tag: Tag) => void;
+  onAddTag?: (tagName: string) => void;
   onCreateAndTag?: (tagName: string) => void;
 }
 
@@ -27,20 +27,23 @@ export default function AddTagPopover({
   const [newTag, setNewTag] = useState("");
   const [allTags, setAllTags] = useState<Tag[]>([]);
 
-  const tagsSet = useMemo(() => new Set(tags.map((tag) => tag.id)), [tags]);
+  const tagsSet = useMemo(
+    () => new Set(tags.map((tag) => (tag.id ?? tag.name))),
+    [tags]
+  );
 
-  const fetchTags = async () => {
+  const fetchTags = useCallback(async () => {
     if (onFetchTags && showPopover) {
       const data = await onFetchTags?.();
       setAllTags(data || []);
     }
-  };
+  }, [onFetchTags, showPopover]);
   useEffect(() => {
     fetchTags();
-  }, [showPopover]);
+  }, [fetchTags]);
 
   const availableTags = useMemo(() => {
-    return allTags.filter((tag) => !tagsSet.has(tag.id));
+    return allTags.filter((tag) => !tagsSet.has(tag.id ?? tag.name));
   }, [allTags, tagsSet]);
 
   const handleCreateAndAddTag = () => {

frontend/src/components/DetailHeader.tsx

@@ -24,21 +24,28 @@ interface OperationItem {
 
 interface TagConfig {
   showAdd: boolean;
-  tags: { id: number; name: string; color: string }[];
-  onFetchTags?: () => Promise<{
-    data: { id: number; name: string; color: string }[];
-  }>;
-  onAddTag?: (tag: { id: number; name: string; color: string }) => void;
+  tags: { id?: string | number; name: string; color?: string }[];
+  onFetchTags?: () => Promise<{ id?: string | number; name: string; color?: string }[]>;
+  onAddTag?: (tagName: string) => void;
   onCreateAndTag?: (tagName: string) => void;
 }
-interface DetailHeaderProps<T> {
+interface DetailHeaderData {
+  name?: string;
+  description?: string;
+  status?: { color?: string; icon?: React.ReactNode; label?: string };
+  tags?: { id?: string | number; name?: string }[];
+  icon?: React.ReactNode;
+  iconColor?: string;
+}
+
+interface DetailHeaderProps<T extends DetailHeaderData> {
   data: T;
   statistics: StatisticItem[];
   operations: OperationItem[];
   tagConfig?: TagConfig;
 }
 
-function DetailHeader<T>({
+function DetailHeader<T extends DetailHeaderData>({
   data = {} as T,
   statistics,
   operations,
@@ -50,13 +57,13 @@ function DetailHeader<T>({
         <div className="flex items-start gap-4 flex-1">
           <div
             className={`w-16 h-16 text-white rounded-lg flex-center shadow-lg ${
-              (data as any)?.iconColor
+              data?.iconColor
                 ? ""
                 : "bg-gradient-to-br from-sky-300 to-blue-500 text-white"
             }`}
-            style={(data as any)?.iconColor ? { backgroundColor: (data as any).iconColor } : undefined}
+            style={data?.iconColor ? { backgroundColor: data.iconColor } : undefined}
           >
-            {<div className="w-[2.8rem] h-[2.8rem] text-gray-50">{(data as any)?.icon}</div> || (
+            {<div className="w-[2.8rem] h-[2.8rem] text-gray-50">{data?.icon}</div> || (
               <Database className="w-8 h-8 text-white" />
             )}
           </div>

frontend/src/pages/KnowledgeManagement/Detail/KnowledgeSetDetail.tsx

@@ -75,6 +75,30 @@ const OFFICE_PREVIEW_POLL_MAX_TIMES = 60;
 
 type OfficePreviewStatus = "UNSET" | "PENDING" | "PROCESSING" | "READY" | "FAILED";
 
+const parseMetadata = (value?: string | Record<string, unknown>) => {
+  if (!value) {
+    return null;
+  }
+  if (typeof value === "object") {
+    return value as Record<string, unknown>;
+  }
+  if (typeof value !== "string") {
+    return null;
+  }
+  try {
+    const parsed = JSON.parse(value);
+    return parsed && typeof parsed === "object" ? (parsed as Record<string, unknown>) : null;
+  } catch {
+    return null;
+  }
+};
+
+const isAnnotationItem = (record: KnowledgeItemView) => {
+  const metadata = parseMetadata(record.metadata);
+  const source = metadata && typeof metadata === "object" ? (metadata as { source?: { type?: string } }).source : null;
+  return source?.type === "annotation";
+};
+
 const isOfficeFileName = (fileName?: string) => {
   const lowerName = (fileName || "").toLowerCase();
   return OFFICE_FILE_EXTENSIONS.some((ext) => lowerName.endsWith(ext));
@@ -488,7 +512,7 @@ const KnowledgeSetDetail = () => {
     setReadItemId(record.id);
     setReadTitle("知识条目");
 
-    if (!record.sourceDatasetId || !record.sourceFileId) {
+    if (!record.sourceDatasetId || !record.sourceFileId || isAnnotationItem(record)) {
       const content = record.content || "";
       setReadContent(truncatePreviewText(content, PREVIEW_TEXT_MAX_LENGTH));
       setReadModalOpen(true);
@@ -921,7 +945,7 @@ const KnowledgeSetDetail = () => {
         ]}
         tagConfig={{
           showAdd: true,
-          tags: (knowledgeSet?.tags || []) as any,
+          tags: knowledgeSet?.tags || [],
           onFetchTags: async () => {
             const res = await queryDatasetTagsUsingGet({
               page: 0,
@@ -950,10 +974,10 @@ const KnowledgeSetDetail = () => {
               fetchKnowledgeSet();
             }
           },
-          onAddTag: async (tag: any) => {
+          onAddTag: async (tagName: string) => {
             if (knowledgeSet) {
               const currentTags = knowledgeSet.tags || [];
-              const newTagName = typeof tag === "string" ? tag : tag?.name;
+              const newTagName = tagName?.trim();
               if (!newTagName) return;
               await updateKnowledgeSetByIdUsingPut(knowledgeSet.id, {
                 name: knowledgeSet.name,