修改时间范围组件，评查详情创建新的数据结构来适配新的返回格式
This commit is contained in:
@@ -67,11 +67,11 @@ interface FileContent {
|
||||
interface FilePreviewProps {
|
||||
fileContent: FileContent;
|
||||
reviewPoints: ReviewPoint[];
|
||||
activeReviewPointId: string | null;
|
||||
activeReviewPointResultId: string | null;
|
||||
targetPage?: number; // 新增目标页码参数
|
||||
}
|
||||
|
||||
export function FilePreview({ fileContent, reviewPoints, activeReviewPointId, targetPage }: FilePreviewProps) {
|
||||
export function FilePreview({ fileContent, reviewPoints, activeReviewPointResultId, targetPage }: FilePreviewProps) {
|
||||
const [zoomLevel, setZoomLevel] = useState(100);
|
||||
// const [highlightsVisible, setHighlightsVisible] = useState(true);
|
||||
const contentRef = useRef<HTMLDivElement>(null);
|
||||
@@ -119,7 +119,7 @@ export function FilePreview({ fileContent, reviewPoints, activeReviewPointId, ta
|
||||
const prevTargetPageRef = useRef<number | undefined>(undefined);
|
||||
useEffect(() => {
|
||||
// 如果有目标页码，并且与上次不同或activeReviewPointId变化了，则执行跳转
|
||||
if (targetPage && numPages && targetPage <= numPages && (targetPage !== prevTargetPageRef.current || activeReviewPointId)) {
|
||||
if (targetPage && numPages && targetPage <= numPages && (targetPage !== prevTargetPageRef.current || activeReviewPointResultId)) {
|
||||
prevTargetPageRef.current = targetPage;
|
||||
let newTargetPage = targetPage;
|
||||
try {
|
||||
@@ -134,25 +134,25 @@ export function FilePreview({ fileContent, reviewPoints, activeReviewPointId, ta
|
||||
|
||||
const pageElement = document.getElementById(`page-${newTargetPage}`);
|
||||
if (pageElement) {
|
||||
console.log(`跳转到第${newTargetPage}页，对应评查点结果ID: ${activeReviewPointId}`);
|
||||
console.log(`跳转到第${newTargetPage}页，对应评查点结果ID: ${activeReviewPointResultId}`);
|
||||
pageElement.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||
}
|
||||
}
|
||||
}, [targetPage, numPages, fileContent, activeReviewPointId]);
|
||||
}, [targetPage, numPages, fileContent, activeReviewPointResultId]);
|
||||
|
||||
// 获取评查点对应的样式类
|
||||
const getHighlightClass = (status: string) => {
|
||||
switch (status) {
|
||||
case 'warning':
|
||||
return 'warning';
|
||||
case 'error':
|
||||
return 'error';
|
||||
case 'success':
|
||||
return 'success';
|
||||
default:
|
||||
return 'warning';
|
||||
}
|
||||
};
|
||||
// const getHighlightClass = (status: string) => {
|
||||
// switch (status) {
|
||||
// case 'warning':
|
||||
// return 'warning';
|
||||
// case 'error':
|
||||
// return 'error';
|
||||
// case 'success':
|
||||
// return 'success';
|
||||
// default:
|
||||
// return 'warning';
|
||||
// }
|
||||
// };
|
||||
|
||||
// 处理页码输入变化
|
||||
const handlePageInputChange = (e: ChangeEvent<HTMLInputElement>) => {
|
||||
@@ -231,9 +231,9 @@ export function FilePreview({ fileContent, reviewPoints, activeReviewPointId, ta
|
||||
// 遍历每一页，生成对应的页面组件
|
||||
for (let i = 1; i <= numPages; i++) {
|
||||
// 查找该页面上的评查点，基于position.section匹配页面ID
|
||||
const pageReviewPoints = reviewPoints.filter(point =>
|
||||
point.position && point.position.section === `page-${i}`
|
||||
);
|
||||
// const pageReviewPoints = reviewPoints.filter(point =>
|
||||
// point.position && point.position.section === `page-${i}`
|
||||
// );
|
||||
|
||||
// 计算当前缩放级别下的页面容器样式
|
||||
const zoomFactor = zoomLevel / 100;
|
||||
|
||||
@@ -34,7 +34,7 @@ export interface ReviewPoint {
|
||||
title: string;
|
||||
groupName: string;
|
||||
status: string;
|
||||
content: Record<string, string>;
|
||||
content: Record<string, string | { page?: number, value?: string }>;
|
||||
suggestion: string;
|
||||
needsHumanReview?: boolean;
|
||||
humanReviewNote?: string;
|
||||
@@ -49,7 +49,7 @@ export interface ReviewPoint {
|
||||
legalBasis?: {
|
||||
name?: string;
|
||||
content?: string;
|
||||
articles?: Array<string | { name?: string; content?: string; [key: string]: unknown }>;
|
||||
articles?: Array<string | { name?: string; content?: string;[key: string]: unknown }>;
|
||||
[key: string]: unknown;
|
||||
};
|
||||
postAction?: string;
|
||||
@@ -68,17 +68,17 @@ interface Statistics {
|
||||
interface ReviewPointsListProps {
|
||||
reviewPoints: ReviewPoint[];
|
||||
statistics: Statistics;
|
||||
activeReviewPointId: string | null;
|
||||
activeReviewPointResultId: string | null;
|
||||
onReviewPointSelect: (id: string, page?: number) => void;
|
||||
onStatusChange: (id: string, editAuditStatusId: string | number, status: string, message: string) => void;
|
||||
}
|
||||
|
||||
export function ReviewPointsList({
|
||||
reviewPoints,
|
||||
export function ReviewPointsList({
|
||||
reviewPoints,
|
||||
statistics,
|
||||
activeReviewPointId,
|
||||
activeReviewPointResultId,
|
||||
onReviewPointSelect,
|
||||
onStatusChange
|
||||
onStatusChange
|
||||
}: ReviewPointsListProps) {
|
||||
// 状态管理
|
||||
const [editingReviewPoint, setEditingReviewPoint] = useState<string | null>(null); // 当前正在编辑的评查点ID
|
||||
@@ -86,23 +86,23 @@ export function ReviewPointsList({
|
||||
const [statusFilter, setStatusFilter] = useState<string | null>(null); // 状态过滤
|
||||
|
||||
const [suggestionTexts, setSuggestionTexts] = useState<Record<string, string>>({}); // 存储每个评查点的建议文本
|
||||
|
||||
|
||||
// 添加重新审核意见的状态/ 用户输入的修改内容 / 用户提前写好的修改内容
|
||||
const [manualReviewNotes, setManualReviewNotes] = useState<Record<string, string>>({});
|
||||
|
||||
|
||||
// 初始化建议文本
|
||||
useEffect(() => {
|
||||
// 将所有评查点的建议文本存储到状态中
|
||||
const suggestions: Record<string, string> = {};
|
||||
|
||||
|
||||
reviewPoints.forEach(point => {
|
||||
suggestions[point.id] = point.suggestion || '';
|
||||
});
|
||||
setSuggestionTexts(suggestions);
|
||||
|
||||
|
||||
// 使用函数式更新，不再需要外部 manualReviewNotes 变量
|
||||
setManualReviewNotes(prev => {
|
||||
const notes = {...prev};
|
||||
const notes = { ...prev };
|
||||
reviewPoints.forEach(point => {
|
||||
notes[point.id] = point.actionContent || '';
|
||||
});
|
||||
@@ -117,7 +117,7 @@ export function ReviewPointsList({
|
||||
[reviewPointId]: text
|
||||
}));
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 处理评查点审核操作
|
||||
* @param reviewPointResultId 评查点结果ID
|
||||
@@ -137,7 +137,7 @@ export function ReviewPointsList({
|
||||
// console.log('通过/不通过-------', reviewPointResultId, editAuditStatusId || '', action === 'approve' ? 'true' : 'false', message);
|
||||
onStatusChange(reviewPointResultId, editAuditStatusId || '', action === 'approve' ? 'true' : 'false', message);
|
||||
}
|
||||
|
||||
|
||||
// 将参数输出到控制台
|
||||
console.log('评查点审核操作', {
|
||||
id: reviewPointResultId,
|
||||
@@ -146,35 +146,32 @@ export function ReviewPointsList({
|
||||
content: message,
|
||||
status: action === 'approve' ? 'true' : (action === 'reject' ? 'false' : 'review')
|
||||
});
|
||||
|
||||
|
||||
// 清除编辑状态
|
||||
setEditingReviewPoint(null);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 过滤评查点
|
||||
* 根据搜索文本和状态过滤条件筛选评查点
|
||||
*/
|
||||
const filteredReviewPoints = reviewPoints.filter(point => {
|
||||
const filteredReviewPoints = reviewPoints.filter(point => {
|
||||
// 匹配搜索文本
|
||||
const matchesSearch = searchText === '' ||
|
||||
const matchesSearch = searchText === '' ||
|
||||
point.pointName.toLowerCase().includes(searchText.toLowerCase()) ||
|
||||
point.title.toLowerCase().includes(searchText.toLowerCase()) ||
|
||||
point.groupName.toLowerCase().includes(searchText.toLowerCase()) ||
|
||||
(typeof point.content === 'object' && point.content !== null &&
|
||||
Object.values(point.content).some(value =>
|
||||
typeof value === 'string' && value.toLowerCase().includes(searchText.toLowerCase())
|
||||
));
|
||||
|
||||
JSON.stringify(point.content).toLowerCase().includes(searchText.toLowerCase())
|
||||
|
||||
// 处理状态过滤
|
||||
let matchesStatus = false;
|
||||
|
||||
|
||||
if (statusFilter === null) {
|
||||
// 未选择过滤条件时显示所有
|
||||
matchesStatus = true;
|
||||
} else if (statusFilter === 'success') {
|
||||
// 过滤"通过"状态
|
||||
matchesStatus = point.result === true || (point.result === undefined && point.status === 'success');
|
||||
matchesStatus = point.result === true;
|
||||
} else if (statusFilter === 'warning') {
|
||||
// 过滤"警告"状态
|
||||
matchesStatus = point.result === false && point.status === 'warning';
|
||||
@@ -182,10 +179,10 @@ export function ReviewPointsList({
|
||||
// 过滤"错误"状态
|
||||
matchesStatus = point.result === false && point.status === 'error';
|
||||
}
|
||||
|
||||
|
||||
return matchesSearch && matchesStatus;
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* 处理一键替换操作
|
||||
* @param reviewPointId 评查点ID
|
||||
@@ -194,50 +191,50 @@ export function ReviewPointsList({
|
||||
// 在实际应用中，这里应该调用API进行内容替换
|
||||
// 模拟替换操作
|
||||
alert(`将为评查点 ${reviewPointId} 执行一键替换操作`);
|
||||
|
||||
|
||||
// 更新评查点状态为成功
|
||||
// onStatusChange(reviewPointId, 'success');
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染评查统计信息
|
||||
* 显示总计、通过、警告、错误数量
|
||||
*/
|
||||
const renderStatistics = () => {
|
||||
// 确保传入的statistics存在，否则使用计算值
|
||||
const statsToUse = statistics || {
|
||||
const statsToUse = statistics || {
|
||||
total: reviewPoints.length,
|
||||
success: 0,
|
||||
warning: 0,
|
||||
error: 0,
|
||||
score: 0
|
||||
};
|
||||
|
||||
|
||||
// 计算各个状态的评查点数量
|
||||
const successCount = reviewPoints.filter(
|
||||
point => point.result === true || (point.result === undefined && point.status === 'success')
|
||||
).length;
|
||||
|
||||
|
||||
const warningCount = reviewPoints.filter(
|
||||
point => point.result === false && point.status === 'warning'
|
||||
).length;
|
||||
|
||||
|
||||
const errorCount = reviewPoints.filter(
|
||||
point => point.result === false && point.status === 'error'
|
||||
).length;
|
||||
|
||||
|
||||
// 如果没有计算值，则使用传入的统计值
|
||||
const totalToShow = statsToUse.total === 0 ? reviewPoints.length : statsToUse.total;
|
||||
const successToShow = successCount || statsToUse.success;
|
||||
const warningToShow = warningCount || statsToUse.warning;
|
||||
const errorToShow = errorCount || statsToUse.error;
|
||||
|
||||
|
||||
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">
|
||||
<button
|
||||
<button
|
||||
className={`px-3 h-7 bg-gray-100 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === null && searchText === '' ? 'ring-2 ring-gray-400' : ''}`}
|
||||
onClick={() => {
|
||||
setStatusFilter(null);
|
||||
@@ -253,7 +250,7 @@ export function ReviewPointsList({
|
||||
<div className="h-8 border-r border-gray-200"></div>
|
||||
{/* 通过数量 */}
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
<button
|
||||
className={`px-3 h-7 bg-green-50 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === 'success' ? 'ring-2 ring-green-500' : ''}`}
|
||||
onClick={() => setStatusFilter(statusFilter === 'success' ? null : 'success')}
|
||||
aria-label={`过滤通过项 ${statusFilter === 'success' ? '(已选中)' : ''}`}
|
||||
@@ -266,7 +263,7 @@ export function ReviewPointsList({
|
||||
<div className="h-8 border-r border-gray-200"></div>
|
||||
{/* 警告数量 */}
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
<button
|
||||
className={`px-3 h-7 bg-yellow-50 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === 'warning' ? 'ring-2 ring-yellow-500' : ''}`}
|
||||
onClick={() => setStatusFilter(statusFilter === 'warning' ? null : 'warning')}
|
||||
aria-label={`过滤警告项 ${statusFilter === 'warning' ? '(已选中)' : ''}`}
|
||||
@@ -279,7 +276,7 @@ export function ReviewPointsList({
|
||||
<div className="h-8 border-r border-gray-200"></div>
|
||||
{/* 错误数量 */}
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
<button
|
||||
className={`px-3 h-7 bg-red-50 rounded-md flex items-center justify-center cursor-pointer ${statusFilter === 'error' ? 'ring-2 ring-red-500' : ''}`}
|
||||
onClick={() => setStatusFilter(statusFilter === 'error' ? null : 'error')}
|
||||
aria-label={`过滤错误项 ${statusFilter === 'error' ? '(已选中)' : ''}`}
|
||||
@@ -293,7 +290,7 @@ export function ReviewPointsList({
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染搜索框
|
||||
* 用于按文本搜索评查点
|
||||
@@ -312,7 +309,7 @@ export function ReviewPointsList({
|
||||
/>
|
||||
<i className="ri-search-line absolute left-2 top-0.5 text-gray-400"></i>
|
||||
{searchText && (
|
||||
<button
|
||||
<button
|
||||
className="absolute right-2 top-0.5 text-gray-400 hover:text-gray-600"
|
||||
onClick={() => setSearchText('')}
|
||||
>
|
||||
@@ -323,7 +320,7 @@ export function ReviewPointsList({
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染评查点状态标签
|
||||
* @param status 状态文本
|
||||
@@ -339,7 +336,7 @@ export function ReviewPointsList({
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
// 当result为false时，根据status决定显示警告还是错误
|
||||
if (result === false) {
|
||||
if (status === 'warning') {
|
||||
@@ -356,7 +353,7 @@ export function ReviewPointsList({
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 兼容旧版逻辑，当没有result时，仍按status判断
|
||||
switch (status) {
|
||||
case 'success':
|
||||
@@ -391,7 +388,7 @@ export function ReviewPointsList({
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染人工审核标记
|
||||
* @param reviewPoint 评查点
|
||||
@@ -407,13 +404,14 @@ export function ReviewPointsList({
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染人工审核注释
|
||||
* @param reviewPoint 评查点
|
||||
* @returns 人工审核注释组件
|
||||
*/
|
||||
const renderHumanReviewNote = (reviewPoint: ReviewPoint) => {
|
||||
// 目前needsHumanReview和humanReviewNote都为空，所以不显示
|
||||
if (reviewPoint.needsHumanReview && reviewPoint.humanReviewNote) {
|
||||
return (
|
||||
<div className="human-review-note">
|
||||
@@ -428,11 +426,64 @@ export function ReviewPointsList({
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染评查点主要内容
|
||||
* @param reviewPoint 评查点
|
||||
* @returns 评查点主要内容组件
|
||||
*/
|
||||
const renderContent = (reviewPoint: ReviewPoint) => {
|
||||
return (
|
||||
<>
|
||||
{/* 修改评查结果的结构之后，显示新的结构 */}
|
||||
{Object.entries(reviewPoint.content).map(([key, value], index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="mb-2 pb-2 border-b border-gray-100 last:border-b-0 last:mb-0 last:pb-0 cursor-pointer hover:bg-gray-100 transition-colors duration-200 rounded p-1"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
console.log(`通过：单独点击${key}----`, reviewPoint);
|
||||
// 检查value中的page属性是否存在
|
||||
if (value && typeof value === 'object' && value.page) {
|
||||
// 获取当前 key 对应的第一个页码并跳转
|
||||
console.log(`通过：单独点击${key}----页码---`, value.page);
|
||||
|
||||
onReviewPointSelect(reviewPoint.id, value.page);
|
||||
} else {
|
||||
console.log(`通过：单独点击${key}--------没有对应页码`);
|
||||
}
|
||||
}}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
e.preventDefault();
|
||||
if (value && typeof value === 'object' && value.page) {
|
||||
onReviewPointSelect(reviewPoint.id, value.page);
|
||||
} else {
|
||||
console.log(`通过：单独点击${key}--------没有对应页码`);
|
||||
}
|
||||
}
|
||||
}}
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
aria-label={`查看${key}内容详情`}
|
||||
>
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs">{key}</span>
|
||||
<span className={`text-xs w-15 ${value ? 'text-error' : 'text-warning'}`}>
|
||||
{value ? '' : '缺失'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染评查点内容与建议
|
||||
* @param reviewPoint 评查点
|
||||
* @returns 评查点内容组件
|
||||
* @returns 评查点内容与建议组件
|
||||
*/
|
||||
const renderReviewPointContent = (reviewPoint: ReviewPoint) => {
|
||||
|
||||
@@ -446,8 +497,8 @@ export function ReviewPointsList({
|
||||
// 如果当前评查点不处于编辑状态，只显示简单信息
|
||||
if (editingReviewPoint !== reviewPoint.id) {
|
||||
// 根据result和status决定渲染哪种样式
|
||||
if (reviewPoint.result === true ){
|
||||
// 已通过的评查点只显示基本信息和人工审核注释 delete
|
||||
if (reviewPoint.result === true) {
|
||||
// 已通过的评查点只显示基本信息和人工审核注释 delete TODO
|
||||
// if (reviewPoint.needsHumanReview && reviewPoint.humanReviewNote) {
|
||||
// return (
|
||||
// <div className="mt-2">
|
||||
@@ -476,56 +527,115 @@ export function ReviewPointsList({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="mt-2">
|
||||
{reviewPoint.suggestion && (
|
||||
<div className="p-2 bg-blue-50 rounded border border-blue-200 text-xs mb-3 select-text">
|
||||
<div className="flex items-start">
|
||||
<i className="ri-information-line text-blue-500 mr-2 mt-0.5"></i>
|
||||
<p className="text-xs text-gray-600 select-text">{reviewPoint.suggestion}</p>
|
||||
</div>
|
||||
</div>
|
||||
<>
|
||||
{checkContentPage(reviewPoint).pageIndex === 0 && (
|
||||
<p className="text-xs text-red-500 select-text text-left">该评查点无法找到索引内容，无法自动定位到对应页面。</p>
|
||||
)}
|
||||
|
||||
{/* 额外的文本输入框区域 */}
|
||||
<div className="mb-3">
|
||||
<textarea
|
||||
id={`manual-review-${reviewPoint.id}`}
|
||||
className="w-full p-2 border rounded bg-white text-xs min-h-[80px] focus:outline-none focus:border-primary"
|
||||
placeholder="请输入重新审核意见..."
|
||||
value={manualReviewNotes[reviewPoint.id] || ''}
|
||||
onChange={(e) => handleNoteChange(reviewPoint.id, e.target.value)}
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end">
|
||||
{reviewPoint.editAuditStatus === 0 ? (
|
||||
<div className="w-full flex justify-end gap-2">
|
||||
<button
|
||||
className="bg-[#1890ff] hover:bg-blue-600 text-xs text-white py-1 px-2 rounded-md flex items-center justify-center"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, reviewPoint.editAuditStatusId, 'approve', note)}
|
||||
>
|
||||
<i className="ri-check-line mr-1"></i> 通过
|
||||
</button>
|
||||
<button
|
||||
className="bg-[#f5222d] hover:bg-red-600 text-xs text-white py-1 px-2 rounded-md flex items-center justify-center"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, reviewPoint.editAuditStatusId, 'reject', note)}
|
||||
>
|
||||
<i className="ri-close-line mr-1"></i> 不通过
|
||||
</button>
|
||||
<div className="mt-2">
|
||||
{reviewPoint.suggestion && (
|
||||
<div className="p-2 bg-blue-50 rounded border border-blue-200 text-xs mb-3 select-text">
|
||||
<div className="flex items-start">
|
||||
<i className="ri-information-line text-blue-500 mr-2 mt-0.5"></i>
|
||||
<p className="text-xs text-gray-600 select-text">{reviewPoint.suggestion}</p>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<button
|
||||
className="bg-purple-600 hover:bg-purple-700 text-xs text-white py-1 px-2 rounded-md flex items-center justify-center"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, reviewPoint.editAuditStatusId, 'review', note)}
|
||||
>
|
||||
<i className="ri-refresh-line mr-1"></i> 重新审核
|
||||
</button>
|
||||
)}
|
||||
|
||||
{/* 评查点内容显示区域 */}
|
||||
{reviewPoint.content && Object.entries(reviewPoint.content).length > 0 && (
|
||||
<div className="p-2 bg-white rounded border border-gray-200 text-xs mb-3 select-text">
|
||||
{/* 修改评查结果的结构之前，先显示旧的结构 */}
|
||||
{Object.entries(reviewPoint.content).map(([key, value], index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="mb-2 pb-2 border-b border-gray-100 last:border-b-0 last:mb-0 last:pb-0 cursor-pointer hover:bg-gray-100 transition-colors duration-200 rounded p-1"
|
||||
onClick={(e) => {
|
||||
// 阻止事件冒泡，防止触发父元素的点击事件
|
||||
e.stopPropagation();
|
||||
|
||||
console.log(`通过：单独点击${key}----`, reviewPoint);
|
||||
// 检查评查点是否有 contentPage 以及当前 key 对应的页码数组
|
||||
if (reviewPoint.contentPage && reviewPoint.contentPage[key] && reviewPoint.contentPage[key].length > 0) {
|
||||
// 获取当前 key 对应的第一个页码并跳转
|
||||
console.log(`通过：单独点击${key}----页码---`, reviewPoint.contentPage[key][0]);
|
||||
|
||||
onReviewPointSelect(reviewPoint.id, reviewPoint.contentPage[key][0]);
|
||||
} else {
|
||||
console.log(`通过：单独点击${key}--------没有对应页码`);
|
||||
}
|
||||
}}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
e.preventDefault();
|
||||
if (reviewPoint.contentPage && reviewPoint.contentPage[key] && reviewPoint.contentPage[key].length > 0) {
|
||||
onReviewPointSelect(reviewPoint.id, reviewPoint.contentPage[key][0]);
|
||||
} else {
|
||||
console.log(`通过：单独点击${key}--------没有对应页码`);
|
||||
}
|
||||
}
|
||||
}}
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
aria-label={`查看${key}内容详情`}
|
||||
>
|
||||
{/* 使用flex布局使key和状态标签左右对齐 */}
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs">{key}</span>
|
||||
<span className={`text-xs w-15 ${value ? 'text-error' : 'text-warning'}`}>
|
||||
{value ? '' : '缺失'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-xs text-left select-text">{value || (value === '' ? <span className="invisible">占位符</span> : '')}</p>
|
||||
</div>
|
||||
))}
|
||||
{/* 修改评查结果的结构之后，显示新的结构 */}
|
||||
{/* {renderContent(reviewPoint)} */}
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
|
||||
{/* 额外的文本输入框区域 */}
|
||||
<div className="mb-3">
|
||||
<textarea
|
||||
id={`manual-review-${reviewPoint.id}`}
|
||||
className="w-full p-2 border rounded bg-white text-xs min-h-[80px] focus:outline-none focus:border-primary"
|
||||
placeholder="请输入重新审核意见..."
|
||||
value={manualReviewNotes[reviewPoint.id] || ''}
|
||||
onChange={(e) => handleNoteChange(reviewPoint.id, e.target.value)}
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end">
|
||||
{reviewPoint.editAuditStatus === 0 ? (
|
||||
<div className="w-full flex justify-end gap-2">
|
||||
<button
|
||||
className="bg-[#1890ff] hover:bg-blue-600 text-xs text-white py-1 px-2 rounded-md flex items-center justify-center"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, reviewPoint.editAuditStatusId, 'approve', note)}
|
||||
>
|
||||
<i className="ri-check-line mr-1"></i> 通过
|
||||
</button>
|
||||
<button
|
||||
className="bg-[#f5222d] hover:bg-red-600 text-xs text-white py-1 px-2 rounded-md flex items-center justify-center"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, reviewPoint.editAuditStatusId, 'reject', note)}
|
||||
>
|
||||
<i className="ri-close-line mr-1"></i> 不通过
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<button
|
||||
className="bg-purple-600 hover:bg-purple-700 text-xs text-white py-1 px-2 rounded-md flex items-center justify-center"
|
||||
onClick={() => handleReviewAction(reviewPoint.id, reviewPoint.editAuditStatusId, 'review', note)}
|
||||
>
|
||||
<i className="ri-refresh-line mr-1"></i> 重新审核
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
// 处理 result=true 且 postAction!=manual 的情况
|
||||
return (
|
||||
<>
|
||||
@@ -534,20 +644,21 @@ export function ReviewPointsList({
|
||||
)}
|
||||
<div className="p-2 bg-white rounded border border-gray-200 text-xs mb-3 select-text">
|
||||
<div>
|
||||
{/* 修改评查结果的结构之前，先显示旧的结构 */}
|
||||
{Object.entries(reviewPoint.content).map(([key, value], index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="mb-2 pb-2 border-b border-gray-100 last:border-b-0 last:mb-0 last:pb-0 cursor-pointer hover:bg-gray-100 transition-colors duration-200 rounded p-1"
|
||||
<div
|
||||
key={index}
|
||||
className="mb-2 pb-2 border-b border-gray-100 last:border-b-0 last:mb-0 last:pb-0 cursor-pointer hover:bg-gray-100 transition-colors duration-200 rounded p-1"
|
||||
onClick={(e) => {
|
||||
// 阻止事件冒泡，防止触发父元素的点击事件
|
||||
e.stopPropagation();
|
||||
|
||||
console.log(`通过：单独点击${key}----`,reviewPoint);
|
||||
|
||||
console.log(`通过：单独点击${key}----`, reviewPoint);
|
||||
// 检查评查点是否有 contentPage 以及当前 key 对应的页码数组
|
||||
if (reviewPoint.contentPage && reviewPoint.contentPage[key] && reviewPoint.contentPage[key].length > 0) {
|
||||
// 获取当前 key 对应的第一个页码并跳转
|
||||
console.log(`通过：单独点击${key}----页码---`,reviewPoint.contentPage[key][0]);
|
||||
|
||||
console.log(`通过：单独点击${key}----页码---`, reviewPoint.contentPage[key][0]);
|
||||
|
||||
onReviewPointSelect(reviewPoint.id, reviewPoint.contentPage[key][0]);
|
||||
} else {
|
||||
console.log(`通过：单独点击${key}--------没有对应页码`);
|
||||
@@ -570,48 +681,47 @@ export function ReviewPointsList({
|
||||
{/* 使用flex布局使key和状态标签左右对齐 */}
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
<span className="text-xs">{key}</span>
|
||||
<span className={`text-xs ${value ? 'text-error' : 'text-warning'}`}>
|
||||
<span className={`text-xs w-15 ${value ? 'text-error' : 'text-warning'}`}>
|
||||
{value ? '' : '缺失'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-xs text-left select-text">{value || (value === '' ? <span className="invisible">占位符</span> : '')}</p>
|
||||
</div>
|
||||
))}
|
||||
{/* 修改评查结果的结构之后，显示新的结构 */}
|
||||
{/* {renderContent(reviewPoint)} */}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
// 非通过状态，显示内容和修改建议
|
||||
const isErrorStatus = reviewPoint.result === false && reviewPoint.status === 'error';
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className="mt-2">
|
||||
|
||||
{/* 没有索引内容提示 */}
|
||||
{reviewPoint.contentPage &&
|
||||
checkContentPage(reviewPoint).pageIndex === 0 && (
|
||||
// <div className="p-2 bg-white rounded border border-gray-200 text-xs mb-3 select-text">
|
||||
<p className="text-xs text-red-500 select-text text-left">该评查点无法找到索引内容，无法自动定位到对应页面。</p>
|
||||
// </div>
|
||||
{checkContentPage(reviewPoint).pageIndex === 0 && (
|
||||
<p className="text-xs text-red-500 select-text text-left">该评查点无法找到索引内容，无法自动定位到对应页面。</p>
|
||||
)}
|
||||
|
||||
{/* 建议内容显示区域 */}
|
||||
{reviewPoint.suggestion && (
|
||||
<div className="p-2 bg-blue-50 rounded border border-blue-200 text-xs mb-3 select-text">
|
||||
<div className="flex items-start">
|
||||
<i className="ri-information-line text-blue-500 mr-2 mt-0.5"></i>
|
||||
<p className="text-xs text-gray-600 select-text text-left">{reviewPoint.suggestion}</p>
|
||||
</div>
|
||||
<div className="p-2 bg-blue-50 rounded border border-blue-200 text-xs mb-3 select-text">
|
||||
<div className="flex items-start">
|
||||
<i className="ri-information-line text-blue-500 mr-2 mt-0.5"></i>
|
||||
<p className="text-xs text-gray-600 select-text text-left">{reviewPoint.suggestion}</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
{/* 法律依据内容 */}
|
||||
{reviewPoint.legalBasis && (typeof reviewPoint.legalBasis === 'object') && (
|
||||
(reviewPoint.legalBasis.name || reviewPoint.legalBasis.content ||
|
||||
{/* 法律依据内容 */}
|
||||
{reviewPoint.legalBasis && (typeof reviewPoint.legalBasis === 'object') && (
|
||||
(reviewPoint.legalBasis.name || reviewPoint.legalBasis.content ||
|
||||
(reviewPoint.legalBasis.articles && Array.isArray(reviewPoint.legalBasis.articles) && reviewPoint.legalBasis.articles.length > 0)) && (
|
||||
<div className="p-2 bg-white rounded border border-gray-200 text-xs mb-3 select-text">
|
||||
<div className="flex justify-between items-center mb-1">
|
||||
@@ -629,10 +739,10 @@ export function ReviewPointsList({
|
||||
<ul className="list-disc pl-4 select-text">
|
||||
{reviewPoint.legalBasis.articles.map((item, index) => (
|
||||
<li key={index} className="text-xs text-left select-text">
|
||||
{typeof item === 'string' ? item :
|
||||
typeof item === 'object' && item !== null ?
|
||||
(item.name ? `${item.name}: ${item.content || ''}` :
|
||||
item.content || JSON.stringify(item)) :
|
||||
{typeof item === 'string' ? item :
|
||||
typeof item === 'object' && item !== null ?
|
||||
(item.name ? `${item.name}: ${item.content || ''}` :
|
||||
item.content || JSON.stringify(item)) :
|
||||
String(item)}
|
||||
</li>
|
||||
))}
|
||||
@@ -649,20 +759,21 @@ export function ReviewPointsList({
|
||||
{/* 内容显示区域 */}
|
||||
<div className="p-2 bg-white rounded border border-gray-200 text-xs mb-3 select-text">
|
||||
<div>
|
||||
{/* 修改评查结果的结构之前，先显示旧的结构 */}
|
||||
{Object.entries(reviewPoint.content).map(([key, value], index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="mb-2 pb-2 border-b border-gray-100 last:border-b-0 last:mb-0 cursor-pointer hover:bg-gray-100 transition-colors duration-200 rounded p-1"
|
||||
<div
|
||||
key={index}
|
||||
className="mb-2 pb-2 border-b border-gray-100 last:border-b-0 last:mb-0 cursor-pointer hover:bg-gray-100 transition-colors duration-200 rounded p-1"
|
||||
onClick={(e) => {
|
||||
// 阻止事件冒泡，防止触发父元素的点击事件
|
||||
e.stopPropagation();
|
||||
|
||||
console.log(`非通过：单独点击${key}----`,reviewPoint);
|
||||
|
||||
console.log(`非通过：单独点击${key}----`, reviewPoint);
|
||||
// 检查评查点是否有 contentPage 以及当前 key 对应的页码数组
|
||||
if (reviewPoint.contentPage && reviewPoint.contentPage[key] && reviewPoint.contentPage[key].length > 0) {
|
||||
// 获取当前 key 对应的第一个页码并跳转
|
||||
console.log(`非通过：单独点击${key}----页码---`,reviewPoint.contentPage[key][0]);
|
||||
|
||||
console.log(`非通过：单独点击${key}----页码---`, reviewPoint.contentPage[key][0]);
|
||||
|
||||
onReviewPointSelect(reviewPoint.id, reviewPoint.contentPage[key][0]);
|
||||
} else {
|
||||
// 如果没有对应页码，弹出提示
|
||||
@@ -695,6 +806,8 @@ export function ReviewPointsList({
|
||||
<p className="text-xs text-left select-text">{value || (value === '' ? <span className="invisible">占位符</span> : '')}</p>
|
||||
</div>
|
||||
))}
|
||||
{/* 修改评查结果的结构之后，显示新的结构 */}
|
||||
{/* {renderContent(reviewPoint)} */}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
@@ -702,7 +815,7 @@ export function ReviewPointsList({
|
||||
|
||||
{/* 建议修改区域 */}
|
||||
{/* {((reviewPoint.postAction === 'manual') || (reviewPoint.content !== null && Object.keys(reviewPoint.content).length > 0)) && ( */}
|
||||
{(reviewPoint.postAction === 'manual') && (
|
||||
{(reviewPoint.postAction === 'manual') && (
|
||||
<div className="mb-2">
|
||||
<div className="flex justify-between items-center mb-2">
|
||||
<span className="text-gray-700 text-[0.8rem]">{reviewPoint.postAction === 'manual' ? "审核意见：" : "建议修改为："}</span>
|
||||
@@ -723,18 +836,18 @@ export function ReviewPointsList({
|
||||
<div className="flex space-x-2 mt-2">
|
||||
{/* 一键替换按钮 - 只有非人工审核的点或未通过的人工审核点才显示 */}
|
||||
{(reviewPoint.postAction !== 'manual') && (
|
||||
<button
|
||||
<button
|
||||
className="replace-action flex-1 justify-center"
|
||||
onClick={() => handleReplace(reviewPoint.id)}
|
||||
>
|
||||
<i className="ri-replace-line"></i> 一键替换
|
||||
</button>
|
||||
)}
|
||||
|
||||
|
||||
{/* 人工审核按钮 */}
|
||||
{reviewPoint.editAuditStatus === 0 ? (
|
||||
<div className="w-full flex justify-end gap-2">
|
||||
<button
|
||||
<button
|
||||
className="bg-[#1890ff] hover:bg-blue-600 text-white py-1 px-2 rounded-md text-sm"
|
||||
onClick={() => {
|
||||
const note = manualReviewNotes[reviewPoint.id] || '';
|
||||
@@ -743,7 +856,7 @@ export function ReviewPointsList({
|
||||
>
|
||||
<i className="ri-check-line mr-1"></i> 通过
|
||||
</button>
|
||||
<button
|
||||
<button
|
||||
className="bg-[#f5222d] hover:bg-red-600 text-white py-1 px-2 rounded-md text-sm"
|
||||
onClick={() => {
|
||||
const note = manualReviewNotes[reviewPoint.id] || '';
|
||||
@@ -755,7 +868,7 @@ export function ReviewPointsList({
|
||||
</div>
|
||||
) : (
|
||||
<div className="w-full flex justify-end">
|
||||
<button
|
||||
<button
|
||||
className="bg-purple-600 hover:bg-purple-700 text-white py-1 px-2 rounded-md text-sm"
|
||||
onClick={() => {
|
||||
const note = manualReviewNotes[reviewPoint.id] || '';
|
||||
@@ -771,9 +884,9 @@ export function ReviewPointsList({
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 渲染无匹配结果提示
|
||||
* 当过滤后没有评查点时显示
|
||||
@@ -785,7 +898,7 @@ export function ReviewPointsList({
|
||||
<p className="text-sm mb-1">没有找到匹配的评查点</p>
|
||||
<p className="text-xs">请尝试不同的搜索词或清除筛选条件</p>
|
||||
{(searchText || statusFilter) && (
|
||||
<button
|
||||
<button
|
||||
className="mt-3 text-xs text-primary underline"
|
||||
onClick={() => {
|
||||
setSearchText('');
|
||||
@@ -798,24 +911,24 @@ export function ReviewPointsList({
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
// 处理评查点点击事件
|
||||
const handleReviewPointClick = (id: string) => {
|
||||
// 找到被点击的评查点
|
||||
const reviewPoint = reviewPoints.find(result => result.id === id);
|
||||
|
||||
|
||||
// 如果评查点存在
|
||||
if (reviewPoint) {
|
||||
// 使用checkContentPage方法获取页码和key
|
||||
const { pageIndex, key } = checkContentPage(reviewPoint);
|
||||
|
||||
|
||||
// 如果有有效页码，传递ID和页码
|
||||
if (pageIndex > 0) {
|
||||
console.log(`跳转到页面 ${pageIndex}，对应内容 ${key || '未知'}`);
|
||||
onReviewPointSelect(id, pageIndex);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// 没有有效页码，只传递ID
|
||||
onReviewPointSelect(id);
|
||||
console.log(`没有有效页码---评查点ID：${reviewPoint.pointId}，评查点结果ID：${id}`);
|
||||
@@ -825,17 +938,17 @@ export function ReviewPointsList({
|
||||
console.log(`没有找到评查点---评查点结果ID：${id}`);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// 检查评查点的contentPage
|
||||
const checkContentPage = (reviewPoint: ReviewPoint): { pageIndex: number, key?: string, id: string } => {
|
||||
// 返回对象初始化
|
||||
const result = { pageIndex: 0, id: reviewPoint.id };
|
||||
|
||||
|
||||
// 如果contentPage不存在或是空对象，返回默认值
|
||||
if (!reviewPoint.contentPage || Object.keys(reviewPoint.contentPage).length === 0) {
|
||||
return result;
|
||||
}
|
||||
|
||||
|
||||
// 遍历contentPage中的每个key
|
||||
for (const key of Object.keys(reviewPoint.contentPage)) {
|
||||
const pageArr = reviewPoint.contentPage[key];
|
||||
@@ -849,11 +962,11 @@ export function ReviewPointsList({
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 如果遍历完所有key都没找到有效页码，返回默认值
|
||||
return result;
|
||||
};
|
||||
|
||||
|
||||
// 组件主渲染函数
|
||||
return (
|
||||
<div className="review-points-panel select-text">
|
||||
@@ -862,20 +975,20 @@ export function ReviewPointsList({
|
||||
<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 => (
|
||||
<div
|
||||
<div
|
||||
key={reviewPoint.id}
|
||||
className={`review-point-item ${activeReviewPointId === reviewPoint.id ? 'active' : ''}`}
|
||||
className={`review-point-item ${activeReviewPointResultId === reviewPoint.id ? 'active' : ''}`}
|
||||
onClick={() => handleReviewPointClick(reviewPoint.id)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter') {
|
||||
@@ -888,23 +1001,23 @@ export function ReviewPointsList({
|
||||
>
|
||||
{/* 评查点标题和状态 */}
|
||||
{/* 评查点名称 pointName*/}
|
||||
<div className="review-point-title flex-1 text-left text-blue-500">{'评查点名称：'+reviewPoint.pointName}</div>
|
||||
<div className="review-point-title flex-1 text-left text-blue-500">{'评查点名称：' + reviewPoint.pointName}</div>
|
||||
<div className="review-point-header flex justify-between items-start">
|
||||
<div className="review-point-title flex-1 text-left">{reviewPoint.title}</div>
|
||||
<div className="review-point-title flex-1 text-left min-w-[25%]">{reviewPoint.title}</div>
|
||||
{/* 评查点所属分组 */}
|
||||
<div className="review-point-location">
|
||||
<div className="review-point-location max-w-[40%]">
|
||||
<i className="ri-file-list-line mr-1"></i>
|
||||
<span>{reviewPoint.groupName}</span>
|
||||
</div>
|
||||
<div className="flex flex-col items-center ml-2 flex-shrink-0">
|
||||
<div className="flex flex-col items-center ml-2 flex-shrink-0 max-w-[15%]">
|
||||
{renderStatusBadge(reviewPoint.status, reviewPoint.result)}
|
||||
{renderHumanReviewBadge(reviewPoint)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* 人工审核注释 */}
|
||||
{renderHumanReviewNote(reviewPoint)}
|
||||
|
||||
|
||||
{/* 评查点内容和操作 */}
|
||||
{renderReviewPointContent(reviewPoint)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user