我已经成功将客户管理模块的照片上传功能统一改造为使用 UnifiedAttachmentUpload 组件。以下是完成的修改:

📋 修改清单

  1. 前端修改

    ✓ 客户表单组件 (ui/src/views/business/customer/components/customer-form.vue:66-77)

  • 已经使用了 UnifiedAttachmentUpload 组件

  • 支持 v-model 双向绑定 customerPhotoUrl

  • 支持 v-model:keys 双向绑定 customerPhotoKeys

  • 配置:最多5张照片,单个文件最大10MB

    ✓ 客户列表页面 (ui/src/views/business/customer/index.vue:845-872)

  • 优化了照片URL解析函数 getFirstPhotoUrl() 和 getPhotoUrlList()

  • 兼容字符串(逗号分隔)和数组两种格式

  • 正确处理多个照片URL的展示和预览

  1. 后端修改

    ✓ 实体类 (src/main/java/com/husky/business/domain/BzCustomer.java:93-119)

  • 已包含 customerPhotoUrl 字段(支持多个照片,逗号分隔)

  • 已包含 customerPhotoKeys 字段(OSS永久引用Key,逗号分隔)

  • 配置了 Excel 导出注解

    ✓ MyBatis Mapper (src/main/resources/mapper/business/BzCustomerMapper.xml)

  • ✅ 添加了 customer_photo_keys 字段映射(第27行)

  • ✅ 更新了 SELECT 语句包含 customer_photo_keys(第36行)

  • ✅ 更新了 INSERT 语句支持 customer_photo_keys(第108行)

  • ✅ 更新了 UPDATE 语句支持 customer_photo_keys(第166行)

  1. 数据库修改

    ✓ 迁移SQL脚本 (db/update_customer_photo_fields.sql)

  • 已存在完整的数据库迁移脚本

  • 添加 customer_photo_keys 字段(VARCHAR(1000))

  • 扩展 customer_photo_url 字段长度为 1000

    🎯 核心功能

  1. 照片上传 - 使用统一的 UnifiedAttachmentUpload 组件

  2. 双向绑定 - 同时保存 URL 和 Key,支持 OSS 永久引用

  3. 多照片支持 - 最多支持5张照片,逗号分隔存储

  4. 预览功能 - 列表页悬停预览,详情页完整展示

  5. 数据兼容 - 兼容字符串和数组两种数据格式

    📝 使用说明

    表单组件中的配置:

    ⚠️ 注意事项

  6. 数据库迁移 - 需要执行 db/update_customer_photo_fields.sql 脚本

  7. 字段长度 - 确保数据库字段长度足够(VARCHAR(1000))

  8. 数据格式 - 支持逗号分隔的字符串格式

  9. OSS配置 - 确保文件上传接口 /business/file/upload 正常工作

    🚀 下一步操作

  10. 执行数据库迁移SQL脚本

  11. 重启后端服务

  12. 测试照片上传、预览、编辑功能

  13. 验证数据保存是否包含 customer_photo_keys 字段

    所有修改已完成!系统现在已统一使用 UnifiedAttachmentUpload 组件进行客户照片管理。

作者:聂盼盼  创建时间:2025-10-16 10:47
最后编辑:聂盼盼  更新时间:2025-10-28 19:53