diff --git a/src/views/restaurant/images/index.vue b/src/views/restaurant/images/index.vue index 2b2df14..48fb319 100644 --- a/src/views/restaurant/images/index.vue +++ b/src/views/restaurant/images/index.vue @@ -86,10 +86,13 @@ :on-preview="handlePreview" :on-remove="handleRemove" :on-success="handleSuccess" + :on-error="handleError" :before-upload="beforeUpload" :file-list="fileList" :data="form" + :limit="1" list-type="picture" + accept=".jpg,.jpeg,.png" > 点击上传
只能上传jpg/png文件,且不超过2MB
@@ -145,7 +148,7 @@ export default { // 上传参数 upload: { // 上传地址 - url: process.env.VUE_APP_BASE_API + "/restaurant/images/upload", + url: process.env.VUE_APP_BASE_API + "/restaurant/images/uploadDispatchings", // 设置上传的请求头部 headers: { Authorization: "Bearer " + getToken() } }, @@ -218,27 +221,34 @@ export default { }, /** 文件上传成功处理 */ handleSuccess(response, file, fileList) { + console.log('上传响应:', response); + console.log('上传文件:', file); + console.log('文件列表:', fileList); + if (response.code === 200) { - this.form.imageUrl = response.data; + this.form.imageUrl = response.data || response.url; this.$modal.msgSuccess("上传成功"); - this.getList(); - this.open = false; + this.fileList = fileList; } else { this.$modal.msgError(response.msg || "上传失败"); + // 从文件列表中移除失败的文件 + this.fileList = fileList.filter(item => item.uid !== file.uid); } }, /** 文件上传前的处理 */ beforeUpload(file) { const isJPG = file.type === 'image/jpeg' || file.type === 'image/png'; - const isLt2M = file.size / 1024 / 1024 < 2; + const isLt2M = file.size / 1024 / 1024 < 3; if (!isJPG) { this.$message.error('上传图片只能是 JPG/PNG 格式!'); + return false; } if (!isLt2M) { - this.$message.error('上传图片大小不能超过 2MB!'); + this.$message.error('上传图片大小不能超过 3MB!'); + return false; } - return isJPG && isLt2M; + return true; }, /** 文件列表移除时的钩子 */ handleRemove(file, fileList) { @@ -256,23 +266,29 @@ export default { this.$modal.msgError("请先上传图片"); return; } - if (this.form.id) { - // 更新操作 - uploadDispatchingFile(this.form).then(response => { - this.$modal.msgSuccess("修改成功"); + + // 使用正确的API接口 + uploadDispatchingFile(this.form).then(response => { + if (response.code === 200) { + this.$modal.msgSuccess(this.form.id ? "修改成功" : "新增成功"); this.open = false; this.getList(); - }); - } else { - // 新增操作 - uploadDispatchingFile(this.form).then(response => { - this.$modal.msgSuccess("新增成功"); - this.open = false; - this.getList(); - }); - } + } else { + this.$modal.msgError(response.msg || "操作失败"); + } + }).catch(error => { + console.error('提交失败:', error); + this.$modal.msgError("操作失败,请重试"); + }); } }); + }, + /** 文件上传错误处理 */ + handleError(error, file) { + console.error('上传错误:', error); + this.$modal.msgError("上传失败,请重试"); + // 从文件列表中移除失败的文件 + this.fileList = this.fileList.filter(item => item.uid !== file.uid); } } };