feat: 🚀 flx:修复bug
This commit is contained in:
parent
58f7d41023
commit
607c699ca3
@ -30,14 +30,20 @@
|
|||||||
<section class="upload-area">
|
<section class="upload-area">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<p v-if="!fileList.length">
|
<p v-if="!fileList.length">
|
||||||
<el-icon class="info"><InfoFilled /></el-icon>
|
<el-icon class="info">
|
||||||
|
<InfoFilled />
|
||||||
|
</el-icon>
|
||||||
<span>温馨提示:将文件添加到上传队列, 然后点击“开始上传”按钮。</span>
|
<span>温馨提示:将文件添加到上传队列, 然后点击“开始上传”按钮。</span>
|
||||||
</p>
|
</p>
|
||||||
<p v-if="isOverflow">
|
<p v-if="isOverflow">
|
||||||
<el-icon class="error"><WarningFilled /></el-icon>
|
<el-icon class="error">
|
||||||
|
<WarningFilled />
|
||||||
|
</el-icon>
|
||||||
<span>文件大小错误: 文件大小不超过 {{ calculateFileSize(maxTotalFileSize!) }}</span>
|
<span>文件大小错误: 文件大小不超过 {{ calculateFileSize(maxTotalFileSize!) }}</span>
|
||||||
</p>
|
</p>
|
||||||
<el-icon class="close" @click.capture="close"><Close /></el-icon>
|
<el-icon class="close" @click.capture="close">
|
||||||
|
<Close />
|
||||||
|
</el-icon>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="upload-list">
|
<div class="upload-list">
|
||||||
@ -55,9 +61,16 @@
|
|||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
{{ /* TODO: 只是为了触发视图更新, 因为 File 对象无法被 vue 托管 */ __JUST_UPDATE_VIEW ? "" : "" }}
|
{{ /* TODO: 只是为了触发视图更新, 因为 File 对象无法被 vue 托管 */ __JUST_UPDATE_VIEW ? "" : "" }}
|
||||||
|
|
||||||
<el-icon v-if="row.response" class="success"><CircleCheckFilled /></el-icon>
|
<el-icon v-if="row.response" class="success">
|
||||||
<el-icon v-else-if="row.uploading" class="uploading"> <Upload /></el-icon>
|
<CircleCheckFilled />
|
||||||
<el-icon v-else class="remove" @click.capture="remove(row)"><RemoveFilled /></el-icon>
|
</el-icon>
|
||||||
|
<el-icon v-else-if="row.uploading" class="uploading">
|
||||||
|
<Upload />
|
||||||
|
</el-icon>
|
||||||
|
<el-icon class="remove" @click.capture="remove(row, 1)">
|
||||||
|
<RemoveFilled />
|
||||||
|
</el-icon>
|
||||||
|
<!-- v-else -->
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
@ -73,9 +86,15 @@
|
|||||||
<p>{{ calculateFileSize(file.size) }}</p>
|
<p>{{ calculateFileSize(file.size) }}</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-icon v-if="file.response" class="success"><CircleCheckFilled /></el-icon>
|
<el-icon v-if="file.response" class="success">
|
||||||
<el-icon v-else-if="file.uploading" class="uploading"> <Upload /></el-icon>
|
<CircleCheckFilled />
|
||||||
<el-icon v-else class="remove" @click.capture="remove(file)"><RemoveFilled /></el-icon>
|
</el-icon>
|
||||||
|
<el-icon v-else-if="file.uploading" class="uploading">
|
||||||
|
<Upload />
|
||||||
|
</el-icon>
|
||||||
|
<el-icon v-else class="remove" @click.capture="remove(file)">
|
||||||
|
<RemoveFilled />
|
||||||
|
</el-icon>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -84,7 +103,12 @@
|
|||||||
<div class="file-info">
|
<div class="file-info">
|
||||||
<span class="size">{{ !fileList.length ? "未选择" : calculateFileSize(totalFileSize) }}</span>
|
<span class="size">{{ !fileList.length ? "未选择" : calculateFileSize(totalFileSize) }}</span>
|
||||||
|
|
||||||
<div class="progress" :style="{ '--progress': `${parseInt((progress / currentTask) * 100 + '')}%` }"></div>
|
<div
|
||||||
|
class="progress"
|
||||||
|
:style="{
|
||||||
|
'--progress': `${parseInt((progress / currentTask) * 100 + '')}%`
|
||||||
|
}"
|
||||||
|
></div>
|
||||||
|
|
||||||
<!-- <span class="uploaded" :class="{ active: isUploading }">{{ `已上传 ${completeCount}/${currentTask} 个文件` }}</span> -->
|
<!-- <span class="uploaded" :class="{ active: isUploading }">{{ `已上传 ${completeCount}/${currentTask} 个文件` }}</span> -->
|
||||||
</div>
|
</div>
|
||||||
@ -305,11 +329,18 @@ const selectFile = (e: Event) => {
|
|||||||
* @description 删除指定文件对象
|
* @description 删除指定文件对象
|
||||||
* @param row 文件对象
|
* @param row 文件对象
|
||||||
*/
|
*/
|
||||||
const remove = (row: UploadFile) => {
|
const remove = (row: UploadFile, type?: number) => {
|
||||||
if (isUploading.value) return ElMessage.warning("上传中, 请不要执行任何操作");
|
if (isUploading.value) return ElMessage.warning("上传中, 请不要执行任何操作");
|
||||||
|
|
||||||
const i = fileList.value.indexOf(row);
|
const i = fileList.value.indexOf(row);
|
||||||
|
|
||||||
|
if (type == 1) {
|
||||||
|
const findIndex = successList.value.findIndex(item => item.id === row.id);
|
||||||
|
if (findIndex > -1) {
|
||||||
|
successList.value.splice(findIndex, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (i >= 0) {
|
if (i >= 0) {
|
||||||
fileList.value.splice(i, 1);
|
fileList.value.splice(i, 1);
|
||||||
|
|
||||||
@ -367,7 +398,11 @@ const handlerUpload = () => {
|
|||||||
|
|
||||||
controllerList.value.push(controller);
|
controllerList.value.push(controller);
|
||||||
|
|
||||||
upload(data, { signal: controller.signal, onUploadProgress, headers: { noLoading: true } })
|
upload(data, {
|
||||||
|
signal: controller.signal,
|
||||||
|
onUploadProgress,
|
||||||
|
headers: { noLoading: true }
|
||||||
|
})
|
||||||
.then(res => {
|
.then(res => {
|
||||||
if (res.code == "200") {
|
if (res.code == "200") {
|
||||||
file.response = res.result;
|
file.response = res.result;
|
||||||
|
|||||||
@ -95,10 +95,10 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<!-- <el-input placeholder="请输入" v-model="item.punish" class="form-element-input" /> -->
|
<el-input placeholder="请输入" v-model="item.punish" class="form-element-input" />
|
||||||
<el-select placeholder="请选择" class="form-element-select" v-model="item.punish">
|
<!-- <el-select placeholder="请选择" class="form-element-select" v-model="item.punish">
|
||||||
<el-option v-for="(item2, index) in rankRemark" :key="item2.label" :label="item2.label" :value="item2.value" />
|
<el-option v-for="(item2, index) in rankRemark" :key="item2.label" :label="item2.label" :value="item2.value" />
|
||||||
</el-select>
|
</el-select> -->
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<el-input placeholder="请输入" v-model="item.remark" class="form-element-input" />
|
<el-input placeholder="请输入" v-model="item.remark" class="form-element-input" />
|
||||||
|
|||||||
@ -70,32 +70,52 @@ const handlechange = e => {
|
|||||||
|
|
||||||
const handleSubmit = (isTemporary?: any) => {
|
const handleSubmit = (isTemporary?: any) => {
|
||||||
const fileList: AnnexFile[] = [];
|
const fileList: AnnexFile[] = [];
|
||||||
|
console.log(annexFiles.value, 888999);
|
||||||
annexFiles.value.forEach(item => {
|
annexFiles.value.forEach(item => {
|
||||||
const files = item.files;
|
const files = item.files;
|
||||||
|
|
||||||
files.forEach(file => {
|
files.forEach((file: any) => {
|
||||||
const curr: AnnexFile = {};
|
if (file.response.fileId) {
|
||||||
|
const curr: AnnexFile = {};
|
||||||
|
|
||||||
curr.createTime = file.response?.createTime;
|
curr.createTime = file.response?.createTime;
|
||||||
curr.extendName = file.response?.ext;
|
curr.extendName = file.response?.extendName;
|
||||||
|
|
||||||
// TODO: 上传文件后, 后端返回两个 name 字段, 一个后端存储的 filename, 一个文件本身的 originalFilename
|
// TODO: 上传文件后, 后端返回两个 name 字段, 一个后端存储的 filename, 一个文件本身的 originalFilename
|
||||||
curr.fileName = file.response?.originalFilename;
|
curr.fileName = file.response?.fileName;
|
||||||
// curr.fileName = file.response?.filename;
|
// curr.fileName = file.response?.filename;
|
||||||
|
|
||||||
// curr.fileId = file.response && +file.response.id;
|
// curr.fileId = file.response && +file.response.id;
|
||||||
curr.fileSize = `${file.response?.size || ""}`;
|
curr.fileSize = `${file.response?.fileSize || ""}`;
|
||||||
curr.fileUrl = file.response?.url;
|
curr.fileUrl = file.response?.fileUrl;
|
||||||
|
|
||||||
curr.label = file.label;
|
curr.label = file.response?.label;
|
||||||
|
|
||||||
fileList.push(curr);
|
fileList.push(curr);
|
||||||
|
} else {
|
||||||
|
const curr: AnnexFile = {};
|
||||||
|
|
||||||
|
curr.createTime = file.response?.createTime;
|
||||||
|
curr.extendName = file.response?.ext;
|
||||||
|
|
||||||
|
// TODO: 上传文件后, 后端返回两个 name 字段, 一个后端存储的 filename, 一个文件本身的 originalFilename
|
||||||
|
curr.fileName = file.response?.originalFilename;
|
||||||
|
// curr.fileName = file.response?.filename;
|
||||||
|
|
||||||
|
// curr.fileId = file.response && +file.response.id;
|
||||||
|
curr.fileSize = `${file.response?.size || ""}`;
|
||||||
|
curr.fileUrl = file.response?.url;
|
||||||
|
|
||||||
|
curr.label = file.label;
|
||||||
|
|
||||||
|
fileList.push(curr);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
item.files = files;
|
item.files = files;
|
||||||
});
|
});
|
||||||
|
console.log(fileList, 888999);
|
||||||
|
// return;
|
||||||
emit("next", { annexFiles: fileList }, isTemporary);
|
emit("next", { annexFiles: fileList }, isTemporary);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user