Files
leaudit-platform-frontend/app/routes/rules-new.tsx
T

827 lines
32 KiB
TypeScript

/**
* 评查点管理页面 - 创建或编辑评查点规则
*
* 功能概述:
* - 支持创建新的评查点规则或编辑现有规则
* - 评查点包含基本信息、抽取设置和评查设置三大部分
* - 支持使用三种抽取方式: 大模型(LLM)抽取、多模态(VLM)抽取和正则表达式抽取
* - 支持配置各种类型的评查规则,如存在性检查、内容一致性检查等
* - 支持保存评查规则和保存草稿功能
*
* 组件结构:
* - PageHeader: 页面标题和保存按钮
* - BasicInfo: 评查点的基本信息设置,如名称、编码、风险级别等
* - ExtractionSettings: 抽取设置,配置从文档中抽取哪些字段及抽取方式
* - ReviewSettings: 评查设置,基于抽取字段配置评查规则、评查结果消息等
* - ActionButtons: 页面底部的操作按钮,包括保存、保存草稿和返回
*
* 数据流转:
* 1. 页面加载时检查URL参数,确定是新建还是编辑模式
* 2. 编辑模式下从API获取评查点数据并填充表单
* 3. ExtractionSettings通过RuleContext将抽取的字段传递给ReviewSettings
* 4. 各组件的onChange回调收集表单变更并更新formData状态
* 5. 保存时将formData转换为API需要的格式并提交
*
* @author 中国烟草AI合同及卷宗审核系统开发团队
*/
import { type MetaFunction } from "@remix-run/node";
import { useState, useEffect, useCallback } from "react";
import { BasicInfo } from "~/components/rules/new/BasicInfo";
import { ExtractionSettings } from "~/components/rules/new/ExtractionSettings";
import { ReviewSettings } from "~/components/rules/new/ReviewSettings";
import { ActionButtons } from "~/components/rules/new/ActionButtons";
import { PageHeader } from "~/components/rules/new/PageHeader";
import rulesStyles from "~/styles/rules.css?url";
import { useNavigate, useLocation } from "@remix-run/react";
// 导入评查点模型定义和常量
import type {
EvaluationPoint,
LogicOperator,
CompareMethod,
FormatType,
ComparisonOperator,
MatchType,
ProgrammingLanguage
} from "~/models/evaluation_points";
import { EVALUATION_OPTIONS } from "~/models/evaluation_points";
import type { EvaluationPointGroup } from "~/models/evaluation_point_groups";
// 导入RuleContext上下文
import { RuleContext } from "~/contexts/RuleContext";
import { postgrestGet, postgrestPost, postgrestPut } from "~/api/postgrest-client";
import { toastService } from '~/components/ui/Toast';
import type { UserRole } from '~/root';
export const meta: MetaFunction = () => {
return [
{ title: "评查点管理 - 中国烟草AI合同及卷宗审核系统" },
{
name: "description",
content: "创建或修改评查点,设置规则参数"
}
];
};
export function links() {
return [{ rel: "stylesheet", href: rulesStyles }];
}
export const handle = {
breadcrumb: "评查点管理",
previousRoute: () => {
if (typeof window !== 'undefined') {
const searchParams = new URLSearchParams(window.location.search);
const mode = searchParams.get('mode');
const id = searchParams.get('id');
if (mode || id) {
return {
title: "评查点列表",
to: `/rules`
};
}
}
return undefined;
}
};
// 添加规则配置接口
interface BaseRuleConfig {
availableFields?: string[];
}
interface ExistsRuleConfig extends BaseRuleConfig {
fields: string[];
logic: LogicOperator;
selectedFields?: string[];
existsLogic?: string;
}
interface ConsistencyRuleConfig extends BaseRuleConfig {
pairs: Array<{sourceField: string; targetField: string; compareMethod: CompareMethod}>;
logic: LogicOperator;
logicRelation?: string;
initialSourceField?: string;
initialTargetField?: string;
initialCompareMethod?: string;
}
interface FormatRuleConfig extends BaseRuleConfig {
field: string;
formatType: FormatType;
parameters: string;
checkField?: string;
formatParams?: string;
}
interface LogicRuleConfig extends BaseRuleConfig {
conditions: {
field: string;
operator: ComparisonOperator;
value: string;
}[];
logic: LogicOperator;
logicRelation?: string;
initialField?: string;
initialOperator?: string;
initialValue?: string;
}
interface RegexRuleConfig extends BaseRuleConfig {
field: string;
pattern: string;
matchType: MatchType;
checkField?: string;
regexPattern?: string;
}
interface AIRuleConfig extends BaseRuleConfig {
model: string;
temperature: number;
prompt: string;
}
interface CodeRuleConfig extends BaseRuleConfig {
language: ProgrammingLanguage;
code: string;
}
type RuleConfig = ExistsRuleConfig | ConsistencyRuleConfig | FormatRuleConfig | LogicRuleConfig | RegexRuleConfig | AIRuleConfig | CodeRuleConfig;
export default function RuleNew() {
const navigate = useNavigate();
const location = useLocation();
const [isEditMode, setIsEditMode] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [instanceKey, setInstanceKey] = useState<string>('new');
const [userRole, setUserRole] = useState<UserRole>('common');
const [formData, setFormData] = useState<EvaluationPoint>({});
const [evaluationPointGroups, setEvaluationPointGroups] = useState<EvaluationPointGroup[]>([]);
// 检查用户是否为开发者角色
const isDeveloper = userRole === 'developer';
// 添加用于共享的字段数据状态
const [extractionFields, setExtractionFields] = useState<string[]>([]);
/**
* 从表单数据中提取所有字段
* 用于编辑模式下初始化字段数据
*/
const extractFieldsFromFormData = useCallback((data: EvaluationPoint) => {
if (!data || !data.extraction_config) return [];
const fields: string[] = [];
const config = data.extraction_config;
// 提取LLM字段
if (config.llm && Array.isArray(config.llm.fields)) {
fields.push(...config.llm.fields);
}
// 提取VLM字段
if (config.vlm && Array.isArray(config.vlm.fields)) {
const vlmFields = config.vlm.fields.map((f: string | { name: string, type: string }) =>
typeof f === 'string' ? f : f.name
);
fields.push(...vlmFields);
}
// 提取正则字段
if (config.regex && Array.isArray(config.regex.fields)) {
const regexFields = config.regex.fields.map((f: { field: string, pattern: string }) => f.field).filter(Boolean);
fields.push(...regexFields);
}
return fields;
}, []);
/**
* 重置表单数据到默认状态
*/
const resetFormData = useCallback(() => {
// console.log("重置表单数据到默认状态");
setFormData({
name: '',
code: '',
risk: 'low',
is_enabled: true,
description: '',
references_laws: { name: '', articles: [], content: '' },
evaluation_point_groups_pid: null,
evaluation_point_groups_id: null,
extraction_config: {
llm: {
fields: [],
prompt_setting: {
type: 'system',
template: ''
}
},
vlm: {
fields: [],
prompt_setting: {
type: 'system',
template: ''
}
},
regex: {
fields: []
}
},
evaluation_config: {
logicType: 'and',
customLogic: '',
rules: []
},
pass_message: '文档检查通过,符合规范要求。',
fail_message: '文档存在以下问题,请修改后重新提交。',
suggestion_message: '',
suggestion_message_type: 'warning',
post_action: 'none',
action_config: '',
score: 0
});
setExtractionFields([]);
// 生成新的实例键,强制所有子组件重新渲染
setInstanceKey(`new_${Date.now()}`);
}, []);
/**
* 获取评查点数据
* 编辑模式下从API获取指定ID的评查点数据
* @param id 评查点ID
*/
const fetchEvaluationPoint = useCallback(async (id: number) => {
try {
setIsLoading(true);
// console.log(`获取评查点数据,ID: ${id}`);
// 使用 postgrestGet 替代直接调用 fetch
const postgrestParams = {
filter: {
'id': `eq.${id}`
}
};
const response = await postgrestGet('evaluation_points', postgrestParams);
if (response.data && Array.isArray(response.data) && response.data[0]) {
if (response.data.length > 0) {
try {
// 使用JSON序列化和反序列化来进行深拷贝,避免浏览器差异
const originalData = response.data[0];
const jsonString = JSON.stringify(originalData);
const data = JSON.parse(jsonString);
// console.log("数据已经过深拷贝处理,避免浏览器兼容性问题");
// 设置表单数据
setFormData(data);
// 初始化extractionFields
const extractedFields = extractFieldsFromFormData(data);
setExtractionFields(extractedFields);
// 设置编辑模式的实例键
setInstanceKey(`edit_${id}_${Date.now()}`);
} catch (jsonError) {
console.error('JSON处理错误:', jsonError);
toastService.error(`数据处理错误: ${jsonError instanceof Error ? jsonError.message : '未知错误'}`);
resetFormData();
navigate('/rules');
}
} else {
console.error('获取数据失败: 返回数据为空');
toastService.error('获取数据失败: 返回数据为空');
resetFormData();
navigate('/rules');
}
} else {
throw new Error(`响应状态: ${response.error}`);
}
} catch (error) {
console.error('获取评查点数据失败:', error);
toastService.error(`获取评查点数据失败: ${error instanceof Error ? error.message : '未知错误'}`);
// 获取数据失败时返回上一页
resetFormData();
navigate('/rules');
} finally {
setIsLoading(false);
}
}, [navigate, extractFieldsFromFormData, resetFormData]);
/**
* 获取评查点组数据
* 从API获取所有评查点组,用于基本信息表单中选择
*/
const fetchEvaluationPointGroups = useCallback(async () => {
try {
// console.log("获取评查点组数据");
const response = await postgrestGet('evaluation_point_groups');
if (response.data && Array.isArray(response.data) && response.data.length > 0) {
setEvaluationPointGroups(response.data);
}
} catch (error) {
console.error('获取评查点组数据失败:', error);
// 显示错误提示但不影响应用继续使用
toastService.error(`获取评查点组数据失败: ${error instanceof Error ? error.message : '未知错误'}\n将使用默认数据`);
}
}, []);
const handleSave = async () => {
// console.log("保存评查点", formData);
// 验证必填字段
if (!formData.name?.trim()) {
toastService.warning("评查点名称不能为空");
return;
}
if (!formData.code?.trim()) {
toastService.warning("评查点编码不能为空");
return;
}
// 显示保存中状态
setIsLoading(true);
try {
// 创建一个符合数据库模式的数据副本
const cleanedData = {
id: formData.id,
name: formData.name?.trim(),
code: formData.code?.trim(),
risk: formData.risk || 'low',
is_enabled: formData.is_enabled !== undefined ? formData.is_enabled : true,
description: formData.description || '',
references_laws: formData.references_laws || null,
evaluation_point_groups_pid: formData.evaluation_point_groups_pid || null,
evaluation_point_groups_id: formData.evaluation_point_groups_id || null,
extraction_config: {
llm: {
fields: Array.isArray(formData.extraction_config?.llm?.fields) ?
[...formData.extraction_config.llm.fields] : [],
prompt_setting: {
type: formData.extraction_config?.llm?.prompt_setting?.type || 'system',
template: formData.extraction_config?.llm?.prompt_setting?.template || ''
}
},
vlm: {
fields: Array.isArray(formData.extraction_config?.vlm?.fields) ?
[...formData.extraction_config.vlm.fields] : [],
prompt_setting: {
type: formData.extraction_config?.vlm?.prompt_setting?.type || 'system',
template: formData.extraction_config?.vlm?.prompt_setting?.template || ''
}
},
regex: {
fields: Array.isArray(formData.extraction_config?.regex?.fields) ?
[...formData.extraction_config.regex.fields] : []
}
},
evaluation_config: {
logicType: formData.evaluation_config?.logicType || 'and',
customLogic: formData.evaluation_config?.customLogic || '',
rules: Array.isArray(formData.evaluation_config?.rules) ?
formData.evaluation_config.rules.map(rule => ({
id: rule.id || '1',
type: rule.type || '',
config: rule.config || {}
})) : []
},
pass_message: formData.pass_message || '文档检查通过,符合规范要求。',
fail_message: formData.fail_message || '文档存在以下问题,请修改后重新提交。',
suggestion_message: formData.suggestion_message || '',
suggestion_message_type: formData.suggestion_message_type || 'warning',
post_action: formData.post_action || 'none',
action_config: formData.action_config || '',
score: formData.score !== undefined ? Number(formData.score) : 0
};
// 获取当前所有有效的抽取字段
const currentExtractionFields = extractionFields.map(field => {
// 处理字段名,去掉类型后缀(如果有)
if (field.includes('_')) {
return field.split('_')[0];
}
return field;
});
// 去重,确保不会有重复字段
const validFields = [...new Set(currentExtractionFields)];
// console.log("当前有效的抽取字段:", validFields);
// 重要:这段代码解决了字段删除后,评查配置中仍保留已删除字段的问题
// 在保存前,我们会确保所有规则中引用的字段都是当前有效的抽取字段
// 这样即使用户在界面操作中删除了某个抽取字段,相关的评查规则也会被自动清理
// 确保rules中的每个配置对象都被正确处理
if (cleanedData.evaluation_config && Array.isArray(cleanedData.evaluation_config.rules)) {
cleanedData.evaluation_config.rules = cleanedData.evaluation_config.rules
.filter(rule => rule && rule.type) // 确保规则有类型
.map(rule => {
// 根据规则类型确保config中有必要的字段
const config = { ...rule.config } as RuleConfig;
switch (rule.type) {
case 'exists':
if (!Array.isArray((config as ExistsRuleConfig).fields)) (config as ExistsRuleConfig).fields = [];
// 过滤掉不存在于当前抽取字段中的字段
if (Array.isArray((config as ExistsRuleConfig).fields)) {
(config as ExistsRuleConfig).fields = (config as ExistsRuleConfig).fields.filter(
field => validFields.includes(field)
);
}
if (!(config as ExistsRuleConfig).logic) (config as ExistsRuleConfig).logic = 'and';
// 删除不必要的字段
delete (config as ExistsRuleConfig & {availableFields?: string}).availableFields;
delete (config as ExistsRuleConfig).selectedFields;
delete (config as ExistsRuleConfig).existsLogic;
break;
case 'consistency':
if (!Array.isArray((config as ConsistencyRuleConfig).pairs)) (config as ConsistencyRuleConfig).pairs = [];
// 过滤掉包含不存在于当前抽取字段中的字段的配对
if (Array.isArray((config as ConsistencyRuleConfig).pairs)) {
(config as ConsistencyRuleConfig).pairs = (config as ConsistencyRuleConfig).pairs.filter(
pair => validFields.includes(pair.sourceField) && validFields.includes(pair.targetField)
);
}
if (!(config as ConsistencyRuleConfig).logic) (config as ConsistencyRuleConfig).logic = 'and';
delete (config as ConsistencyRuleConfig & {availableFields?: string}).availableFields;
delete (config as ConsistencyRuleConfig).logicRelation;
delete (config as ConsistencyRuleConfig).initialSourceField;
delete (config as ConsistencyRuleConfig).initialTargetField;
delete (config as ConsistencyRuleConfig).initialCompareMethod;
break;
case 'format':
// 检查字段是否存在于当前抽取字段中
if ((config as FormatRuleConfig).field && !validFields.includes((config as FormatRuleConfig).field)) {
(config as FormatRuleConfig).field = '';
}
if (!(config as FormatRuleConfig).field) (config as FormatRuleConfig).field = '';
if (!(config as FormatRuleConfig).formatType) (config as FormatRuleConfig).formatType = 'date';
if (!(config as FormatRuleConfig).parameters) (config as FormatRuleConfig).parameters = '';
delete (config as FormatRuleConfig & {availableFields?: string}).availableFields;
delete (config as FormatRuleConfig).checkField;
delete (config as FormatRuleConfig).formatParams;
break;
case 'logic':
if (!Array.isArray((config as LogicRuleConfig).conditions)) (config as LogicRuleConfig).conditions = [];
// 过滤掉包含不存在于当前抽取字段中的字段的条件
if (Array.isArray((config as LogicRuleConfig).conditions)) {
(config as LogicRuleConfig).conditions = (config as LogicRuleConfig).conditions.filter(
condition => validFields.includes(condition.field)
);
}
if (!(config as LogicRuleConfig).logic) (config as LogicRuleConfig).logic = 'and';
delete (config as LogicRuleConfig & {availableFields?: string}).availableFields;
delete (config as LogicRuleConfig).logicRelation;
delete (config as LogicRuleConfig).initialField;
delete (config as LogicRuleConfig).initialOperator;
delete (config as LogicRuleConfig).initialValue;
break;
case 'regex':
// 检查字段是否存在于当前抽取字段中
if ((config as RegexRuleConfig).field && !validFields.includes((config as RegexRuleConfig).field)) {
(config as RegexRuleConfig).field = '';
}
if (!(config as RegexRuleConfig).field) (config as RegexRuleConfig).field = '';
if (!(config as RegexRuleConfig).pattern) (config as RegexRuleConfig).pattern = '';
if (!(config as RegexRuleConfig).matchType) (config as RegexRuleConfig).matchType = 'match';
delete (config as RegexRuleConfig & {availableFields?: string}).availableFields;
delete (config as RegexRuleConfig).checkField;
delete (config as RegexRuleConfig).regexPattern;
break;
case 'ai':
if (!(config as AIRuleConfig).model) (config as AIRuleConfig).model = 'qwen14b';
if (typeof (config as AIRuleConfig).temperature !== 'number') (config as AIRuleConfig).temperature = 0.1;
if (!(config as AIRuleConfig).prompt) (config as AIRuleConfig).prompt = '';
delete (config as AIRuleConfig & {availableFields?: string}).availableFields;
break;
case 'code':
if (!(config as CodeRuleConfig).language) (config as CodeRuleConfig).language = 'javascript';
if (!(config as CodeRuleConfig).code) (config as CodeRuleConfig).code = '';
delete (config as CodeRuleConfig & {availableFields?: string}).availableFields;
break;
}
return {
id: rule.id,
type: rule.type,
config
};
});
}
// console.log("当前评查配置-----------------:", formData.evaluation_config);
// 如果是新建模式,则删除id字段
if (!isEditMode) {
delete cleanedData.id;
}
try {
// 使用JSON序列化和反序列化来进行深拷贝,避免浏览器差异
const jsonString = JSON.stringify(cleanedData);
const finalData = JSON.parse(jsonString);
// 确保extraction_config和evaluation_config是有效的JSON对象
try {
JSON.parse(JSON.stringify(finalData.extraction_config));
} catch (e) {
throw new Error("extraction_config 格式无效");
}
try {
JSON.parse(JSON.stringify(finalData.evaluation_config));
} catch (e) {
throw new Error("evaluation_config 格式无效");
}
// 检查JSON字符串长度,如果太长可能会被截断
const dataLength = jsonString.length;
const maxLength = 65536; // 通常PostgreSQL的jsonb列可以存储的最大长度
if (dataLength > maxLength) {
throw new Error(`数据大小超过限制 (${dataLength} > ${maxLength})`);
}
// console.log("准备提交到API的数据(已经过深拷贝处理):", finalData);
// console.log("JSON数据长度:", dataLength);
let response;
if (isEditMode) {
response = await postgrestPut('evaluation_points', finalData, {id: formData.id!});
} else {
response = await postgrestPost('evaluation_points', finalData);
}
if (response.error) {
if (response.error.includes('evaluation_points_code_key')) {
toastService.error('在基本信息中:评查点编码已存在,请修改后保存。');
} else {
toastService.error(`系统繁忙: ${response.error}`);
}
setIsLoading(false);
} else if (response.data && Array.isArray(response.data) && response.data.length > 0) {
// 获取新创建或更新的评查点ID
const savedPointId = response.data[0]?.id;
if (savedPointId) {
// 显示成功消息
toastService.success(`评查点${isEditMode ? '更新' : '创建'}成功!`);
// 保存成功后跳转到编辑页面并重新加载数据
navigate(`/rules-new?id=${savedPointId}`, { replace: true });
// 重新获取评查点数据
await fetchEvaluationPoint(savedPointId);
} else {
// 无法获取ID的情况
toastService.warning(`评查点${isEditMode ? '更新' : '创建'}成功,但无法获取ID。正在返回列表页面。`);
navigate('/rules');
}
} else {
toastService.error('系统繁忙');
}
} catch (jsonError) {
console.error("JSON处理错误:", jsonError);
toastService.error(`数据处理错误: ${jsonError instanceof Error ? jsonError.message : '未知错误'}`);
setIsLoading(false);
return;
}
} catch (error) {
console.error("数据处理错误:", error);
toastService.error(`数据处理错误: ${error instanceof Error ? error.message : '未知错误'}`);
setIsLoading(false);
}
}
const handleSaveDraft = () => {
console.log("保存草稿");
}
const handleBasicInfoChange = (data: Record<string, unknown>) => {
setFormData(prev => ({ ...prev, ...data }));
}
const handleExtractionSettingsChange = (data: Record<string, unknown>) => {
setFormData(prev => ({ ...prev, ...data }));
// 提取并处理字段数据
const processFields = () => {
// 使用类型断言处理字段访问
const extractionConfig = data.extraction_config as {
llm?: { fields?: string[] };
vlm?: { fields?: Array<string | { name: string, type: string }> };
regex?: { fields?: Array<{ field: string, pattern: string }> };
} | undefined;
if (!extractionConfig) return;
const llmFields = extractionConfig.llm?.fields || [];
const vlmFields = extractionConfig.vlm?.fields || [];
const regexFields = (extractionConfig.regex?.fields || []).map((f: { field: string }) => f.field);
// 合并所有字段
const allFields = [
...llmFields,
...vlmFields.map((f: string | { name: string }) => typeof f === 'string' ? f : f.name),
...regexFields
].filter(Boolean);
setExtractionFields(allFields);
};
// 处理字段数据
if (data.extraction_config) {
processFields();
}
};
const handleReviewSettingsChange = (data: Record<string, unknown>) => {
// console.log("评查设置变更:", data);
// 检查数据中是否包含evaluation_config对象
if (data.evaluation_config) {
// 确保formData.evaluation_config存在并具有必要的默认属性
const currentConfig = formData.evaluation_config || {
logicType: 'and',
customLogic: '',
rules: []
};
// console.log("当前评查配置:", currentConfig);
// console.log("变更评查配置:", data.evaluation_config);
// 合并评查配置数据
const mergedConfig = {
...currentConfig,
...(data.evaluation_config as object)
};
// console.log("合并评查配置:", data.evaluation_config);
// 更新表单数据
setFormData(prev => ({
...prev,
evaluation_config: mergedConfig
// evaluation_config: data.evaluation_config as typeof prev.evaluation_config
}));
} else {
// 处理其他普通字段
setFormData(prev => ({ ...prev, ...data }));
}
}
/**
* 添加事件监听,处理抽取字段更新
*/
useEffect(() => {
// 定义事件处理函数
const handleExtractionFieldsUpdated = (event: CustomEvent<{fields: string[]}>) => {
const { fields } = event.detail;
if (Array.isArray(fields) && fields.length > 0) {
// 更新字段数据
setExtractionFields(fields);
}
};
// 添加事件监听
window.addEventListener('extraction-fields-updated', handleExtractionFieldsUpdated as EventListener);
// 清理函数
return () => {
window.removeEventListener('extraction-fields-updated', handleExtractionFieldsUpdated as EventListener);
};
}, []);
/**
* 页面加载时初始化处理
* 1. 检查URL参数,判断是新建还是编辑模式
* 2. 编辑模式下获取评查点数据
* 3. 获取评查点组数据(用于表单选择项)
*/
useEffect(() => {
const searchParams = new URLSearchParams(location.search);
const id = searchParams.get('id');
const mode = searchParams.get('mode');
// 从sessionStorage获取用户角色
if (typeof window !== 'undefined') {
const userRoleFromSession = sessionStorage.getItem('userRole') as UserRole || 'common';
setUserRole(userRoleFromSession);
}
// 编辑或复制模式下设置加载状态
if (id || mode === 'copy') {
setIsLoading(true);
}
// 设置编辑模式
if (mode && mode === 'copy') {
setIsEditMode(false);
} else {
setIsEditMode(!!id);
}
if (id) {
// 编辑模式:获取数据
fetchEvaluationPoint(parseInt(id));
} else {
// 新建模式:重置表单数据
resetFormData();
}
// 获取评查点组数据
fetchEvaluationPointGroups();
}, [location.search, fetchEvaluationPoint, fetchEvaluationPointGroups, resetFormData]);
// 渲染页面内容
return (
<div className="container">
{/* 页面标题和右上角保存按钮 */}
<PageHeader
title={isEditMode ? "编辑评查点" : "新增评查点"}
onSave={handleSave}
showSaveButton={isDeveloper}
/>
{/* 加载状态显示 */}
{isLoading ? (
<div className="flex justify-center items-center p-12">
<div className="loading-spinner"></div>
<span className="ml-3">...</span>
</div>
) : (
<RuleContext.Provider value={{
extractionFields,
updateFields: setExtractionFields
}}>
{/* 使用key属性强制在模式切换时重新渲染所有组件 */}
<div key={instanceKey}>
{/* 评查点基本信息设置 */}
<div className="mb-8">
<BasicInfo
onChange={handleBasicInfoChange}
initialData={formData}
evaluationPointGroups={evaluationPointGroups}
riskOptions={EVALUATION_OPTIONS.riskLevelOptions}
/>
</div>
{/* 抽取设置 - 配置从文档中提取的字段 */}
<div className="mb-8">
<ExtractionSettings
onChange={handleExtractionSettingsChange}
initialData={formData}
promptTypeOptions={EVALUATION_OPTIONS.promptTypeOptions}
vlmFieldTypeOptions={EVALUATION_OPTIONS.vlmFieldTypeOptions}
/>
</div>
{/* 评查设置 - 配置评查规则、消息等 */}
<div className="mb-8">
<ReviewSettings
onChange={handleReviewSettingsChange}
initialData={{
rules: formData.evaluation_config?.rules || [],
combinationLogic: formData.evaluation_config?.logicType || 'and',
customLogic: formData.evaluation_config?.customLogic || '',
pass_message: formData.pass_message || '文档检查通过,符合规范要求。',
fail_message: formData.fail_message || '文档存在以下问题,请修改后重新提交。',
suggestion_message: formData.suggestion_message || '',
suggestion_message_type: formData.suggestion_message_type || 'warning',
post_action: formData.post_action || 'none',
action_config: formData.action_config || '',
score: formData.score !== undefined ? formData.score : 0
}}
ruleTypeOptions={EVALUATION_OPTIONS.ruleTypeOptions}
logicTypeOptions={EVALUATION_OPTIONS.logicTypeOptions}
logicOperatorOptions={EVALUATION_OPTIONS.logicOperatorOptions}
compareMethodOptions={EVALUATION_OPTIONS.compareMethodOptions}
formatTypeOptions={EVALUATION_OPTIONS.formatTypeOptions}
comparisonOperatorOptions={EVALUATION_OPTIONS.comparisonOperatorOptions}
matchTypeOptions={EVALUATION_OPTIONS.matchTypeOptions}
suggestionMessageTypeOptions={EVALUATION_OPTIONS.suggestionMessageTypeOptions}
postActionOptions={EVALUATION_OPTIONS.postActionOptions}
/>
</div>
{/* 底部操作按钮区域 */}
<ActionButtons
onSave={handleSave}
onSaveDraft={handleSaveDraft}
isEditMode={isEditMode}
showButtons={isDeveloper}
/>
</div>
</RuleContext.Provider>
)}
</div>
);
}