diff --git a/apps/web-antd/src/components/upload/helper.ts b/apps/web-antd/src/components/upload/helper.ts index 27313cea6..3b7999963 100644 --- a/apps/web-antd/src/components/upload/helper.ts +++ b/apps/web-antd/src/components/upload/helper.ts @@ -1,8 +1,3 @@ -/** - * 默认图片类型 - */ -export const defaultImageAccepts = ['jpg', 'jpeg', 'png', 'gif', 'webp']; - export function checkFileType(file: File, accepts: string[]) { if (!accepts || accepts.length === 0) { return true; @@ -11,10 +6,3 @@ export function checkFileType(file: File, accepts: string[]) { const reg = new RegExp(`${String.raw`\.(` + newTypes})$`, 'i'); return reg.test(file.name); } - -export function checkImgType( - file: File, - accepts: string[] = defaultImageAccepts, -) { - return checkFileType(file, accepts); -} diff --git a/apps/web-antd/src/components/upload/image-upload.vue b/apps/web-antd/src/components/upload/image-upload.vue index a79f5b7cb..0c0506be3 100644 --- a/apps/web-antd/src/components/upload/image-upload.vue +++ b/apps/web-antd/src/components/upload/image-upload.vue @@ -10,11 +10,16 @@ import { computed, ref, toRefs, watch } from 'vue'; import { IconifyIcon } from '@vben/icons'; import { $t } from '@vben/locales'; -import { isFunction, isObject, isString } from '@vben/utils'; +import { + defaultImageAccepts, + isFunction, + isImage, + isObject, + isString, +} from '@vben/utils'; import { message, Modal, Upload } from 'ant-design-vue'; -import { checkImgType, defaultImageAccepts } from './helper'; import { UploadResultStatus } from './typing'; import { useUpload, useUploadType } from './use-upload'; @@ -159,7 +164,7 @@ async function beforeUpload(file: File) { } const { maxSize, accept } = props; - const isAct = checkImgType(file, accept); + const isAct = isImage(file.name, accept); if (!isAct) { message.error($t('ui.upload.acceptUpload', [accept])); isActMsg.value = false; diff --git a/apps/web-ele/src/components/upload/helper.ts b/apps/web-ele/src/components/upload/helper.ts index a7a67639d..3b7999963 100644 --- a/apps/web-ele/src/components/upload/helper.ts +++ b/apps/web-ele/src/components/upload/helper.ts @@ -6,15 +6,3 @@ export function checkFileType(file: File, accepts: string[]) { const reg = new RegExp(`${String.raw`\.(` + newTypes})$`, 'i'); return reg.test(file.name); } - -/** - * 默认图片类型 - */ -export const defaultImageAccepts = ['jpg', 'jpeg', 'png', 'gif', 'webp']; - -export function checkImgType( - file: File, - accepts: string[] = defaultImageAccepts, -) { - return checkFileType(file, accepts); -} diff --git a/apps/web-ele/src/components/upload/image-upload.vue b/apps/web-ele/src/components/upload/image-upload.vue index 322c2cde1..bb6beb392 100644 --- a/apps/web-ele/src/components/upload/image-upload.vue +++ b/apps/web-ele/src/components/upload/image-upload.vue @@ -15,11 +15,16 @@ import { ref, toRefs, watch } from 'vue'; import { IconifyIcon } from '@vben/icons'; import { $t } from '@vben/locales'; -import { isFunction, isObject, isString } from '@vben/utils'; +import { + defaultImageAccepts, + isFunction, + isImage, + isObject, + isString, +} from '@vben/utils'; import { ElMessage, ElUpload } from 'element-plus'; -import { checkImgType, defaultImageAccepts } from './helper'; import { UploadResultStatus } from './typing'; import { useUpload, useUploadType } from './use-upload'; @@ -173,7 +178,7 @@ const handleRemove = async (file: UploadFile) => { const beforeUpload = async (file: File) => { const { maxSize, accept } = props; - const isAct = checkImgType(file, accept); + const isAct = isImage(file.name, accept); if (!isAct) { ElMessage.error($t('ui.upload.acceptUpload', [accept])); isActMsg.value = false; diff --git a/apps/web-naive/src/components/upload/helper.ts b/apps/web-naive/src/components/upload/helper.ts index 27313cea6..3b7999963 100644 --- a/apps/web-naive/src/components/upload/helper.ts +++ b/apps/web-naive/src/components/upload/helper.ts @@ -1,8 +1,3 @@ -/** - * 默认图片类型 - */ -export const defaultImageAccepts = ['jpg', 'jpeg', 'png', 'gif', 'webp']; - export function checkFileType(file: File, accepts: string[]) { if (!accepts || accepts.length === 0) { return true; @@ -11,10 +6,3 @@ export function checkFileType(file: File, accepts: string[]) { const reg = new RegExp(`${String.raw`\.(` + newTypes})$`, 'i'); return reg.test(file.name); } - -export function checkImgType( - file: File, - accepts: string[] = defaultImageAccepts, -) { - return checkFileType(file, accepts); -} diff --git a/apps/web-naive/src/components/upload/image-upload.vue b/apps/web-naive/src/components/upload/image-upload.vue index e96fb96ad..8e6dd7343 100644 --- a/apps/web-naive/src/components/upload/image-upload.vue +++ b/apps/web-naive/src/components/upload/image-upload.vue @@ -9,11 +9,16 @@ import { computed, ref, toRefs, watch } from 'vue'; import { IconifyIcon } from '@vben/icons'; import { $t } from '@vben/locales'; -import { isFunction, isObject, isString } from '@vben/utils'; +import { + defaultImageAccepts, + isFunction, + isImage, + isObject, + isString, +} from '@vben/utils'; import { NImage, NImageGroup, NModal, NUpload, useMessage } from 'naive-ui'; -import { checkImgType, defaultImageAccepts } from './helper'; import { useUpload, useUploadType } from './use-upload'; defineOptions({ name: 'ImageUpload', inheritAttrs: false }); @@ -152,7 +157,7 @@ function beforeUpload(options: { } const { maxSize, accept } = props; - const isAct = checkImgType(file, accept); + const isAct = isImage(file.name, accept); if (!isAct) { message.error($t('ui.upload.acceptUpload', [accept])); isActMsg.value = false; diff --git a/apps/web-tdesign/src/components/upload/helper.ts b/apps/web-tdesign/src/components/upload/helper.ts index 27313cea6..3b7999963 100644 --- a/apps/web-tdesign/src/components/upload/helper.ts +++ b/apps/web-tdesign/src/components/upload/helper.ts @@ -1,8 +1,3 @@ -/** - * 默认图片类型 - */ -export const defaultImageAccepts = ['jpg', 'jpeg', 'png', 'gif', 'webp']; - export function checkFileType(file: File, accepts: string[]) { if (!accepts || accepts.length === 0) { return true; @@ -11,10 +6,3 @@ export function checkFileType(file: File, accepts: string[]) { const reg = new RegExp(`${String.raw`\.(` + newTypes})$`, 'i'); return reg.test(file.name); } - -export function checkImgType( - file: File, - accepts: string[] = defaultImageAccepts, -) { - return checkFileType(file, accepts); -} diff --git a/apps/web-tdesign/src/components/upload/image-upload.vue b/apps/web-tdesign/src/components/upload/image-upload.vue index 14e3776c4..c8ed5e3bd 100644 --- a/apps/web-tdesign/src/components/upload/image-upload.vue +++ b/apps/web-tdesign/src/components/upload/image-upload.vue @@ -9,13 +9,19 @@ import { computed, ref, toRefs, watch } from 'vue'; import { IconifyIcon } from '@vben/icons'; import { $t } from '@vben/locales'; -import { isFunction, isNumber, isObject, isString } from '@vben/utils'; +import { + defaultImageAccepts, + isFunction, + isImage, + isNumber, + isObject, + isString, +} from '@vben/utils'; import { Dialog, Upload } from 'tdesign-vue-next'; import { message } from '#/adapter/tdesign'; -import { checkImgType, defaultImageAccepts } from './helper'; import { UploadResultStatus } from './typing'; import { useUpload, useUploadType } from './use-upload'; @@ -164,7 +170,7 @@ async function beforeUpload(file: UploadFile) { } const { maxSize, accept } = props; - const isAct = checkImgType(file.raw!, accept); + const isAct = isImage(file.raw!.name, accept); if (!isAct) { message.error($t('ui.upload.acceptUpload', [accept])); isActMsg.value = false; diff --git a/packages/@core/base/shared/src/utils/upload.ts b/packages/@core/base/shared/src/utils/upload.ts index d7d3cb208..7e1279540 100644 --- a/packages/@core/base/shared/src/utils/upload.ts +++ b/packages/@core/base/shared/src/utils/upload.ts @@ -90,18 +90,34 @@ export function getFileNameFromUrl(url: null | string | undefined): string { } } +/** + * 默认图片类型 + */ +export const defaultImageAccepts = [ + 'bmp', + 'gif', + 'jpeg', + 'jpg', + 'png', + 'svg', + 'webp', +]; + /** * 判断文件是否为图片 * * @param filename 文件名 * @returns 是否为图片 */ -export function isImage(filename: null | string | undefined): boolean { - if (!filename) { +export function isImage( + filename: null | string | undefined, + accepts: string[] = defaultImageAccepts, +): boolean { + if (!filename || accepts.length === 0) { return false; } const ext = filename.split('.').pop()?.toLowerCase() || ''; - return ['bmp', 'gif', 'jpeg', 'jpg', 'png', 'svg', 'webp'].includes(ext); + return accepts.includes(ext); } /**