|
|
|
@ -653,48 +653,46 @@ export default { |
|
|
|
}, |
|
|
|
}, |
|
|
|
beforeAvatarUpload(index){ |
|
|
|
beforeAvatarUpload(index){ |
|
|
|
return (file) =>{ |
|
|
|
return (file) =>{ |
|
|
|
console.log('file------>',file) |
|
|
|
|
|
|
|
if(this.addForm[index].form.videoAttaches && this.addForm[index].form.picAttaches && this.addForm[index].form.videoAttaches.length + this.addForm[index].form.picAttaches.length < 3){ |
|
|
|
if(this.addForm[index].form.videoAttaches && this.addForm[index].form.picAttaches && this.addForm[index].form.videoAttaches.length + this.addForm[index].form.picAttaches.length < 3){ |
|
|
|
const isLt3M = file.size |
|
|
|
const isLt3M = file.size |
|
|
|
if(isLt3M > 1024 * 1024 * 5){ |
|
|
|
|
|
|
|
|
|
|
|
// if(isLt3M > 1024 * 1024 * 2){ |
|
|
|
// const r = confirm( |
|
|
|
// const r = confirm( |
|
|
|
// // `您上传的图片大小超过5Mb,是否进行压缩上传？(此操作会降低图片质量)` |
|
|
|
// // `您上传的图片大小超过5Mb,是否进行压缩上传？(此操作会降低图片质量)` |
|
|
|
// `您上传的图片大小超过5Mb,请压缩后再次上传` |
|
|
|
// `您上传的图片大小超过5Mb,请压缩后再次上传` |
|
|
|
// ) |
|
|
|
// ) |
|
|
|
// console.log('r=========>',r) |
|
|
|
|
|
|
|
// if(r){ |
|
|
|
// if(r){ |
|
|
|
// // const _this = this |
|
|
|
const _this = this |
|
|
|
// // return new Promise((resolve, reject) => { |
|
|
|
return new Promise((resolve, reject) => { |
|
|
|
// // const image = new Image() |
|
|
|
const image = new Image() |
|
|
|
// // let resultBlob = '' |
|
|
|
let resultBlob = '' |
|
|
|
// // image.src = URL.createObjectURL(file) |
|
|
|
image.src = URL.createObjectURL(file) |
|
|
|
// // image.onload = () => { |
|
|
|
image.onload = () => { |
|
|
|
// // // 调用方法获取blob格式，方法写在下边 |
|
|
|
// 调用方法获取blob格式，方法写在下边 |
|
|
|
// // resultBlob = _this.compressUpload(image, file) |
|
|
|
resultBlob = _this.compressUpload(image, file) |
|
|
|
// // const fs = new File([resultBlob], file.name, { |
|
|
|
const fs = new File([resultBlob], file.name, { |
|
|
|
// // type: file.type, |
|
|
|
type: file.type, |
|
|
|
// // width:200, |
|
|
|
width:200, |
|
|
|
// // height:200 |
|
|
|
height:200 |
|
|
|
// // }) |
|
|
|
}) |
|
|
|
// // console.log('fs============>',fs) |
|
|
|
if (fs.size > 1024 * 1024 * 3) { |
|
|
|
// // if (fs.size > 1024 * 1024 * 3) { |
|
|
|
// this.commonZipPic(fs) |
|
|
|
// // // this.commonZipPic(fs) |
|
|
|
this.$message.warning('压缩后图片仍大于3Mb，请您手动压缩') |
|
|
|
// // this.$message.warning('压缩后图片仍大于3Mb，请您手动压缩') |
|
|
|
reject() |
|
|
|
// // reject() |
|
|
|
} |
|
|
|
// // } |
|
|
|
resolve(fs) |
|
|
|
// // resolve(fs) |
|
|
|
} |
|
|
|
// // } |
|
|
|
image.onerror = () => { |
|
|
|
// // image.onerror = () => { |
|
|
|
reject() |
|
|
|
// // reject() |
|
|
|
} |
|
|
|
// // } |
|
|
|
}) |
|
|
|
// // }) |
|
|
|
|
|
|
|
// }else{ |
|
|
|
// }else{ |
|
|
|
this.$message.warning('您上传的图片大小超过5Mb,请手动压缩后在上传') |
|
|
|
// this.$message.warning('您上传的图片大小超过5Mb,请手动压缩后在上传') |
|
|
|
return false |
|
|
|
// return false |
|
|
|
// } |
|
|
|
// } |
|
|
|
}else{ |
|
|
|
// }else{ |
|
|
|
return true |
|
|
|
// return true |
|
|
|
} |
|
|
|
// } |
|
|
|
}else{ |
|
|
|
}else{ |
|
|
|
this.$message.error('故障视频与故障图片最多可上传3个') |
|
|
|
this.$message.error('故障视频与故障图片最多可上传3个') |
|
|
|
return false |
|
|
|
return false |
|
|
|
@ -706,17 +704,28 @@ export default { |
|
|
|
const canvas = document.createElement('canvas') |
|
|
|
const canvas = document.createElement('canvas') |
|
|
|
const ctx = canvas.getContext('2d') |
|
|
|
const ctx = canvas.getContext('2d') |
|
|
|
// const initSize = image.src.length |
|
|
|
// const initSize = image.src.length |
|
|
|
const { width } = image |
|
|
|
const width = image.width * 0.1 // 图片宽度 * 压缩比例 |
|
|
|
const { height } = image |
|
|
|
|
|
|
|
canvas.width = width |
|
|
|
const height = image.height * 0.1 // 图片高度 * 压缩比例 |
|
|
|
canvas.height = height |
|
|
|
|
|
|
|
|
|
|
|
canvas.width = width // 画布宽度 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
canvas.height = height // 画布宽度 |
|
|
|
|
|
|
|
// const { width } = image |
|
|
|
|
|
|
|
// const { height } = image |
|
|
|
|
|
|
|
// canvas.width = width |
|
|
|
|
|
|
|
// canvas.height = height |
|
|
|
ctx.fillRect(0, 0, canvas.width, canvas.height) |
|
|
|
ctx.fillRect(0, 0, canvas.width, canvas.height) |
|
|
|
ctx.drawImage(image, 0, 0, width / 10, height / 10) |
|
|
|
// ctx.drawImage(image, 0, 0, width / 10, height / 10) |
|
|
|
// 进行最小压缩0.1 |
|
|
|
ctx.drawImage(image, 0, 0, width, height) |
|
|
|
const compressData = canvas.toDataURL(file.type || 'image/jpeg', 0.1) |
|
|
|
const dataUrl = canvas.toDataURL(file.type) //图片转路径 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const blobData = this.dataURItoBlob(dataUrl, file.type) //图片转二进制 |
|
|
|
|
|
|
|
// // 进行最小压缩0.1 |
|
|
|
|
|
|
|
// const compressData = canvas.toDataURL(file.type || 'image/jpeg', 0.1) |
|
|
|
// 压缩后调用方法进行base64转Blob，方法写在下边 |
|
|
|
// 压缩后调用方法进行base64转Blob，方法写在下边 |
|
|
|
const blobImg = this.dataURItoBlob(compressData) |
|
|
|
// const blobImg = this.dataURItoBlob(blobData) |
|
|
|
return blobImg |
|
|
|
return blobData |
|
|
|
}, |
|
|
|
}, |
|
|
|
/* base64转Blob对象 */ |
|
|
|
/* base64转Blob对象 */ |
|
|
|
dataURItoBlob(data) { |
|
|
|
dataURItoBlob(data) { |
|
|
|
@ -735,7 +744,6 @@ export default { |
|
|
|
}, |
|
|
|
}, |
|
|
|
// 上传视频文件压缩后再上传 |
|
|
|
// 上传视频文件压缩后再上传 |
|
|
|
uploadCompressVideo(file) { |
|
|
|
uploadCompressVideo(file) { |
|
|
|
console.log('file===================>',file) |
|
|
|
|
|
|
|
if (file) { |
|
|
|
if (file) { |
|
|
|
let filename = file.name; |
|
|
|
let filename = file.name; |
|
|
|
let filetype = file.type; |
|
|
|
let filetype = file.type; |
|
|
|
@ -758,7 +766,7 @@ export default { |
|
|
|
this.fileList.push({ name: item.name, link: item.response ? item.response.data.link : item.url }) |
|
|
|
this.fileList.push({ name: item.name, link: item.response ? item.response.data.link : item.url }) |
|
|
|
this.imgList.push({ name: item.name, url: item.response ? item.response.data.link : item.url }) |
|
|
|
this.imgList.push({ name: item.name, url: item.response ? item.response.data.link : item.url }) |
|
|
|
}) |
|
|
|
}) |
|
|
|
this.addForm[index].form.picAttaches = fileList |
|
|
|
this.addForm[index].form.picAttaches = this.fileList |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
changeDescribe(event, index) { |
|
|
|
changeDescribe(event, index) { |
|
|
|
|
