修复评查详情中的下载功能
This commit is contained in:
+174
-3
@@ -281,6 +281,12 @@ export default function FilesUpload() {
|
|||||||
const [documentNumber, setDocumentNumber] = useState<string>("");
|
const [documentNumber, setDocumentNumber] = useState<string>("");
|
||||||
const [remark, setRemark] = useState<string>("");
|
const [remark, setRemark] = useState<string>("");
|
||||||
const [currentFiles, setCurrentFiles] = useState<File[]>([]);
|
const [currentFiles, setCurrentFiles] = useState<File[]>([]);
|
||||||
|
|
||||||
|
// 合同文件上传状态
|
||||||
|
const [isContractType, setIsContractType] = useState<boolean>(false);
|
||||||
|
const [contractMainFiles, setContractMainFiles] = useState<File[]>([]);
|
||||||
|
const [contractAttachmentFiles, setContractAttachmentFiles] = useState<File[]>([]);
|
||||||
|
|
||||||
const [uploadProgress, setUploadProgress] = useState(0);
|
const [uploadProgress, setUploadProgress] = useState(0);
|
||||||
const [uploadSpeed, setUploadSpeed] = useState("0KB/s");
|
const [uploadSpeed, setUploadSpeed] = useState("0KB/s");
|
||||||
const [uploadStage, setUploadStage] = useState<"idle" | "uploading" | "processing" | "completed" | "hadden">("idle");
|
const [uploadStage, setUploadStage] = useState<"idle" | "uploading" | "processing" | "completed" | "hadden">("idle");
|
||||||
@@ -318,6 +324,9 @@ export default function FilesUpload() {
|
|||||||
|
|
||||||
// UploadArea组件引用
|
// UploadArea组件引用
|
||||||
const uploadAreaRef = useRef<UploadAreaRef>(null);
|
const uploadAreaRef = useRef<UploadAreaRef>(null);
|
||||||
|
// 添加合同文件上传区域引用
|
||||||
|
const contractMainFileRef = useRef<UploadAreaRef>(null);
|
||||||
|
const contractAttachmentFileRef = useRef<UploadAreaRef>(null);
|
||||||
|
|
||||||
// 表单提交引用
|
// 表单提交引用
|
||||||
const formRef = useRef<HTMLFormElement>(null);
|
const formRef = useRef<HTMLFormElement>(null);
|
||||||
@@ -441,17 +450,106 @@ export default function FilesUpload() {
|
|||||||
// 立即清除错误状态
|
// 立即清除错误状态
|
||||||
setFileTypeError(null);
|
setFileTypeError(null);
|
||||||
|
|
||||||
|
// 检查是否选择了合同类型
|
||||||
|
const selectedType = documentTypes.find(t => t.id.toString() === value);
|
||||||
|
const isContract = !!(selectedType && selectedType.name.includes('合同'));
|
||||||
|
setIsContractType(isContract);
|
||||||
|
|
||||||
|
// 重置文件状态
|
||||||
|
setContractMainFiles([]);
|
||||||
|
setContractAttachmentFiles([]);
|
||||||
|
setCurrentFiles([]);
|
||||||
|
|
||||||
// 如果已经有选中的文件,且选择了文件类型,则开始上传
|
// 如果已经有选中的文件,且选择了文件类型,则开始上传
|
||||||
if (currentFiles.length > 0) {
|
if (currentFiles.length > 0 && !isContract) {
|
||||||
startUpload(currentFiles);
|
startUpload(currentFiles);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
setFileType("");
|
setFileType("");
|
||||||
|
setIsContractType(false);
|
||||||
// 如果用户选择了空选项,显示错误信息
|
// 如果用户选择了空选项,显示错误信息
|
||||||
setFileTypeError("上传文件之前请选择文件类型");
|
setFileTypeError("上传文件之前请选择文件类型");
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 处理合同主文件选择
|
||||||
|
const handleContractMainFilesSelected = (files: FileList) => {
|
||||||
|
if (files.length > 0) {
|
||||||
|
// 验证文件类型,只允许PDF文件
|
||||||
|
const validFiles: File[] = [];
|
||||||
|
let hasInvalidFiles = false;
|
||||||
|
|
||||||
|
Array.from(files).forEach(file => {
|
||||||
|
if (file.type === 'application/pdf' || file.name.toLowerCase().endsWith('.pdf')) {
|
||||||
|
validFiles.push(file);
|
||||||
|
} else {
|
||||||
|
hasInvalidFiles = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (hasInvalidFiles) {
|
||||||
|
// 显示错误提示
|
||||||
|
messageService.error('只能上传PDF格式的文件', {
|
||||||
|
title: '文件类型错误',
|
||||||
|
confirmText: '确定',
|
||||||
|
cancelText: '',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (validFiles.length > 0) {
|
||||||
|
setContractMainFiles(validFiles);
|
||||||
|
checkAndPrepareUpload(validFiles, contractAttachmentFiles);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 处理合同附件选择
|
||||||
|
const handleContractAttachmentFilesSelected = (files: FileList) => {
|
||||||
|
if (files.length > 0) {
|
||||||
|
// 验证文件类型,只允许PDF文件
|
||||||
|
const validFiles: File[] = [];
|
||||||
|
let hasInvalidFiles = false;
|
||||||
|
|
||||||
|
Array.from(files).forEach(file => {
|
||||||
|
if (file.type === 'application/pdf' || file.name.toLowerCase().endsWith('.pdf')) {
|
||||||
|
validFiles.push(file);
|
||||||
|
} else {
|
||||||
|
hasInvalidFiles = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (hasInvalidFiles) {
|
||||||
|
// 显示错误提示
|
||||||
|
messageService.error('只能上传PDF格式的文件', {
|
||||||
|
title: '文件类型错误',
|
||||||
|
confirmText: '确定',
|
||||||
|
cancelText: '',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (validFiles.length > 0) {
|
||||||
|
setContractAttachmentFiles(validFiles);
|
||||||
|
checkAndPrepareUpload(contractMainFiles, validFiles);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 检查并准备上传
|
||||||
|
const checkAndPrepareUpload = (mainFiles: File[], attachmentFiles: File[]) => {
|
||||||
|
// 当两个区域都有文件时才准备上传
|
||||||
|
if (mainFiles.length > 0 && attachmentFiles.length > 0) {
|
||||||
|
// 合并所有文件
|
||||||
|
const allFiles = [...mainFiles, ...attachmentFiles];
|
||||||
|
|
||||||
|
// 这里的currentFiles的长度是上传进度条是否显示的关键
|
||||||
|
// setCurrentFiles(allFiles);
|
||||||
|
|
||||||
|
// 将准备上传的操作移到这里,暂时不执行
|
||||||
|
console.log('准备上传', allFiles.length, '个文件');
|
||||||
|
// startUpload(allFiles);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// 开始上传文件
|
// 开始上传文件
|
||||||
const startUpload = async (files: File[]) => {
|
const startUpload = async (files: File[]) => {
|
||||||
try {
|
try {
|
||||||
@@ -795,6 +893,10 @@ export default function FilesUpload() {
|
|||||||
setCurrentFiles([]);
|
setCurrentFiles([]);
|
||||||
setCompletedFiles([]);
|
setCompletedFiles([]);
|
||||||
|
|
||||||
|
// 重置合同文件状态
|
||||||
|
setContractMainFiles([]);
|
||||||
|
setContractAttachmentFiles([]);
|
||||||
|
|
||||||
// 重置步骤状态
|
// 重置步骤状态
|
||||||
setProcessingSteps([
|
setProcessingSteps([
|
||||||
{ title: "文件上传", description: "等待上传文件到服务器...", status: "waiting" },
|
{ title: "文件上传", description: "等待上传文件到服务器...", status: "waiting" },
|
||||||
@@ -808,6 +910,12 @@ export default function FilesUpload() {
|
|||||||
if (uploadAreaRef.current) {
|
if (uploadAreaRef.current) {
|
||||||
uploadAreaRef.current.resetFileInput();
|
uploadAreaRef.current.resetFileInput();
|
||||||
}
|
}
|
||||||
|
if (contractMainFileRef.current) {
|
||||||
|
contractMainFileRef.current.resetFileInput();
|
||||||
|
}
|
||||||
|
if (contractAttachmentFileRef.current) {
|
||||||
|
contractAttachmentFileRef.current.resetFileInput();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// 获取当前时间字符串
|
// 获取当前时间字符串
|
||||||
@@ -1051,19 +1159,81 @@ export default function FilesUpload() {
|
|||||||
</Card>
|
</Card>
|
||||||
|
|
||||||
{/* 文件上传区域 */}
|
{/* 文件上传区域 */}
|
||||||
<Card title={<h3>文件上传</h3>} className="mb-4">
|
<Card className="mb-4">
|
||||||
|
{/* 自定义标题栏 */}
|
||||||
|
<div className="w-full flex justify-between items-center mb-4">
|
||||||
|
<h3 className="text-lg font-medium">文件上传</h3>
|
||||||
|
{contractMainFiles.length > 0 && contractAttachmentFiles.length > 0 && (
|
||||||
|
<Button
|
||||||
|
type="primary"
|
||||||
|
icon="ri-upload-cloud-line"
|
||||||
|
onClick={() => startUpload([...contractMainFiles, ...contractAttachmentFiles])}
|
||||||
|
>
|
||||||
|
开始上传
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
{/* 初始上传区域 */}
|
{/* 初始上传区域 */}
|
||||||
{uploadStage === "idle" && (
|
{uploadStage === "idle" && (
|
||||||
<>
|
<>
|
||||||
|
{!isContractType ? (
|
||||||
|
// 标准上传区域 - 非合同类型
|
||||||
<UploadArea
|
<UploadArea
|
||||||
ref={uploadAreaRef}
|
ref={uploadAreaRef}
|
||||||
onFilesSelected={handleFilesSelected}
|
onFilesSelected={handleFilesSelected}
|
||||||
multiple={true}
|
multiple={true}
|
||||||
// accept=".pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png"
|
|
||||||
accept=".pdf"
|
accept=".pdf"
|
||||||
tipText="支持单个或多个pdf文件上传,文件格式:PDF"
|
tipText="支持单个或多个pdf文件上传,文件格式:PDF"
|
||||||
shouldPreventFileSelect={!fileType}
|
shouldPreventFileSelect={!fileType}
|
||||||
/>
|
/>
|
||||||
|
) : (
|
||||||
|
// 合同文件上传区域 - 双区域并排
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||||
|
<div>
|
||||||
|
<h4 className="font-medium mb-2">合同主文件</h4>
|
||||||
|
<UploadArea
|
||||||
|
onFilesSelected={handleContractMainFilesSelected}
|
||||||
|
ref={contractMainFileRef}
|
||||||
|
multiple={false}
|
||||||
|
accept=".pdf"
|
||||||
|
tipText="请上传合同主文件,格式:PDF"
|
||||||
|
mainText="上传合同主文件"
|
||||||
|
buttonText="选择主文件"
|
||||||
|
icon="ri-file-text-line"
|
||||||
|
shouldPreventFileSelect={!fileType}
|
||||||
|
/>
|
||||||
|
{contractMainFiles.length > 0 && (
|
||||||
|
<div className="mt-2 text-sm text-green-600">
|
||||||
|
<i className="ri-checkbox-circle-line"></i>
|
||||||
|
已选择主文件: <span className="font-medium">{contractMainFiles[0].name}</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h4 className="font-medium mb-2">合同附件</h4>
|
||||||
|
<UploadArea
|
||||||
|
onFilesSelected={handleContractAttachmentFilesSelected}
|
||||||
|
ref={contractAttachmentFileRef}
|
||||||
|
multiple={false}
|
||||||
|
accept=".pdf"
|
||||||
|
tipText="请上传合同附件,格式:PDF"
|
||||||
|
mainText="上传合同附件"
|
||||||
|
buttonText="选择附件"
|
||||||
|
icon="ri-file-copy-line"
|
||||||
|
shouldPreventFileSelect={!fileType}
|
||||||
|
/>
|
||||||
|
{contractAttachmentFiles.length > 0 && (
|
||||||
|
<div className="mt-2 text-sm text-green-600">
|
||||||
|
<i className="ri-checkbox-circle-line"></i>
|
||||||
|
已选择附件: {contractAttachmentFiles.map((file, index) => (
|
||||||
|
<span key={index} className="font-medium">{file.name}</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* 测试文档标记 */}
|
{/* 测试文档标记 */}
|
||||||
<div className="switch-container mb-4">
|
<div className="switch-container mb-4">
|
||||||
@@ -1143,6 +1313,7 @@ export default function FilesUpload() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
)}
|
)}
|
||||||
|
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|||||||
@@ -575,7 +575,9 @@ export default function ReviewDetails() {
|
|||||||
activeTab={activeTab}
|
activeTab={activeTab}
|
||||||
onTabChange={handleTabChange}
|
onTabChange={handleTabChange}
|
||||||
fileInfo={{
|
fileInfo={{
|
||||||
previousRoute: loaderData.previousRoute
|
previousRoute: loaderData.previousRoute,
|
||||||
|
path: document?.path,
|
||||||
|
auditStatus: document?.auditStatus
|
||||||
}}
|
}}
|
||||||
onConfirmResults={handleConfirmResults}
|
onConfirmResults={handleConfirmResults}
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user