ccdi/doc/design/2026-03-05-async-file-upload-frontend-design-update.md

异步文件上传功能 - 前端设计更新

文档信息

• 更新日期: 2026-03-05
• 版本: v1.1
• 变更说明: 修改文件格式限制

变更内容

文件格式限制变更

原限制：

• 仅支持 Excel 文件（.xlsx, .xls）

新限制：

• 支持 PDF 文件（.pdf）
• 支持 CSV 文件（.csv）
• 支持 Excel 文件（.xlsx, .xls）

修改点

1. 前端校验逻辑

// 修改前
const validTypes = ['.xlsx', '.xls'];

// 修改后
const validTypes = ['.pdf', '.csv', '.xlsx', '.xls'];

2. 错误提示

修改前: "仅支持 .xlsx, .xls 格式文件"
修改后: "仅支持 PDF、CSV、Excel 格式文件"

3. 上传卡片描述

修改前: "支持 Excel、PDF 格式文件上传"
修改后: "支持 PDF、CSV、Excel 格式文件上传"

4. 批量上传弹窗提示

修改前: "支持 .xlsx, .xls 格式文件，最多上传100个文件"
修改后: "支持 PDF、CSV、Excel 格式文件，最多100个文件，单个文件不超过50MB"

5. accept属性

<!-- 新增 -->
<el-upload accept=".pdf,.csv,.xlsx,.xls" ...>

后端接口变更要求

后端Controller接口需要同步修改文件格式校验逻辑：

// CcdiFileUploadController.java
// 修改文件格式校验部分

// 修改前
if (!fileName.endsWith(".xlsx") && !fileName.endsWith(".xls")) {
    return AjaxResult.error("文件 " + fileName + " 格式不支持，仅支持Excel文件");
}

// 修改后
String lowerFileName = fileName.toLowerCase();
if (!lowerFileName.endsWith(".pdf") && !lowerFileName.endsWith(".csv") 
    && !lowerFileName.endsWith(".xlsx") && !lowerFileName.endsWith(".xls")) {
    return AjaxResult.error("文件 " + fileName + " 格式不支持，仅支持PDF、CSV、Excel文件");
}

测试变更

测试文件格式

需要测试以下格式：

• ✅ PDF 文件
• ✅ CSV 文件
• ✅ XLSX 文件
• ✅ XLS 文件
• ❌ 其他格式（应被拒绝）

测试用例

1. 上传PDF文件 → 应成功
2. 上传CSV文件 → 应成功
3. 上传XLSX文件 → 应成功
4. 上传XLS文件 → 应成功
5. 上传TXT文件 → 应提示"格式不支持"
6. 上传DOC文件 → 应提示"格式不支持"

---

文档结束