# 设备维修单页面增加附件、富文本功能 ## 功能说明 为设备维修单添加富文本编辑和附件上传功能,支持以下内容: 1. 在维修单主表增加富文本编辑器,用于详细描述维修内容(维修描述) 2. 在维修单明细中增加富文本编辑器,用于详细描述每项维修说明 3. 支持上传附件到维修单(通过附件管理按钮) 4. 支持查看、下载和删除已上传的附件 5. 富文本编辑器支持插入图片(自动上传到服务器) ## 数据库变更 ### 新增表 1. `dm_repair_order_attachment` - 维修单附件表 | 字段名 | 类型 | 说明 | |--------|------|------| | id | bigint | 主键ID | | repair_order_id | bigint | 维修单ID | | entry_id | bigint | 明细ID(可为空,表示主单附件) | | file_name | varchar(255) | 文件名称 | | file_path | varchar(1000) | 文件路径(格式:/profile/upload/yyyy/MM/dd/xxx.jpg) | | file_size | bigint | 文件大小(字节) | | file_type | varchar(100) | 文件类型 | | create_by | varchar(32) | 创建人 | | create_time | datetime | 创建时间 | | update_by | varchar(32) | 更新人 | | update_time | datetime | 更新时间 | | status | char(1) | 状态(0正常 1删除) | | remark | varchar(500) | 备注 | ### 表结构变更 1. `dm_repair_order` 主表新增字段: - `rich_text_content` longtext - 富文本内容/维修描述(位于remark字段之后) 2. `dm_repair_order_entry` 明细表新增字段: - `rich_text_content` longtext - 富文本内容/维修说明(位于fault_name字段之后) ## API 变更 ### 新增接口 1. `POST /equipment/repairOrder/attachment/upload` - 上传附件 - 参数:file(文件)、repairOrderId(维修单ID)、entryId(明细ID,可选) - 返回:附件信息 2. `GET /equipment/repairOrder/attachment/download/{id}` - 下载附件(匿名访问) 3. `GET /equipment/repairOrder/attachment/list/{repairOrderId}` - 获取附件列表 4. `DELETE /equipment/repairOrder/attachment/{ids}` - 删除附件 ### 修改接口 1. `POST /equipment/repairOrder` - 支持保存富文本内容和附件信息 2. `PUT /equipment/repairOrder` - 支持更新富文本内容 ## 前端修改 ### 主表单 1. 新增"维修描述"字段,使用Editor富文本编辑器组件 ### 明细表格 1. 新增"维修说明"列,点击弹出富文本编辑对话框 2. 新增"附件管理"按钮,点击弹出附件管理对话框 ### 附件管理对话框 1. 支持上传附件(新增模式:临时存储,保存时一起提交;修改模式:直接上传到服务器) 2. 显示附件列表(文件名、大小、上传时间) 3. 支持下载和删除附件 ### 查看详情对话框 1. 显示主表维修描述(富文本渲染) 2. 明细列表中显示"维修说明"查看按钮 3. 显示附件列表,支持下载 ### Editor组件修复 1. 修复图片上传按钮点击无效的问题(v-if条件修复) 2. 兼容不同版本Element UI的文件选择触发方式 ## 约束条件 - 单个文件大小限制:50MB - 支持的文件类型:图片(jpg/png/gif)、文档(doc/docx/pdf/xls/xlsx)、压缩包(zip/rar) - 富文本图片大小限制:5MB ## 涉及文件 ### 后端 - `RepairOrder.java` - 主表实体,新增richTextContent和attachmentList字段 - `RepairOrderEntry.java` - 明细实体,新增richTextContent字段 - `RepairOrderAttachment.java` - 附件实体(新增) - `RepairOrderAttachmentMapper.java` - 附件Mapper接口(新增) - `RepairOrderAttachmentMapper.xml` - 附件Mapper XML(新增) - `IRepairOrderAttachmentService.java` - 附件Service接口(新增) - `RepairOrderAttachmentServiceImpl.java` - 附件Service实现(新增) - `RepairOrderController.java` - 新增附件上传/下载/删除接口 - `RepairOrderServiceImpl.java` - 新增时处理附件保存 - `RepairOrderMapper.xml` - 查询时映射richTextContent字段 ### 前端 - `repairOrder.js` - 新增getAttachmentList、deleteAttachment接口 - `index.vue` - 主页面,新增富文本编辑、附件管理、查看详情功能 - `Editor/index.vue` - 修复图片上传功能 ### SQL脚本 - `2025-12-05_v1.0.37_周启威_设备维修单增加附件、富文本.sql` ## 测试要点 1. 主表富文本编辑和保存功能 2. 明细富文本编辑和保存功能 3. 富文本中插入图片功能 4. 新增模式下附件上传和保存 5. 修改模式下附件上传和删除 6. 附件下载功能 7. 查看详情页面富文本和附件展示 8. 文件大小和类型校验