feat(annotation): 扩展标注模板的数据类型和标注类型选项

- 新增多种数据类型包括PDF、时间序列、聊天数据、HTML和表格数据
- 扩展分类标签体系增加音频语音、聊天评估、对话AI、生成式AI等分类
- 实现动态下拉选项渲染替代硬编码选项列表
- 添加超过100种新的标注类型涵盖音频语音、聊天评估、计算机视觉等领域
- 更新列表组件显示映射后的标签文本而非原始值
- 优化表单布局添加wrap属性支持选项换行显示

frontend/src/pages/DataAnnotation/Template/TemplateForm.tsx

@@ -17,6 +17,7 @@ import {
     updateAnnotationTemplateByIdUsingPut,
 } from "../annotation.api";
 import type { AnnotationTemplate } from "../annotation.model";
+import { DataTypeMap, ClassificationMap, AnnotationTypeMap } from "../annotation.const";
 import TagSelector from "./components/TagSelector";
 
 const { TextArea } = Input;
@@ -147,7 +148,7 @@ const TemplateForm: React.FC<TemplateFormProps> = ({
                     />
                 </Form.Item>
 
-                <Space style={{ width: "100%" }} size="large">
+                <Space style={{ width: "100%" }} size="large" wrap>
                     <Form.Item
                         label="数据类型"
                         name="dataType"
@@ -155,10 +156,9 @@ const TemplateForm: React.FC<TemplateFormProps> = ({
                         style={{ width: 200 }}
                     >
                         <Select placeholder="选择数据类型">
-                            <Option value="image">图像</Option>
-                            <Option value="text">文本</Option>
-                            <Option value="audio">音频</Option>
-                            <Option value="video">视频</Option>
+                            {Object.entries(DataTypeMap).map(([key, item]) => (
+                                <Option key={key} value={item.value}>{item.label}</Option>
+                            ))}
                         </Select>
                     </Form.Item>
 
@@ -168,12 +168,10 @@ const TemplateForm: React.FC<TemplateFormProps> = ({
                         rules={[{ required: true, message: "请选择标注类型" }]}
                         style={{ width: 220 }}
                     >
-                        <Select placeholder="选择标注类型">
-                            <Option value="classification">分类</Option>
-                            <Option value="object-detection">目标检测</Option>
-                            <Option value="segmentation">分割</Option>
-                            <Option value="ner">命名实体识别</Option>
-                            <Option value="multi-stage">多阶段</Option>
+                        <Select placeholder="选择标注类型" showSearch optionFilterProp="children">
+                            {Object.entries(AnnotationTypeMap).map(([key, item]) => (
+                                <Option key={key} value={item.value}>{item.label}</Option>
+                            ))}
                         </Select>
                     </Form.Item>
 
@@ -193,12 +191,10 @@ const TemplateForm: React.FC<TemplateFormProps> = ({
                         name="category"
                         style={{ width: 180 }}
                     >
-                        <Select>
-                            <Option value="computer-vision">计算机视觉</Option>
-                            <Option value="nlp">自然语言处理</Option>
-                            <Option value="audio">音频</Option>
-                            <Option value="quality-control">质量控制</Option>
-                            <Option value="custom">自定义</Option>
+                        <Select showSearch optionFilterProp="children">
+                            {Object.entries(ClassificationMap).map(([key, item]) => (
+                                <Option key={key} value={item.value}>{item.label}</Option>
+                            ))}
                         </Select>
                     </Form.Item>
                 </Space>

frontend/src/pages/DataAnnotation/Template/TemplateList.tsx

@@ -112,10 +112,17 @@ const TemplateList: React.FC = () => {
 
     const getCategoryColor = (category: string) => {
         const colors: Record<string, string> = {
+            "audio-speech": "purple",
+            "chat": "cyan",
             "computer-vision": "blue",
+            "conversational-ai": "magenta",
+            "generative-ai": "volcano",
             "nlp": "green",
-            "audio": "purple",
-            "quality-control": "orange",
+            "ranking-scoring": "gold",
+            "structured-data": "lime",
+            "time-series": "geekblue",
+            "video": "orange",
+            "community": "pink",
             "custom": "default",
         };
         return colors[category] || "default";
@@ -164,7 +171,7 @@ const TemplateList: React.FC = () => {
             key: "dataType",
             width: 120,
             render: (dataType: string) => (
-                <Tag color="cyan">{dataType}</Tag>
+                <Tag color="cyan">{DataTypeMap[dataType as keyof typeof DataTypeMap]?.label || dataType}</Tag>
             ),
         },
         {
@@ -173,7 +180,7 @@ const TemplateList: React.FC = () => {
             key: "labelingType",
             width: 150,
             render: (labelingType: string) => (
-                <Tag color="geekblue">{labelingType}</Tag>
+                <Tag color="geekblue">{AnnotationTypeMap[labelingType as keyof typeof AnnotationTypeMap]?.label || labelingType}</Tag>
             ),
         },
         {
@@ -182,7 +189,7 @@ const TemplateList: React.FC = () => {
             key: "category",
             width: 150,
             render: (category: string) => (
-                <Tag color={getCategoryColor(category)}>{category}</Tag>
+                <Tag color={getCategoryColor(category)}>{ClassificationMap[category as keyof typeof ClassificationMap]?.label || category}</Tag>
             ),
         },
         {