refactor: clean up tag management and dataset handling, update API endpoints

chenghh-9609 · chenghh-9609 · commit b9a7e7a0a984 · 2025-10-22T14:41:14.000+08:00
diff --git a/frontend/src/components/TagManagement.tsx b/frontend/src/components/TagManagement.tsx
@@ -92,17 +92,6 @@ function CustomTag({
   );
 }
 
-export const mockPreparedTags = [
-  { id: "1", name: "重要" },
-  { id: "2", name: "待处理" },
-  { id: "3", name: "已完成" },
-  { id: "4", name: "审核中" },
-  { id: "5", name: "高优先级" },
-  { id: "6", name: "低优先级" },
-  { id: "7", name: "客户A" },
-  { id: "8", name: "客户B" },
-];
-
 const TagManager: React.FC = ({
   onFetch,
   onCreate,
@@ -112,7 +101,7 @@ const TagManager: React.FC = ({
   onFetch: () => Promise<any>;
   onCreate: (tag: Pick<TagItem, "name">) => Promise<{ ok: boolean }>;
   onDelete: (tagId: number) => Promise<{ ok: boolean }>;
-  onUpdate: (oldTagId: number, newTag: string) => Promise<{ ok: boolean }>;
+  onUpdate: (tag: TagItem) => Promise<{ ok: boolean }>;
 }) => {
   const [showTagManager, setShowTagManager] = useState(false);
   const { message } = App.useApp();
@@ -121,9 +110,6 @@ const TagManager: React.FC = ({
   const [editingTag, setEditingTag] = useState<string | null>(null);
   const [editingTagValue, setEditingTagValue] = useState("");
 
-  // 预置标签
-  const [preparedTags, setPreparedTags] = useState(mockPreparedTags);
-
   // 获取标签列表
   const fetchTags = async () => {
     if (!onFetch) return;
@@ -161,7 +147,7 @@ const TagManager: React.FC = ({
 
   const updateTag = async (oldTag: TagItem, newTag: string) => {
     try {
-      await onUpdate?.(oldTag.id, { ...oldTag, name: newTag });
+      await onUpdate?.({ ...oldTag, name: newTag });
       fetchTags();
       message.success("标签更新成功");
     } catch (error) {
@@ -213,54 +199,47 @@ const TagManager: React.FC = ({
         title="标签管理"
         width={500}
       >
-        <div className="space-y-4">
+        <div className="space-y-4 flex flex-col overflow-y-auto h-full">
           {/* Add New Tag */}
-          <div className="space-y-2">
-            <div className="flex gap-2">
-              <Input
-                placeholder="输入标签名称..."
-                value={newTag}
-                allowClear
-                onChange={(e) => setNewTag(e.target.value)}
-                onKeyPress={(e) => {
-                  if (e.key === "Enter") {
-                    addTag(e.target.value);
-                  }
-                }}
-              />
-              <Button
-                type="primary"
-                onClick={handleCreateNewTag}
-                disabled={!newTag.trim()}
-                icon={<PlusOutlined />}
-              >
-                添加
-              </Button>
-            </div>
-          </div>
-
-          <h2 className="font-large font-bold w-full">预置标签</h2>
-          <div className="grid grid-cols-2 gap-2">
-            {preparedTags.length > 0 &&
-              preparedTags.map((tag) => <CustomTag key={tag.id} tag={tag} />)}
+          <div className="flex gap-2">
+            <Input
+              placeholder="输入标签名称..."
+              value={newTag}
+              allowClear
+              onChange={(e) => setNewTag(e.target.value)}
+              onKeyPress={(e) => {
+                if (e.key === "Enter") {
+                  addTag(e.target.value);
+                }
+              }}
+            />
+            <Button
+              type="primary"
+              onClick={handleCreateNewTag}
+              disabled={!newTag.trim()}
+              icon={<PlusOutlined />}
+            >
+              添加
+            </Button>
           </div>
 
-          <h2 className="font-large font-bold w-full">自定义标签</h2>
-          <div className="grid grid-cols-2 gap-2 mt-4">
-            {tags.map((tag) => (
-              <CustomTag
-                isEditable
-                key={tag.id}
-                tag={tag}
-                editingTag={editingTag}
-                editingTagValue={editingTagValue}
-                setEditingTag={setEditingTag}
-                setEditingTagValue={setEditingTagValue}
-                handleEditTag={handleEditTag}
-                handleCancelEdit={handleCancelEdit}
-                handleDeleteTag={handleDeleteTag}
-              />
-            ))}
+          <div className="flex-1 overflow-auto">
+            <div className="overflow-auto grid grid-cols-2 gap-2">
+              {tags.map((tag) => (
+                <CustomTag
+                  isEditable
+                  key={tag.id}
+                  tag={tag}
+                  editingTag={editingTag}
+                  editingTagValue={editingTagValue}
+                  setEditingTag={setEditingTag}
+                  setEditingTagValue={setEditingTagValue}
+                  handleEditTag={handleEditTag}
+                  handleCancelEdit={handleCancelEdit}
+                  handleDeleteTag={handleDeleteTag}
+                />
+              ))}
+            </div>
           </div>
         </div>
       </Drawer>
diff --git a/frontend/src/pages/DataAnnotation/Create/components/CreateAnnptationTaskDialog.tsx b/frontend/src/pages/DataAnnotation/Create/components/CreateAnnptationTaskDialog.tsx
@@ -1,5 +1,8 @@
 import { queryDatasetsUsingGet } from "@/pages/DataManagement/dataset.api";
-import { datasetTypeMap } from "@/pages/DataManagement/dataset.const";
+import {
+  datasetTypeMap,
+  mapDataset,
+} from "@/pages/DataManagement/dataset.const";
 import { Button, Form, Input, Modal, Select } from "antd";
 import TextArea from "antd/es/input/TextArea";
 import { Database } from "lucide-react";
@@ -26,7 +29,7 @@ export default function CreateAnnotationTask({
         page: 0,
         size: 1000,
       });
-      setDatasets(data.content || []);
+      setDatasets(data.content.map(mapDataset) || []);
     };
     fetchDatasets();
   }, [open]);
@@ -74,22 +77,20 @@ export default function CreateAnnotationTask({
         >
           <Select
             placeholder="请选择数据集"
-            options={datasets.map((dataset) => ({
-              label: (
-                <div className="flex items-center justify-between gap-3 py-2">
-                  <div className="flex items-center font-sm text-gray-900">
-                    <span>
-                      {dataset.icon || <Database className="w-4 h-4 mr-2" />}
-                    </span>
-                    <span>{dataset.name}</span>
+            options={datasets.map((dataset) => {
+              return {
+                label: (
+                  <div className="flex items-center justify-between gap-3 py-2">
+                    <div className="flex items-center font-sm text-gray-900">
+                      <span className="mr-2">{dataset.icon}</span>
+                      <span>{dataset.name}</span>
+                    </div>
+                    <div className="text-xs text-gray-500">{dataset.size}</div>
                   </div>
-                  <div className="text-xs text-gray-500">
-                    {datasetTypeMap[dataset?.datasetType]?.label}
-                  </div>
-                </div>
-              ),
-              value: dataset.id,
-            }))}
+                ),
+                value: dataset.id,
+              };
+            })}
           />
         </Form.Item>
       </Form>
diff --git a/frontend/src/pages/DataAnnotation/Home/DataAnnotation.tsx b/frontend/src/pages/DataAnnotation/Home/DataAnnotation.tsx
@@ -19,8 +19,10 @@ import {
 import { mapAnnotationTask } from "../annotation.const";
 import CreateAnnotationTask from "../Create/components/CreateAnnptationTaskDialog";
 import { ColumnType } from "antd/es/table";
+import DevelopmentInProgress from "@/components/DevelopmentInProgress";
 
 export default function DataAnnotation() {
+  return <DevelopmentInProgress />;
   const navigate = useNavigate();
   const [viewMode, setViewMode] = useState<"list" | "card">("list");
   const [showCreateDialog, setShowCreateDialog] = useState(false);
diff --git a/frontend/src/pages/DataAnnotation/annotation.api.ts b/frontend/src/pages/DataAnnotation/annotation.api.ts
@@ -2,7 +2,7 @@ import { get, post, put, del, download } from "@/utils/request";
 
 // 标注任务管理相关接口
 export function queryAnnotationTasksUsingGet(params?: any) {
-  return get("/api/project/mappings/list", params);
+  return get("/project/mappings/list", params);
 }
 
 export function createAnnotationTaskUsingPost(data: any) {
diff --git a/frontend/src/pages/DataCleansing/Create/components/CreateTaskStepOne.tsx b/frontend/src/pages/DataCleansing/Create/components/CreateTaskStepOne.tsx
@@ -3,6 +3,7 @@ import { queryDatasetsUsingGet } from "@/pages/DataManagement/dataset.api";
 import {
   datasetTypeMap,
   datasetTypes,
+  mapDataset,
 } from "@/pages/DataManagement/dataset.const";
 import {
   Dataset,
@@ -34,7 +35,7 @@ export default function CreateTaskStepOne({
 
   const fetchDatasets = async () => {
     const { data } = await queryDatasetsUsingGet({ page: 0, size: 1000 });
-    setDatasets(data.content || []);
+    setDatasets(data.content.map(mapDataset) || []);
   };
 
   useEffect(() => {
@@ -76,22 +77,20 @@ export default function CreateTaskStepOne({
       <Form.Item label="源数据集" name="srcDatasetId" required>
         <Select
           placeholder="请选择源数据集"
-          options={datasets.map((dataset) => ({
-            label: (
-              <div className="flex items-center justify-between gap-3 py-2">
-                <div className="flex items-center font-sm text-gray-900">
-                  <span>
-                    {dataset.icon || <Database className="w-4 h-4 mr-2" />}
-                  </span>
-                  <span>{dataset.name}</span>
+          options={datasets.map((dataset) => {
+            return {
+              label: (
+                <div className="flex items-center justify-between gap-3 py-2">
+                  <div className="flex items-center font-sm text-gray-900">
+                    <span className="mr-2">{dataset.icon}</span>
+                    <span>{dataset.name}</span>
+                  </div>
+                  <div className="text-xs text-gray-500">{dataset.size}</div>
                 </div>
-                <div className="text-xs text-gray-500">
-                  {datasetTypeMap[dataset?.datasetType]?.label}
-                </div>
-              </div>
-            ),
-            value: dataset.id,
-          }))}
+              ),
+              value: dataset.id,
+            };
+          })}
         />
       </Form.Item>
       <Form.Item label="目标数据集名称" name="destDatasetName" required>
diff --git a/frontend/src/pages/DataManagement/Create/components/BasicInformation.tsx b/frontend/src/pages/DataManagement/Create/components/BasicInformation.tsx
@@ -2,7 +2,6 @@ import RadioCard from "@/components/RadioCard";
 import { Input, Select, Form } from "antd";
 import { datasetTypes } from "../../dataset.const";
 import { useEffect, useState } from "react";
-import { mockPreparedTags } from "@/components/TagManagement";
 import { queryDatasetTagsUsingGet } from "../../dataset.api";
 
 export default function BasicInformation({
@@ -26,26 +25,11 @@ export default function BasicInformation({
   const fetchTags = async () => {
     try {
       const { data } = await queryDatasetTagsUsingGet();
-      const preparedTags = mockPreparedTags.map((tag) => ({
-        label: tag.name,
-        value: tag.name,
-      }));
       const customTags = data.map((tag) => ({
         label: tag.name,
         value: tag.name,
       }));
-      setTagOptions([
-        {
-          label: <span>预置标签</span>,
-          title: "prepared",
-          options: preparedTags,
-        },
-        {
-          label: <span>自定义标签</span>,
-          title: "custom",
-          options: customTags,
-        },
-      ]);
+      setTagOptions(customTags);
     } catch (error) {
       console.error("Error fetching tags: ", error);
     }
diff --git a/frontend/src/pages/DataManagement/Detail/DatasetDetail.tsx b/frontend/src/pages/DataManagement/Detail/DatasetDetail.tsx
@@ -121,7 +121,7 @@ export default function DatasetDetail() {
     {
       icon: <Clock className="text-blue-400 w-4 h-4" />,
       key: "time",
-      value: dataset?.createdAt,
+      value: dataset?.updatedAt,
     },
   ];
 
diff --git a/frontend/src/pages/DataManagement/Home/DataManagement.tsx b/frontend/src/pages/DataManagement/Home/DataManagement.tsx
@@ -20,8 +20,8 @@ import {
   deleteDatasetByIdUsingDelete,
   createDatasetTagUsingPost,
   queryDatasetTagsUsingGet,
-  updateDatasetTagByIdUsingPut,
-  deleteDatasetTagByIdUsingDelete,
+  deleteDatasetTagUsingDelete,
+  updateDatasetTagUsingPut,
 } from "../dataset.api";
 import { formatBytes } from "@/utils/unit";
 import EditDataset from "../Create/EditDataset";
@@ -295,8 +295,8 @@ export default function DatasetManagementPage() {
           {/* tasks */}
           <TagManager
             onCreate={createDatasetTagUsingPost}
-            onDelete={deleteDatasetTagByIdUsingDelete}
-            onUpdate={updateDatasetTagByIdUsingPut}
+            onDelete={(ids: string) => deleteDatasetTagUsingDelete({ ids })}
+            onUpdate={updateDatasetTagUsingPut}
             onFetch={queryDatasetTagsUsingGet}
           />
           <Link to="/data/management/create">
diff --git a/frontend/src/pages/DataManagement/dataset.api.ts b/frontend/src/pages/DataManagement/dataset.api.ts
@@ -97,13 +97,13 @@ export function createDatasetTagUsingPost(data: any) {
 }
 
 // 更新数据集标签
-export function updateDatasetTagByIdUsingPut(id: string | number, data: any) {
-  return put(`/api/data-management/tags/${id}`, data);
+export function updateDatasetTagUsingPut(data: any) {
+  return put(`/api/data-management/tags`, data);
 }
 
 // 删除数据集标签
-export function deleteDatasetTagByIdUsingDelete(id: string | number) {
-  return del(`/api/data-management/tags/${id}`);
+export function deleteDatasetTagUsingDelete(data: any) {
+  return del(`/api/data-management/tags`, data);
 }
 
 // 数据集质量检查
diff --git a/frontend/src/pages/DataManagement/dataset.const.tsx b/frontend/src/pages/DataManagement/dataset.const.tsx
diff --git a/frontend/src/pages/Layout/Sidebar.tsx b/frontend/src/pages/Layout/Sidebar.tsx

Original file line number	Diff line number	Diff line change
`@@ -2,7 +2,7 @@ import { get, post, put, del, download } from "@/utils/request";`
`2`	`2`
`3`	`3`	`// 标注任务管理相关接口`
`4`	`4`	`export function queryAnnotationTasksUsingGet(params?: any) {`
`5`		`- return get("/api/project/mappings/list", params);`
	`5`	`+ return get("/project/mappings/list", params);`
`6`	`6`	`}`
`7`	`7`
`8`	`8`	`export function createAnnotationTaskUsingPost(data: any) {`
Original file line number	Diff line number	Diff line change
`@@ -121,7 +121,7 @@ export default function DatasetDetail() {`
`121`	`121`	`{`
`122`	`122`	`icon: <Clock className="text-blue-400 w-4 h-4" />,`
`123`	`123`	`key: "time",`
`124`		`- value: dataset?.createdAt,`
	`124`	`+ value: dataset?.updatedAt,`
`125`	`125`	`},`
`126`	`126`	`];`
`127`	`127`
Original file line number	Diff line number	Diff line change
`@@ -97,13 +97,13 @@ export function createDatasetTagUsingPost(data: any) {`
`97`	`97`	`}`
`98`	`98`
`99`	`99`	`// 更新数据集标签`
`100`		`-export function updateDatasetTagByIdUsingPut(id: string \| number, data: any) {`
`101`		- return put(`/api/data-management/tags/${id}`, data);
	`100`	`+export function updateDatasetTagUsingPut(data: any) {`
	`101`	+ return put(`/api/data-management/tags`, data);
`102`	`102`	`}`
`103`	`103`
`104`	`104`	`// 删除数据集标签`
`105`		`-export function deleteDatasetTagByIdUsingDelete(id: string \| number) {`
`106`		- return del(`/api/data-management/tags/${id}`);
	`105`	`+export function deleteDatasetTagUsingDelete(data: any) {`
	`106`	+ return del(`/api/data-management/tags`, data);
`107`	`107`	`}`
`108`	`108`
`109`	`109`	`// 数据集质量检查`