新增数据，编辑数据初步完善

app/components/rules/new/ExtractionSettings.tsx

@@ -1,12 +1,8 @@
 import { useState, KeyboardEvent, FormEvent, useContext, useEffect } from 'react';
 import { RuleContext } from './ReviewSettings';
 
-interface ExtractionSettingsProps {
-  onChange?: (data: Record<string, unknown>) => void;
-}
-
 interface RegexField {
-  id: string;
+  id?: string;
   fieldName: string;
   regex: string;
 }
@@ -18,7 +14,30 @@ interface PromptTemplate {
   template_content: string;
 }
 
-export function ExtractionSettings({ onChange }: ExtractionSettingsProps) {
+interface ExtractionSettingsProps {
+  onChange?: (data: Record<string, unknown>) => void;
+  initialData?: {
+    llm_ocr?: {
+      fields?: string[];
+      prompt_setting?: {
+        type?: string;
+        template?: string;
+      }
+    };
+    llm_vl?: {
+      fields?: string[];
+      prompt_setting?: {
+        type?: string;
+        template?: string;
+      }
+    };
+    ocr_regex?: {
+      fields?: RegexField[];
+    }
+  };
+}
+
+export function ExtractionSettings({ onChange, initialData }: ExtractionSettingsProps) {
   // 使用RuleContext获取全局状态
   const ruleContext = useContext(RuleContext);
   
@@ -50,9 +69,61 @@ export function ExtractionSettings({ onChange }: ExtractionSettingsProps) {
     llm: ''
   });
 
-  // 在组件初始化时，如果Context中已有字段数据，则使用Context数据初始化
+  // 加载初始数据
   useEffect(() => {
-    if (ruleContext && ruleContext.extractionFields.length > 0) {
+    if (initialData) {
+      // 设置字段数据
+      const newFields = {
+        llm_ocr: initialData.llm_ocr?.fields || [],
+        llm: initialData.llm_vl?.fields || []
+      };
+      setFields(newFields);
+      
+      // 设置提示词类型
+      setPromptType({
+        llm_ocr: initialData.llm_ocr?.prompt_setting?.type || 'system',
+        llm: initialData.llm_vl?.prompt_setting?.type || 'system'
+      });
+      
+      // 设置提示词内容
+      setPromptContent({
+        llm_ocr: initialData.llm_ocr?.prompt_setting?.template || '',
+        llm: initialData.llm_vl?.prompt_setting?.template || ''
+      });
+      
+      // 设置正则字段
+      if (initialData.ocr_regex && initialData.ocr_regex.fields && initialData.ocr_regex.fields.length > 0) {
+        const regexFieldsWithIds = initialData.ocr_regex.fields.map((field: RegexField, index: number) => ({
+          id: (index + 1).toString(),
+          fieldName: field.fieldName || '',
+          regex: field.regex || ''
+        }));
+        setRegexFields(regexFieldsWithIds);
+      }
+      
+      // 更新全局字段列表
+      const allFields = [
+        ...newFields.llm_ocr,
+        ...newFields.llm,
+        ...(initialData.ocr_regex?.fields || []).map((f: RegexField) => f.fieldName)
+      ].filter(Boolean);
+      
+      if (ruleContext && ruleContext.updateFields) {
+        ruleContext.updateFields(allFields);
+      }
+    }
+  }, [initialData, ruleContext?.updateFields]);
+
+  // 在组件首次加载时更新字段
+  useEffect(() => {
+    if (!initialData) {
+      updateAllFields();
+    }
+  }, []);
+
+  // 当组件首次加载时，如果Context中已有字段数据，则使用Context数据初始化
+  useEffect(() => {
+    if (!initialData && ruleContext && ruleContext.extractionFields.length > 0) {
       // 将Context中的字段数据添加到当前激活的抽取方式中
       setFields(prevFields => ({
         ...prevFields,
@@ -61,11 +132,6 @@ export function ExtractionSettings({ onChange }: ExtractionSettingsProps) {
     }
   }, []);
 
-  // 当组件首次加载时更新字段
-  useEffect(() => {
-    updateAllFields();
-  }, []);
-
   // 获取所有可用字段（合并大模型、多模态和正则抽取的字段）
   const getAllFields = (): string[] => {
     // 从大模型OCR抽取中获取字段
@@ -169,10 +235,11 @@ export function ExtractionSettings({ onChange }: ExtractionSettingsProps) {
 
   // 使用useEffect监听字段变化并更新Context
   useEffect(() => {
-    // 立即更新字段列表
-    updateAllFields();
+    const debouncedUpdate = setTimeout(() => {
+      updateAllFields();
+    }, 300);
     
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return () => clearTimeout(debouncedUpdate);
   }, [fields.llm_ocr, fields.llm, regexFields]);
 
   const handleTabChange = (tab: string) => {