xiaoli/peixue-dev

Fork 0

xiaojiang dedaf98ea2 初始化项目：上传完整代码

2026-02-28 17:26:03 +08:00

4.9 KiB

Raw Permalink Blame History

个人资料功能开发完成总结

✅ 已完成的功能

1. 中文乱码修复

修复了源代码中的中文乱码问题
所有中文字符现在可以正常显示

2. 生日选择功能

实现了生日输入功能
支持 YYYY-MM-DD 格式
带格式验证

3. 头像上传功能

实现了图片选择（相册/相机）
实现了文件上传到服务器
上传成功后更新头像显示

4. 保存修改功能

调用后端 API 保存所有修改
保存成功后更新本地存储
自动返回上一页

5. 地区选择功能

暂时显示"功能开发中"提示
预留了接口

6. 实名认证功能

暂时显示"功能开发中"提示
预留了接口

📝 修改的文件

前端文件：

peidu/uniapp/src/user-package/pages/user/profile.vue

修改内容：

修复了所有中文乱码
实现了生日选择功能
实现了头像上传功能
完善了保存功能
添加了 request 导入

🔧 后端需要添加的接口

头像上传接口

文件：peidu/backend/src/main/java/com/peidu/controller/UserController.java

需要添加：

@ApiOperation("上传头像")
@PostMapping("/upload-avatar")
public Result<String> uploadAvatar(@CurrentUser Long userId,
                                   @RequestParam("file") MultipartFile file) {
    try {
        // 1. 验证文件类型
        if (file.isEmpty()) {
            return Result.error("文件不能为空");
        }
        
        String contentType = file.getContentType();
        if (!contentType.startsWith("image/")) {
            return Result.error("只能上传图片文件");
        }
        
        // 2. 验证文件大小（5MB）
        if (file.getSize() > 5 * 1024 * 1024) {
            return Result.error("文件大小不能超过5MB");
        }
        
        // 3. 生成文件名
        String originalFilename = file.getOriginalFilename();
        String extension = originalFilename.substring(originalFilename.lastIndexOf("."));
        String filename = "avatar_" + userId + "_" + System.currentTimeMillis() + extension;
        
        // 4. 保存文件（需要配置文件存储路径）
        String uploadDir = "/path/to/upload/avatar/";
        File dir = new File(uploadDir);
        if (!dir.exists()) {
            dir.mkdirs();
        }
        
        File destFile = new File(uploadDir + filename);
        file.transferTo(destFile);
        
        // 5. 生成访问URL
        String fileUrl = "/uploads/avatar/" + filename;
        
        // 6. 更新用户头像
        User user = new User();
        user.setId(userId);
        user.setAvatar(fileUrl);
        userService.updateById(user);
        
        return Result.success(fileUrl);
    } catch (Exception e) {
        log.error("上传头像失败", e);
        return Result.error("上传失败：" + e.getMessage());
    }
}

🚀 测试步骤

1. 重新编译前端

前端已经在运行，会自动重新编译。

2. 添加后端头像上传接口

在 UserController.java 中添加上面的代码。

3. 重启后端

cd peidu/backend
# 停止当前服务（Ctrl+C）
mvn spring-boot:run

4. 测试功能

测试生日选择：
- 点击"生日"行
- 输入日期（如：2000-01-01）
- 点击"保存修改"
- 检查是否保存成功
测试头像上传：
- 点击头像
- 选择图片
- 等待上传完成
- 点击"保存修改"
- 检查头像是否更新
测试昵称修改：
- 点击"昵称"行
- 输入新昵称
- 点击"保存修改"
- 检查是否保存成功
测试性别选择：
- 点击"性别"行
- 选择男/女
- 点击"保存修改"
- 检查是否保存成功

⚠️ 注意事项

头像上传URL：
- 当前代码中使用的是 http://192.168.1.50:8080
- 需要根据实际后端地址修改
文件存储：
- 后端需要配置文件存储路径
- 可以使用本地存储或OSS（阿里云、腾讯云等）
生日选择器：
- 当前使用简单的输入框
- 可以后续优化为日期选择器组件
地区选择：
- 需要省市区数据
- 可以使用第三方组件或自己实现
实名认证：
- 需要对接第三方实名认证API
- 需要上传身份证照片

📋 后续优化建议

生日选择器优化：
- 使用 picker 组件实现更友好的日期选择
- 支持滚动选择年月日
地区选择实现：
- 实现省市区三级联动
- 或使用 uni-app 的 uni.chooseLocation
头像裁剪：
- 添加图片裁剪功能
- 支持缩放和旋转
实名认证：
- 实现身份证上传
- 对接实名认证API
表单验证：
- 添加更完善的表单验证
- 如昵称长度、格式等

📅 完成时间

2026-01-28

👤 开发人员

Kiro AI Assistant

4.9 KiB Raw Permalink Blame History Unescape Escape