Commit 8391898b266b2cc02bbe9d9c94b36bddb9d3b73e
1 parent
76d31061
fix(前端 ImageUpload 组件):
- 前端 ImageUpload 组件, 上传路径以及地址拼接 - 基础设施-文件上传, 新增简单上传接口
Showing
3 changed files
with
41 additions
and
6 deletions
yudao-module-infra/yudao-module-infra-biz/src/main/java/cn/iocoder/yudao/module/infra/controller/admin/file/FileController.java
| 1 | 1 | package cn.iocoder.yudao.module.infra.controller.admin.file; |
| 2 | 2 | |
| 3 | +import cn.hutool.core.io.FileUtil; | |
| 3 | 4 | import cn.hutool.core.io.IoUtil; |
| 5 | +import cn.hutool.core.util.IdUtil; | |
| 4 | 6 | import cn.iocoder.yudao.framework.common.pojo.CommonResult; |
| 5 | 7 | import cn.iocoder.yudao.framework.common.pojo.PageResult; |
| 6 | 8 | import cn.iocoder.yudao.framework.common.util.servlet.ServletUtils; |
| 7 | 9 | import cn.iocoder.yudao.module.infra.controller.admin.file.vo.file.FilePageReqVO; |
| 8 | 10 | import cn.iocoder.yudao.module.infra.controller.admin.file.vo.file.FileRespVO; |
| 11 | +import cn.iocoder.yudao.module.infra.controller.admin.file.vo.file.SimpleUploadRespVO; | |
| 9 | 12 | import cn.iocoder.yudao.module.infra.convert.file.FileConvert; |
| 10 | 13 | import cn.iocoder.yudao.module.infra.dal.dataobject.file.FileDO; |
| 11 | 14 | import cn.iocoder.yudao.module.infra.service.file.FileService; |
| ... | ... | @@ -47,6 +50,21 @@ public class FileController { |
| 47 | 50 | return success(fileService.createFile(path, IoUtil.readBytes(file.getInputStream()))); |
| 48 | 51 | } |
| 49 | 52 | |
| 53 | + @PostMapping("/simple-upload") | |
| 54 | + @ApiOperation("简单上传文件") | |
| 55 | + @ApiImplicitParams({ | |
| 56 | + @ApiImplicitParam(name = "file", value = "文件附件", required = true, dataTypeClass = MultipartFile.class), | |
| 57 | + }) | |
| 58 | + public CommonResult<SimpleUploadRespVO> uploadFile(@RequestParam("file") MultipartFile file) throws Exception { | |
| 59 | + SimpleUploadRespVO simpleUploadRespVO = new SimpleUploadRespVO(); | |
| 60 | + simpleUploadRespVO.setFileName(file.getOriginalFilename()); | |
| 61 | + // TODO 日期路径, 随机文件名 | |
| 62 | + String path = IdUtil.fastSimpleUUID() + "." + FileUtil.extName(file.getOriginalFilename()); | |
| 63 | + String fileUrl = fileService.createFile(path, IoUtil.readBytes(file.getInputStream())); | |
| 64 | + simpleUploadRespVO.setFileUrl(fileUrl); | |
| 65 | + return success(simpleUploadRespVO); | |
| 66 | + } | |
| 67 | + | |
| 50 | 68 | @DeleteMapping("/delete") |
| 51 | 69 | @ApiOperation("删除文件") |
| 52 | 70 | @ApiImplicitParam(name = "id", value = "编号", required = true, dataTypeClass = Long.class) | ... | ... |
yudao-module-infra/yudao-module-infra-biz/src/main/java/cn/iocoder/yudao/module/infra/controller/admin/file/vo/file/SimpleUploadRespVO.java
0 → 100644
| 1 | +package cn.iocoder.yudao.module.infra.controller.admin.file.vo.file; | |
| 2 | + | |
| 3 | +import io.swagger.annotations.ApiModel; | |
| 4 | +import io.swagger.annotations.ApiModelProperty; | |
| 5 | +import lombok.Data; | |
| 6 | + | |
| 7 | +@Data | |
| 8 | +@ApiModel(value = "管理后台 - 简单上传文件 VO", description = "简单上传文件, 不需要 path") | |
| 9 | +public class SimpleUploadRespVO { | |
| 10 | + | |
| 11 | + @ApiModelProperty(value = "文件名", required = true, example = "yudao.jpg") | |
| 12 | + private String fileName; | |
| 13 | + | |
| 14 | + @ApiModelProperty(value = "文件 URL", required = true, example = "https://www.iocoder.cn/yudao.jpg") | |
| 15 | + private String fileUrl; | |
| 16 | +} | ... | ... |
yudao-ui-admin/src/components/ImageUpload/index.vue
| ... | ... | @@ -43,7 +43,7 @@ |
| 43 | 43 | </template> |
| 44 | 44 | |
| 45 | 45 | <script> |
| 46 | -import { getToken } from "@/utils/auth"; | |
| 46 | +import {getToken} from "@/utils/auth"; | |
| 47 | 47 | |
| 48 | 48 | export default { |
| 49 | 49 | props: { |
| ... | ... | @@ -77,7 +77,7 @@ export default { |
| 77 | 77 | dialogVisible: false, |
| 78 | 78 | hideUpload: false, |
| 79 | 79 | baseUrl: process.env.VUE_APP_BASE_API, |
| 80 | - uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 | |
| 80 | + uploadImgUrl: process.env.VUE_APP_BASE_API + "/admin-api/infra/file/simple-upload", // 上传的图片服务器地址 | |
| 81 | 81 | headers: { |
| 82 | 82 | Authorization: "Bearer " + getToken(), |
| 83 | 83 | }, |
| ... | ... | @@ -93,10 +93,11 @@ export default { |
| 93 | 93 | // 然后将数组转为对象数组 |
| 94 | 94 | this.fileList = list.map(item => { |
| 95 | 95 | if (typeof item === "string") { |
| 96 | - if (item.indexOf(this.baseUrl) === -1) { | |
| 97 | - item = { name: this.baseUrl + item, url: this.baseUrl + item }; | |
| 96 | + // 不带有 http 的路径, 才拼接 baseUrl. | |
| 97 | + if (item.indexOf("http") === -1) { | |
| 98 | + item = {name: this.baseUrl + item, url: this.baseUrl + item}; | |
| 98 | 99 | } else { |
| 99 | - item = { name: item, url: item }; | |
| 100 | + item = {name: item, url: item}; | |
| 100 | 101 | } |
| 101 | 102 | } |
| 102 | 103 | return item; |
| ... | ... | @@ -127,7 +128,7 @@ export default { |
| 127 | 128 | }, |
| 128 | 129 | // 上传成功回调 |
| 129 | 130 | handleUploadSuccess(res) { |
| 130 | - this.uploadList.push({ name: res.fileName, url: res.fileName }); | |
| 131 | + this.uploadList.push({name: res.data.fileName, url: res.data.fileUrl}); | |
| 131 | 132 | if (this.uploadList.length === this.number) { |
| 132 | 133 | this.fileList = this.fileList.concat(this.uploadList); |
| 133 | 134 | this.uploadList = []; | ... | ... |