diff --git a/apps/web-antd/src/components/upload/src/file-upload.vue b/apps/web-antd/src/components/upload/src/file-upload.vue index de511f03..fbdae9cb 100644 --- a/apps/web-antd/src/components/upload/src/file-upload.vue +++ b/apps/web-antd/src/components/upload/src/file-upload.vue @@ -118,9 +118,9 @@ const handleRemove = async (file: UploadFile) => { } }; -const beforeUpload = (file: File) => { +const beforeUpload = async (file: File) => { const { maxSize, accept } = props; - const isAct = checkFileType(file, accept); + const isAct = await checkFileType(file, accept); if (!isAct) { message.error($t('component.upload.acceptUpload', [accept])); isActMsg.value = false; diff --git a/apps/web-antd/src/components/upload/src/helper.ts b/apps/web-antd/src/components/upload/src/helper.ts index e18ef80c..ff70b413 100644 --- a/apps/web-antd/src/components/upload/src/helper.ts +++ b/apps/web-antd/src/components/upload/src/helper.ts @@ -1,20 +1,25 @@ import { fileTypeFromBlob } from '@vben/utils'; /** - * TODO: file-upload暂时使用 需要进行重构 + * 不支持txt文件 @see https://github.com/sindresorhus/file-type/issues/55 + * 需要自行修改 * @param file file对象 * @param accepts 文件类型数组 包括拓展名(不带点) 文件头(image/png等 不包括泛写法即image/*) * @returns 是否通过文件类型校验 */ -export function checkFileType(file: File, accepts: string[]) { - let reg; - if (!accepts || accepts.length === 0) { - reg = /.(?:jpg|jpeg|png|gif|webp)$/i; - } else { - const newTypes = accepts.join('|'); - reg = new RegExp(`${String.raw`\.(` + newTypes})$`, 'i'); +export async function checkFileType(file: File, accepts: string[]) { + if (!accepts || accepts?.length === 0) { + return true; } - return reg.test(file.name); + console.log(file); + const fileType = await fileTypeFromBlob(file); + if (!fileType) { + console.error('无法获取文件类型'); + return false; + } + console.log('文件类型', fileType); + // 是否文件拓展名/文件头任意有一个匹配 + return accepts.includes(fileType.ext) || accepts.includes(fileType.mime); } /** diff --git a/apps/web-antd/src/views/system/oss/file-upload-modal.vue b/apps/web-antd/src/views/system/oss/file-upload-modal.vue index cbdaa1bc..242ce173 100644 --- a/apps/web-antd/src/views/system/oss/file-upload-modal.vue +++ b/apps/web-antd/src/views/system/oss/file-upload-modal.vue @@ -24,7 +24,7 @@ const [BasicModal, modalApi] = useVbenModal({ }, }); -const accept = ref(['txt', 'excel', 'word', 'pdf']); +const accept = ref(['xlsx', 'word', 'pdf']); const maxNumber = ref(3); const message = computed(() => { diff --git a/apps/web-antd/src/views/演示使用自行删除/upload/index.vue b/apps/web-antd/src/views/演示使用自行删除/upload/index.vue index f7663c41..c5556660 100644 --- a/apps/web-antd/src/views/演示使用自行删除/upload/index.vue +++ b/apps/web-antd/src/views/演示使用自行删除/upload/index.vue @@ -15,7 +15,7 @@ const fieldOptions = [ { label: 'ossId', value: 'ossId' }, { label: '链接地址', value: 'url' }, ]; -const fileAccept = ['txt', 'excel', 'word', 'pdf']; +const fileAccept = ['xlsx', 'word', 'pdf']; const signleImage = ref('');