bonus
/
smart-bid-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

文件上传优化

This commit is contained in:
cwchen 2025-10-28 16:25:47 +08:00
parent 841475250c
commit d20331fbf0
9 changed files with 410 additions and 318 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

685
src/views/common/UploadFile.vue
View File

@ -1,8 +1,9 @@
<template>
<div class="upload-container">
<el-upload class="upload-demo" drag action="#" multiple :show-file-list="true" :before-upload="beforeUpload"
:on-change="handleFileChange" :on-remove="handleRemove" :on-exceed="handleExceed" :file-list="files"
:accept="accept" :limit="limitUploadNum" :auto-upload="autoUpload">
<el-upload ref="upload" class="upload-demo" drag action="#" multiple :show-file-list="true"
:before-upload="beforeUpload" :on-remove="handleRemove" :on-change="handleFileChange"
:on-exceed="handleExceed" :file-list="files" :accept="accept" :limit="limitUploadNum"
:auto-upload="autoUpload" :http-request="customUpload">
<div class="upload-content">
<!-- 当只有一张图片时显示缩略图 -->
<div v-if="showImagePreview" class="image-preview">
@ -43,161 +44,236 @@
</template>
<script>
import { uploadSmallFileByOcr, uploadLargeFileByOcr, uploadSmallFile, uploadLargeFile } from '@/api/common/uploadFile.js'
import {
uploadSmallFileByOcr,
uploadLargeFileByOcr,
uploadSmallFile,
uploadLargeFile,
} from '@/api/common/uploadFile.js'
export default {
name: 'UploadFile',
props: {
fileList: {
type: Array,
default: () => []
default: () => [],
},
maxFileTips: {
type: String,
default: '20MB'
default: '20MB',
},
uploadType: {
type: String,
default: 'png、jpg、jpeg'
default: 'png、jpg、jpeg',
},
limitUploadNum: {
type: Number,
default: 1
default: 1,
},
fileUploadRule: {
type: Object,
default: () => ({})
default: () => ({}),
},
autoUpload: {
type: Boolean,
default: true
default: true,
},
type: {
type: String,
default: ''
default: '',
},
},
data() {
return {
files: [...this.fileList], // 使用展开运算符创建新数组
files: [],
previewImageUrl: '',
previewImageName: '',
previewFileName: '',
previewFileType: '',
isUploading: false, // 添加上传状态标识
defaultFileSize: 1024 * 1024 * 5, // 默认文件大小5MB 超过5MB算大文件上传
skipNextChange: false,
}
},
computed: {
// 是否显示图片预览
showImagePreview() {
return this.previewImageUrl && this.files.length === 1
},
// 是否显示文件预览
showFilePreview() {
return (
this.previewFileName &&
this.previewFileType &&
this.files.length === 1
)
},
accept() {
return this.uploadType
.split('、')
.map((type) => `.${type}`)
.join(',')
},
// 获取支持的文件类型数组
allowedTypes() {
return this.uploadType.split('、')
},
// 获取文件大小限制（转换为MB数字）
maxSizeMB() {
const sizeStr = this.maxFileTips.toLowerCase()
if (sizeStr.includes('mb')) {
return parseFloat(sizeStr)
} else if (sizeStr.includes('kb')) {
return parseFloat(sizeStr) / 1024
} else if (sizeStr.includes('gb')) {
return parseFloat(sizeStr) * 1024
}
return 20
},
// 获取MIME类型映射
mimeTypes() {
const typeMap = {
png: 'image/png',
jpg: 'image/jpeg',
jpeg: 'image/jpeg',
pdf: 'application/pdf',
doc: 'application/msword',
docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
xls: 'application/vnd.ms-excel',
xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
}
return this.allowedTypes.map((type) => typeMap[type] || '')
},
},
watch: {
fileList: {
handler(newVal) {
if (this.files.length === 0 && newVal.length > 0) {
// 使用 $nextTick 确保 DOM 更新完成
this.$nextTick(() => {
// 直接设置上传组件的内部文件列表
if (this.$refs.upload) {
this.$refs.upload.uploadFiles = this.formatFileList(newVal)
}
this.files = this.formatFileList(newVal)
// 单独处理预览
this.handlePreviewFromExternal(newVal)
})
}
},
immediate: true,
deep: true
},
},
methods: {
beforeUpload(file) {
// 如果正在上传中，阻止新的上传
if (this.isUploading) {
return false;
this.$message.warning('当前有文件正在上传，请稍后再试')
return false
}
// 验证文件类型
const fileExtension = file.name.split('.').pop().toLowerCase();
const isAllowedType = this.allowedTypes.includes(fileExtension);
const fileExtension = file.name.split('.').pop().toLowerCase()
const isAllowedType = this.allowedTypes.includes(fileExtension)
// 验证MIME类型（额外验证）
const isAllowedMimeType = this.mimeTypes.includes(file.type);
const isAllowedMimeType = this.mimeTypes.includes(file.type)
// 验证文件大小
const isLtMaxSize = file.size / 1024 / 1024 < this.maxSizeMB;
const isLtMaxSize = file.size / 1024 / 1024 < this.maxSizeMB
if (!isAllowedType || !isAllowedMimeType) {
this.$message.error(`只能上传 ${this.uploadType} 格式的文件!`);
return false;
this.$message.error(`只能上传 ${this.uploadType} 格式的文件!`)
return false
}
if (!isLtMaxSize) {
this.$message.error(`文件大小不能超过 ${this.maxFileTips}!`);
return false;
this.$message.error(`文件大小不能超过 ${this.maxFileTips}!`)
return false
}
return false;
return true
},
// 文件状态改变
handleFileChange(file, fileList) {
// 如果文件状态是移除或失败，不处理
if (file.status === 'removed' || file.status === 'fail') {
return;
// 如果文件状态是移除或失败或者成功，不处理
if (file.status === 'removed' || file.status === 'fail' || file.status === 'success') {
console.log('现在的文件：', this.files);
return
}
// 不使用深拷贝，直接使用 fileList，但确保 files 是响应式的
this.files = this.formatFileList(fileList);
// 更新文件列表
this.files = this.formatFileList(fileList)
// 生成预览
if (file.raw && fileList.length === 1) {
if (this.isImageFile(file.raw)) {
// 图片预览
this.generateImagePreview(file.raw);
this.generateImagePreview(file.raw)
} else if (this.isDocumentFile(file.raw)) {
// 文档预览
this.generateDocumentPreview(file.raw);
this.generateDocumentPreview(file.raw)
}
} else {
// 如果不是单个文件，清除预览
this.clearPreview();
}
// 如果启用自动上传且文件验证通过，触发上传
if (this.autoUpload && file.status === 'ready' && !this.isUploading) {
if (this.fileUploadRule.fields_json) {
// 文件需要ocr识别
this.uploadFile(file, '识别中');
} else {
// 文件不需要ocr识别
this.uploadFile(file, '上传中');
}
this.clearPreview()
}
},
// 格式化文件列表，确保数据结构正确
formatFileList(fileList) {
return fileList.map(file => {
// 创建一个标准的文件对象
const formattedFile = {
uid: file.uid,
name: file.name,
size: file.size,
type: file.type,
status: file.status,
raw: file.raw
};
// 确保 percentage 属性存在且有效
if (file.percentage !== undefined && file.percentage !== null) {
formattedFile.percentage = Math.max(0, Math.min(100, file.percentage));
} else if (file.status === 'uploading') {
formattedFile.percentage = 0;
} else if (file.status === 'success') {
formattedFile.percentage = 100;
}
// 保留其他可能存在的属性
if (file.response) {
formattedFile.response = file.response;
formattedFile.url = file.url;
}
if (file.statusText) {
formattedFile.statusText = file.statusText;
}
return formattedFile;
});
// 添加上传成功的处理
handleSuccess(response, file) {
this.$bus.$emit('endUpload')
// 更新文件状态为成功
this.updateFileStatus(file.uid, 'success', '', response.data, 100)
// 触发文件变化事件
this.$emit('file-change', this.getCurrentFiles(), this.type)
// 重置上传状态
this.isUploading = false
},
// 上传文件
async uploadFile(file, text) {
// 添加上传失败的处理
handleError(error, file) {
console.error('上传失败:', error)
this.$bus.$emit('endUpload')
// 上传失败，移除文件
this.removeFailedFile(file.uid)
// 重置上传状态
this.isUploading = false
},
// 自定义上传逻辑
async customUpload(options) {
console.log(options);
const { file } = options;
// 设置上传状态
this.isUploading = true;
const formData = new FormData();
formData.append('file', file.raw);
formData.append('file', file);
formData.append('params', JSON.stringify(this.fileUploadRule));
// 从 el-upload 的文件列表中查找对应的完整文件对象
const uploadFileObj = this.findFileByRawFile(file);
if (!uploadFileObj) {
console.error('未找到对应的文件对象');
this.handleError(new Error('文件对象不存在'), file);
return;
}
const fileUid = uploadFileObj.uid;
// 更新文件状态为上传中，并设置初始进度为 0
this.updateFileStatus(file.uid, 'uploading', text, null, 0);
this.updateFileStatus(
fileUid,
'uploading',
this.fileUploadRule.fields_json ? '识别中' : '上传中',
null,
0,
);
try {
this.$bus.$emit('startUpload', text);
this.$bus.$emit(
'startUpload',
this.fileUploadRule.fields_json ? '识别中' : '上传中',
);
let res = null;
if (this.defaultFileSize < file.size) {
if (this.fileUploadRule.fields_json) {
@ -212,131 +288,108 @@ export default {
res = await uploadSmallFile(formData);
}
}
console.log('上传成功:', res);
this.$bus.$emit('endUpload');
// 上传成功，更新文件状态，设置进度为 100
this.updateFileStatus(file.uid, 'success', '', res.data, 100);
console.log('上传成功后的文件列表:', this.files);
// 触发文件变化事件，传递当前的文件列表
this.$emit('file-change', this.getCurrentFiles(), this.type);
if (res.code === 200) {
this.handleSuccess(res, uploadFileObj);
} else {
this.handleError(new Error(res.message || '上传失败'), uploadFileObj);
}
} catch (err) {
this.$bus.$emit('endUpload');
// 上传失败，移除文件
this.removeFailedFile(file.uid);
this.handleError(err, uploadFileObj);
} finally {
// 无论成功失败，都重置上传状态
this.isUploading = false;
}
},
// 通过原始文件对象查找对应的上传文件对象
findFileByRawFile(rawFile) {
return this.files.find(item =>
item.raw === rawFile ||
(item.name === rawFile.name && item.size === rawFile.size)
);
},
// 移除上传失败的文件
removeFailedFile(fileUid) {
console.log('移除上传失败的文件:', fileUid);
const fileIndex = this.files.findIndex(item => item.uid === fileUid);
console.log('移除上传失败的文件:', fileUid)
const fileIndex = this.files.findIndex(
(item) => item.uid === fileUid,
)
if (fileIndex !== -1) {
// 从文件列表中移除
this.files.splice(fileIndex, 1);
console.log('移除失败文件后的文件列表:', this.files);
this.files.splice(fileIndex, 1)
console.log('移除失败文件后的文件列表:', this.files)
// 清除预览
this.clearPreview();
this.clearPreview()
// 触发文件变化事件
this.$emit('file-change', this.getCurrentFiles(), this.type);
this.$emit('file-change', this.getCurrentFiles(), this.type)
}
},
// 更新文件状态
updateFileStatus(fileUid, status, statusText, responseData = null, percentage = null) {
console.log('更新文件状态:', fileUid, status, statusText, '进度:', percentage);
console.log('更新前的文件列表:', this.files);
const fileIndex = this.files.findIndex(item => item.uid === fileUid);
updateFileStatus(
fileUid,
status,
statusText,
responseData = null,
percentage = null,
) {
const fileIndex = this.files.findIndex(
(item) => item.uid === fileUid,
)
if (fileIndex !== -1) {
const updatedFile = {
...this.files[fileIndex],
status: status
};
status: status,
}
if (statusText) {
updatedFile.statusText = statusText;
updatedFile.statusText = statusText
}
// 确保 percentage 是有效的数字（0-100）
if (percentage !== null && percentage >= 0 && percentage <= 100) {
updatedFile.percentage = percentage;
if (
percentage !== null &&
percentage >= 0 &&
percentage <= 100
) {
updatedFile.percentage = percentage
} else if (status === 'uploading') {
// 上传中状态默认设置进度为 0
updatedFile.percentage = 0;
updatedFile.percentage = 0
} else if (status === 'success') {
// 成功状态设置进度为 100
updatedFile.percentage = 100;
updatedFile.percentage = 100
}
if (responseData) {
// 保存服务器返回的文件信息
updatedFile.response = responseData;
updatedFile.response.businessType = this.fileUploadRule?.fileUploadType;
updatedFile.response.businessType =
this.fileUploadRule?.fileUploadType;
updatedFile.res = updatedFile.response;
}
// 使用 Vue.set 确保响应式更新
this.$set(this.files, fileIndex, updatedFile);
console.log('更新后的文件列表:', this.files);
this.$set(this.files, fileIndex, updatedFile)
console.log('更新后的文件列表:', this.files)
} else {
console.warn('未找到要更新的文件:', fileUid);
console.warn('未找到要更新的文件:', fileUid)
}
},
// 获取当前文件列表（确保是普通数组）
getCurrentFiles() {
const currentFiles = this.files.map(file => {
const fileObj = {
uid: file.uid,
name: file.name,
size: file.size,
type: file.type,
status: file.status
};
// 确保 percentage 存在
if (file.percentage !== undefined) {
fileObj.percentage = file.percentage;
}
// 保留原始文件对象（如果存在）
if (file.raw) {
fileObj.raw = file.raw;
}
// 如果文件已上传成功，添加服务器返回的信息
if (file.response) {
fileObj.response = file.response;
fileObj.response.businessType = this.fileUploadRule?.fileUploadType;
}
return fileObj;
});
console.log('getCurrentFiles 返回:', currentFiles);
return currentFiles;
},
// 处理文件超出限制
handleExceed(files, fileList) {
console.log('文件超出限制处理', files, fileList);
console.log('文件超出限制处理', files, fileList)
// 当文件数量超出限制时，用新文件替换旧文件
if (files.length > 0) {
// 触发文件删除事件
this.$emit('del-file', fileList[0]);
this.$emit('del-file', fileList[0])
// 清空原有文件列表
this.files = [];
this.files = []
// 手动触发新文件的上传流程
const newFile = files[0];
this.beforeUpload(newFile); // 先进行验证
const newFile = files[0]
// 创建新的文件对象，确保包含 percentage
const newFileObj = {
name: newFile.name,
@ -345,50 +398,35 @@ export default {
raw: newFile,
uid: Date.now(), // 生成新的uid
status: 'ready',
percentage: 0 // 添加默认进度
};
percentage: 0, // 添加默认进度
}
// 更新文件列表
this.files = [newFileObj];
this.files = [newFileObj]
// 生成预览
if (this.isImageFile(newFile)) {
this.generateImagePreview(newFile);
this.generateImagePreview(newFile)
} else if (this.isDocumentFile(newFile)) {
this.generateDocumentPreview(newFile);
this.generateDocumentPreview(newFile)
}
console.log('handleExceed 后的文件列表:', this.files);
// 传递当前文件信息给父组件
this.$emit('file-change', this.getCurrentFiles());
console.log('handleExceed 后的文件列表:', this.files)
// 自动上传新文件
if (this.autoUpload && !this.isUploading) {
if (this.fileUploadRule.fields_json) {
this.uploadFile(newFileObj, '识别中');
} else {
this.uploadFile(newFileObj, '上传中');
}
this.$nextTick(() => {
this.$refs.upload.submit();
});
}
}
},
// 移除文件
handleRemove(file, fileList) {
console.log('移除文件:', file);
console.log('移除前的文件列表:', this.files);
// 如果正在上传中，阻止移除
if (this.isUploading) {
return false;
if (this.isUploading && file.status === 'uploading') {
this.$message.warning('文件正在上传中，请稍后再删除');
return false; // 阻止删除操作
}
// 使用格式化方法而不是深拷贝
this.files = this.formatFileList(fileList);
console.log('移除后的文件列表:', this.files);
// 根据剩余文件重新生成预览
if (fileList.length === 0) {
this.clearPreview();
@ -401,158 +439,189 @@ export default {
} else {
this.clearPreview();
}
// 触发文件删除事件
this.$emit('del-file', file);
const delFileObj = this.findFileByRawFile(file.raw);
delFileObj.response = delFileObj.res;
// 更新文件列表
this.files = this.formatFileList(fileList);
// 触发文件删除事件给父组件
this.$emit('del-file', delFileObj);
// 传递当前文件信息给父组件
this.$emit('file-change', this.getCurrentFiles());
this.$emit('file-change', this.getCurrentFiles(), this.type);
// 返回 true 允许删除继续，false 阻止删除
return true;
},
// 格式化文件列表，确保数据结构正确
formatFileList(fileList) {
return fileList.map((file) => {
// 创建一个标准的文件对象
const formattedFile = {
uid: file.uid,
name: file.name,
size: file.size,
type: file.type,
status: file.status,
raw: file.raw,
}
// 确保 percentage 属性存在且有效
if (file.percentage !== undefined && file.percentage !== null) {
formattedFile.percentage = Math.max(
0,
Math.min(100, file.percentage),
)
} else if (file.status === 'uploading') {
formattedFile.percentage = 0
} else if (file.status === 'success') {
formattedFile.percentage = 100
}
// 保留其他可能存在的属性
if (file.response) {
formattedFile.response = file.response;
formattedFile.res = file.response;
}
if (file.filePath) {
formattedFile.filePath = file.filePath;
}
if (file.statusText) {
formattedFile.statusText = file.statusText
}
return formattedFile
})
},
// 获取当前文件列表（确保是普通数组）
getCurrentFiles() {
const currentFiles = this.files.map((file) => {
const fileObj = {
uid: file.uid,
name: file.name,
size: file.size,
type: file.type,
status: file.status,
}
// 确保 percentage 存在
if (file.percentage !== undefined) {
fileObj.percentage = file.percentage
}
// 保留原始文件对象（如果存在）
if (file.raw) {
fileObj.raw = file.raw
}
// 如果文件已上传成功，添加服务器返回的信息
if (file.response) {
fileObj.response = file.response
fileObj.response.businessType =
this.fileUploadRule?.fileUploadType
}
return fileObj
})
return currentFiles
},
// 判断是否为图片文件
isImageFile(file) {
return (file && file.type && file.type.startsWith('image/')) || (file && file.fileType === '1');
return (
(file && file.type && file.type.startsWith('image/')) ||
(file && file.fileType === '1')
)
},
// 判断是否为文档文件
isDocumentFile(file) {
if (!file || !file.name) return false;
const fileExtension = file.name.split('.').pop().toLowerCase();
return ['pdf', 'doc', 'docx', 'xls', 'xlsx'].includes(fileExtension) || (file && file.fileType === '2');
if (!file || !file.name) return false
const fileExtension = file.name.split('.').pop().toLowerCase()
return (
['pdf', 'doc', 'docx', 'xls', 'xlsx'].includes(fileExtension) ||
(file && file.fileType === '2')
)
},
// 生成图片预览
generateImagePreview(file) {
const reader = new FileReader();
const reader = new FileReader()
reader.onload = (e) => {
this.previewImageUrl = e.target.result;
this.previewImageName = file.name;
this.previewImageUrl = e.target.result
this.previewImageName = file.name
// 清除文档预览
this.previewFileName = '';
this.previewFileType = '';
};
reader.readAsDataURL(file);
this.previewFileName = ''
this.previewFileType = ''
}
reader.readAsDataURL(file)
},
// 修改回显生成图片预览
generateImagePreviewFromPath(file) {
this.previewImageUrl = file.lsFilePath;
this.previewImageName = file.name;
this.previewImageUrl = file.lsFilePath
this.previewImageName = file.name
// 清除文档预览
this.previewFileName = '';
this.previewFileType = '';
this.previewFileName = ''
this.previewFileType = ''
},
// 生成文档预览
generateDocumentPreview(file) {
const fileExtension = file.name.split('.').pop().toLowerCase();
this.previewFileName = file.name;
this.previewFileType = fileExtension;
const fileExtension = file.name.split('.').pop().toLowerCase()
this.previewFileName = file.name
this.previewFileType = fileExtension
// 清除图片预览
this.previewImageUrl = '';
this.previewImageName = '';
this.previewImageUrl = ''
this.previewImageName = ''
},
// 清除预览
clearPreview() {
this.previewImageUrl = '';
this.previewImageName = '';
this.previewFileName = '';
this.previewFileType = '';
this.previewImageUrl = ''
this.previewImageName = ''
this.previewFileName = ''
this.previewFileType = ''
},
// 获取文件图标类型
getFileIconClass() {
const iconMap = {
'pdf': 'el-icon-document',
'doc': 'el-icon-document',
'docx': 'el-icon-document',
'xls': 'el-icon-document',
'xlsx': 'el-icon-document'
};
return iconMap[this.previewFileType] || 'el-icon-document';
pdf: 'el-icon-document',
doc: 'el-icon-document',
docx: 'el-icon-document',
xls: 'el-icon-document',
xlsx: 'el-icon-document',
}
return iconMap[this.previewFileType] || 'el-icon-document'
},
// 清空所有文件
clearFiles() {
this.files = [];
this.clearPreview();
this.$emit('file-change', []);
}
},
computed: {
// 是否显示图片预览
showImagePreview() {
return this.previewImageUrl &&
this.files.length === 1 ;
this.files = []
this.clearPreview()
this.$emit('file-change', [])
},
// 是否显示文件预览
showFilePreview() {
return this.previewFileName &&
this.previewFileType &&
this.files.length === 1;
},
accept() {
return this.uploadType.split('、').map(type => `.${type}`).join(',');
},
// 获取支持的文件类型数组
allowedTypes() {
return this.uploadType.split('、');
},
// 获取文件大小限制（转换为MB数字）
maxSizeMB() {
const sizeStr = this.maxFileTips.toLowerCase();
if (sizeStr.includes('mb')) {
return parseFloat(sizeStr);
} else if (sizeStr.includes('kb')) {
return parseFloat(sizeStr) / 1024;
} else if (sizeStr.includes('gb')) {
return parseFloat(sizeStr) * 1024;
}
return 20;
},
// 获取MIME类型映射
mimeTypes() {
const typeMap = {
'png': 'image/png',
'jpg': 'image/jpeg',
'jpeg': 'image/jpeg',
'pdf': 'application/pdf',
'doc': 'application/msword',
'docx': 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'xls': 'application/vnd.ms-excel',
'xlsx': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
};
return this.allowedTypes.map(type => typeMap[type] || '');
}
},
watch: {
fileList: {
handler(newVal) {
this.files = this.formatFileList(newVal);
// 如果外部传入文件列表，从 lsFilePath 生成预览
if (newVal.length > 0) {
const firstFile = newVal[0];
if (firstFile && firstFile.lsFilePath) {
// 根据文件类型生成预览
if (this.isImageFile(firstFile)) {
this.generateImagePreviewFromPath(firstFile);
} else if (this.isDocumentFile(firstFile)) {
this.generateDocumentPreview(firstFile);
}
} else {
// 如果没有 lsFilePath，回退到原始逻辑
if (firstFile && firstFile.raw) {
if (this.isImageFile(firstFile.raw)) {
this.generateImagePreview(firstFile.raw);
} else if (this.isDocumentFile(firstFile.raw)) {
this.generateDocumentPreview(firstFile.raw);
}
} else {
this.clearPreview();
}
// 专门处理外部传入的文件预览
handlePreviewFromExternal(fileList) {
if (fileList.length > 0) {
const firstFile = fileList[0]
if (firstFile && firstFile.lsFilePath) {
if (this.isImageFile(firstFile)) {
this.generateImagePreviewFromPath(firstFile)
} else if (this.isDocumentFile(firstFile)) {
this.generateDocumentPreview(firstFile)
}
} else if (firstFile && firstFile.raw) {
if (this.isImageFile(firstFile.raw)) {
this.generateImagePreview(firstFile.raw)
} else if (this.isDocumentFile(firstFile.raw)) {
this.generateDocumentPreview(firstFile.raw)
}
} else {
this.clearPreview();
this.clearPreview()
}
},
immediate: true,
deep: true
}
} else {
this.clearPreview()
}
},
},
}
</script>
@ -569,9 +638,9 @@ export default {
.el-upload-dragger {
width: 100%;
height: 240px;
border: 2px dashed #DCDFE6;
border: 2px dashed #dcdfe6;
border-radius: 8px;
background-color: #FAFAFA;
background-color: #fafafa;
display: flex;
align-items: center;
justify-content: center;
@ -580,8 +649,8 @@ export default {
overflow: hidden;
&:hover {
border-color: #409EFF;
background-color: #F5F7FA;
border-color: #409eff;
background-color: #f5f7fa;
}
}
}
@ -672,7 +741,7 @@ export default {
.file-icon {
font-size: 64px;
color: #1F72EA;
color: #1f72ea;
margin-bottom: 16px;
}
@ -735,7 +804,7 @@ export default {
.main-text {
font-size: 18px;
color: #1F72EA;
color: #1f72ea;
margin-bottom: 12px;
font-weight: 500;
}
@ -752,4 +821,4 @@ export default {
}
}
}
</style>
</style>

5
src/views/enterpriseLibrary/enterprise/components/child/AccountOpeningCertificate.vue
View File

@ -119,7 +119,10 @@ export default {
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData(){
const fileList = this.getFileList('account_opening_license');

5
src/views/enterpriseLibrary/enterprise/components/child/BasicInfo.vue
View File

@ -174,7 +174,10 @@ export default {
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData(){
const fileList = this.getFileList('business_license');

5
src/views/enterpriseLibrary/enterprise/components/child/LegalPerson.vue
View File

@ -172,7 +172,10 @@ export default {
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData(){
const fileList = this.getFileList('face_id_card_portrait')

3
src/views/enterpriseLibrary/personnel/components/PersonnelForm.vue
View File

@ -295,6 +295,9 @@ export default {
// 组装表单数据
assembleFormData(basicInfoData, qualificationData = EMPTY_OBJECT, otherData = EMPTY_OBJECT) {
console.log(qualificationData);
console.log(otherData);
// 安全合并所有文件列表
const allFiles = [
...this.safeGetArray(basicInfoData.fileList),

5
src/views/enterpriseLibrary/personnel/components/child/BasicInfo.vue
View File

@ -261,7 +261,10 @@ export default {
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData() {
const fileList = this.getFileList('face_id_card_portrait');

5
src/views/enterpriseLibrary/personnel/components/child/OtherInfo.vue
View File

@ -145,7 +145,10 @@ export default {
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData() {

5
src/views/enterpriseLibrary/personnel/components/child/QualificationInfo.vue
View File

@ -302,7 +302,10 @@ export default {
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData() {
const { fileUploadType } = CONSTRUCTOR_CERTIFICATE;

10
src/views/enterpriseLibrary/technical/components/child/FileInfo.vue
View File

@ -19,14 +19,14 @@
// 默认参数
const defaultParams = {
fileType: 'technical_solution',
uploadType: 'pdf、doc、docx',
uploadType: 'pdf、doc、docx、jpe、png、jpeg',
maxFileTips: '1MB',
fileUploadRule: {
fileUploadType: 'technical_solution',
fields_json: '',
suffix: 'technical_solution_database'
},
limitUploadNum: 10
limitUploadNum: 1
};
import UploadFile from '@/views/common/UploadFile.vue'
export default {
@ -83,8 +83,10 @@ export default {
},
// 文件删除时触发
handleDelFile(file) {
console.log(file);
this.form.delFileList.push(file.response.fileRes.uploadPath || file.filePath);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
this.form.delFileList.push(delPath);
}
},
setFormData() {
},