# 商务数据库文件预览功能说明 ## 功能概述 商务数据库信息模块的文件预览功能已经实现,支持多种文件类型的在线预览,为用户提供便捷的文件查看体验。 ## 支持的文件类型 ### 1. 图片文件 - **支持格式**: JPG, JPEG, PNG, GIF, BMP, WebP - **预览方式**: 在模态窗口中直接显示图片 - **特性**: - 自适应大小,最大高度为70vh - 圆角和阴影效果提升视觉体验 - 显示文件名信息 ### 2. PDF文件 - **支持格式**: PDF - **预览方式**: 在新窗口中打开PDF文件 - **特性**: 利用浏览器原生PDF查看器 ### 3. 文本文件 - **支持格式**: TXT, MD, JSON, XML, CSV - **预览方式**: 在模态窗口中显示文本内容 - **特性**: - 等宽字体显示,保持格式 - 400px高度的滚动区域 - 保留原文本格式和换行 ### 4. Office文档 - **支持格式**: DOC, DOCX, XLS, XLSX, PPT, PPTX - **预览方式**: 提示用户下载查看 - **说明**: 由于Office文档需要特殊渲染,建议下载后使用相应软件打开 ### 5. 其他文件类型 - **处理方式**: 询问用户是否下载查看 - **说明**: 对于不支持在线预览的文件类型,系统会友好提示用户 ## 功能特性 ### 用户体验优化 1. **加载提示**: 预览过程中显示"正在加载预览..."提示 2. **错误处理**: 针对不同错误状态提供详细的错误信息 3. **资源管理**: 自动清理预览使用的内存资源 ### 错误处理机制 - **404错误**: "文件不存在或已被删除" - **403错误**: "没有权限访问该文件" - **500错误**: "服务器内部错误,请稍后重试" - **网络错误**: "预览文件失败,请检查网络连接" ### 安全性 - 使用Blob URL进行文件预览,确保安全性 - 10秒后自动释放URL资源,防止内存泄漏 ## 使用方法 1. 在文件列表中找到要预览的文件 2. 点击文件行中的"眼睛"图标按钮 3. 系统会根据文件类型自动选择合适的预览方式 4. 对于不支持的文件类型,系统会提供下载选项 ## 技术实现 ### API接口 - **接口地址**: `/businessData/file/preview` - **请求方式**: GET - **参数**: `fileId` (必需) - **响应类型**: Blob ### 核心函数 - `handlePreview(file)`: 主预览函数 - `showImagePreview(url, fileName)`: 图片预览组件 - `showTextPreview(blob, fileName)`: 文本预览组件 ## 注意事项 1. **文件大小限制**: 大文件可能需要较长加载时间 2. **浏览器兼容性**: 确保浏览器支持Blob和URL.createObjectURL 3. **网络要求**: 稳定的网络连接确保预览效果 4. **权限控制**: 需要有相应的文件访问权限 ## 后续优化建议 1. 添加文件预览缓存机制 2. 支持更多文件格式的在线预览 3. 添加图片预览的缩放和旋转功能 4. 支持文档的分页预览功能