github_mirrors/vue-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/vue-vben-admin.git synced 2025-01-24 02:00:25 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

feat(components->Upload): 修正图片上传组件允许自定义上传格式限制 (#3755)

Browse Source
This commit is contained in:
1455668754 2024-04-18 14:10:32 +08:00 committed by GitHub
parent 36274025d6
commit 302e2125ba
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Upload/src/components/ImageUpload.vue
View File

@ -35,14 +35,15 @@
import { useI18n } from '@/hooks/web/useI18n'; import { useI18n } from '@/hooks/web/useI18n';
import { useUploadType } from '../hooks/useUpload'; import { useUploadType } from '../hooks/useUpload';
import { uploadContainerProps } from '../props'; import { uploadContainerProps } from '../props';
import { isImgTypeByName } from '../helper'; import { checkFileType } from '../helper';
import { UploadResultStatus } from '@/components/Upload/src/types/typing'; import { UploadResultStatus } from '@/components/Upload/src/types/typing';
import { get,omit } from 'lodash-es'; import { get, omit } from 'lodash-es';
defineOptions({ name: 'ImageUpload' }); defineOptions({ name: 'ImageUpload' });
const emit = defineEmits(['change', 'update:value', 'delete']); const emit = defineEmits(['change', 'update:value', 'delete']);
const props = defineProps({ const props = defineProps({
...omit(uploadContainerProps,["previewColumns","beforePreviewData"]), ...omit(uploadContainerProps, ['previewColumns', 'beforePreviewData']),
}); });
const { t } = useI18n(); const { t } = useI18n();
const { createMessage } = useMessage(); const { createMessage } = useMessage();
@ -138,8 +139,7 @@
const beforeUpload = (file: File) => { const beforeUpload = (file: File) => {
const { maxSize, accept } = props; const { maxSize, accept } = props;
const { name } = file; const isAct = checkFileType(file, accept);
const isAct = isImgTypeByName(name);
if (!isAct) { if (!isAct) {
createMessage.error(t('component.upload.acceptUpload', [accept])); createMessage.error(t('component.upload.acceptUpload', [accept]));
isActMsg.value = false; isActMsg.value = false;
@ -170,9 +170,9 @@
name: props.name, name: props.name,
filename: props.filename, filename: props.filename,
}); });
if(props.resultField){ if (props.resultField) {
info.onSuccess!(res); info.onSuccess!(res);
}else{ } else {
// 不传入 resultField 的情况 // 不传入 resultField 的情况
info.onSuccess!(res.data); info.onSuccess!(res.data);
} }
@ -190,8 +190,8 @@
const list = (fileList.value || []) const list = (fileList.value || [])
.filter((item) => item?.status === UploadResultStatus.DONE) .filter((item) => item?.status === UploadResultStatus.DONE)
.map((item: any) => { .map((item: any) => {
if(props.resultField){ if (props.resultField) {
return get(item?.response, props.resultField) return get(item?.response, props.resultField);
} }
return item?.url || item?.response?.url; return item?.url || item?.response?.url;
}); });

11
src/components/Upload/src/helper.ts
View File

@ -1,8 +1,11 @@
export function checkFileType(file: File, accepts: string[]) { export function checkFileType(file: File, accepts: string[]) {
const newTypes = accepts.join('|'); let reg;
// const reg = /\.(jpg|jpeg|png|gif|txt|doc|docx|xls|xlsx|xml)$/i; if (!accepts || accepts.length === 0) {
const reg = new RegExp('\\.(' + newTypes + ')$', 'i'); reg = /.(jpg|jpeg|png|gif|webp)$/i;
} else {
const newTypes = accepts.join('|');
reg = new RegExp('\\.(' + newTypes + ')$', 'i');
}
return reg.test(file.name); return reg.test(file.name);
} }