e4ec2bfe by renchao@pashanhoo.com

style:图片上传

1 parent fcf0c30a
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-07-28 14:59:55 4 * @LastEditTime: 2023-07-31 15:12:08
5 --> 5 -->
6 <template> 6 <template>
7 <div class="rlPopup"> 7 <div class="rlPopup">
...@@ -223,28 +223,20 @@ ...@@ -223,28 +223,20 @@
223 clickImage () { 223 clickImage () {
224 this.showViewer = true 224 this.showViewer = true
225 }, 225 },
226 // 上传
227 /** 226 /**
228 * @description: 上传 227 * @description: 上传
229 * @param {*} file 228 * @param {*} file
230 * @author: renchao 229 * @author: renchao
231 */ 230 */
232 beforeUpload (file) { 231 beforeUpload (file) {
233 const isJPEG = file.type === 'image/jpeg' 232 const isLt5M = file.size / 1024 / 1024 < 5;
234 const isPNG = file.type === 'image/png'
235 const isJPG = file.type === 'image/jpg'
236 const isGIF = file.type === 'image/gif'
237 const isLt5M = file.size / 1024 / 1024 < 5
238 if (!isJPEG && !isGIF && !isPNG && !isJPG && !isGIF) {
239 this.$message.error('请选择jpeg/png/jpg/bmp/gif格式的图片后重试')
240 this.loading = false
241 }
242 if (!isLt5M) { 233 if (!isLt5M) {
243 this.$message.error('上传图片大小不能超过 5MB!') 234 this.$message.error('上传图片大小不能超过 5MB!');
244 this.loading = false 235 return false;
245 } 236 }
246 this.imgHidden = (isJPG || isJPEG || isPNG || isGIF) && isLt5M 237
247 return this.imgHidden 238 // 所有条件满足时返回 true
239 return true;
248 }, 240 },
249 /** 241 /**
250 * @description: handleChange 242 * @description: handleChange
...@@ -253,17 +245,25 @@ ...@@ -253,17 +245,25 @@
253 * @author: renchao 245 * @author: renchao
254 */ 246 */
255 async handleChange (file, fileList) { 247 async handleChange (file, fileList) {
248 if (!this.beforeUpload(file)) return
256 let length = fileList.length; 249 let length = fileList.length;
257 this.maxFileLength = Math.max(length, this.maxFileLength) 250 this.maxFileLength = Math.max(length, this.maxFileLength)
258 console.log(fileList, this.maxFileLength, 'this.maxFileLength');
259 var formData = new FormData(); 251 var formData = new FormData();
252 let num = 0
260 setTimeout(() => { 253 setTimeout(() => {
261 if (this.maxFileLength !== length) { 254 if (this.maxFileLength !== length) {
262 return 255 return
263 } 256 }
264 fileList.forEach(item => { 257 fileList.forEach(item => {
258 if (!['image/jpeg', 'image/png', 'image/jpg', 'image/gif'].includes(item.raw.type)) {
259 num++
260 }
265 formData.append('file', item.raw) 261 formData.append('file', item.raw)
266 }) 262 })
263 if (num >= 1) {
264 this.$message.error("请选择jpeg/png/jpg/bmp/gif格式的图片后重试")
265 return
266 }
267 formData.append("bsmSj", this.previewImg.bsmSj); 267 formData.append("bsmSj", this.previewImg.bsmSj);
268 formData.append("bsmSlsq", this.previewImg.bsmSlsq); 268 formData.append("bsmSlsq", this.previewImg.bsmSlsq);
269 uploadBatch(formData).then((res) => { 269 uploadBatch(formData).then((res) => {
......