From 6f11bae15c683f1c03295e53bd561b28fbf0269e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=8D=E5=81=9A=E7=A0=81=E5=86=9C?= <599854767@qq.com> Date: Thu, 9 Dec 2021 21:52:45 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=9B=BE=E7=89=87=E4=B8=8A?= =?UTF-8?q?=E4=BC=A0=E6=96=B0=E5=A2=9E=E5=8A=A0=E5=8F=AF=E4=BB=A5=E4=B8=8A?= =?UTF-8?q?=E4=BC=A0=E5=A4=9A=E5=BC=A0=E5=9B=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Controllers/CommonController.cs | 19 +++- .../wwwroot/CodeGenTemplate/TplVueApi.txt | 2 +- ZR.Service/System/IService/ISysFileService.cs | 8 +- ZR.Service/System/SysFileService.cs | 8 +- ZR.Vue/src/components/UploadImage/index.vue | 104 ++++++++++++++++-- ZR.Vue/src/views/tool/gen/editTable.vue | 2 +- 6 files changed, 117 insertions(+), 26 deletions(-) diff --git a/ZR.Admin.WebApi/Controllers/CommonController.cs b/ZR.Admin.WebApi/Controllers/CommonController.cs index d331494..aac986a 100644 --- a/ZR.Admin.WebApi/Controllers/CommonController.cs +++ b/ZR.Admin.WebApi/Controllers/CommonController.cs @@ -99,23 +99,28 @@ namespace ZR.Admin.WebApi.Controllers } string accessPath = $"{OptionsSetting.Upload.UploadUrl}/{FileUtil.GetdirPath("uploads").Replace("\\", " /")}{fileName}"; - return ToResponse(ResultCode.SUCCESS, accessPath); + return ToResponse(ResultCode.SUCCESS, new + { + url = accessPath, + fileName + }); } /// /// 存储文件到阿里云 /// /// + /// 上传文件夹路径 /// [HttpPost] [Verify] [ActionPermissionFilter(Permission = "system")] - public IActionResult UploadFileAliyun([FromForm(Name = "file")] IFormFile formFile) + public IActionResult UploadFileAliyun([FromForm(Name = "file")] IFormFile formFile, string fileDir = "") { if (formFile == null) throw new CustomException(ResultCode.PARAM_ERROR, "上传文件不能为空"); string fileExt = Path.GetExtension(formFile.FileName); string[] AllowedFileExtensions = new string[] { ".jpg", ".gif", ".png", ".jpeg", ".webp", ".svga", ".xls" }; - int MaxContentLength = 1024 * 1024 * 4; + int MaxContentLength = 1024 * 1024 * 5; if (!AllowedFileExtensions.Contains(fileExt)) { @@ -126,9 +131,13 @@ namespace ZR.Admin.WebApi.Controllers { return ToResponse(ResultCode.CUSTOM_ERROR, "上传文件过大，不能超过 " + (MaxContentLength / 1024).ToString() + " MB"); } - (bool, string) result = SysFileService.SaveFile("", formFile); + (bool, string, string) result = SysFileService.SaveFile(fileDir, formFile); - return ToResponse(ResultCode.SUCCESS, result.Item2); + return ToResponse(ResultCode.SUCCESS, new + { + url = result.Item2, + fileName = result.Item3 + }); } #endregion } diff --git a/ZR.Admin.WebApi/wwwroot/CodeGenTemplate/TplVueApi.txt b/ZR.Admin.WebApi/wwwroot/CodeGenTemplate/TplVueApi.txt index a69b283..b6c0fae 100644 --- a/ZR.Admin.WebApi/wwwroot/CodeGenTemplate/TplVueApi.txt +++ b/ZR.Admin.WebApi/wwwroot/CodeGenTemplate/TplVueApi.txt @@ -59,7 +59,7 @@ export function del${genTable.BusinessName}(pid) { } // 导出${genTable.functionName} -export function export${replaceDto.ModelTypeName}(query) { +export function export${genTable.BusinessName}(query) { return request({ url: '${genTable.ModuleName}/${replaceDto.ModelTypeName}/export', method: 'get', diff --git a/ZR.Service/System/IService/ISysFileService.cs b/ZR.Service/System/IService/ISysFileService.cs index ff1b047..c4dc983 100644 --- a/ZR.Service/System/IService/ISysFileService.cs +++ b/ZR.Service/System/IService/ISysFileService.cs @@ -5,7 +5,13 @@ namespace ZR.Service.System.IService { public interface ISysFileService { - (bool, string) SaveFile(string picdir, IFormFile formFile); + /// + /// 上传文件 + /// + /// + /// + /// 结果、地址、文件名 + (bool, string, string) SaveFile(string picdir, IFormFile formFile); /// /// 按时间来创建文件夹 diff --git a/ZR.Service/System/SysFileService.cs b/ZR.Service/System/SysFileService.cs index 7a78c8b..bab5cb3 100644 --- a/ZR.Service/System/SysFileService.cs +++ b/ZR.Service/System/SysFileService.cs @@ -25,7 +25,7 @@ namespace ZR.Service.System /// /// /// - public (bool, string) SaveFile(string picdir, IFormFile formFile) + public (bool, string, string) SaveFile(string picdir, IFormFile formFile) { // eg: idcard/2020/08/18 string dir = GetdirPath(picdir.ToString()); @@ -36,11 +36,7 @@ namespace ZR.Service.System HttpStatusCode statusCode = AliyunOssHelper.PutObjectFromFile(formFile.OpenReadStream(), Path.Combine(dir, fileName)); - if (statusCode == HttpStatusCode.OK) - { - return (true, webUrl); - } - return (false, ""); + return (statusCode == HttpStatusCode.OK, webUrl, fileName); } public string GetdirPath(string path = "") diff --git a/ZR.Vue/src/components/UploadImage/index.vue b/ZR.Vue/src/components/UploadImage/index.vue index a397ab0..72aafdb 100644 --- a/ZR.Vue/src/components/UploadImage/index.vue +++ b/ZR.Vue/src/components/UploadImage/index.vue @@ -1,10 +1,21 @@ @@ -14,6 +25,11 @@ import { getToken } from "@/utils/auth"; export default { props: { value: [String], + // 图片数量限制 + limit: { + type: Number, + default: 1, + }, column: [String], // 上传地址 uploadUrl: { @@ -32,14 +48,23 @@ export default { }, //显示手动输入地址 showInput: false, + // 是否显示提示 + isShowTip: { + type: Boolean, + default: true, + }, }, data() { return { + dialogImageUrl: "", + dialogVisible: false, + hideUpload: false, uploadImgUrl: process.env.VUE_APP_BASE_API + this.uploadUrl, // 上传的图片服务器地址 headers: { Authorization: "Bearer " + getToken(), }, imageUrl: "", + fileList: [], }; }, watch: { @@ -49,22 +74,49 @@ export default { deep: true, handler: function (val) { if (val) { - this.imageUrl = val; + // 首先将值转为数组 + const list = Array.isArray(val) ? val : this.value.split(","); + // 然后将数组转为对象数组 + this.fileList = list.map((item) => { + if (typeof item === "string") { + // if (item.indexOf(this.baseUrl) === -1) { + // item = { name: this.baseUrl + item, url: this.baseUrl + item }; + // } else { + item = { name: item, url: item }; + // } + } + return item; + }); } else { - this.imageUrl = ""; + this.fileList = []; + return []; } }, }, }, + computed: { + // 是否显示提示 + showTip() { + return this.isShowTip && (this.fileType || this.fileSize); + }, + }, methods: { + // 删除图片 + handleRemove(file, fileList) { + const findex = this.fileList.map((f) => f.name).indexOf(file.name); + if (findex > -1) { + this.fileList.splice(findex, 1); + this.$emit("input", this.column, this.listToString(this.fileList)); + } + }, + //上传成功回调 handleUploadSuccess(res) { - this.$emit(`input`, res, this.column); - this.imageUrl = res.data; + this.fileList.push({ name: res.data.fileName, url: res.data.url }); + this.$emit(`input`, this.column, this.listToString(this.fileList)); this.loading.close(); }, // 上传前loading加载 handleBeforeUpload(file) { - console.log(file); let isImg = false; if (this.fileType.length) { let fileExtension = ""; @@ -99,6 +151,24 @@ export default { background: "rgba(0, 0, 0, 0.7)", }); }, + // 文件个数超出 + handleExceed() { + this.$message.error(`上传文件数量不能超过 ${this.limit} 个!`); + }, + // 预览 + handlePictureCardPreview(file) { + this.dialogImageUrl = file.url; + this.dialogVisible = true; + }, + // 对象转成指定字符串分隔 + listToString(list, separator) { + let strs = ""; + separator = separator || ","; + for (let i in list) { + strs += list[i].url.replace(this.baseUrl, "") + separator; + } + return strs != '' ? strs.substr(0, strs.length - 1) : ''; + }, handleUploadError() { this.$message({ type: "error", @@ -111,8 +181,18 @@ export default { \ No newline at end of file diff --git a/ZR.Vue/src/views/tool/gen/editTable.vue b/ZR.Vue/src/views/tool/gen/editTable.vue index 663e7d6..56f9d1e 100644 --- a/ZR.Vue/src/views/tool/gen/editTable.vue +++ b/ZR.Vue/src/views/tool/gen/editTable.vue @@ -1,6 +1,6 @@