Merge branch 'awen' into shiy
This commit is contained in:
@@ -3,3 +3,6 @@ node_modules
|
||||
/.cache
|
||||
/build
|
||||
.env
|
||||
|
||||
.idea
|
||||
|
||||
|
||||
@@ -0,0 +1,132 @@
|
||||
/**
|
||||
* AI智能分析组件
|
||||
* 显示AI对文档的分析结果、风险提示和优化建议
|
||||
*/
|
||||
|
||||
// 分析项类型
|
||||
interface AnalysisItem {
|
||||
title: string;
|
||||
content: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
// 分析数据类型
|
||||
interface AnalysisData {
|
||||
riskAlerts: AnalysisItem[];
|
||||
suggestions: AnalysisItem[];
|
||||
summary: string;
|
||||
}
|
||||
|
||||
interface AIAnalysisProps {
|
||||
analysisData: AnalysisData;
|
||||
score: number;
|
||||
onConfirmResults: () => void;
|
||||
}
|
||||
|
||||
export function AIAnalysis({ analysisData, score, onConfirmResults }: AIAnalysisProps) {
|
||||
const handleExportReport = () => {
|
||||
alert('导出评查报告功能');
|
||||
};
|
||||
|
||||
// 渲染风险提示项
|
||||
const renderRiskAlerts = () => {
|
||||
return analysisData.riskAlerts.map((item, index) => (
|
||||
<div key={`risk-${index}`} className="bg-gray-50 rounded-md p-4 mb-4">
|
||||
<div className="flex items-start">
|
||||
<i className="ri-lightbulb-line text-warning text-lg mr-2"></i>
|
||||
<div>
|
||||
<p className="text-sm mb-2">
|
||||
<span className="font-medium">{item.title}：</span>
|
||||
{item.content}
|
||||
</p>
|
||||
<p className="text-xs text-secondary">{item.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
));
|
||||
};
|
||||
|
||||
// 渲染优化建议项
|
||||
const renderSuggestions = () => {
|
||||
return analysisData.suggestions.map((item, index) => (
|
||||
<div key={`suggestion-${index}`} className="bg-gray-50 rounded-md p-4 mb-4">
|
||||
<div className="flex items-start">
|
||||
<i className="ri-lightbulb-line text-primary text-lg mr-2"></i>
|
||||
<div>
|
||||
<p className="text-sm mb-2">
|
||||
<span className="font-medium">{item.title}：</span>
|
||||
{item.content}
|
||||
</p>
|
||||
<p className="text-xs text-secondary">{item.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
));
|
||||
};
|
||||
|
||||
// 获取评分对应的颜色类
|
||||
const getScoreColorClass = (score: number) => {
|
||||
if (score >= 90) return 'text-success';
|
||||
if (score >= 70) return 'text-warning';
|
||||
return 'text-error';
|
||||
};
|
||||
|
||||
// 获取评分条对应的颜色类
|
||||
const getScoreBarColorClass = (score: number) => {
|
||||
if (score >= 90) return 'bg-success';
|
||||
if (score >= 70) return 'bg-warning';
|
||||
return 'bg-error';
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="analysis-card bg-white rounded-lg shadow-sm p-4">
|
||||
<h3 className="text-lg font-medium mb-4">AI智能分析</h3>
|
||||
|
||||
{/* 风险提示 */}
|
||||
{analysisData.riskAlerts.length > 0 && renderRiskAlerts()}
|
||||
|
||||
{/* 优化建议 */}
|
||||
{analysisData.suggestions.length > 0 && renderSuggestions()}
|
||||
</div>
|
||||
|
||||
<div className="mt-8">
|
||||
<h3 className="text-lg font-medium mb-4">综合评价</h3>
|
||||
<div className="bg-white border border-gray-200 p-4 rounded-md">
|
||||
{/* 评价摘要 */}
|
||||
<p className="text-sm">{analysisData.summary}</p>
|
||||
|
||||
{/* 评分 */}
|
||||
<div className="mt-4">
|
||||
<p className="text-sm font-medium">
|
||||
合规性评分：
|
||||
<span className={`${getScoreColorClass(score)} font-medium`}>{score}分</span>
|
||||
</p>
|
||||
<div className="mt-2 bg-gray-200 rounded-full h-2.5 w-full">
|
||||
<div
|
||||
className={`${getScoreBarColorClass(score)} h-2.5 rounded-full`}
|
||||
style={{ width: `${score}%` }}
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 操作按钮 */}
|
||||
<div className="mt-4 flex space-x-4">
|
||||
<button
|
||||
className="ant-btn ant-btn-default flex items-center"
|
||||
onClick={handleExportReport}
|
||||
>
|
||||
<i className="ri-file-download-line mr-1"></i> 导出评查报告
|
||||
</button>
|
||||
<button
|
||||
className="ant-btn ant-btn-primary flex items-center"
|
||||
onClick={onConfirmResults}
|
||||
>
|
||||
<i className="ri-check-double-line mr-1"></i> 确认评查结果
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,150 @@
|
||||
/**
|
||||
* 文件详情组件
|
||||
* 显示文件基本信息、合同信息和评查信息
|
||||
*/
|
||||
import { ReactNode } from 'react';
|
||||
|
||||
// 文件基本信息
|
||||
interface FileInfo {
|
||||
fileName: string;
|
||||
contractNumber: string;
|
||||
fileSize: string;
|
||||
fileFormat: string;
|
||||
pageCount: number;
|
||||
uploadTime: string;
|
||||
uploadUser: string;
|
||||
}
|
||||
|
||||
// 合同信息
|
||||
interface ContractInfo {
|
||||
contractType: string;
|
||||
signDate: string;
|
||||
parties: {
|
||||
partyA: string;
|
||||
partyB: string;
|
||||
};
|
||||
amount: string;
|
||||
period: string;
|
||||
}
|
||||
|
||||
// 评查信息
|
||||
interface ReviewInfo {
|
||||
reviewTime: string;
|
||||
reviewModel: string;
|
||||
ruleGroup: string;
|
||||
result: string;
|
||||
issueCount: number;
|
||||
}
|
||||
|
||||
interface FileDetailsProps {
|
||||
fileInfo: FileInfo;
|
||||
contractInfo: ContractInfo;
|
||||
reviewInfo: ReviewInfo;
|
||||
}
|
||||
|
||||
export function FileDetails({ fileInfo, contractInfo, reviewInfo }: FileDetailsProps) {
|
||||
// 情况状态对应的标签
|
||||
const renderResultBadge = (result: string) => {
|
||||
switch (result) {
|
||||
case 'success':
|
||||
return (
|
||||
<span className="status-badge status-success">
|
||||
<i className="ri-checkbox-circle-line mr-1"></i>通过
|
||||
</span>
|
||||
);
|
||||
case 'warning':
|
||||
return (
|
||||
<span className="status-badge status-warning">
|
||||
<i className="ri-alert-line mr-1"></i>警告
|
||||
</span>
|
||||
);
|
||||
case 'error':
|
||||
return (
|
||||
<span className="status-badge status-error">
|
||||
<i className="ri-close-circle-line mr-1"></i>不通过
|
||||
</span>
|
||||
);
|
||||
default:
|
||||
return (
|
||||
<span className="status-badge status-warning">
|
||||
<i className="ri-alert-line mr-1"></i>警告
|
||||
</span>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
// 渲染信息区块
|
||||
const renderInfoSection = (title: string, icon: string, color: string, children: ReactNode) => {
|
||||
return (
|
||||
<div className="info-section">
|
||||
<div className={`info-header bg-${color}-50`}>
|
||||
<i className={`${icon} text-${color}-500 text-lg mr-2`}></i>
|
||||
<h3 className={`font-medium text-${color}-700`}>{title}</h3>
|
||||
</div>
|
||||
<div className="info-content">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// 渲染信息行
|
||||
const renderInfoRow = (label: string, value: string | ReactNode) => {
|
||||
return (
|
||||
<div className="info-row">
|
||||
<div className="info-label">{label}：</div>
|
||||
<div className="info-value">{value}</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-white rounded-lg shadow-sm overflow-hidden">
|
||||
{/* 文件基本信息 */}
|
||||
{renderInfoSection('文件基本信息', 'ri-file-info-line', 'blue', (
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
{renderInfoRow('文件名称', fileInfo.fileName)}
|
||||
{renderInfoRow('合同编号', fileInfo.contractNumber)}
|
||||
{renderInfoRow('文件大小', fileInfo.fileSize)}
|
||||
{renderInfoRow('文件格式', fileInfo.fileFormat)}
|
||||
{renderInfoRow('页数', `${fileInfo.pageCount}页`)}
|
||||
{renderInfoRow('上传时间', fileInfo.uploadTime)}
|
||||
{renderInfoRow('上传用户', fileInfo.uploadUser)}
|
||||
</div>
|
||||
))}
|
||||
|
||||
{/* 合同信息 */}
|
||||
{renderInfoSection('合同信息', 'ri-file-paper-2-line', 'green', (
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
{renderInfoRow('合同类型', contractInfo.contractType)}
|
||||
{renderInfoRow('签约日期', contractInfo.signDate)}
|
||||
{renderInfoRow('合同当事人', (
|
||||
<div>
|
||||
<div>甲方：{contractInfo.parties.partyA}</div>
|
||||
<div>乙方：{contractInfo.parties.partyB}</div>
|
||||
</div>
|
||||
))}
|
||||
{renderInfoRow('合同金额', contractInfo.amount)}
|
||||
{renderInfoRow('履行期限', contractInfo.period)}
|
||||
</div>
|
||||
))}
|
||||
|
||||
{/* 评查信息 */}
|
||||
{renderInfoSection('评查信息', 'ri-search-eye-line', 'purple', (
|
||||
<>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
{renderInfoRow('评查时间', reviewInfo.reviewTime)}
|
||||
{renderInfoRow('评查模型', reviewInfo.reviewModel)}
|
||||
{renderInfoRow('评查规则组', reviewInfo.ruleGroup)}
|
||||
{renderInfoRow('评查结果', (
|
||||
<div className="flex items-center">
|
||||
{renderResultBadge(reviewInfo.result)}
|
||||
<span className="text-sm ml-2">（共发现{reviewInfo.issueCount}个问题）</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,72 @@
|
||||
/**
|
||||
* 文件信息组件
|
||||
* 显示文件名称、状态信息以及操作按钮（下载原文件、导出评查报告、确认评查结果）
|
||||
*/
|
||||
|
||||
interface FileInfoProps {
|
||||
fileInfo: {
|
||||
fileName: string;
|
||||
contractNumber: string;
|
||||
fileSize?: string;
|
||||
fileFormat?: string;
|
||||
pageCount?: number;
|
||||
uploadTime?: string;
|
||||
uploadUser?: string;
|
||||
};
|
||||
onConfirmResults: () => void;
|
||||
}
|
||||
|
||||
export function FileInfo({ fileInfo, onConfirmResults }: FileInfoProps) {
|
||||
const handleDownloadFile = () => {
|
||||
alert('下载原文件功能');
|
||||
};
|
||||
|
||||
const handleExportReport = () => {
|
||||
alert('导出评查报告功能');
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="mb-4 file-info-header">
|
||||
<div className="flex justify-between items-center">
|
||||
<div>
|
||||
<h2 className="text-xl font-medium">
|
||||
{fileInfo.fileName}
|
||||
<span className="text-sm text-secondary font-normal ml-2">
|
||||
合同编号：{fileInfo.contractNumber}
|
||||
</span>
|
||||
{fileInfo.fileSize && (
|
||||
<span className="text-xs text-gray-500 ml-2">
|
||||
{fileInfo.fileSize} | {fileInfo.fileFormat} | {fileInfo.pageCount}页
|
||||
</span>
|
||||
)}
|
||||
</h2>
|
||||
{fileInfo.uploadTime && (
|
||||
<div className="text-xs text-gray-500 mt-1">
|
||||
上传时间：{fileInfo.uploadTime} | 上传用户：{fileInfo.uploadUser}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex space-x-3">
|
||||
<button
|
||||
className="ant-btn ant-btn-default flex items-center"
|
||||
onClick={handleDownloadFile}
|
||||
>
|
||||
<i className="ri-file-download-line mr-1"></i> 下载原文件
|
||||
</button>
|
||||
<button
|
||||
className="ant-btn ant-btn-default flex items-center"
|
||||
onClick={handleExportReport}
|
||||
>
|
||||
<i className="ri-file-copy-line mr-1"></i> 导出评查报告
|
||||
</button>
|
||||
<button
|
||||
className="ant-btn ant-btn-primary flex items-center"
|
||||
onClick={onConfirmResults}
|
||||
>
|
||||
<i className="ri-check-double-line mr-1"></i> 确认评查结果
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,200 @@
|
||||
/**
|
||||
* 文件预览组件
|
||||
* 显示文档内容和评查点高亮
|
||||
*/
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
|
||||
// 定义评查点类型
|
||||
interface ReviewPoint {
|
||||
id: string;
|
||||
title: string;
|
||||
status: string;
|
||||
content: string;
|
||||
suggestion: string;
|
||||
position?: {
|
||||
section: string;
|
||||
index: number;
|
||||
};
|
||||
}
|
||||
|
||||
// 定义文档内容类型
|
||||
interface FileContent {
|
||||
title: string;
|
||||
contractNumber: string;
|
||||
parties: {
|
||||
partyA: {
|
||||
name: string;
|
||||
address: string;
|
||||
representative: string;
|
||||
phone: string;
|
||||
};
|
||||
partyB: {
|
||||
name: string;
|
||||
address: string;
|
||||
representative: string;
|
||||
phone: string;
|
||||
};
|
||||
};
|
||||
sections: {
|
||||
title: string;
|
||||
content: string;
|
||||
}[];
|
||||
}
|
||||
|
||||
interface FilePreviewProps {
|
||||
fileContent: FileContent;
|
||||
reviewPoints: ReviewPoint[];
|
||||
activeReviewPointId: string | null;
|
||||
}
|
||||
|
||||
export function FilePreview({ fileContent, reviewPoints, activeReviewPointId }: FilePreviewProps) {
|
||||
const [zoomLevel, setZoomLevel] = useState(100);
|
||||
const [highlightsVisible, setHighlightsVisible] = useState(true);
|
||||
const contentRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
// 放大文档
|
||||
const handleZoomIn = () => {
|
||||
if (zoomLevel < 200) {
|
||||
setZoomLevel(prevZoom => prevZoom + 10);
|
||||
}
|
||||
};
|
||||
|
||||
// 缩小文档
|
||||
const handleZoomOut = () => {
|
||||
if (zoomLevel > 50) {
|
||||
setZoomLevel(prevZoom => prevZoom - 10);
|
||||
}
|
||||
};
|
||||
|
||||
// 切换高亮显示
|
||||
const toggleHighlights = () => {
|
||||
setHighlightsVisible(!highlightsVisible);
|
||||
};
|
||||
|
||||
// 当选中的评查点变化时，滚动到对应位置
|
||||
useEffect(() => {
|
||||
if (activeReviewPointId && contentRef.current) {
|
||||
const highlightElement = contentRef.current.querySelector(`[data-review-id="${activeReviewPointId}"]`);
|
||||
if (highlightElement) {
|
||||
highlightElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
|
||||
// 添加临时突出显示效果
|
||||
highlightElement.classList.add('highlight-focus');
|
||||
setTimeout(() => {
|
||||
highlightElement.classList.remove('highlight-focus');
|
||||
}, 1500);
|
||||
}
|
||||
}
|
||||
}, [activeReviewPointId]);
|
||||
|
||||
// 获取评查点对应的样式类
|
||||
const getHighlightClass = (status: string) => {
|
||||
switch (status) {
|
||||
case 'warning':
|
||||
return 'warning';
|
||||
case 'error':
|
||||
return 'error';
|
||||
case 'success':
|
||||
return 'success';
|
||||
default:
|
||||
return 'warning';
|
||||
}
|
||||
};
|
||||
|
||||
// 渲染文档内容
|
||||
const renderDocumentContent = () => {
|
||||
return (
|
||||
<div className="word-document" ref={contentRef} style={{transform: `scale(${zoomLevel/100})`, transformOrigin: 'center top'}}>
|
||||
<h1>{fileContent.title}</h1>
|
||||
<p style={{textAlign: 'right'}}>合同编号：{fileContent.contractNumber}</p>
|
||||
|
||||
<div style={{margin: '20px 0'}}>
|
||||
<p><strong>甲方（供方）：</strong>{fileContent.parties.partyA.name}</p>
|
||||
<p>地址：{fileContent.parties.partyA.address}</p>
|
||||
<p>法定代表人：{fileContent.parties.partyA.representative}</p>
|
||||
<p>联系电话：{fileContent.parties.partyA.phone}</p>
|
||||
<p> </p>
|
||||
<p><strong>乙方（需方）：</strong>{fileContent.parties.partyB.name}</p>
|
||||
<p>地址：{fileContent.parties.partyB.address}</p>
|
||||
<p>法定代表人：{fileContent.parties.partyB.representative}</p>
|
||||
<p>联系电话：{fileContent.parties.partyB.phone}</p>
|
||||
</div>
|
||||
|
||||
<p>根据《中华人民共和国合同法》及有关法律法规的规定，经双方协商一致，签订本合同，共同遵守。</p>
|
||||
|
||||
{fileContent.sections.map((section, sectionIndex) => (
|
||||
<div key={sectionIndex}>
|
||||
<h2>{section.title}</h2>
|
||||
{renderSectionContent(section.content, section.title, sectionIndex)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// 渲染章节内容，处理高亮
|
||||
const renderSectionContent = (content: string, sectionTitle: string, sectionIndex: number) => {
|
||||
const lines = content.split('\n');
|
||||
|
||||
return lines.map((line, lineIndex) => {
|
||||
// 查找该行对应的评查点
|
||||
const reviewPoint = reviewPoints.find(point =>
|
||||
point.position &&
|
||||
point.position.section === sectionTitle &&
|
||||
point.position.index === lineIndex
|
||||
);
|
||||
|
||||
if (reviewPoint && highlightsVisible) {
|
||||
// 如果有对应的评查点，添加高亮
|
||||
const isActive = reviewPoint.id === activeReviewPointId;
|
||||
return (
|
||||
<div
|
||||
key={`${sectionIndex}-${lineIndex}`}
|
||||
className={`highlight-area ${getHighlightClass(reviewPoint.status)} ${isActive ? 'highlight-focus' : ''}`}
|
||||
data-review-id={reviewPoint.id}
|
||||
style={isActive ? {zIndex: 20, boxShadow: '0 0 0 2px yellow, 0 0 10px rgba(0,0,0,0.3)'} : {}}
|
||||
>
|
||||
<p>{line}</p>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
// 没有评查点，正常显示
|
||||
return <p key={`${sectionIndex}-${lineIndex}`}>{line}</p>;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="file-preview">
|
||||
<div className="file-preview-header py-2 px-4">
|
||||
<div className="flex items-center">
|
||||
<i className="ri-file-text-line text-primary mr-2"></i>
|
||||
<span className="font-medium text-primary">文件预览</span>
|
||||
</div>
|
||||
<div className="file-preview-actions">
|
||||
<button
|
||||
className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5"
|
||||
onClick={handleZoomIn}
|
||||
>
|
||||
<i className="ri-zoom-in-line"></i>
|
||||
</button>
|
||||
<button
|
||||
className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5"
|
||||
onClick={handleZoomOut}
|
||||
>
|
||||
<i className="ri-zoom-out-line"></i>
|
||||
</button>
|
||||
<button
|
||||
className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5"
|
||||
onClick={toggleHighlights}
|
||||
>
|
||||
<i className="ri-mark-pen-line"></i> {highlightsVisible ? '隐藏问题' : '显示问题'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="file-preview-content">
|
||||
{renderDocumentContent()}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,441 @@
|
||||
/**
|
||||
* 评查点列表组件
|
||||
* 显示评查结果统计和所有评查点列表
|
||||
*/
|
||||
import { useState } from 'react';
|
||||
|
||||
// 评查点类型定义
|
||||
interface ReviewPoint {
|
||||
id: string;
|
||||
title: string;
|
||||
location: string;
|
||||
status: string;
|
||||
content: string;
|
||||
suggestion: string;
|
||||
needsHumanReview?: boolean;
|
||||
humanReviewNote?: string;
|
||||
humanReviewBy?: string;
|
||||
humanReviewTime?: string;
|
||||
position?: {
|
||||
section: string;
|
||||
index: number;
|
||||
};
|
||||
}
|
||||
|
||||
// 统计数据类型
|
||||
interface Statistics {
|
||||
total: number;
|
||||
success: number;
|
||||
warning: number;
|
||||
error: number;
|
||||
score: number;
|
||||
}
|
||||
|
||||
interface ReviewPointsListProps {
|
||||
reviewPoints: ReviewPoint[];
|
||||
statistics: Statistics;
|
||||
activeReviewPointId: string | null;
|
||||
onReviewPointSelect: (id: string) => void;
|
||||
onStatusChange: (id: string, status: string) => void;
|
||||
}
|
||||
|
||||
export function ReviewPointsList({
|
||||
reviewPoints,
|
||||
statistics,
|
||||
activeReviewPointId,
|
||||
onReviewPointSelect,
|
||||
onStatusChange
|
||||
}: ReviewPointsListProps) {
|
||||
const [editingReviewPoint, setEditingReviewPoint] = useState<string | null>(null);
|
||||
const [userInputText, setUserInputText] = useState('');
|
||||
const [searchText, setSearchText] = useState('');
|
||||
const [statusFilter, setStatusFilter] = useState<string | null>(null);
|
||||
|
||||
// 过滤评查点
|
||||
const filteredReviewPoints = reviewPoints.filter(point => {
|
||||
const matchesSearch = searchText === '' ||
|
||||
point.title.toLowerCase().includes(searchText.toLowerCase()) ||
|
||||
point.location.toLowerCase().includes(searchText.toLowerCase()) ||
|
||||
point.content.toLowerCase().includes(searchText.toLowerCase());
|
||||
|
||||
const matchesStatus = statusFilter === null || point.status === statusFilter;
|
||||
|
||||
return matchesSearch && matchesStatus;
|
||||
});
|
||||
|
||||
// 处理点击"一键替换"按钮
|
||||
const handleReplace = (reviewPointId: string) => {
|
||||
// 在实际应用中，这里应该调用API进行内容替换
|
||||
// 模拟替换操作
|
||||
alert(`将为评查点 ${reviewPointId} 执行一键替换操作`);
|
||||
|
||||
// 更新评查点状态为成功
|
||||
onStatusChange(reviewPointId, 'success');
|
||||
};
|
||||
|
||||
// 处理评查点审核操作
|
||||
const handleReviewAction = (reviewPointId: string, action: 'approve' | 'reject') => {
|
||||
// 更新评查点状态
|
||||
onStatusChange(reviewPointId, action === 'approve' ? 'success' : 'error');
|
||||
|
||||
// 清除编辑状态
|
||||
setEditingReviewPoint(null);
|
||||
setUserInputText('');
|
||||
|
||||
alert(`${action === 'approve' ? '通过' : '不通过'}了评查点 ${reviewPointId}`);
|
||||
};
|
||||
|
||||
// 显示评查点详情编辑界面
|
||||
const handleEditReviewPoint = (reviewPointId: string) => {
|
||||
setEditingReviewPoint(reviewPointId);
|
||||
|
||||
// 获取评查点的建议内容作为初始值
|
||||
const reviewPoint = reviewPoints.find(point => point.id === reviewPointId);
|
||||
if (reviewPoint) {
|
||||
setUserInputText(reviewPoint.suggestion || '');
|
||||
}
|
||||
};
|
||||
|
||||
// 渲染评查统计信息
|
||||
const renderStatistics = () => {
|
||||
return (
|
||||
<div className="review-statistics bg-white border-b border-gray-100 py-3 px-4">
|
||||
<div className="flex justify-between items-center">
|
||||
<div className="flex items-center">
|
||||
<div className="w-7 h-7 bg-gray-100 rounded-md flex items-center justify-center">
|
||||
<span className="text-sm font-semibold text-gray-600">{statistics.total}</span>
|
||||
</div>
|
||||
<span className="text-xs text-gray-500 ml-1">总计</span>
|
||||
</div>
|
||||
<div className="h-8 border-r border-gray-200"></div>
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
className={`w-7 h-7 bg-green-50 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === 'success' ? 'ring-2 ring-success' : ''}`}
|
||||
onClick={() => setStatusFilter(statusFilter === 'success' ? null : 'success')}
|
||||
aria-label={`过滤通过项 ${statusFilter === 'success' ? '(已选中)' : ''}`}
|
||||
type="button"
|
||||
>
|
||||
<span className="text-sm font-semibold text-success">{statistics.success}</span>
|
||||
</button>
|
||||
<span className="text-xs text-gray-500 ml-1">通过</span>
|
||||
</div>
|
||||
<div className="h-8 border-r border-gray-200"></div>
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
className={`w-7 h-7 bg-yellow-50 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === 'warning' ? 'ring-2 ring-warning' : ''}`}
|
||||
onClick={() => setStatusFilter(statusFilter === 'warning' ? null : 'warning')}
|
||||
aria-label={`过滤警告项 ${statusFilter === 'warning' ? '(已选中)' : ''}`}
|
||||
type="button"
|
||||
>
|
||||
<span className="text-sm font-semibold text-warning">{statistics.warning}</span>
|
||||
</button>
|
||||
<span className="text-xs text-gray-500 ml-1">警告</span>
|
||||
</div>
|
||||
<div className="h-8 border-r border-gray-200"></div>
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
className={`w-7 h-7 bg-red-50 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === 'error' ? 'ring-2 ring-error' : ''}`}
|
||||
onClick={() => setStatusFilter(statusFilter === 'error' ? null : 'error')}
|
||||
aria-label={`过滤错误项 ${statusFilter === 'error' ? '(已选中)' : ''}`}
|
||||
type="button"
|
||||
>
|
||||
<span className="text-sm font-semibold text-error">{statistics.error}</span>
|
||||
</button>
|
||||
<span className="text-xs text-gray-500 ml-1">错误</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// 渲染搜索框
|
||||
const renderSearchBar = () => {
|
||||
return (
|
||||
<div className="py-2 px-3 border-b border-gray-100">
|
||||
<div className="relative">
|
||||
<input
|
||||
type="text"
|
||||
className="w-full border border-gray-200 rounded-md pl-8 pr-2 py-1 text-xs focus:outline-none focus:ring-1 focus:ring-primary"
|
||||
placeholder="搜索评查点..."
|
||||
value={searchText}
|
||||
onChange={(e) => setSearchText(e.target.value)}
|
||||
/>
|
||||
<i className="ri-search-line absolute left-2 top-0.5 text-gray-400"></i>
|
||||
{searchText && (
|
||||
<button
|
||||
className="absolute right-2 top-1.5 text-gray-400 hover:text-gray-600"
|
||||
onClick={() => setSearchText('')}
|
||||
>
|
||||
<i className="ri-close-line"></i>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// 渲染评查点状态标签
|
||||
const renderStatusBadge = (status: string) => {
|
||||
switch (status) {
|
||||
case 'success':
|
||||
return (
|
||||
<span className="status-badge status-success">
|
||||
<i className="ri-checkbox-circle-line mr-1"></i>通过
|
||||
</span>
|
||||
);
|
||||
case 'warning':
|
||||
return (
|
||||
<span className="status-badge status-warning">
|
||||
<i className="ri-alert-line mr-1"></i>警告
|
||||
</span>
|
||||
);
|
||||
case 'error':
|
||||
return (
|
||||
<span className="status-badge status-error">
|
||||
<i className="ri-close-circle-line mr-1"></i>不通过
|
||||
</span>
|
||||
);
|
||||
case 'processing':
|
||||
return (
|
||||
<span className="status-badge status-processing">
|
||||
<i className="ri-time-line mr-1"></i>处理中
|
||||
</span>
|
||||
);
|
||||
default:
|
||||
return (
|
||||
<span className="status-badge status-warning">
|
||||
<i className="ri-alert-line mr-1"></i>警告
|
||||
</span>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
// 渲染人工审核标记
|
||||
const renderHumanReviewBadge = (reviewPoint: ReviewPoint) => {
|
||||
if (reviewPoint.needsHumanReview) {
|
||||
return (
|
||||
<span className="status-badge status-waiting ml-2">
|
||||
<i className="ri-user-line mr-1"></i>需人工
|
||||
</span>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
// 渲染人工审核注释
|
||||
const renderHumanReviewNote = (reviewPoint: ReviewPoint) => {
|
||||
if (reviewPoint.needsHumanReview && reviewPoint.humanReviewNote) {
|
||||
return (
|
||||
<div className="human-review-note">
|
||||
<i className="ri-information-line mr-1"></i> {reviewPoint.humanReviewNote}
|
||||
{reviewPoint.humanReviewBy && reviewPoint.humanReviewTime && (
|
||||
<div className="text-right text-xs text-gray-500 mt-1">
|
||||
审核人：{reviewPoint.humanReviewBy} | 时间：{reviewPoint.humanReviewTime}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
// 渲染评查点内容与建议
|
||||
const renderReviewPointContent = (reviewPoint: ReviewPoint) => {
|
||||
// 如果当前评查点不处于编辑状态，只显示简单信息
|
||||
if (editingReviewPoint !== reviewPoint.id) {
|
||||
if (reviewPoint.status === 'success') {
|
||||
// 已通过的评查点只显示基本信息和人工审核注释
|
||||
if (reviewPoint.needsHumanReview && reviewPoint.humanReviewNote) {
|
||||
return (
|
||||
<div className="mt-2">
|
||||
<div className="p-2 bg-green-50 rounded border border-green-200 text-xs">
|
||||
<p className="text-xs text-success"><i className="ri-check-line mr-1"></i>已处理</p>
|
||||
{reviewPoint.suggestion && (
|
||||
<div className="border-t border-green-200 mt-1 pt-1">
|
||||
<p className="text-xs text-gray-600">{reviewPoint.suggestion}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mt-2">
|
||||
<div className="p-2 bg-white rounded border border-gray-200 text-xs">
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs">当前值</span>
|
||||
<span className={`text-xs ${reviewPoint.status === 'error' ? 'text-error' : 'text-warning'}`}>
|
||||
{reviewPoint.status === 'error' ? '不符合规范' : '需优化'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-xs text-left">{reviewPoint.content || '（内容为空）'}</p>
|
||||
|
||||
{reviewPoint.suggestion && (
|
||||
<div className="mt-2 pt-2 border-t border-gray-100">
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs">建议修改为</span>
|
||||
<span className='text-xs text-green-500'>
|
||||
符合规范
|
||||
</span>
|
||||
</div>
|
||||
<textarea
|
||||
className="text-xs w-full border border-gray-200 rounded p-2"
|
||||
rows={4}
|
||||
value={reviewPoint.suggestion}
|
||||
onChange={(e) => setUserInputText(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 操作按钮区域 */}
|
||||
<div className="flex space-x-2 mt-2">
|
||||
{/* 一键替换按钮 - 只有非人工审核的点或未通过的人工审核点才显示 */}
|
||||
{(!reviewPoint.needsHumanReview || reviewPoint.status !== 'success') && (
|
||||
<button
|
||||
className="replace-action flex-1 justify-center"
|
||||
onClick={() => handleReplace(reviewPoint.id)}
|
||||
>
|
||||
<i className="ri-replace-line"></i> 一键替换
|
||||
</button>
|
||||
)}
|
||||
|
||||
{/* 人工审核按钮 */}
|
||||
{reviewPoint.needsHumanReview && reviewPoint.status !== 'success' && (
|
||||
<button
|
||||
className="replace-action flex-1 justify-center human-review-request"
|
||||
onClick={() => handleEditReviewPoint(reviewPoint.id)}
|
||||
>
|
||||
<i className="ri-edit-line"></i> 人工审核
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// 处于编辑状态时显示编辑界面
|
||||
return (
|
||||
<div className="mt-2">
|
||||
<div className="p-2 bg-white rounded border border-gray-200 text-xs mb-2">
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs">当前值</span>
|
||||
<span className={`text-xs ${reviewPoint.status === 'error' ? 'text-error' : 'text-warning'}`}>
|
||||
{reviewPoint.status === 'error' ? '不符合规范' : '需优化'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-xs">{reviewPoint.content || '（内容为空）'}</p>
|
||||
|
||||
{reviewPoint.suggestion && (
|
||||
<div className="mt-2 pt-2 border-t border-gray-100">
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs text-primary">建议修改为</span>
|
||||
</div>
|
||||
<p className="text-xs">{reviewPoint.suggestion}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-50 rounded border border-gray-200 p-2">
|
||||
<label htmlFor="reviewNote" className="block text-xs text-gray-700 mb-1">审核意见</label>
|
||||
<textarea
|
||||
id="reviewNote"
|
||||
className="w-full border border-gray-200 rounded-md text-xs p-2 mb-2"
|
||||
placeholder="请输入审核意见（可选）..."
|
||||
rows={2}
|
||||
value={userInputText}
|
||||
onChange={(e) => setUserInputText(e.target.value)}
|
||||
></textarea>
|
||||
<div className="flex justify-end mt-2 space-x-2">
|
||||
<button
|
||||
className="replace-action"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, 'approve')}
|
||||
>
|
||||
<i className="ri-check-line"></i> 通过
|
||||
</button>
|
||||
<button
|
||||
className="replace-action status-error"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, 'reject')}
|
||||
>
|
||||
<i className="ri-close-line"></i> 不通过
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// 渲染无匹配结果提示
|
||||
const renderEmptyState = () => {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center py-8 px-4 text-center text-gray-500">
|
||||
<i className="ri-search-line text-3xl mb-2"></i>
|
||||
<p className="text-sm mb-1">没有找到匹配的评查点</p>
|
||||
<p className="text-xs">请尝试不同的搜索词或清除筛选条件</p>
|
||||
{(searchText || statusFilter) && (
|
||||
<button
|
||||
className="mt-3 text-xs text-primary underline"
|
||||
onClick={() => {
|
||||
setSearchText('');
|
||||
setStatusFilter(null);
|
||||
}}
|
||||
>
|
||||
清除所有筛选
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="review-points-panel">
|
||||
<div className="review-panel-header py-2 px-4 flex items-center">
|
||||
<i className="ri-file-list-check-line text-primary mr-2"></i>
|
||||
<span className="font-medium text-primary">评查结果</span>
|
||||
</div>
|
||||
|
||||
{/* 评查统计 */}
|
||||
{renderStatistics()}
|
||||
|
||||
{/* 搜索框 */}
|
||||
{renderSearchBar()}
|
||||
|
||||
{/* 评查点列表 */}
|
||||
<div className="review-points-list">
|
||||
{filteredReviewPoints.length > 0 ? (
|
||||
filteredReviewPoints.map(reviewPoint => (
|
||||
<button
|
||||
key={reviewPoint.id}
|
||||
className={`review-point-item ${activeReviewPointId === reviewPoint.id ? 'active' : ''}`}
|
||||
onClick={() => onReviewPointSelect(reviewPoint.id)}
|
||||
type="button"
|
||||
>
|
||||
<div className="review-point-header">
|
||||
<div className="review-point-title">{reviewPoint.title}</div>
|
||||
<div className="flex items-center">
|
||||
{renderStatusBadge(reviewPoint.status)}
|
||||
{renderHumanReviewBadge(reviewPoint)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="review-point-location">
|
||||
<i className="ri-file-list-line mr-1"></i>
|
||||
<span>{reviewPoint.location}</span>
|
||||
</div>
|
||||
|
||||
{/* 人工审核注释 */}
|
||||
{renderHumanReviewNote(reviewPoint)}
|
||||
|
||||
{/* 评查点内容和操作 */}
|
||||
{renderReviewPointContent(reviewPoint)}
|
||||
</button>
|
||||
))
|
||||
) : (
|
||||
renderEmptyState()
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
/**
|
||||
* 评查选项卡组件
|
||||
* 提供三个选项卡：评查结果、AI智能分析、文件信息
|
||||
*/
|
||||
import { ReactNode } from 'react';
|
||||
|
||||
interface ReviewTabsProps {
|
||||
activeTab: string;
|
||||
onTabChange: (tabKey: string) => void;
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
export function ReviewTabs({ activeTab, onTabChange, children }: ReviewTabsProps) {
|
||||
return (
|
||||
<div className="tab-container">
|
||||
<div className="tab-nav">
|
||||
<button
|
||||
className={`tab-nav-item ${activeTab === 'preview' ? 'active' : ''}`}
|
||||
onClick={() => onTabChange('preview')}
|
||||
type="button"
|
||||
aria-pressed={activeTab === 'preview'}
|
||||
>
|
||||
<i className="ri-file-text-line"></i> 评查结果
|
||||
</button>
|
||||
<button
|
||||
className={`tab-nav-item ${activeTab === 'analysis' ? 'active' : ''}`}
|
||||
onClick={() => onTabChange('analysis')}
|
||||
type="button"
|
||||
aria-pressed={activeTab === 'analysis'}
|
||||
>
|
||||
<i className="ri-lightbulb-line"></i> AI智能分析
|
||||
</button>
|
||||
<button
|
||||
className={`tab-nav-item ${activeTab === 'fileinfo' ? 'active' : ''}`}
|
||||
onClick={() => onTabChange('fileinfo')}
|
||||
type="button"
|
||||
aria-pressed={activeTab === 'fileinfo'}
|
||||
>
|
||||
<i className="ri-information-line"></i> 文件信息
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="tab-content">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
/**
|
||||
* 评查详情组件导出文件
|
||||
*/
|
||||
|
||||
export { FileInfo } from './FileInfo';
|
||||
export { ReviewTabs } from './ReviewTabs';
|
||||
export { FilePreview } from './FilePreview';
|
||||
export { ReviewPointsList } from './ReviewPointsList';
|
||||
export { AIAnalysis } from './AIAnalysis';
|
||||
export { FileDetails } from './FileDetails';
|
||||
@@ -0,0 +1,35 @@
|
||||
import React from 'react';
|
||||
|
||||
interface ActionButtonsProps {
|
||||
onSave?: () => void;
|
||||
onSaveDraft?: () => void;
|
||||
isEditMode?: boolean;
|
||||
}
|
||||
|
||||
export function ActionButtons({ onSave, onSaveDraft, isEditMode }: ActionButtonsProps) {
|
||||
return (
|
||||
<div className="flex justify-center space-x-4 mt-8 mb-4">
|
||||
<button
|
||||
type="button"
|
||||
className="ant-btn ant-btn-primary min-w-[120px]"
|
||||
onClick={onSave}
|
||||
>
|
||||
<i className="ri-save-line mr-1"></i> {isEditMode ? '保存修改' : '保存'}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="ant-btn ant-btn-default min-w-[120px]"
|
||||
onClick={onSaveDraft}
|
||||
>
|
||||
<i className="ri-draft-line mr-1"></i> {isEditMode ? '另存为草稿' : '保存草稿'}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="ant-btn ant-btn-default min-w-[120px]"
|
||||
onClick={() => window.history.back()}
|
||||
>
|
||||
<i className="ri-arrow-left-line mr-1"></i> 返回
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,421 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import type { EvaluationPoint } from '~/models/evaluation_points';
|
||||
import type { EvaluationPointGroup } from '~/models/evaluation_point_groups';
|
||||
interface BasicInfoProps {
|
||||
onChange?: (data: Record<string, unknown>) => void;
|
||||
initialData?: EvaluationPoint;
|
||||
evaluationPointGroups?: EvaluationPointGroup[];
|
||||
riskOptions?: Array<{value: string, label: string}>;
|
||||
}
|
||||
|
||||
// 评查点基本信息组件
|
||||
export function BasicInfo({ onChange, initialData, evaluationPointGroups = [], riskOptions = [] }: BasicInfoProps) {
|
||||
const [formData, setFormData] = useState<EvaluationPoint>({
|
||||
risk: 'medium', // 风险等级 默认中风险
|
||||
is_enabled: true, // 是否启用 默认启用
|
||||
references_laws: {
|
||||
name: '',
|
||||
articles: [],
|
||||
content: ''
|
||||
},
|
||||
...(initialData || {}) // 合并初始数据
|
||||
});
|
||||
|
||||
// 找到当前评查点类型对应的code
|
||||
const getCheckpointTypeCode = () => {
|
||||
if (!formData.evaluation_point_groups_pid) return "";
|
||||
|
||||
const typeGroup = evaluationPointGroups.find(
|
||||
group => group.id === formData.evaluation_point_groups_pid && group.pid === 0
|
||||
);
|
||||
|
||||
return typeGroup?.code || "";
|
||||
};
|
||||
|
||||
// 评查点描述与法律依据 展开状态
|
||||
const [isDescExpanded, setIsDescExpanded] = useState(false);
|
||||
|
||||
// 条款号临时输入字符串（不会触发自动分割）
|
||||
const [lawArticlesText, setLawArticlesText] = useState('');
|
||||
|
||||
// 根据选择的评查点类型筛选可用的规则组
|
||||
const filteredRuleGroups = evaluationPointGroups.filter(group =>
|
||||
formData.evaluation_point_groups_pid &&
|
||||
group.pid === formData.evaluation_point_groups_pid &&
|
||||
group.is_enabled
|
||||
);
|
||||
|
||||
// 获取评查点类型选项（pid=0的数据）
|
||||
const getCheckpointTypeOptions = () => {
|
||||
if (!evaluationPointGroups || evaluationPointGroups.length === 0) {
|
||||
return (
|
||||
<>
|
||||
<option value="">请选择评查点类型</option>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const typeGroups = evaluationPointGroups.filter(group => group.pid === 0 && group.is_enabled);
|
||||
|
||||
return (
|
||||
<>
|
||||
<option value="">请选择评查点类型</option>
|
||||
{typeGroups.map(group => (
|
||||
<option key={group.id} value={group.code}>
|
||||
{group.name}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
// 评查点描述与法律依据 展开状态
|
||||
const handleToggleDescription = () => {
|
||||
setIsDescExpanded(!isDescExpanded);
|
||||
};
|
||||
|
||||
// 处理表单输入变化
|
||||
const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>) => {
|
||||
const { id, value } = e.target;
|
||||
const newData = { ...formData };
|
||||
// 映射id到表单字段名
|
||||
switch(id) {
|
||||
case 'rule-name':
|
||||
newData.name = value;
|
||||
break;
|
||||
case 'rule-code':
|
||||
newData.code = value;
|
||||
break;
|
||||
case 'risk-level':
|
||||
newData.risk = value;
|
||||
break;
|
||||
case 'is-enabled':
|
||||
newData.is_enabled = value === 'true';
|
||||
break;
|
||||
case 'rule-description':
|
||||
newData.description = value;
|
||||
break;
|
||||
case 'law-name':
|
||||
newData.references_laws = {
|
||||
...formData.references_laws,
|
||||
name: value
|
||||
};
|
||||
break;
|
||||
case 'law-content':
|
||||
newData.references_laws = {
|
||||
...formData.references_laws,
|
||||
content: value
|
||||
};
|
||||
break;
|
||||
case 'evaluation-point-group':
|
||||
newData.evaluation_point_groups_id = value ? parseInt(value) : null;
|
||||
break;
|
||||
case 'checkpoint-type':
|
||||
// 处理评查点类型选择
|
||||
if (value) {
|
||||
// 找到选中的类型组
|
||||
const selectedType = evaluationPointGroups.find(group => group.code === value && group.pid === 0);
|
||||
if (selectedType) {
|
||||
newData.evaluation_point_groups_pid = selectedType.id;
|
||||
}
|
||||
} else {
|
||||
newData.evaluation_point_groups_pid = null;
|
||||
newData.evaluation_point_groups_id = null; // 清空规则组选择
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
setFormData(newData);
|
||||
|
||||
if (onChange) {
|
||||
onChange(newData);
|
||||
}
|
||||
};
|
||||
|
||||
// 处理条款号输入框变化
|
||||
const handleLawArticlesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
// 设置临时字符串状态，这样不会触发任何处理
|
||||
setLawArticlesText(e.target.value);
|
||||
};
|
||||
|
||||
// 处理条款号输入框失去焦点
|
||||
const handleLawArticlesBlur = () => {
|
||||
if (!lawArticlesText) return;
|
||||
|
||||
// 将输入的文本转换为数组
|
||||
const articles = lawArticlesText
|
||||
.split(',')
|
||||
.map(article => article.trim())
|
||||
.filter(article => article !== '');
|
||||
|
||||
// 创建一个新的引用法律对象，保留现有字段
|
||||
const referencesLaws = {
|
||||
...(formData.references_laws || {}),
|
||||
articles: articles.length > 0 ? articles : []
|
||||
};
|
||||
|
||||
// 更新表单数据
|
||||
const newData = {
|
||||
...formData,
|
||||
references_laws: referencesLaws
|
||||
};
|
||||
|
||||
setFormData(newData);
|
||||
|
||||
if (onChange) {
|
||||
onChange(newData);
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化条款号文本字段
|
||||
useEffect(() => {
|
||||
if (formData.references_laws?.articles && formData.references_laws.articles.length > 0) {
|
||||
setLawArticlesText(formData.references_laws.articles.join(','));
|
||||
}
|
||||
}, [formData.references_laws?.articles]);
|
||||
|
||||
// 检查是否需要自动展开描述区域
|
||||
useEffect(() => {
|
||||
// 如果描述或法律依据相关字段有值，则自动展开
|
||||
if (
|
||||
formData.description ||
|
||||
formData.references_laws?.name ||
|
||||
(formData.references_laws?.articles && formData.references_laws.articles.length > 0) ||
|
||||
formData.references_laws?.content
|
||||
) {
|
||||
setIsDescExpanded(true);
|
||||
}
|
||||
}, [formData]);
|
||||
|
||||
useEffect(() => {
|
||||
// 可以在这里通知父组件
|
||||
if (onChange && filteredRuleGroups.length === 1) {
|
||||
onChange({ evaluation_point_groups_id: filteredRuleGroups[0].id });
|
||||
}
|
||||
}, [filteredRuleGroups, onChange]);
|
||||
|
||||
return (
|
||||
<div className="ant-card">
|
||||
<div className="ant-card-header">
|
||||
<h3>基本信息</h3>
|
||||
</div>
|
||||
<div className="ant-card-body">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
<div>
|
||||
<label className="form-label" htmlFor="rule-name">
|
||||
评查点名称 <span className="required-mark">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="rule-name"
|
||||
className="form-input"
|
||||
placeholder="请输入评查点名称，简洁明了"
|
||||
value={formData.name}
|
||||
onChange={handleInputChange}
|
||||
/>
|
||||
<div className="form-tip">请使用简洁明了的名称，不超过30个字符</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="form-label" htmlFor="rule-code">
|
||||
评查点编码 <span className="required-mark">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="rule-code"
|
||||
className="form-input"
|
||||
placeholder="请输入评查点编码"
|
||||
value={formData.code}
|
||||
onChange={handleInputChange}
|
||||
/>
|
||||
<div className="form-tip">用于系统标识的唯一编码</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="form-label" htmlFor="risk-level">
|
||||
风险等级： <span className="required-mark">*</span>
|
||||
</label>
|
||||
<select
|
||||
id="risk-level"
|
||||
className="form-select"
|
||||
value={formData.risk}
|
||||
onChange={handleInputChange}
|
||||
>
|
||||
{riskOptions.length > 0 ? (
|
||||
riskOptions.map(option => (
|
||||
<option key={option.value} value={option.value}>
|
||||
{option.label}
|
||||
</option>
|
||||
))
|
||||
) : (
|
||||
<>
|
||||
<option value="high">高风险</option>
|
||||
<option value="medium">中风险</option>
|
||||
<option value="low">低风险</option>
|
||||
</>
|
||||
)}
|
||||
</select>
|
||||
<div className="form-tip">请定义评查点的风险等级</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="form-label" htmlFor="checkpoint-type">
|
||||
评查点类型 <span className="required-mark">*</span>
|
||||
</label>
|
||||
<select
|
||||
id="checkpoint-type"
|
||||
className="form-select"
|
||||
value={getCheckpointTypeCode()}
|
||||
onChange={handleInputChange}
|
||||
>
|
||||
{getCheckpointTypeOptions()}
|
||||
</select>
|
||||
<div className="form-tip">评查点类型用于分类管理，便于规则统一调用</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="form-label" htmlFor="evaluation-point-group">
|
||||
所属规则组 <span className="required-mark">*</span>
|
||||
</label>
|
||||
<select
|
||||
id="evaluation-point-group"
|
||||
className={`form-select ${!formData.evaluation_point_groups_pid || filteredRuleGroups.length === 0 ? 'bg-gray-100 cursor-not-allowed' : ''}`}
|
||||
value={formData.evaluation_point_groups_id?.toString() || ""}
|
||||
onChange={handleInputChange}
|
||||
disabled={!formData.evaluation_point_groups_pid || filteredRuleGroups.length === 0}
|
||||
>
|
||||
<option value="">
|
||||
{!formData.evaluation_point_groups_pid ? "请先选择评查点类型" :
|
||||
filteredRuleGroups.length === 0 ? "该类型下暂无可用规则组" :
|
||||
"请选择规则组"}
|
||||
</option>
|
||||
{filteredRuleGroups.map(group => (
|
||||
<option key={group.id} value={group.id.toString()}>
|
||||
{group.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
<div className="form-tip">
|
||||
{!formData.evaluation_point_groups_pid ? "请先选择评查点类型" :
|
||||
filteredRuleGroups.length === 0 ? "该类型下暂无可用规则组" :
|
||||
"选择评查点所属的规则组"}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="form-label" htmlFor="is-enabled">是否启用</label>
|
||||
<select
|
||||
id="is-enabled"
|
||||
className="form-select"
|
||||
value={formData.is_enabled ? 'true' : 'false'}
|
||||
onChange={handleInputChange}
|
||||
>
|
||||
<option value="true">是</option>
|
||||
<option value="false">否</option>
|
||||
</select>
|
||||
<div className="form-tip">创建后是否立即启用此评查点</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-8">
|
||||
<div
|
||||
className={`flex justify-between items-center cursor-pointer ${isDescExpanded ? 'expanded' : ''}`}
|
||||
onClick={handleToggleDescription}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
handleToggleDescription();
|
||||
}
|
||||
}}
|
||||
tabIndex={0}
|
||||
role="button"
|
||||
>
|
||||
<label className="form-label mb-0" htmlFor="description-section">评查点描述与法律依据</label>
|
||||
<i className={`ri-arrow-${isDescExpanded ? 'up' : 'down'}-s-line text-lg expand-icon`}></i>
|
||||
</div>
|
||||
|
||||
<div className={`mt-2 ${isDescExpanded ? '' : 'hidden'}`} id="description-section">
|
||||
<div className="mb-4">
|
||||
<textarea
|
||||
id="rule-description"
|
||||
className="form-textarea"
|
||||
placeholder="请输入评查点的详细描述"
|
||||
style={{ minHeight: '80px' }}
|
||||
value={formData.description}
|
||||
onChange={handleInputChange}
|
||||
></textarea>
|
||||
<div className="form-tip">详细描述有助于其他用户了解该评查点的用途</div>
|
||||
</div>
|
||||
|
||||
{/* 引用法典输入区域 */}
|
||||
<div className="mb-4">
|
||||
<label className="form-label" htmlFor="law-section">引用法典</label>
|
||||
|
||||
<div className="mb-3" id="law-section">
|
||||
<label className="text-sm text-gray-600 mb-1 block" htmlFor="law-name">法典名称</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-input"
|
||||
placeholder="例如：《中华人民共和国民法典》"
|
||||
id="law-name"
|
||||
value={formData.references_laws?.name || ''}
|
||||
onChange={handleInputChange}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="text-sm text-gray-600 mb-1 block" htmlFor="law-articles">
|
||||
条款号 <span className="text-xs text-gray-400">(多个条款请用逗号分隔)</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-input"
|
||||
placeholder="例如：第五百八十五条,第五百八十六条"
|
||||
id="law-articles"
|
||||
value={lawArticlesText}
|
||||
onChange={handleLawArticlesChange}
|
||||
onBlur={handleLawArticlesBlur}
|
||||
/>
|
||||
<div className="form-tip">多个条款用逗号分隔，将自动转换为数组格式</div>
|
||||
</div>
|
||||
|
||||
<div className="mb-4">
|
||||
<label className="text-sm text-gray-600 mb-1 block" htmlFor="law-content">条款内容</label>
|
||||
<textarea
|
||||
className="form-textarea"
|
||||
style={{ minHeight: '60px' }}
|
||||
placeholder="例如：当事人应当按照约定全面履行自己的义务。"
|
||||
id="law-content"
|
||||
value={formData.references_laws?.content || ''}
|
||||
onChange={handleInputChange}
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div className="p-3 bg-blue-50 border border-blue-200 rounded-md text-sm text-blue-700 mb-2">
|
||||
<i className="ri-information-line mr-1"></i> 引用的法律条文将在评查结果中显示，帮助用户理解评查规则的法律依据
|
||||
</div>
|
||||
|
||||
{/* 预览区域 */}
|
||||
<div className="mt-3">
|
||||
<div className="text-sm font-medium mb-2">预览效果</div>
|
||||
<div className="law-reference">
|
||||
<div className="law-reference-title" id="preview-law-name">
|
||||
{formData.references_laws?.name || '《中华人民共和国民法典》'}
|
||||
</div>
|
||||
<div className="law-reference-articles" id="preview-law-articles">
|
||||
{formData.references_laws?.articles && formData.references_laws.articles.length > 0 ?
|
||||
formData.references_laws.articles.map((article, index) => (
|
||||
<span key={index} className="law-article">{article}</span>
|
||||
)) : (
|
||||
<>
|
||||
<span className="law-article">第五百八十五条</span>
|
||||
<span className="law-article">第五百八十六条</span>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<div className="law-reference-content" id="preview-law-content">
|
||||
{formData.references_laws?.content || '当事人应当按照约定全面履行自己的义务。'}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,128 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import CodeMirror from '@uiw/react-codemirror';
|
||||
import { javascript } from '@codemirror/lang-javascript';
|
||||
import { oneDark } from '@codemirror/theme-one-dark';
|
||||
|
||||
interface CodeEditorProps {
|
||||
id: string;
|
||||
initialValue?: string;
|
||||
language?: 'javascript' | 'python';
|
||||
onChange?: (value: string) => void;
|
||||
}
|
||||
|
||||
export function CodeEditor({
|
||||
id,
|
||||
initialValue = '',
|
||||
language = 'javascript',
|
||||
onChange
|
||||
}: CodeEditorProps) {
|
||||
const [code, setCode] = useState(initialValue);
|
||||
const [copySuccess, setCopySuccess] = useState(false);
|
||||
|
||||
// 当语言变化时更新编辑器
|
||||
const extensions = [language === 'javascript' ? javascript() : javascript()];
|
||||
|
||||
// 处理代码变化
|
||||
const handleChange = (value: string) => {
|
||||
setCode(value);
|
||||
if (onChange) {
|
||||
onChange(value);
|
||||
}
|
||||
};
|
||||
|
||||
// 复制代码到剪贴板
|
||||
const copyToClipboard = () => {
|
||||
navigator.clipboard.writeText(code).then(() => {
|
||||
setCopySuccess(true);
|
||||
setTimeout(() => setCopySuccess(false), 2000);
|
||||
});
|
||||
};
|
||||
|
||||
// 初始示例代码
|
||||
const getDefaultCode = (lang: string) => {
|
||||
if (lang === 'javascript') {
|
||||
return `// 示例代码
|
||||
function checkRule(data) {
|
||||
// data 包含抽取的字段
|
||||
try {
|
||||
// 在此编写检查逻辑
|
||||
if (data.fieldName && condition) {
|
||||
return {
|
||||
pass: true,
|
||||
message: "检查通过"
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
pass: false,
|
||||
message: "检查不通过，原因：..."
|
||||
};
|
||||
}
|
||||
} catch (error) {
|
||||
return {
|
||||
pass: false,
|
||||
message: "执行出错：" + error.message
|
||||
};
|
||||
}
|
||||
}`;
|
||||
} else {
|
||||
return `# 示例代码
|
||||
def check_rule(data):
|
||||
# data 包含抽取的字段
|
||||
try:
|
||||
# 在此编写检查逻辑
|
||||
if 'field_name' in data and condition:
|
||||
return {
|
||||
'pass': True,
|
||||
'message': "检查通过"
|
||||
}
|
||||
else:
|
||||
return {
|
||||
'pass': False,
|
||||
'message': "检查不通过，原因：..."
|
||||
}
|
||||
except Exception as error:
|
||||
return {
|
||||
'pass': False,
|
||||
'message': f"执行出错：{str(error)}"
|
||||
}`;
|
||||
}
|
||||
};
|
||||
|
||||
// 如果初始值为空，则使用默认示例代码
|
||||
useEffect(() => {
|
||||
if (!initialValue) {
|
||||
setCode(getDefaultCode(language));
|
||||
}
|
||||
}, [language, initialValue]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="code-editor-wrapper">
|
||||
<div className="code-editor-header">
|
||||
<div className="code-editor-filename">{language === 'javascript' ? 'script.js' : 'script.py'}</div>
|
||||
<div className="code-editor-actions">
|
||||
<i
|
||||
className="ri-file-copy-line"
|
||||
title="复制代码"
|
||||
onClick={copyToClipboard}
|
||||
></i>
|
||||
</div>
|
||||
</div>
|
||||
<CodeMirror
|
||||
id={id}
|
||||
value={code}
|
||||
height="400px"
|
||||
theme={oneDark}
|
||||
extensions={extensions}
|
||||
onChange={handleChange}
|
||||
style={{ fontSize: '14px' }}
|
||||
/>
|
||||
</div>
|
||||
{copySuccess && (
|
||||
<div className="code-copy-success show">
|
||||
代码已复制到剪贴板
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,21 @@
|
||||
interface PageHeaderProps {
|
||||
title: string;
|
||||
onSave?: () => void;
|
||||
}
|
||||
|
||||
export function PageHeader({ title, onSave }: PageHeaderProps) {
|
||||
return (
|
||||
<div className="flex justify-between items-center pb-2 mb-4 border-b border-gray-200">
|
||||
<h1 className="text-xl font-medium text-gray-800">{title}</h1>
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
className="ant-btn ant-btn-primary"
|
||||
onClick={onSave}
|
||||
>
|
||||
<i className="ri-save-line mr-1"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,95 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
interface SimpleCodeEditorProps {
|
||||
id: string;
|
||||
initialValue?: string;
|
||||
language?: 'javascript' | 'python';
|
||||
onChange?: (value: string) => void;
|
||||
}
|
||||
|
||||
export function SimpleCodeEditor({
|
||||
id,
|
||||
initialValue = '',
|
||||
language = 'javascript',
|
||||
onChange
|
||||
}: SimpleCodeEditorProps) {
|
||||
const [code, setCode] = useState(initialValue);
|
||||
const [copySuccess, setCopySuccess] = useState(false);
|
||||
|
||||
// 复制代码到剪贴板
|
||||
const copyToClipboard = () => {
|
||||
navigator.clipboard.writeText(code).then(() => {
|
||||
setCopySuccess(true);
|
||||
setTimeout(() => setCopySuccess(false), 2000);
|
||||
});
|
||||
};
|
||||
|
||||
// 处理代码变化
|
||||
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
|
||||
const value = e.target.value;
|
||||
setCode(value);
|
||||
if (onChange) {
|
||||
onChange(value);
|
||||
}
|
||||
};
|
||||
|
||||
// 更新初始值
|
||||
useEffect(() => {
|
||||
if (initialValue !== undefined) {
|
||||
setCode(initialValue);
|
||||
}
|
||||
}, [initialValue]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="code-editor-wrapper">
|
||||
<div className="code-editor-header">
|
||||
<div className="code-editor-filename">{language === 'javascript' ? 'script.js' : 'script.py'}</div>
|
||||
<div className="code-editor-actions">
|
||||
<button
|
||||
className="bg-transparent border-0 p-0 cursor-pointer"
|
||||
title="复制代码"
|
||||
onClick={copyToClipboard}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
copyToClipboard();
|
||||
}
|
||||
}}
|
||||
aria-label="复制代码"
|
||||
tabIndex={0}
|
||||
>
|
||||
<i className="ri-file-copy-line"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="code-editor-container">
|
||||
<textarea
|
||||
id={id}
|
||||
className="code-editor-textarea"
|
||||
value={code}
|
||||
onChange={handleChange}
|
||||
placeholder="请输入自定义代码"
|
||||
style={{
|
||||
fontFamily: 'Consolas, Monaco, Courier New, monospace',
|
||||
fontSize: '14px',
|
||||
lineHeight: '1.5',
|
||||
padding: '12px',
|
||||
width: '100%',
|
||||
height: '400px',
|
||||
backgroundColor: '#272822',
|
||||
color: '#f8f8f2',
|
||||
border: 'none',
|
||||
resize: 'vertical',
|
||||
tabSize: '4'
|
||||
}}
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
{copySuccess && (
|
||||
<div className="code-copy-success show">
|
||||
代码已复制到剪贴板
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
import { createContext } from 'react';
|
||||
|
||||
/**
|
||||
* 规则上下文类型
|
||||
* 用于在抽取设置和评查设置之间共享数据
|
||||
*/
|
||||
export interface RuleContextType {
|
||||
/**
|
||||
* 抽取的字段列表
|
||||
*/
|
||||
extractionFields: string[];
|
||||
|
||||
/**
|
||||
* 更新字段列表的函数
|
||||
*/
|
||||
updateFields: (fields: string[]) => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建规则上下文
|
||||
* 用于在抽取设置和评查设置组件之间共享字段数据
|
||||
*/
|
||||
export const RuleContext = createContext<RuleContextType>({
|
||||
extractionFields: [],
|
||||
updateFields: () => {}
|
||||
});
|
||||
@@ -5,14 +5,12 @@
|
||||
*/
|
||||
|
||||
import { RemixBrowser } from "@remix-run/react";
|
||||
import { startTransition, StrictMode } from "react";
|
||||
import { startTransition } from "react";
|
||||
import { hydrateRoot } from "react-dom/client";
|
||||
|
||||
startTransition(() => {
|
||||
hydrateRoot(
|
||||
document,
|
||||
<StrictMode>
|
||||
<RemixBrowser />
|
||||
</StrictMode>
|
||||
);
|
||||
});
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
/**
|
||||
* 评查点分组表
|
||||
*/
|
||||
interface EvaluationPointGroup {
|
||||
id: number; // 主键，自增
|
||||
pid: number | null; // 所属分组ID，外键引用本表，可为空
|
||||
code: string; // 分组编码，唯一且非空
|
||||
name: string; // 分组名称，非空
|
||||
description?: string; // 分组描述，可为空
|
||||
is_enabled: boolean; // 是否启用，默认true
|
||||
created_at: string; // 创建时间，带时区，默认当前时间
|
||||
updated_at: string; // 更新时间，带时区，默认当前时间
|
||||
}
|
||||
|
||||
export type { EvaluationPointGroup };
|
||||
@@ -0,0 +1,308 @@
|
||||
/**
|
||||
* 评查点数据类型定义
|
||||
*/
|
||||
interface EvaluationPoint {
|
||||
id?: number;
|
||||
name?: string; // 评查点名称
|
||||
code?: string; // 评查点编码
|
||||
risk?: string; // 风险级别
|
||||
is_enabled?: boolean; // 是否启用
|
||||
description?: string; // 描述
|
||||
references_laws?: { // 法律法规引用
|
||||
name?: string; // 法规名称
|
||||
articles?: string[]; // 条款列表
|
||||
content?: string; // 法规内容
|
||||
};
|
||||
evaluation_point_groups_pid?: number | null; // 评查点类型组ID
|
||||
evaluation_point_groups_id?: number | null; // 所属评查组ID
|
||||
extraction_config?: ExtactionConfigType; // 抽取配置
|
||||
evaluation_config?: EvaluationConfigType; // 评查配置
|
||||
pass_message?: string; // 通过消息
|
||||
fail_message?: string; // 失败消息
|
||||
suggestion_message?: string; // 建议消息
|
||||
suggestion_message_type?: SuggestionMessageType; // 建议消息类型 默认warning（info/warning/error）
|
||||
post_action?: PostActionType; // 评查后动作 可为空（none/manual/replace）
|
||||
action_config?: string; // 动作配置
|
||||
score?: number; // 分数
|
||||
}
|
||||
|
||||
/**
|
||||
* 风险级别类型定义
|
||||
*/
|
||||
type RiskLevelType = 'high' | 'medium' | 'low';
|
||||
|
||||
/**
|
||||
* 建议消息类型定义
|
||||
*/
|
||||
type SuggestionMessageType = 'info' | 'warning' | 'error';
|
||||
|
||||
/**
|
||||
* 评查后动作类型定义
|
||||
*/
|
||||
type PostActionType = 'none' | 'manual' | 'replace';
|
||||
|
||||
/**
|
||||
* 抽取配置类型定义
|
||||
*/
|
||||
interface ExtactionConfigType {
|
||||
llm: {
|
||||
fields: string[];
|
||||
prompt_setting: PromptSetting;
|
||||
};
|
||||
vlm: {
|
||||
fields: Array<{
|
||||
name: string;
|
||||
type: VLMFieldType; // 多模态字段类型 默认、货币、打印、印章、骑缝章、英文、数字、手写
|
||||
}>;
|
||||
prompt_setting: PromptSetting;
|
||||
};
|
||||
regex: {
|
||||
fields: Array<{
|
||||
field: string;
|
||||
pattern: string;
|
||||
}>;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* VLM字段类型定义
|
||||
*/
|
||||
type VLMFieldType = 'default' | 'currency' | 'print' | 'seal' | 'cross-seal' | 'english' | 'number' | 'handwriting';
|
||||
|
||||
/**
|
||||
* 提示配置类型定义
|
||||
*/
|
||||
interface PromptSetting {
|
||||
type: PromptType; // "system" or "custom" 如果为 "custom" 则为自定义提示
|
||||
template: string; // 提示模板
|
||||
}
|
||||
|
||||
/**
|
||||
* 提示类型定义
|
||||
*/
|
||||
type PromptType = 'system' | 'custom';
|
||||
|
||||
/**
|
||||
* 评查配置类型定义
|
||||
*/
|
||||
interface EvaluationConfigType {
|
||||
logicType: LogicType;
|
||||
customLogic: string; // 自定义逻辑:(规则1 AND 规则2) OR 规则3
|
||||
rules: Rule[];
|
||||
}
|
||||
|
||||
/**
|
||||
* 逻辑类型定义
|
||||
*/
|
||||
type LogicType = 'and' | 'or' | 'custom';
|
||||
|
||||
interface Rule {
|
||||
id: string;
|
||||
type: RuleType; // 规则类型 有无、一致性、格式、逻辑、正则、AI、代码
|
||||
config: {
|
||||
// exists 规则配置
|
||||
fields?: string[];
|
||||
logic?: LogicOperator;
|
||||
|
||||
// consistency 规则配置
|
||||
pairs?: Array<{
|
||||
sourceField: string;
|
||||
targetField: string;
|
||||
compareMethod: CompareMethod; // 比较方法 包含、精确、大模型语义
|
||||
}>;
|
||||
|
||||
// format 规则配置
|
||||
field?: string;
|
||||
formatType?: FormatType; // 格式类型 日期格式、数字格式、电话号码、电子邮箱、银行卡号、身份证号码、邮政编码、统一社会信用代码
|
||||
parameters?: string;
|
||||
|
||||
// logic 规则配置
|
||||
conditions?: Array<{
|
||||
field: string;
|
||||
operator: ComparisonOperator; // 比较运算符 等于、不等于、大于、大于等于、小于、小于等于、包含、不包含
|
||||
value: string;
|
||||
}>;
|
||||
|
||||
// regex 规则配置
|
||||
pattern?: string;
|
||||
matchType?: MatchType; // 匹配类型 必须匹配（符合为通过）、不得匹配（不符合为通过）
|
||||
|
||||
// ai 规则配置
|
||||
model?: string; // 大模型名称
|
||||
temperature?: number; // 温度
|
||||
prompt?: string; // 提示
|
||||
|
||||
// code 规则配置
|
||||
language?: ProgrammingLanguage;
|
||||
code?: string;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 规则类型定义
|
||||
*/
|
||||
type RuleType = 'exists' | 'consistency' | 'format' | 'logic' | 'regex' | 'ai' | 'code';
|
||||
|
||||
/**
|
||||
* 逻辑操作符定义
|
||||
*/
|
||||
type LogicOperator = 'and' | 'or';
|
||||
|
||||
/**
|
||||
* 比较方法定义
|
||||
*/
|
||||
type CompareMethod = 'contains' | 'exact' | 'semantic';
|
||||
|
||||
/**
|
||||
* 格式类型定义
|
||||
*/
|
||||
type FormatType = 'date' | 'number' | 'phone' | 'email' | 'bank' | 'id' | 'postal' | 'credit';
|
||||
|
||||
/**
|
||||
* 比较运算符定义
|
||||
*/
|
||||
type ComparisonOperator = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'contains' | 'not_contains';
|
||||
|
||||
/**
|
||||
* 匹配类型定义
|
||||
*/
|
||||
type MatchType = 'match' | 'not_match';
|
||||
|
||||
/**
|
||||
* 编程语言定义
|
||||
*/
|
||||
type ProgrammingLanguage = 'python' | 'javascript';
|
||||
|
||||
/**
|
||||
* 下拉选项数据集
|
||||
*/
|
||||
export const EVALUATION_OPTIONS = {
|
||||
// 风险级别选项
|
||||
riskLevelOptions: [
|
||||
{ value: 'high', label: '高风险' },
|
||||
{ value: 'medium', label: '中风险' },
|
||||
{ value: 'low', label: '低风险' }
|
||||
],
|
||||
|
||||
// 建议消息类型选项
|
||||
suggestionMessageTypeOptions: [
|
||||
{ value: 'info', label: '提示' },
|
||||
{ value: 'warning', label: '警告' },
|
||||
{ value: 'error', label: '错误' }
|
||||
],
|
||||
|
||||
// 评查后动作选项
|
||||
postActionOptions: [
|
||||
{ value: 'none', label: '无' },
|
||||
{ value: 'manual', label: '人工确认' },
|
||||
{ value: 'replace', label: '内容替换' }
|
||||
],
|
||||
|
||||
// VLM字段类型选项
|
||||
vlmFieldTypeOptions: [
|
||||
{ value: 'default', label: '默认' },
|
||||
{ value: 'currency', label: '货币' },
|
||||
{ value: 'print', label: '打印' },
|
||||
{ value: 'seal', label: '印章' },
|
||||
{ value: 'cross-seal', label: '骑缝章' },
|
||||
{ value: 'english', label: '英文' },
|
||||
{ value: 'number', label: '数字' },
|
||||
{ value: 'handwriting', label: '手写' }
|
||||
],
|
||||
|
||||
// 提示类型选项
|
||||
promptTypeOptions: [
|
||||
{ value: 'system', label: '使用系统默认提示词' },
|
||||
{ value: 'custom', label: '使用自定义提示词' }
|
||||
],
|
||||
|
||||
// 逻辑类型选项
|
||||
logicTypeOptions: [
|
||||
{ value: 'and', label: '全部满足（AND）' },
|
||||
{ value: 'or', label: '任一满足（OR）' },
|
||||
{ value: 'custom', label: '自定义组合' }
|
||||
],
|
||||
|
||||
// 规则类型选项
|
||||
ruleTypeOptions: [
|
||||
{ value: 'exists', label: '有无判断' },
|
||||
{ value: 'consistency', label: '一致性判断' },
|
||||
{ value: 'format', label: '格式判断' },
|
||||
{ value: 'logic', label: '逻辑判断' },
|
||||
{ value: 'regex', label: '正则表达式' },
|
||||
{ value: 'ai', label: '大模型判断' },
|
||||
{ value: 'code', label: '自定义代码' }
|
||||
],
|
||||
|
||||
// 逻辑操作符选项
|
||||
logicOperatorOptions: [
|
||||
{ value: 'and', label: 'AND（所有条件都满足）' },
|
||||
{ value: 'or', label: 'OR（任一条件满足）' }
|
||||
],
|
||||
|
||||
// 比较方法选项
|
||||
compareMethodOptions: [
|
||||
{ value: 'contains', label: '包含关系' },
|
||||
{ value: 'exact', label: '精确匹配' },
|
||||
{ value: 'semantic', label: '大模型语义匹配' }
|
||||
],
|
||||
|
||||
// 格式类型选项
|
||||
formatTypeOptions: [
|
||||
{ value: 'date', label: '日期格式' },
|
||||
{ value: 'number', label: '数字格式' },
|
||||
{ value: 'phone', label: '电话号码' },
|
||||
{ value: 'email', label: '电子邮箱' },
|
||||
{ value: 'bank', label: '银行卡号' },
|
||||
{ value: 'id', label: '身份证号码' },
|
||||
{ value: 'postal', label: '邮政编码' },
|
||||
{ value: 'credit', label: '统一社会信用代码' }
|
||||
],
|
||||
|
||||
// 比较运算符选项
|
||||
comparisonOperatorOptions: [
|
||||
{ value: 'eq', label: '等于(=)' },
|
||||
{ value: 'neq', label: '不等于(≠)' },
|
||||
{ value: 'gt', label: '大于(>)' },
|
||||
{ value: 'gte', label: '大于等于(≥)' },
|
||||
{ value: 'lt', label: '小于(<)' },
|
||||
{ value: 'lte', label: '小于等于(≤)' },
|
||||
{ value: 'contains', label: '包含' },
|
||||
{ value: 'not_contains', label: '不包含' }
|
||||
],
|
||||
|
||||
// 匹配类型选项
|
||||
matchTypeOptions: [
|
||||
{ value: 'match', label: '必须匹配（符合为通过）' },
|
||||
{ value: 'not_match', label: '不得匹配（不符合为通过）' }
|
||||
],
|
||||
|
||||
// 编程语言选项
|
||||
programmingLanguageOptions: [
|
||||
{ value: 'python', label: 'Python' },
|
||||
{ value: 'javascript', label: 'JavaScript' }
|
||||
]
|
||||
};
|
||||
|
||||
// 导出类型定义供其他模块使用
|
||||
export type {
|
||||
EvaluationPoint,
|
||||
RiskLevelType,
|
||||
SuggestionMessageType,
|
||||
PostActionType,
|
||||
ExtactionConfigType,
|
||||
VLMFieldType,
|
||||
PromptSetting,
|
||||
PromptType,
|
||||
EvaluationConfigType,
|
||||
LogicType,
|
||||
Rule,
|
||||
RuleType,
|
||||
LogicOperator,
|
||||
CompareMethod,
|
||||
FormatType,
|
||||
ComparisonOperator,
|
||||
MatchType,
|
||||
ProgrammingLanguage
|
||||
};
|
||||
|
||||
@@ -55,6 +55,19 @@ export default function App() {
|
||||
<head>
|
||||
<meta charSet="utf-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<style dangerouslySetInnerHTML={{ __html: `
|
||||
:root {
|
||||
--color-primary: #00684a;
|
||||
--color-primary-hover: #005a3f;
|
||||
--color-primary-light: rgba(0, 104, 74, 0.1);
|
||||
--primary-color: #00684a;
|
||||
|
||||
/* 成功、警告、错误颜色 */
|
||||
--color-success: #52c41a;
|
||||
--color-warning: #faad14;
|
||||
--color-error: #f5222d;
|
||||
}
|
||||
` }} />
|
||||
<Meta />
|
||||
<Links />
|
||||
</head>
|
||||
|
||||
@@ -0,0 +1,458 @@
|
||||
/**
|
||||
* 评查详情页面
|
||||
*
|
||||
* 功能概述:
|
||||
* - 显示文档评查结果和详细信息
|
||||
* - 支持查看文档内容及评查点高亮标记
|
||||
* - 提供评查点列表，分为通过、警告和错误三种类型
|
||||
* - 支持评查点处理，如一键替换、人工审核等功能
|
||||
* - 支持导出评查报告和下载原文件
|
||||
*
|
||||
* 组件结构:
|
||||
* - FileInfo: 显示文件基本信息和操作按钮
|
||||
* - ReviewTabs: 页面选项卡，包括评查结果、AI智能分析和文件信息
|
||||
* - FilePreview: 文档预览组件，显示文档内容及高亮问题
|
||||
* - ReviewPointsList: 评查点列表组件，显示所有评查结果
|
||||
* - AIAnalysis: AI智能分析结果，提供综合评价
|
||||
* - FileDetails: 文件详情信息
|
||||
*
|
||||
* 数据流转:
|
||||
* 1. 页面加载时从API获取评查详情数据
|
||||
* 2. 根据评查点ID关联文档中的高亮区域
|
||||
* 3. 点击评查点时在文档中定位对应位置
|
||||
* 4. 处理评查点时更新状态并反馈到UI
|
||||
*
|
||||
* @author 中国烟草AI合同及卷宗审核系统开发团队
|
||||
*/
|
||||
|
||||
import { type MetaFunction } from "@remix-run/node";
|
||||
import { useState, useEffect } from "react";
|
||||
import { useNavigate } from "@remix-run/react";
|
||||
import reviewsStyles from "~/styles/reviews.css?url";
|
||||
|
||||
// 导入评查详情页面组件
|
||||
import {
|
||||
FileInfo,
|
||||
ReviewTabs,
|
||||
FilePreview,
|
||||
ReviewPointsList,
|
||||
AIAnalysis,
|
||||
FileDetails
|
||||
} from "~/components/reviews";
|
||||
|
||||
// 定义评查点类型
|
||||
interface ReviewPoint {
|
||||
id: string;
|
||||
title: string;
|
||||
location: string;
|
||||
status: string;
|
||||
content: string;
|
||||
suggestion: string;
|
||||
needsHumanReview?: boolean;
|
||||
humanReviewNote?: string;
|
||||
humanReviewBy?: string;
|
||||
humanReviewTime?: string;
|
||||
position?: {
|
||||
section: string;
|
||||
index: number;
|
||||
};
|
||||
}
|
||||
|
||||
// 定义统计数据类型
|
||||
interface Statistics {
|
||||
total: number;
|
||||
success: number;
|
||||
warning: number;
|
||||
error: number;
|
||||
score: number;
|
||||
}
|
||||
|
||||
// 定义文件信息类型
|
||||
interface FileInfo {
|
||||
fileName: string;
|
||||
contractNumber: string;
|
||||
fileSize: string;
|
||||
fileFormat: string;
|
||||
pageCount: number;
|
||||
uploadTime: string;
|
||||
uploadUser: string;
|
||||
}
|
||||
|
||||
// 定义合同信息类型
|
||||
interface ContractInfo {
|
||||
contractType: string;
|
||||
signDate: string;
|
||||
parties: {
|
||||
partyA: string;
|
||||
partyB: string;
|
||||
};
|
||||
amount: string;
|
||||
period: string;
|
||||
}
|
||||
|
||||
// 定义评查信息类型
|
||||
interface ReviewInfo {
|
||||
reviewTime: string;
|
||||
reviewModel: string;
|
||||
ruleGroup: string;
|
||||
result: string;
|
||||
issueCount: number;
|
||||
}
|
||||
|
||||
// 定义文档内容类型
|
||||
interface FileContent {
|
||||
title: string;
|
||||
contractNumber: string;
|
||||
parties: {
|
||||
partyA: {
|
||||
name: string;
|
||||
address: string;
|
||||
representative: string;
|
||||
phone: string;
|
||||
};
|
||||
partyB: {
|
||||
name: string;
|
||||
address: string;
|
||||
representative: string;
|
||||
phone: string;
|
||||
};
|
||||
};
|
||||
sections: {
|
||||
title: string;
|
||||
content: string;
|
||||
}[];
|
||||
}
|
||||
|
||||
// 定义分析项类型
|
||||
interface AnalysisItem {
|
||||
title: string;
|
||||
content: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
// 定义分析数据类型
|
||||
interface AnalysisData {
|
||||
riskAlerts: AnalysisItem[];
|
||||
suggestions: AnalysisItem[];
|
||||
summary: string;
|
||||
}
|
||||
|
||||
// 定义评查数据类型
|
||||
interface ReviewData {
|
||||
fileInfo: FileInfo;
|
||||
contractInfo: ContractInfo;
|
||||
reviewInfo: ReviewInfo;
|
||||
statistics: Statistics;
|
||||
fileContent: FileContent;
|
||||
reviewPoints: ReviewPoint[];
|
||||
aiAnalysis: AnalysisData;
|
||||
}
|
||||
|
||||
export const meta: MetaFunction = () => {
|
||||
return [
|
||||
{ title: "评查详情 - 中国烟草AI合同及卷宗审核系统" },
|
||||
{
|
||||
name: "description",
|
||||
content: "查看文档评查结果，处理问题点，确认评查结果"
|
||||
}
|
||||
];
|
||||
};
|
||||
|
||||
export function links() {
|
||||
return [{ rel: "stylesheet", href: reviewsStyles }];
|
||||
}
|
||||
|
||||
export const handle = {
|
||||
breadcrumb: "评查详情"
|
||||
};
|
||||
|
||||
export default function ReviewDetails() {
|
||||
const navigate = useNavigate();
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [activeTab, setActiveTab] = useState<string>('preview'); // 'preview', 'analysis', 'fileinfo'
|
||||
const [reviewData, setReviewData] = useState<ReviewData | null>(null);
|
||||
const [activeReviewPointId, setActiveReviewPointId] = useState<string | null>(null);
|
||||
|
||||
// 模拟获取评查数据
|
||||
useEffect(() => {
|
||||
// 模拟API请求延迟
|
||||
const timer = setTimeout(() => {
|
||||
// 模拟评查数据
|
||||
const mockData = getMockReviewData();
|
||||
setReviewData(mockData);
|
||||
setIsLoading(false);
|
||||
|
||||
// 默认选中第一个评查点
|
||||
if (mockData.reviewPoints.length > 0) {
|
||||
setActiveReviewPointId(mockData.reviewPoints[0].id);
|
||||
}
|
||||
}, 800);
|
||||
|
||||
return () => clearTimeout(timer);
|
||||
}, []);
|
||||
|
||||
const handleTabChange = (tabKey: string) => {
|
||||
setActiveTab(tabKey);
|
||||
};
|
||||
|
||||
const handleReviewPointSelect = (reviewPointId: string) => {
|
||||
setActiveReviewPointId(reviewPointId);
|
||||
};
|
||||
|
||||
const handleReviewPointStatusChange = (reviewPointId: string, newStatus: string) => {
|
||||
// 更新评查点状态
|
||||
if (reviewData) {
|
||||
const updatedReviewPoints = reviewData.reviewPoints.map(point =>
|
||||
point.id === reviewPointId ? { ...point, status: newStatus } : point
|
||||
);
|
||||
|
||||
setReviewData({
|
||||
...reviewData,
|
||||
reviewPoints: updatedReviewPoints,
|
||||
statistics: calculateStatistics(updatedReviewPoints)
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const handleConfirmResults = () => {
|
||||
alert('评查结果已确认');
|
||||
navigate('/reviews'); // 假设评查列表页面路径为 /reviews
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
{isLoading ? (
|
||||
<div className="flex justify-center items-center p-12">
|
||||
<div className="loading-spinner"></div>
|
||||
<span className="ml-3">加载中...</span>
|
||||
</div>
|
||||
) : reviewData && (
|
||||
<>
|
||||
{/* 文件信息和操作按钮 */}
|
||||
<FileInfo
|
||||
fileInfo={reviewData.fileInfo}
|
||||
onConfirmResults={handleConfirmResults}
|
||||
/>
|
||||
|
||||
{/* 选项卡 */}
|
||||
<ReviewTabs
|
||||
activeTab={activeTab}
|
||||
onTabChange={handleTabChange}
|
||||
>
|
||||
{/* 评查结果选项卡内容 */}
|
||||
{activeTab === 'preview' && (
|
||||
<div className="flex flex-col lg:flex-row space-y-4 lg:space-y-0 lg:space-x-4">
|
||||
{/* 左侧：文件预览 */}
|
||||
<div className="w-full lg:w-2/3">
|
||||
<FilePreview
|
||||
fileContent={reviewData.fileContent}
|
||||
reviewPoints={reviewData.reviewPoints}
|
||||
activeReviewPointId={activeReviewPointId}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 右侧：评查结果 */}
|
||||
<div className="w-full lg:w-1/3">
|
||||
<ReviewPointsList
|
||||
reviewPoints={reviewData.reviewPoints}
|
||||
statistics={reviewData.statistics}
|
||||
activeReviewPointId={activeReviewPointId}
|
||||
onReviewPointSelect={handleReviewPointSelect}
|
||||
onStatusChange={handleReviewPointStatusChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* AI智能分析选项卡内容 */}
|
||||
{activeTab === 'analysis' && (
|
||||
<AIAnalysis
|
||||
analysisData={reviewData.aiAnalysis}
|
||||
score={reviewData.statistics.score}
|
||||
onConfirmResults={handleConfirmResults}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* 文件信息选项卡内容 */}
|
||||
{activeTab === 'fileinfo' && (
|
||||
<FileDetails
|
||||
fileInfo={reviewData.fileInfo}
|
||||
contractInfo={reviewData.contractInfo}
|
||||
reviewInfo={reviewData.reviewInfo}
|
||||
/>
|
||||
)}
|
||||
</ReviewTabs>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// 计算评查统计数据
|
||||
function calculateStatistics(reviewPoints: ReviewPoint[]): Statistics {
|
||||
const total = reviewPoints.length;
|
||||
const success = reviewPoints.filter(point => point.status === 'success').length;
|
||||
const warning = reviewPoints.filter(point => point.status === 'warning').length;
|
||||
const error = reviewPoints.filter(point => point.status === 'error').length;
|
||||
|
||||
// 计算评分：通过占总数的百分比，错误项有额外惩罚
|
||||
const score = Math.round((success / total) * 100 - (error * 5));
|
||||
|
||||
return {
|
||||
total,
|
||||
success,
|
||||
warning,
|
||||
error,
|
||||
score: Math.max(0, Math.min(100, score)) // 确保分数在0-100之间
|
||||
};
|
||||
}
|
||||
|
||||
// 模拟评查数据
|
||||
function getMockReviewData(): ReviewData {
|
||||
return {
|
||||
fileInfo: {
|
||||
fileName: "烟草产品销售合同（2023版）.docx",
|
||||
contractNumber: "XS-2023-1025-001",
|
||||
fileSize: "5.2MB",
|
||||
fileFormat: "DOCX",
|
||||
pageCount: 5,
|
||||
uploadTime: "2023-10-25 14:30:45",
|
||||
uploadUser: "张三"
|
||||
},
|
||||
contractInfo: {
|
||||
contractType: "销售合同",
|
||||
signDate: "2023年10月20日",
|
||||
parties: {
|
||||
partyA: "XX烟草公司",
|
||||
partyB: "YY贸易有限公司"
|
||||
},
|
||||
amount: "¥ 1,580,000.00",
|
||||
period: "2023年11月1日至2024年10月31日"
|
||||
},
|
||||
reviewInfo: {
|
||||
reviewTime: "2023-10-25 14:35:12",
|
||||
reviewModel: "DeepSeek",
|
||||
ruleGroup: "合同标准规则组",
|
||||
result: "warning",
|
||||
issueCount: 9
|
||||
},
|
||||
statistics: {
|
||||
total: 15,
|
||||
success: 6,
|
||||
warning: 7,
|
||||
error: 2,
|
||||
score: 75
|
||||
},
|
||||
fileContent: {
|
||||
title: "烟草产品销售合同",
|
||||
contractNumber: "XS-2023-1025-001",
|
||||
parties: {
|
||||
partyA: {
|
||||
name: "XX烟草公司",
|
||||
address: "XX省XX市XX区XX路XX号",
|
||||
representative: "张XX",
|
||||
phone: "123-4567-8901"
|
||||
},
|
||||
partyB: {
|
||||
name: "YY贸易有限公司",
|
||||
address: "XX省XX市XX区YY路YY号",
|
||||
representative: "李YY",
|
||||
phone: "123-4567-8902"
|
||||
}
|
||||
},
|
||||
sections: [
|
||||
{
|
||||
title: "总则",
|
||||
content: "1.1 本合同适用于甲乙双方之间的烟草制品买卖事宜。\n1.2 双方应本着平等互利、诚实信用的原则履行本合同。"
|
||||
},
|
||||
{
|
||||
title: "合同标的物",
|
||||
content: "2.1 产品名称：烟草制品\n2.2 规格型号：如附件所列\n2.3 数量：5000箱\n2.4 质量要求：符合国家标准GB/T XXXXX-XXXX"
|
||||
},
|
||||
{
|
||||
title: "交货与付款",
|
||||
content: "3.1 交货时间：自合同签订之日起30日内。\n3.2 乙方应在收到货物之日起5个工作日内支付合同款项，甲方应在收到乙方全部付款后开具增值税专用发票，乙方应在收到发票后支付剩余款项。\n3.3 交货地点：乙方指定的仓库。\n3.4 运输方式：陆运，运费由甲方承担。"
|
||||
},
|
||||
{
|
||||
title: "合同文本",
|
||||
content: "本合同一式两份，甲乙双方各执一份，具有同等法律效力。"
|
||||
}
|
||||
]
|
||||
},
|
||||
reviewPoints: [
|
||||
{
|
||||
id: "1",
|
||||
title: "付款条件描述不明确",
|
||||
location: "付款条款清晰性",
|
||||
status: "error",
|
||||
content: "乙方应在收到货物之日起5个工作日内支付合同款项，甲方应在收到乙方全部付款后开具增值税专用发票，乙方应在收到发票后支付剩余款项。",
|
||||
suggestion: "乙方应在收到货物验收合格之日起5个工作日内支付合同总额的70%，甲方收到该部分款项后3个工作日内向乙方开具等额增值税专用发票；乙方应在收到发票之日起5个工作日内支付剩余30%款项。",
|
||||
position: { section: "交货与付款", index: 2 }
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "违约责任条款缺失",
|
||||
location: "合同权利义务对等性",
|
||||
status: "warning",
|
||||
content: "如合同发生纠纷，双方应协商解决。",
|
||||
suggestion: "如合同发生纠纷，双方应友好协商解决；协商不成的，任何一方均有权向甲方所在地人民法院提起诉讼。任何一方未能履行本合同约定义务，应向守约方支付合同总金额的10%作为违约金；给对方造成损失的，还应赔偿由此产生的全部损失。",
|
||||
position: { section: "争议解决", index: 0 }
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "签章不完整",
|
||||
location: "合同签署规范性",
|
||||
status: "warning",
|
||||
content: "乙方（盖章）：YY贸易有限公司\n代表人签字：李YY\n日期：2023年10月20日",
|
||||
suggestion: "需要联系甲方补充公章",
|
||||
needsHumanReview: true,
|
||||
humanReviewNote: "需要联系甲方补充公章",
|
||||
position: { section: "签章", index: 0 }
|
||||
},
|
||||
{
|
||||
id: "9",
|
||||
title: "交货方式描述模糊",
|
||||
location: "履行条款明确性",
|
||||
status: "success",
|
||||
content: "3.4 运输方式：陆运，运费由甲方承担。",
|
||||
suggestion: "建议补充具体的运输方式和时间",
|
||||
needsHumanReview: true,
|
||||
humanReviewNote: "经核实，该交货方式虽然描述不够详细，但符合行业惯例且双方已经多次合作，不会造成实际履行障碍。",
|
||||
humanReviewBy: "王法务",
|
||||
humanReviewTime: "2023-11-05 14:30:22",
|
||||
position: { section: "交货与付款", index: 4 }
|
||||
},
|
||||
{
|
||||
id: "10",
|
||||
title: "法律适用条款缺失",
|
||||
location: "争议解决条款完整性",
|
||||
status: "error",
|
||||
content: "",
|
||||
suggestion: "第十三条 法律适用\n本合同的订立、效力、解释、履行及争议的解决均适用中华人民共和国法律。因本合同引起的或与本合同有关的任何争议，双方应友好协商解决。协商不成的，提交甲方所在地人民法院诉讼解决。",
|
||||
position: { section: "缺失", index: 0 }
|
||||
}
|
||||
],
|
||||
aiAnalysis: {
|
||||
riskAlerts: [
|
||||
{
|
||||
title: "风险提示",
|
||||
content: "本合同缺少违约责任条款，可能导致权责不明。",
|
||||
description: "根据《中华人民共和国民法典》第五百七十七条规定，建议增加违约责任条款，明确双方违约责任及赔偿方式。"
|
||||
},
|
||||
{
|
||||
title: "完整性检查",
|
||||
content: "本合同缺少法律适用条款。",
|
||||
description: "根据行业惯例，销售合同应明确约定适用法律和纠纷解决方式，以避免后续争议解决时的不确定性。"
|
||||
}
|
||||
],
|
||||
suggestions: [
|
||||
{
|
||||
title: "优化建议",
|
||||
content: "建议完善付款条件描述。",
|
||||
description: "目前合同中关于付款条件的描述存在歧义，可能导致付款时间和条件不明确。建议按系统修改建议优化。"
|
||||
}
|
||||
],
|
||||
summary: "本合同基本结构完整，主体内容清晰，但存在多处条款描述不完善的问题，主要体现在支付条件、违约责任、不可抗力、保密条款、合同终止条件等方面。这些问题虽不影响合同的基本合规性，但可能在合同履行过程中引发争议和纠纷。同时，合同签章不完整，也影响了合同的法律效力。建议对上述问题进行修改完善后再行签署。"
|
||||
}
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,103 @@
|
||||
import { type MetaFunction, LinksFunction } from "@remix-run/node";
|
||||
import { useState } from "react";
|
||||
import { BasicInfo } from "~/components/rules/new/BasicInfo";
|
||||
import { ExtractionSettings } from "~/components/rules/new/ExtractionSettings";
|
||||
import { ReviewSettings, RuleContext } 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";
|
||||
|
||||
export const meta: MetaFunction = () => {
|
||||
return [
|
||||
{ title: "新增评查点 - 中国烟草AI合同及卷宗审核系统" },
|
||||
{
|
||||
name: "description",
|
||||
content: "创建新的评查点，设置规则参数"
|
||||
}
|
||||
];
|
||||
};
|
||||
|
||||
export const links: LinksFunction = () => [
|
||||
{ rel: "stylesheet", href: rulesStyles }
|
||||
];
|
||||
|
||||
export const handle = {
|
||||
breadcrumb: "新增评查点"
|
||||
};
|
||||
|
||||
export default function RuleNew() {
|
||||
// 用于保存抽取字段的状态，在抽取设置和评查设置组件之间共享
|
||||
const [extractionFields, setExtractionFields] = useState<string[]>([]);
|
||||
|
||||
const updateExtractionFields = (fields: string[]) => {
|
||||
setExtractionFields(fields);
|
||||
};
|
||||
|
||||
const handleSave = () => {
|
||||
// 实现保存逻辑
|
||||
console.log('保存评查点');
|
||||
};
|
||||
|
||||
const handleSaveDraft = () => {
|
||||
// 实现保存草稿逻辑
|
||||
console.log('保存为草稿');
|
||||
};
|
||||
|
||||
const handleExtractionChange = (data: Record<string, unknown>) => {
|
||||
// 使用合并后的所有字段列表
|
||||
if (data.allFields && Array.isArray(data.allFields)) {
|
||||
updateExtractionFields(data.allFields);
|
||||
return;
|
||||
}
|
||||
|
||||
// 旧版本兼容逻辑
|
||||
if (data.fields) {
|
||||
// 尝试获取合并的字段列表
|
||||
if (Array.isArray(data.fields)) {
|
||||
updateExtractionFields(data.fields);
|
||||
} else {
|
||||
const fieldData = data.fields as Record<string, string[]>;
|
||||
const currentMethod = data.extractionMethod as string;
|
||||
|
||||
// 提取当前抽取方法的字段
|
||||
if (fieldData[currentMethod]) {
|
||||
updateExtractionFields(fieldData[currentMethod]);
|
||||
}
|
||||
}
|
||||
} else if (data.regexFields) {
|
||||
// 处理正则字段情况
|
||||
const regexFields = data.regexFields as { id: string; fieldName: string; regex: string }[];
|
||||
const fieldNames = regexFields
|
||||
.map(field => field.fieldName)
|
||||
.filter(name => name.trim() !== '');
|
||||
|
||||
updateExtractionFields(fieldNames);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<RuleContext.Provider value={{ extractionFields, updateExtractionFields }}>
|
||||
<div className="px-4 py-6 bg-white border-b border-gray-200 shadow-sm">
|
||||
<PageHeader
|
||||
title="新增评查点"
|
||||
onSave={handleSave}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="container py-6">
|
||||
<div className="px-4">
|
||||
<BasicInfo />
|
||||
|
||||
<ExtractionSettings onChange={handleExtractionChange} />
|
||||
|
||||
<ReviewSettings />
|
||||
|
||||
<ActionButtons
|
||||
onSave={handleSave}
|
||||
onSaveDraft={handleSaveDraft}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</RuleContext.Provider>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,766 @@
|
||||
/**
|
||||
* 评查点管理页面 - 创建或编辑评查点规则
|
||||
*
|
||||
* 功能概述:
|
||||
* - 支持创建新的评查点规则或编辑现有规则
|
||||
* - 评查点包含基本信息、抽取设置和评查设置三大部分
|
||||
* - 支持使用三种抽取方式: 大模型(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";
|
||||
|
||||
export const meta: MetaFunction = () => {
|
||||
return [
|
||||
{ title: "评查点管理 - 中国烟草AI合同及卷宗审核系统" },
|
||||
{
|
||||
name: "description",
|
||||
content: "创建或修改评查点，设置规则参数"
|
||||
}
|
||||
];
|
||||
};
|
||||
|
||||
export function links() {
|
||||
return [{ rel: "stylesheet", href: rulesStyles }];
|
||||
}
|
||||
|
||||
export const handle = {
|
||||
breadcrumb: "评查点管理"
|
||||
};
|
||||
|
||||
// 添加规则配置接口
|
||||
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 [formData, setFormData] = useState<EvaluationPoint>({});
|
||||
const [evaluationPointGroups, setEvaluationPointGroups] = useState<EvaluationPointGroup[]>([]);
|
||||
|
||||
// 添加用于共享的字段数据状态
|
||||
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}`);
|
||||
const response = await fetch(`http://172.16.0.119:9000/admin/evaluation_points?id=eq.${id}`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
});
|
||||
console.log(response);
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
if (data.data && data.data[0]) {
|
||||
setFormData(data.data[0]);
|
||||
|
||||
// 初始化extractionFields
|
||||
const extractedFields = extractFieldsFromFormData(data.data[0]);
|
||||
setExtractionFields(extractedFields);
|
||||
|
||||
// 设置编辑模式的实例键
|
||||
setInstanceKey(`edit_${id}_${Date.now()}`);
|
||||
} else {
|
||||
console.error('获取数据失败: 返回数据为空');
|
||||
alert('获取数据失败: 返回数据为空');
|
||||
resetFormData();
|
||||
navigate('/rules');
|
||||
}
|
||||
} else {
|
||||
throw new Error(`响应状态: ${response.status}`);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取评查点数据失败:', error);
|
||||
alert(`获取评查点数据失败: ${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 fetch("http://172.16.0.119:9000/admin/evaluation_point_groups", {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
});
|
||||
console.log(response);
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
setEvaluationPointGroups(data.data);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取评查点组数据失败:', error);
|
||||
// 显示错误提示但不影响应用继续使用
|
||||
alert(`获取评查点组数据失败: ${error instanceof Error ? error.message : '未知错误'}\n将使用默认数据`);
|
||||
}
|
||||
}, []);
|
||||
|
||||
const handleSave = () => {
|
||||
console.log("保存评查点", formData);
|
||||
|
||||
// 验证必填字段
|
||||
if (!formData.name?.trim()) {
|
||||
alert("评查点名称不能为空");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!formData.code?.trim()) {
|
||||
alert("评查点编码不能为空");
|
||||
return;
|
||||
}
|
||||
|
||||
// 显示保存中状态
|
||||
setIsLoading(true);
|
||||
|
||||
// 根据模式决定是创建还是更新
|
||||
const apiMethod = isEditMode ? 'PATCH' : 'POST';
|
||||
const apiUrl = isEditMode
|
||||
? `http://172.16.0.119:9000/admin/evaluation_points?id=eq.${formData.id}`
|
||||
: 'http://172.16.0.119:9000/admin/evaluation_points';
|
||||
|
||||
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
|
||||
};
|
||||
|
||||
// 确保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 (!(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 (!(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) (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 (!(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) (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
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
// 如果是新建模式，则删除id字段
|
||||
if (!isEditMode) {
|
||||
delete cleanedData.id;
|
||||
}
|
||||
|
||||
// 确保extraction_config和evaluation_config是有效的JSON对象
|
||||
// 通过先序列化再解析来验证
|
||||
try {
|
||||
JSON.parse(JSON.stringify(cleanedData.extraction_config));
|
||||
} catch (e) {
|
||||
throw new Error("extraction_config 格式无效");
|
||||
}
|
||||
|
||||
try {
|
||||
JSON.parse(JSON.stringify(cleanedData.evaluation_config));
|
||||
} catch (e) {
|
||||
throw new Error("evaluation_config 格式无效");
|
||||
}
|
||||
|
||||
// 检查JSON字符串长度，如果太长可能会被截断
|
||||
const jsonData = JSON.stringify(cleanedData);
|
||||
const maxLength = 65536; // 通常PostgreSQL的jsonb列可以存储的最大长度
|
||||
|
||||
if (jsonData.length > maxLength) {
|
||||
throw new Error(`数据大小超过限制 (${jsonData.length} > ${maxLength})`);
|
||||
}
|
||||
|
||||
console.log("准备提交到API的数据：", cleanedData);
|
||||
console.log("JSON数据长度:", jsonData.length);
|
||||
|
||||
// 发送数据到API
|
||||
fetch(apiUrl, {
|
||||
method: apiMethod,
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(cleanedData)
|
||||
})
|
||||
.then(async response => {
|
||||
// 尝试解析响应内容
|
||||
let responseData;
|
||||
try {
|
||||
responseData = await response.json();
|
||||
} catch (e) {
|
||||
responseData = { code: 500, msg: "响应解析失败" };
|
||||
}
|
||||
|
||||
// 根据响应码处理不同情况
|
||||
if (responseData.code === 0) {
|
||||
// 成功情况
|
||||
console.log("保存成功:", responseData);
|
||||
|
||||
// 获取新创建或更新的评查点ID
|
||||
const savedPointId = responseData.data[0]?.id;
|
||||
|
||||
if (savedPointId) {
|
||||
// 显示成功消息
|
||||
alert(`评查点${isEditMode ? '更新' : '创建'}成功!`);
|
||||
|
||||
// 保存成功后跳转到编辑页面，加载刚保存的数据
|
||||
navigate(`/rules/new?id=${savedPointId}`);
|
||||
} else {
|
||||
// 无法获取ID的情况
|
||||
alert(`评查点${isEditMode ? '更新' : '创建'}成功，但无法获取ID。正在返回列表页面。`);
|
||||
navigate('/rules');
|
||||
}
|
||||
} else {
|
||||
// 处理各种错误情况
|
||||
console.error("API错误:", responseData);
|
||||
|
||||
// 根据错误码显示不同的错误消息
|
||||
switch (responseData.code) {
|
||||
case 400:
|
||||
alert(`参数错误: ${responseData.msg}`);
|
||||
break;
|
||||
case 401:
|
||||
alert(`未授权: ${responseData.msg}`);
|
||||
break;
|
||||
case 403:
|
||||
alert(`禁止访问: ${responseData.msg}`);
|
||||
break;
|
||||
case 404:
|
||||
alert(`未找到资源: ${responseData.msg}`);
|
||||
break;
|
||||
case 409:
|
||||
alert(`资源冲突: ${responseData.msg}`);
|
||||
break;
|
||||
case 500:
|
||||
alert(`服务器错误: ${responseData.msg}`);
|
||||
break;
|
||||
default:
|
||||
alert(`保存失败: ${responseData.msg || '未知错误'}`);
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("网络或解析错误:", error);
|
||||
alert(`网络或解析错误: ${error.message || '未知错误'}`);
|
||||
})
|
||||
.finally(() => {
|
||||
setIsLoading(false);
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("数据处理错误:", error);
|
||||
alert(`数据处理错误: ${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: []
|
||||
};
|
||||
|
||||
// 合并评查配置数据
|
||||
const mergedConfig = {
|
||||
...currentConfig,
|
||||
...(data.evaluation_config as object)
|
||||
};
|
||||
|
||||
// 更新表单数据
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
evaluation_config: mergedConfig
|
||||
}));
|
||||
} 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 newIsEditMode = !!id;
|
||||
setIsEditMode(newIsEditMode);
|
||||
|
||||
if (id) {
|
||||
// 编辑模式：获取数据
|
||||
fetchEvaluationPoint(parseInt(id));
|
||||
} else {
|
||||
// 新建模式：重置表单数据
|
||||
resetFormData();
|
||||
}
|
||||
|
||||
// 获取评查点组数据
|
||||
fetchEvaluationPointGroups();
|
||||
}, [location.search, fetchEvaluationPoint, fetchEvaluationPointGroups, resetFormData]);
|
||||
|
||||
// 渲染页面内容
|
||||
return (
|
||||
<div className="container">
|
||||
{/* 页面标题和右上角保存按钮 */}
|
||||
<PageHeader
|
||||
title={isEditMode ? "编辑评查点" : "新增评查点"}
|
||||
onSave={handleSave}
|
||||
/>
|
||||
|
||||
{/* 加载状态显示 */}
|
||||
{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}
|
||||
/>
|
||||
</div>
|
||||
</RuleContext.Provider>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -75,10 +75,6 @@
|
||||
}
|
||||
|
||||
/* 表单复选框和单选框 */
|
||||
.form-checkbox-group,
|
||||
.form-radio-group {
|
||||
@apply space-y-2;
|
||||
}
|
||||
|
||||
.form-check {
|
||||
@apply flex items-center;
|
||||
|
||||
@@ -0,0 +1,385 @@
|
||||
:root {
|
||||
--primary-color: #00684a;
|
||||
--primary-hover: #005a40;
|
||||
--primary-light: rgba(0, 104, 74, 0.1);
|
||||
--success-color: #52c41a;
|
||||
--warning-color: #faad14;
|
||||
--error-color: #ff4d4f;
|
||||
--text-color: rgba(0, 0, 0, 0.85);
|
||||
--text-secondary: rgba(0, 0, 0, 0.45);
|
||||
--border-color: #f0f0f0;
|
||||
--bg-gray: #f5f5f5;
|
||||
}
|
||||
|
||||
/* 文件信息和操作按钮区域 */
|
||||
.file-info-header {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
/* 选项卡样式 */
|
||||
.tab-container {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.tab-nav {
|
||||
display: flex;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
background-color: white;
|
||||
border-top-left-radius: 6px;
|
||||
border-top-right-radius: 6px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tab-nav-item {
|
||||
padding: 12px 20px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border-bottom: 2px solid transparent;
|
||||
transition: all 0.3s;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.tab-nav-item i {
|
||||
margin-right: 6px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.tab-nav-item:hover {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.tab-nav-item.active {
|
||||
color: var(--primary-color);
|
||||
border-bottom-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
background-color: white;
|
||||
border: 1px solid var(--border-color);
|
||||
border-top: none;
|
||||
border-bottom-left-radius: 6px;
|
||||
border-bottom-right-radius: 6px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
/* 文件预览区域 */
|
||||
.file-preview {
|
||||
background-color: white;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 6px;
|
||||
height: calc(100vh - 220px);
|
||||
min-height: 500px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.file-preview-header {
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: var(--primary-light);
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.file-preview-content {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.file-preview-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
/* 文档内容样式 */
|
||||
.word-document {
|
||||
padding: 40px;
|
||||
background-color: white;
|
||||
font-family: 'SimSun', serif;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.word-document h1 {
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.word-document h2 {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin-top: 16px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.word-document p {
|
||||
text-indent: 2em;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* 高亮区域 */
|
||||
.highlight-area {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
padding: 2px;
|
||||
margin: -2px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.highlight-area:hover {
|
||||
box-shadow: 0 0 0 3px rgba(250, 173, 20, 0.6);
|
||||
}
|
||||
|
||||
.highlight-area.warning {
|
||||
background-color: rgba(250, 173, 20, 0.2);
|
||||
border: 2px solid var(--warning-color);
|
||||
}
|
||||
|
||||
.highlight-area.error {
|
||||
background-color: rgba(255, 77, 79, 0.2);
|
||||
border: 2px solid var(--error-color);
|
||||
}
|
||||
|
||||
.highlight-area.success {
|
||||
background-color: rgba(82, 196, 26, 0.2);
|
||||
border: 2px solid var(--success-color);
|
||||
}
|
||||
|
||||
/* 评查点列表区域 */
|
||||
.review-points-panel {
|
||||
background-color: white;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 6px;
|
||||
height: calc(100vh - 220px);
|
||||
min-height: 500px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.review-panel-header {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
background-color: var(--primary-light);
|
||||
height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.review-statistics {
|
||||
padding: 16px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.review-points-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.review-point-item {
|
||||
padding: 20px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.review-point-item:hover {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.review-point-item.active {
|
||||
background-color: var(--primary-light);
|
||||
}
|
||||
|
||||
.review-point-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 8px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.review-point-title {
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
line-height: 1.3;
|
||||
margin-right: 8px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.review-point-location {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
color: var(--text-secondary);
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 4px;
|
||||
padding: 2px 8px;
|
||||
width: fit-content;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
/* 状态标签 */
|
||||
.status-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.status-waiting {
|
||||
background-color: #f9f0ff;
|
||||
color: #722ed1;
|
||||
}
|
||||
|
||||
.status-processing {
|
||||
background-color: #e6f7ff;
|
||||
color: #1890ff;
|
||||
}
|
||||
|
||||
.status-success {
|
||||
background-color: #f6ffed;
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
.status-error {
|
||||
background-color: #fff1f0;
|
||||
color: #f5222d;
|
||||
}
|
||||
|
||||
.status-warning {
|
||||
background-color: #fffbe6;
|
||||
color: #faad14;
|
||||
}
|
||||
|
||||
/* 替换动作按钮 */
|
||||
.replace-action {
|
||||
background-color: #1890ff;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 4px 8px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
margin-top: 6px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.replace-action i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.replace-action:hover {
|
||||
background-color: #40a9ff;
|
||||
}
|
||||
|
||||
/* 人工审核标记 */
|
||||
.human-review-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background-color: #e6f7ff;
|
||||
color: #1890ff;
|
||||
padding: 1px 4px;
|
||||
border-radius: 4px;
|
||||
font-size: 11px;
|
||||
margin-left: 4px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.human-review-note {
|
||||
background-color: #e6f7ff;
|
||||
border-left: 3px solid #1890ff;
|
||||
padding: 6px 10px;
|
||||
margin-top: 6px;
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* AI智能分析区域 */
|
||||
.analysis-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.analysis-item {
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 4px;
|
||||
padding: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.analysis-title {
|
||||
font-weight: 500;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.analysis-content {
|
||||
color: var(--text-secondary);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.score-container {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.score-bar {
|
||||
height: 10px;
|
||||
background-color: #eee;
|
||||
border-radius: 5px;
|
||||
margin-top: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.score-fill {
|
||||
height: 100%;
|
||||
background-color: var(--warning-color);
|
||||
}
|
||||
|
||||
/* 文件详情页面 */
|
||||
.info-section {
|
||||
margin-bottom: 24px;
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.info-header {
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.info-content {
|
||||
padding: 16px;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
width: 120px;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.info-value {
|
||||
flex: 1;
|
||||
}
|
||||
@@ -0,0 +1,412 @@
|
||||
/* 评查点页面样式 */
|
||||
|
||||
/* 卡片组件样式 */
|
||||
.ant-card {
|
||||
@apply bg-white border border-gray-200 rounded-md shadow-sm mb-4 overflow-hidden;
|
||||
}
|
||||
|
||||
.ant-card-header {
|
||||
@apply flex items-center justify-between p-4 border-b border-gray-100 bg-gray-50;
|
||||
}
|
||||
|
||||
.ant-card-header h3 {
|
||||
@apply text-base font-medium m-0;
|
||||
}
|
||||
|
||||
.ant-card-body {
|
||||
@apply p-6;
|
||||
}
|
||||
|
||||
/* 表单样式 */
|
||||
.form-label {
|
||||
@apply block text-sm font-medium text-gray-700 mb-1;
|
||||
}
|
||||
|
||||
.form-input, .form-select, .form-textarea {
|
||||
@apply w-full px-3 py-2 text-sm border border-gray-300 rounded-md shadow-sm
|
||||
focus:outline-none focus:ring-2 focus:ring-[rgba(0,104,74,0.2)] focus:border-[#00684a]
|
||||
transition-colors duration-200;
|
||||
}
|
||||
|
||||
.form-textarea {
|
||||
@apply min-h-[80px] resize;
|
||||
}
|
||||
|
||||
.form-tip {
|
||||
@apply mt-1 text-xs text-gray-500;
|
||||
}
|
||||
|
||||
.required-mark {
|
||||
@apply text-[#f5222d];
|
||||
}
|
||||
|
||||
/* 按钮样式 */
|
||||
.ant-btn {
|
||||
@apply inline-flex items-center px-4 py-2 text-sm font-medium rounded-md border
|
||||
shadow-sm transition-colors duration-200 focus:outline-none focus:ring-2
|
||||
focus:ring-offset-2 justify-center cursor-pointer;
|
||||
}
|
||||
|
||||
.ant-btn-primary {
|
||||
@apply text-white bg-[#00684a] hover:bg-[#005a3f] border-transparent
|
||||
focus:ring-[#00684a] disabled:bg-[rgba(0,104,74,0.5)] disabled:cursor-not-allowed;
|
||||
}
|
||||
|
||||
.ant-btn-default {
|
||||
@apply text-gray-700 bg-white hover:bg-gray-50 border-gray-300
|
||||
focus:ring-[#00684a] disabled:bg-gray-100 disabled:text-gray-400
|
||||
disabled:cursor-not-allowed;
|
||||
}
|
||||
|
||||
/* 抽取方法切换按钮样式 */
|
||||
#extraction-method-tabs {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
background-color: white;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tab-nav-item {
|
||||
padding: 10px 16px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
border-bottom: 2px solid transparent;
|
||||
transition: all 0.3s;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.tab-nav-item:hover {
|
||||
color: #00684a;
|
||||
background-color: rgba(0, 104, 74, 0.05);
|
||||
}
|
||||
|
||||
.tab-nav-item.active {
|
||||
color: #00684a;
|
||||
border-bottom-color: #00684a;
|
||||
background-color: rgba(0, 104, 74, 0.1);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.extraction-config {
|
||||
padding: 12px;
|
||||
border: 1px solid #f0f0f0;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
/* 字段标签样式 */
|
||||
.field-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background-color: #f5f5f5;
|
||||
color: #333;
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 4px;
|
||||
padding: 4px 12px;
|
||||
margin: 4px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.field-tag:hover {
|
||||
background-color: #e8f5e9;
|
||||
border-color: #a5d6a7;
|
||||
}
|
||||
|
||||
.field-tag.selected {
|
||||
background-color: var(--primary-color, #00684a);
|
||||
color: white;
|
||||
border-color: var(--primary-color, #00684a);
|
||||
}
|
||||
|
||||
/* 不可用但已选择的字段样式 */
|
||||
.field-tag.unavailable {
|
||||
border-style: dashed;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.field-tag.unavailable:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.field-tags-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.chips-container {
|
||||
padding: 6px;
|
||||
border: 1px solid #f0f0f0;
|
||||
border-radius: 4px;
|
||||
min-height: 36px;
|
||||
background-color: #fafafa;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.chip {
|
||||
padding: 3px 6px;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chip .close-btn {
|
||||
margin-left: 4px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
color: #999;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.chip .close-btn:hover {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.extraction-config .form-input,
|
||||
.extraction-config .form-select,
|
||||
.extraction-config button.ant-btn {
|
||||
padding: 4px 8px;
|
||||
font-size: 13px;
|
||||
height: auto;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 变量标签样式 */
|
||||
.var-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4px 8px;
|
||||
background-color: rgba(0, 104, 74, 0.1);
|
||||
color: #00684a;
|
||||
border: 1px solid rgba(0, 104, 74, 0.2);
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.var-tag:hover {
|
||||
background-color: rgba(0, 104, 74, 0.2);
|
||||
border-color: rgba(0, 104, 74, 0.3);
|
||||
}
|
||||
|
||||
.var-tag::before {
|
||||
content: '{';
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.var-tag::after {
|
||||
content: '}';
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
/* 法典引用样式 */
|
||||
.law-reference {
|
||||
background-color: #f0f9ff;
|
||||
border: 1px solid #bae0ff;
|
||||
border-radius: 4px;
|
||||
padding: 12px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.law-reference-title {
|
||||
color: #0958d9;
|
||||
font-weight: 500;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.law-reference-articles {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.law-article {
|
||||
background-color: #e6f4ff;
|
||||
border: 1px solid #91caff;
|
||||
border-radius: 12px;
|
||||
padding: 2px 8px;
|
||||
font-size: 12px;
|
||||
color: #0958d9;
|
||||
}
|
||||
|
||||
.law-reference-content {
|
||||
font-size: 13px;
|
||||
color: #434343;
|
||||
line-height: 1.6;
|
||||
border-left: 3px solid #bae0ff;
|
||||
padding-left: 8px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
|
||||
.expanded .expand-icon {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
/* 自定义宽度类 */
|
||||
.w-3\/10 {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.w-7\/10 {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
/* 正则表达式配置行样式优化 */
|
||||
.regex-field-row {
|
||||
padding: 6px !important;
|
||||
margin-bottom: 6px !important;
|
||||
}
|
||||
|
||||
.regex-field-row input {
|
||||
padding: 3px 6px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* 隐藏单选按钮 */
|
||||
.severity-radio {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/* 单选表单组 */
|
||||
.form-radio-group {
|
||||
@apply flex flex-wrap gap-4;
|
||||
}
|
||||
|
||||
.form-radio-item {
|
||||
@apply flex items-center cursor-pointer mb-2;
|
||||
}
|
||||
|
||||
.form-radio {
|
||||
@apply w-4 h-4 mr-2 text-[#00684a] focus:ring-[#00684a];
|
||||
}
|
||||
|
||||
/* 分隔线 */
|
||||
.divider {
|
||||
@apply h-px w-full bg-gray-200 my-6;
|
||||
}
|
||||
|
||||
/* 徽章 */
|
||||
.badge {
|
||||
@apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
|
||||
}
|
||||
|
||||
/* 警告信息类型卡片 */
|
||||
.severity-option {
|
||||
@apply transition-all duration-200;
|
||||
}
|
||||
|
||||
.severity-option.selected-severity {
|
||||
@apply shadow-md;
|
||||
}
|
||||
|
||||
/* 提示信息 */
|
||||
.bg-blue-50 {
|
||||
@apply bg-[#e6f7ff];
|
||||
}
|
||||
|
||||
.border-blue-200 {
|
||||
@apply border-[#91d5ff];
|
||||
}
|
||||
|
||||
.text-blue-700 {
|
||||
@apply text-[#1890ff];
|
||||
}
|
||||
|
||||
/* 容器通用样式 */
|
||||
.container {
|
||||
@apply mx-auto px-4;
|
||||
}
|
||||
|
||||
/* 颜色变量 */
|
||||
:root {
|
||||
--primary-color: #00684a;
|
||||
--primary-color-light: rgba(0, 104, 74, 0.1);
|
||||
--primary-color-hover: rgba(0, 104, 74, 0.2);
|
||||
--primary-color-border: rgba(0, 104, 74, 0.3);
|
||||
}
|
||||
|
||||
/* 代码编辑器样式 */
|
||||
.code-editor-wrapper {
|
||||
border: 1px solid #444;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
background-color: #282c34;
|
||||
}
|
||||
|
||||
.code-editor-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 12px;
|
||||
background-color: #21252b;
|
||||
border-bottom: 1px solid #444;
|
||||
color: #abb2bf;
|
||||
}
|
||||
|
||||
.code-editor-filename {
|
||||
font-family: monospace;
|
||||
font-size: 13px;
|
||||
color: #abb2bf;
|
||||
}
|
||||
|
||||
.code-editor-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.code-editor-actions button {
|
||||
cursor: pointer;
|
||||
color: #abb2bf;
|
||||
}
|
||||
|
||||
.code-editor-actions button:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.code-copy-success {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
background-color: rgba(0, 104, 74, 0.9);
|
||||
color: white;
|
||||
padding: 8px 16px;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
|
||||
transition: all 0.3s;
|
||||
opacity: 0;
|
||||
transform: translateY(20px);
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.code-copy-success.show {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
@@ -0,0 +1,68 @@
|
||||
/**
|
||||
* 工具函数集合
|
||||
* 包含字段处理、防抖等通用功能
|
||||
*/
|
||||
|
||||
/**
|
||||
* 处理字段名，去除类型后缀
|
||||
* 例如: "字段名_类型" -> "字段名"
|
||||
*/
|
||||
export function processFieldName(field: string): string {
|
||||
if (field.includes('_')) {
|
||||
return field.split('_')[0]; // 只保留类型前面的字段名
|
||||
}
|
||||
return field;
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理字段数组，去除类型后缀并去重
|
||||
*/
|
||||
export function processFieldNames(fields: string[]): string[] {
|
||||
// 处理字段，去掉类型后缀
|
||||
const processedFields = fields.map(processFieldName);
|
||||
|
||||
// 去重并返回
|
||||
return [...new Set(processedFields)];
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建防抖函数
|
||||
* @param fn 要执行的函数
|
||||
* @param delay 延迟时间（毫秒）
|
||||
*/
|
||||
export function debounce<T extends (...args: unknown[]) => unknown>(
|
||||
fn: T,
|
||||
delay: number
|
||||
): (...args: Parameters<T>) => void {
|
||||
let timer: NodeJS.Timeout | null = null;
|
||||
|
||||
return function(...args: Parameters<T>) {
|
||||
if (timer) {
|
||||
clearTimeout(timer);
|
||||
}
|
||||
|
||||
timer = setTimeout(() => {
|
||||
fn(...args);
|
||||
timer = null;
|
||||
}, delay);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 比较两个数组是否有实质性不同
|
||||
* 用于避免不必要的状态更新
|
||||
*/
|
||||
export function areArraysDifferent<T>(arr1: T[], arr2: T[]): boolean {
|
||||
return JSON.stringify(arr1) !== JSON.stringify(arr2);
|
||||
}
|
||||
|
||||
/**
|
||||
* 查找两个数组之间的差异项
|
||||
* @returns 包含新增和删除项的对象
|
||||
*/
|
||||
export function getArrayDifference<T>(current: T[], previous: T[]): { added: T[], removed: T[] } {
|
||||
const added = current.filter(item => !previous.includes(item));
|
||||
const removed = previous.filter(item => !current.includes(item));
|
||||
|
||||
return { added, removed };
|
||||
}
|
||||
+2
-2
@@ -7,7 +7,7 @@
|
||||
<link href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
|
||||
<!-- 引入外部CSS文件 -->
|
||||
<link href="../css/main.css" rel="stylesheet">
|
||||
<link href="./main.css" rel="stylesheet">
|
||||
|
||||
<!-- 添加Highlight.js样式 - 使用monokai-sublime主题 -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/monokai-sublime.min.css">
|
||||
@@ -1771,7 +1771,7 @@
|
||||
<label class="form-label text-sm">运算符</label>
|
||||
<select class="form-select">
|
||||
<option value="eq">等于 (=)</option>
|
||||
<option value="neq">不等于 (≠)</option>
|
||||
<option value="neq"> (≠)</option>
|
||||
<option value="gt">大于 (>)</option>
|
||||
<option value="gte">大于等于 (≥)</option>
|
||||
<option value="lt">小于 (<)</option>
|
||||
|
||||
Generated
+1047
-44
File diff suppressed because it is too large
Load Diff
@@ -11,12 +11,24 @@
|
||||
"typecheck": "tsc"
|
||||
},
|
||||
"dependencies": {
|
||||
"@codemirror/lang-javascript": "^6.2.3",
|
||||
"@codemirror/theme-one-dark": "^6.1.2",
|
||||
"@react-pdf-viewer/core": "^3.12.0",
|
||||
"@react-pdf-viewer/highlight": "^3.12.0",
|
||||
"@react-pdf-viewer/search": "^3.12.0",
|
||||
"@remix-run/node": "^2.16.2",
|
||||
"@remix-run/react": "^2.16.2",
|
||||
"@remix-run/serve": "^2.16.2",
|
||||
"@uiw/react-codemirror": "^4.23.10",
|
||||
"dayjs": "^1.11.13",
|
||||
"diff": "^7.0.0",
|
||||
"html-docx-js": "^0.3.1",
|
||||
"isbot": "^4.1.0",
|
||||
"mammoth": "^1.9.0",
|
||||
"pdf-lib": "^1.17.1",
|
||||
"pdfjs-dist": "^3.11.174",
|
||||
"pg": "^8.14.1",
|
||||
"prismjs": "^1.30.0",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"remixicon": "^4.6.0"
|
||||
|
||||
+158
@@ -0,0 +1,158 @@
|
||||
// 使用原生Node.js http模块发送请求
|
||||
import http from 'http';
|
||||
import { Buffer } from 'buffer';
|
||||
|
||||
// 测试GET请求 - 检查API服务器是否正常运行
|
||||
function testApiConnection() {
|
||||
console.log('测试API连接...');
|
||||
|
||||
// 设置请求选项
|
||||
const options = {
|
||||
hostname: '127.0.0.1',
|
||||
port: 9000,
|
||||
path: '/admin/evaluation_points',
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'application/json',
|
||||
'Authorization': '1234567890'
|
||||
}
|
||||
};
|
||||
|
||||
// 创建请求
|
||||
const req = http.request(options, (res) => {
|
||||
console.log(`状态码: ${res.statusCode}`);
|
||||
console.log('响应头:', res.headers);
|
||||
|
||||
let data = '';
|
||||
|
||||
res.on('data', (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on('end', () => {
|
||||
console.log('响应数据:');
|
||||
try {
|
||||
const parsedData = JSON.parse(data);
|
||||
console.log(JSON.stringify(parsedData, null, 2));
|
||||
} catch (e) {
|
||||
console.log('无法解析响应为JSON:', data);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on('error', (error) => {
|
||||
console.error('请求错误:', error.message);
|
||||
if (error.code === 'ECONNREFUSED') {
|
||||
console.error('无法连接到API服务器 - 请确保服务器已启动并监听端口9000');
|
||||
}
|
||||
});
|
||||
|
||||
// 完成请求
|
||||
req.end();
|
||||
}
|
||||
|
||||
// 测试POST请求 - 尝试创建一个测试评查点
|
||||
function testPostRequest() {
|
||||
console.log('\n测试POST请求...');
|
||||
|
||||
// 创建测试数据
|
||||
const testData = {
|
||||
code: 'TEST_CODE',
|
||||
name: '测试评查点',
|
||||
risk: 'low',
|
||||
is_enabled: false,
|
||||
is_draft: true,
|
||||
description: '这是一个测试评查点',
|
||||
references_laws: {
|
||||
name: '测试法规',
|
||||
articles: ['第一条'],
|
||||
content: '测试内容'
|
||||
},
|
||||
extraction_config: {
|
||||
llm: {
|
||||
fields: ['测试字段1', '测试字段2'],
|
||||
prompt_setting: {
|
||||
type: 'system',
|
||||
template: '测试提示词'
|
||||
}
|
||||
},
|
||||
vlm: {
|
||||
fields: [
|
||||
{ name: '图片字段1', type: 'default' }
|
||||
],
|
||||
prompt_setting: {
|
||||
type: 'system',
|
||||
template: '测试图片提示词'
|
||||
}
|
||||
},
|
||||
regex: {
|
||||
fields: [
|
||||
{ field: '正则字段1', pattern: '\\d+' }
|
||||
]
|
||||
}
|
||||
},
|
||||
evaluation_config: {
|
||||
logicType: 'and',
|
||||
customLogic: '',
|
||||
rules: []
|
||||
}
|
||||
};
|
||||
|
||||
// 将数据转换为JSON字符串
|
||||
const postData = JSON.stringify(testData);
|
||||
|
||||
// 设置请求选项
|
||||
const options = {
|
||||
hostname: '127.0.0.1',
|
||||
port: 9000,
|
||||
path: '/admin/evaluation_points',
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'application/json',
|
||||
'Authorization': '1234567890',
|
||||
'Content-Length': Buffer.byteLength(postData)
|
||||
}
|
||||
};
|
||||
|
||||
// 创建请求
|
||||
const req = http.request(options, (res) => {
|
||||
console.log(`状态码: ${res.statusCode}`);
|
||||
console.log('响应头:', res.headers);
|
||||
|
||||
let data = '';
|
||||
|
||||
res.on('data', (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on('end', () => {
|
||||
console.log('响应数据:');
|
||||
try {
|
||||
const parsedData = JSON.parse(data);
|
||||
console.log(JSON.stringify(parsedData, null, 2));
|
||||
} catch (e) {
|
||||
console.log('无法解析响应为JSON:', data);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on('error', (error) => {
|
||||
console.error('请求错误:', error.message);
|
||||
});
|
||||
|
||||
// 发送数据
|
||||
req.write(postData);
|
||||
|
||||
// 完成请求
|
||||
req.end();
|
||||
}
|
||||
|
||||
// 执行测试
|
||||
testApiConnection();
|
||||
|
||||
// 等待3秒后执行POST测试
|
||||
setTimeout(() => {
|
||||
testPostRequest();
|
||||
}, 3000);
|
||||
+108
@@ -0,0 +1,108 @@
|
||||
// 使用原生Node.js http模块发送请求
|
||||
import http from 'http';
|
||||
import { Buffer } from 'buffer';
|
||||
|
||||
// 测试POST请求 - 尝试创建一个测试评查点
|
||||
function testPostRequest() {
|
||||
console.log('测试POST请求...');
|
||||
|
||||
// 创建测试数据
|
||||
const testData = {
|
||||
code: 'TEST_CODE_' + Date.now(),
|
||||
name: '测试评查点',
|
||||
risk: 'low',
|
||||
is_enabled: false,
|
||||
description: '这是一个测试评查点',
|
||||
references_laws: {
|
||||
name: '测试法规',
|
||||
articles: ['第一条'],
|
||||
content: '测试内容'
|
||||
},
|
||||
extraction_config: {
|
||||
llm: {
|
||||
fields: ['测试字段1', '测试字段2'],
|
||||
prompt_setting: {
|
||||
type: 'system',
|
||||
template: '测试提示词'
|
||||
}
|
||||
},
|
||||
vlm: {
|
||||
fields: [
|
||||
{ name: '图片字段1', type: 'default' }
|
||||
],
|
||||
prompt_setting: {
|
||||
type: 'system',
|
||||
template: '测试图片提示词'
|
||||
}
|
||||
},
|
||||
regex: {
|
||||
fields: [
|
||||
{ field: '正则字段1', pattern: '\\d+' }
|
||||
]
|
||||
}
|
||||
},
|
||||
evaluation_config: {
|
||||
logicType: 'and',
|
||||
customLogic: '',
|
||||
rules: []
|
||||
},
|
||||
pass_message: '通过消息',
|
||||
fail_message: '失败消息',
|
||||
suggestion_message: '建议消息',
|
||||
suggestion_message_type: 'warning',
|
||||
post_action: 'none',
|
||||
action_config: ''
|
||||
};
|
||||
|
||||
// 将数据转换为JSON字符串
|
||||
const postData = JSON.stringify(testData);
|
||||
|
||||
// 设置请求选项
|
||||
const options = {
|
||||
hostname: '127.0.0.1',
|
||||
port: 9000,
|
||||
path: '/admin/evaluation_points',
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'application/json',
|
||||
'Authorization': '1234567890',
|
||||
'Content-Length': Buffer.byteLength(postData)
|
||||
}
|
||||
};
|
||||
|
||||
// 创建请求
|
||||
const req = http.request(options, (res) => {
|
||||
console.log(`状态码: ${res.statusCode}`);
|
||||
console.log('响应头:', res.headers);
|
||||
|
||||
let data = '';
|
||||
|
||||
res.on('data', (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on('end', () => {
|
||||
console.log('响应数据:');
|
||||
try {
|
||||
const parsedData = JSON.parse(data);
|
||||
console.log(JSON.stringify(parsedData, null, 2));
|
||||
} catch (e) {
|
||||
console.log('无法解析响应为JSON:', data);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on('error', (error) => {
|
||||
console.error('请求错误:', error.message);
|
||||
});
|
||||
|
||||
// 发送数据
|
||||
req.write(postData);
|
||||
|
||||
// 完成请求
|
||||
req.end();
|
||||
}
|
||||
|
||||
// 执行测试
|
||||
testPostRequest();
|
||||
@@ -0,0 +1,162 @@
|
||||
import http from 'http';
|
||||
import { Buffer } from 'buffer';
|
||||
|
||||
// 测试评查点列表接口
|
||||
function testGetEvaluationPoints() {
|
||||
const options = {
|
||||
hostname: '127.0.0.1',
|
||||
port: 9000,
|
||||
path: '/admin/evaluation_points',
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'application/json'
|
||||
}
|
||||
};
|
||||
|
||||
const req = http.request(options, (res) => {
|
||||
console.log(`状态码: ${res.statusCode}`);
|
||||
console.log(`响应头: ${JSON.stringify(res.headers)}`);
|
||||
|
||||
let data = '';
|
||||
|
||||
res.on('data', (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on('end', () => {
|
||||
console.log('获取评查点列表成功!');
|
||||
try {
|
||||
const jsonData = JSON.parse(data);
|
||||
console.log(`共获取 ${jsonData.length} 条评查点数据`);
|
||||
console.log('第一条数据:', JSON.stringify(jsonData[0], null, 2).substring(0, 200) + '...');
|
||||
} catch (e) {
|
||||
console.error('解析JSON数据失败:', e.message);
|
||||
console.log('原始数据:', data);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on('error', (e) => {
|
||||
console.error(`获取评查点列表请求失败: ${e.message}`);
|
||||
});
|
||||
|
||||
req.end();
|
||||
}
|
||||
|
||||
// 测试创建评查点接口
|
||||
function testCreateEvaluationPoint() {
|
||||
const testData = {
|
||||
name: '测试评查点',
|
||||
code: 'TEST_RULE_001',
|
||||
risk: 'medium',
|
||||
is_enabled: true,
|
||||
description: '这是一个用于测试接口的评查点',
|
||||
type: 'content',
|
||||
references_laws: {
|
||||
name: '《中华人民共和国民法典》',
|
||||
articles: ['第五百八十五条', '第五百八十六条'],
|
||||
content: '当事人应当按照约定全面履行自己的义务。'
|
||||
},
|
||||
evaluation_point_groups_id: 1,
|
||||
extraction_config: {
|
||||
llm: {
|
||||
fields: ['合同名称', '合同编号', '签订日期'],
|
||||
prompt_setting: {
|
||||
type: 'system',
|
||||
template: '请从文档中提取以下字段信息：合同名称、合同编号、签订日期'
|
||||
}
|
||||
},
|
||||
vlm: {
|
||||
fields: [
|
||||
{ name: '公章', type: 'seal' },
|
||||
{ name: '签名', type: 'handwriting' }
|
||||
],
|
||||
prompt_setting: {
|
||||
type: 'system',
|
||||
template: '请识别文档中的公章和签名'
|
||||
}
|
||||
},
|
||||
regex: {
|
||||
fields: [
|
||||
{ field: '合同编号', pattern: 'HT-\\d{4}-\\d{6}' }
|
||||
]
|
||||
}
|
||||
},
|
||||
evaluation_config: {
|
||||
logicType: 'and',
|
||||
customLogic: '',
|
||||
rules: [
|
||||
{
|
||||
id: '1',
|
||||
type: 'exists',
|
||||
config: {
|
||||
fields: ['合同名称', '合同编号', '签订日期'],
|
||||
logic: 'and'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
pass_message: '文档检查通过，符合规范要求。',
|
||||
fail_message: '文档存在以下问题，请修改后重新提交。',
|
||||
suggestion_message: '',
|
||||
suggestion_message_type: 'warning',
|
||||
post_action: 'none',
|
||||
action_config: ''
|
||||
};
|
||||
|
||||
const postData = JSON.stringify(testData);
|
||||
|
||||
const options = {
|
||||
hostname: '127.0.0.1',
|
||||
port: 9000,
|
||||
path: '/admin/evaluation_points',
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Content-Length': Buffer.byteLength(postData),
|
||||
'Accept': 'application/json',
|
||||
'Prefer': 'return=representation'
|
||||
}
|
||||
};
|
||||
|
||||
const req = http.request(options, (res) => {
|
||||
console.log(`状态码: ${res.statusCode}`);
|
||||
console.log(`响应头: ${JSON.stringify(res.headers)}`);
|
||||
|
||||
let data = '';
|
||||
|
||||
res.on('data', (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on('end', () => {
|
||||
console.log('创建评查点成功!');
|
||||
try {
|
||||
const jsonData = JSON.parse(data);
|
||||
console.log('创建的评查点ID:', jsonData.id);
|
||||
console.log('创建的评查点数据:', JSON.stringify(jsonData, null, 2).substring(0, 200) + '...');
|
||||
} catch (e) {
|
||||
console.error('解析JSON数据失败:', e.message);
|
||||
console.log('原始数据:', data);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on('error', (e) => {
|
||||
console.error(`创建评查点请求失败: ${e.message}`);
|
||||
});
|
||||
|
||||
req.write(postData);
|
||||
req.end();
|
||||
}
|
||||
|
||||
// 运行测试
|
||||
console.log('开始测试评查点API...');
|
||||
console.log('1. 测试获取评查点列表...');
|
||||
testGetEvaluationPoints();
|
||||
|
||||
// 等待3秒后测试创建评查点
|
||||
setTimeout(() => {
|
||||
console.log('\n2. 测试创建评查点...');
|
||||
testCreateEvaluationPoint();
|
||||
}, 3000);
|
||||
Reference in New Issue
Block a user