|
@@ -1,20 +1,23 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div>
|
|
<div>
|
|
|
- <a-upload-dragger
|
|
|
|
|
- :file-list="fileList"
|
|
|
|
|
- :before-upload="beforeUpload"
|
|
|
|
|
- @change="handleChange"
|
|
|
|
|
- :show-upload-list="false"
|
|
|
|
|
- :customRequest="customRequest"
|
|
|
|
|
- :multiple="false"
|
|
|
|
|
- :drag="true"
|
|
|
|
|
- :progress="progress"
|
|
|
|
|
- >
|
|
|
|
|
- <div style="padding: 40px; text-align: center">
|
|
|
|
|
- <span class="text"> 点击上传或将文件拖拽至此区域上传 </span>
|
|
|
|
|
- <p class="text">按住Ctrl可同时多选,支持上传PPT/excel/pdf/mp4/zip/rar,等单个文件不能超过2G</p>
|
|
|
|
|
- </div>
|
|
|
|
|
- </a-upload-dragger>
|
|
|
|
|
|
|
+ <a-spin :spinning="spinning" tip="读取中...">
|
|
|
|
|
+ <a-upload-dragger
|
|
|
|
|
+ :file-list="fileList"
|
|
|
|
|
+ :before-upload="beforeUpload"
|
|
|
|
|
+ @change="handleChange"
|
|
|
|
|
+ :show-upload-list="false"
|
|
|
|
|
+ :customRequest="customRequest"
|
|
|
|
|
+ :multiple="false"
|
|
|
|
|
+ :drag="true"
|
|
|
|
|
+ :progress="progress"
|
|
|
|
|
+ >
|
|
|
|
|
+ <div style="padding: 40px; text-align: center">
|
|
|
|
|
+ <span class="text"> 点击上传或将文件拖拽至此区域上传 </span>
|
|
|
|
|
+ <p class="text">按住Ctrl可同时多选,支持上传PPT/excel/pdf/mp4/zip/rar,等单个文件不能超过2G</p>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </a-upload-dragger>
|
|
|
|
|
+ </a-spin>
|
|
|
|
|
+
|
|
|
|
|
|
|
|
<!-- <div style="margin-bottom: 20px">
|
|
<!-- <div style="margin-bottom: 20px">
|
|
|
<a-button v-if="uploadFileList.length > 0" type="primary" @click="uploadFilesList">上传</a-button>
|
|
<a-button v-if="uploadFileList.length > 0" type="primary" @click="uploadFilesList">上传</a-button>
|
|
@@ -31,6 +34,11 @@
|
|
|
</div>
|
|
</div>
|
|
|
<div>
|
|
<div>
|
|
|
<div>
|
|
<div>
|
|
|
|
|
+ <span
|
|
|
|
|
+ v-if="item.percents == 0"
|
|
|
|
|
+ style="color: red; cursor: pointer; margin-left: 10px"
|
|
|
|
|
+ >读取中</span
|
|
|
|
|
+ >
|
|
|
<span
|
|
<span
|
|
|
v-if="item.percents == 0 || item.percents == 100"
|
|
v-if="item.percents == 0 || item.percents == 100"
|
|
|
style="color: red; cursor: pointer; margin-left: 10px"
|
|
style="color: red; cursor: pointer; margin-left: 10px"
|
|
@@ -91,6 +99,7 @@
|
|
|
const uploadingTasks = ref({}) // 正在上传的任务 { md5: true }
|
|
const uploadingTasks = ref({}) // 正在上传的任务 { md5: true }
|
|
|
//当前选中的文件
|
|
//当前选中的文件
|
|
|
const currentFile = ref(null)
|
|
const currentFile = ref(null)
|
|
|
|
|
+ const spinning = ref(false)
|
|
|
const chunkSize = ref(5 * 1024 * 1024)
|
|
const chunkSize = ref(5 * 1024 * 1024)
|
|
|
|
|
|
|
|
const uploadedSize = ref(0) // 已上传文件大小(字节)
|
|
const uploadedSize = ref(0) // 已上传文件大小(字节)
|
|
@@ -639,8 +648,10 @@
|
|
|
}
|
|
}
|
|
|
const beforeUpload = async (file) => {
|
|
const beforeUpload = async (file) => {
|
|
|
console.log('选择了文件', file)
|
|
console.log('选择了文件', file)
|
|
|
|
|
+ spinning.value = true
|
|
|
if(uploadFileList.value.length >= props.uploadCount){
|
|
if(uploadFileList.value.length >= props.uploadCount){
|
|
|
message.error('超过上传条目' + props.uploadCount + "条")
|
|
message.error('超过上传条目' + props.uploadCount + "条")
|
|
|
|
|
+ spinning.value = false
|
|
|
return false
|
|
return false
|
|
|
}
|
|
}
|
|
|
let upFile = await handleFileChange({ raw: file })
|
|
let upFile = await handleFileChange({ raw: file })
|
|
@@ -649,8 +660,10 @@
|
|
|
const exists = uploadFileList.value.some((item) => item.md5 === upFile.md5)
|
|
const exists = uploadFileList.value.some((item) => item.md5 === upFile.md5)
|
|
|
if (exists) {
|
|
if (exists) {
|
|
|
message.warning('该文件已存在,不再重复添加')
|
|
message.warning('该文件已存在,不再重复添加')
|
|
|
|
|
+ spinning.value = false
|
|
|
return false
|
|
return false
|
|
|
}
|
|
}
|
|
|
|
|
+ spinning.value = false
|
|
|
await checkMd5List(upFile)
|
|
await checkMd5List(upFile)
|
|
|
uploadFileList.value.push(upFile)
|
|
uploadFileList.value.push(upFile)
|
|
|
emit('onSuccess', uploadFileList.value)
|
|
emit('onSuccess', uploadFileList.value)
|
|
@@ -664,6 +677,7 @@
|
|
|
message.warning('上传队列已满,将进入暂停状态')
|
|
message.warning('上传队列已满,将进入暂停状态')
|
|
|
}
|
|
}
|
|
|
await uploadSingleFile(upFile)
|
|
await uploadSingleFile(upFile)
|
|
|
|
|
+ spinning.value = false
|
|
|
return false // 阻止默认上传
|
|
return false // 阻止默认上传
|
|
|
}
|
|
}
|
|
|
const handleChange = (info) => {
|
|
const handleChange = (info) => {
|