From ccd67e291e00a2ad9c29ad8df43de6fab5a4afed Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期四, 09 四月 2026 09:30:08 +0800
Subject: [PATCH] feat(协同审批/报价单): 添加附件上传、预览和下载功能
---
src/components/FileUpload/index.vue | 60 +++++++++++++++++++-----------------------------------------
1 files changed, 19 insertions(+), 41 deletions(-)
diff --git a/src/components/FileUpload/index.vue b/src/components/FileUpload/index.vue
index e39a6ed..3300aaa 100644
--- a/src/components/FileUpload/index.vue
+++ b/src/components/FileUpload/index.vue
@@ -1,21 +1,8 @@
<template>
<div class="upload-file">
- <el-upload
- multiple
- :action="uploadFileUrl"
- :before-upload="handleBeforeUpload"
- :file-list="fileList"
- :data="data"
- :limit="limit"
- :on-error="handleUploadError"
- :on-exceed="handleExceed"
- :on-success="handleUploadSuccess"
- :show-file-list="false"
- :headers="headers"
- class="upload-file-uploader"
- ref="fileUpload"
- v-if="!disabled"
- >
+ <el-upload multiple :action="uploadFileUrl" :before-upload="handleBeforeUpload" :file-list="fileList" :data="data"
+ :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed" :on-success="handleUploadSuccess"
+ :show-file-list="false" :headers="headers" class="upload-file-uploader" ref="fileUpload" v-if="!disabled">
<!-- 涓婁紶鎸夐挳 -->
<el-button type="primary">閫夊彇鏂囦欢</el-button>
</el-upload>
@@ -31,31 +18,13 @@
鐨勬枃浠�
</div>
<!-- 鏂囦欢鍒楄〃 -->
- <transition-group
- class="upload-file-list el-upload-list el-upload-list--text"
- name="el-fade-in-linear"
- tag="ul"
- >
- <li
- :key="file.uid"
- class="el-upload-list__item ele-upload-list__item-content"
- v-for="(file, index) in fileList"
- >
- <el-link
- :href="`${baseUrl}${file.url}`"
- :underline="false"
- target="_blank"
- >
+ <transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
+ <li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
+ <el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
</el-link>
<div class="ele-upload-list__item-content-action">
- <el-link
- :underline="false"
- @click="handleDelete(index)"
- type="danger"
- v-if="!disabled"
- > 鍒犻櫎</el-link
- >
+ <el-link :underline="false" @click="handleDelete(index)" type="danger" v-if="!disabled"> 鍒犻櫎</el-link>
</div>
</li>
</transition-group>
@@ -131,7 +100,12 @@
// 鐒跺悗灏嗘暟缁勮浆涓哄璞℃暟缁�
fileList.value = list.map((item) => {
if (typeof item === "string") {
- item = { name: item, url: item };
+ item = { name: getFileName(item), url: item };
+ } else {
+ item = { ...item };
+ if (!item.name) {
+ item.name = getFileName(item.url || item.name || "");
+ }
}
item.uid = item.uid || new Date().getTime() + temp++;
return item;
@@ -215,7 +189,7 @@
.concat(uploadList.value);
uploadList.value = [];
number.value = 0;
- emit("update:modelValue", listToString(fileList.value));
+ emit("update:modelValue", fileList.value);
proxy.$modal.closeLoading();
}
}
@@ -252,7 +226,7 @@
onEnd: (evt) => {
const movedItem = fileList.value.splice(evt.oldIndex, 1)[0];
fileList.value.splice(evt.newIndex, 0, movedItem);
- emit("update:modelValue", listToString(fileList.value));
+ emit("update:modelValue", fileList.value);
},
});
});
@@ -264,9 +238,11 @@
opacity: 0.5;
background: #c8ebfb;
}
+
.upload-file-uploader {
margin-bottom: 5px;
}
+
.upload-file-list .el-upload-list__item {
border: 1px solid #e4e7ed;
line-height: 2;
@@ -274,12 +250,14 @@
position: relative;
transition: none !important;
}
+
.upload-file-list .ele-upload-list__item-content {
display: flex;
justify-content: space-between;
align-items: center;
color: inherit;
}
+
.ele-upload-list__item-content-action .el-link {
margin-right: 10px;
}
--
Gitblit v1.9.3