处理文件上传的逻辑,修复上传为空的问题

This commit is contained in:
renpy 2023-08-30 13:46:45 +08:00
parent 74557d5fdb
commit 720ba0553c

View File

@ -78,6 +78,7 @@
<script>
import JSZip from 'jszip'
import FileSaver from 'file-saver'
import PhdSelect from '../PHDSelect.vue'
import { getAction,postAction } from '../../../../api/manage'
const columns = [
@ -232,11 +233,24 @@ export default {
beforeUpload(file,fileList) {
this.fileList = fileList
},
async handleUpload({ file }) {
handleUpload({ file }) {
this.uploading = true
this.fileNum += 1
if (this.fileNum == this.fileList.length) {
await this.zipFile(this.fileList, (added) => { }).then(content => {
this.zipFile(this.fileList)
}
},
async zipFile(fileList, onProgress) {
const zip = new JSZip()
const promises=[]
fileList.forEach(file => {
promises.push(this.readAsArrayBuffer(file))
})
Promise.all(promises).then(result => {
result.forEach(res => {
zip.file(res.fileName, res.data)
})
zip.generateAsync({ type: 'blob' }).then(content => {
let file = new File([content], 'test.zip', { type: content.type })
const formData = new FormData()
formData.append("file",file)
@ -244,37 +258,24 @@ export default {
this.uploading = false
this.fileNum = 0
if (res.success) {
console.log(res);
this.$message.success(res.message)
} else {
this.$message.warning(res.message)
}
})
})
}
},
async zipFile(fileList, onProgress) {
const zip = new JSZip()
let i = 0
for await (let f of fileList) {
const fileData = await this.readAsArrayBuffer(f)
console.log(f.webkitRelativePath);
zip.file(f.webkitRelativePath, fileData, { createFolders: true })
i++
onProgress && onProgress(i)
}
return zip.generateAsync({ type: 'blob' })
})
},
async readAsArrayBuffer(file){
return new Promise((resolve, reject) => {
return new Promise((resolve) => {
let reader = new FileReader()
reader.readAsArrayBuffer(file)
reader.onload = () => {
resolve(reader.result)
}
reader.onloadend = () => {
reject('FileReader failed')
reader.onload = (e) => {
resolve({
fileName: file.name,
data: e.target.result
})
}
})
},