优化上传附件功能,提升用户体验,提高操作效率。
This commit is contained in:
parent
e16e2b717e
commit
625578a4b1
@ -1,15 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-upload
|
<el-upload :accept="acceptList" :show-file-list="true" aria-hidden="true" :headers="{ Token: userStore?.token }"
|
||||||
accept="doc, docx, xls, xlsx, ppt, pptx, pdf, txt, zip, rar, tar, jpg, png, gif, jpeg, webp, wmv, avi, mpg, mpeg, 3gp, mov, mp4, flv, f4v, rmvb, mkv"
|
:action="base_url + '/upload/file'" :on-success="handleAvatarSuccess" ref="upload" :limit="100" multiple
|
||||||
:show-file-list="true" aria-hidden="true" :headers="{ Token: userStore?.token }" :action="base_url + '/upload/file'"
|
:on-preview="previewFile" :on-remove="removeFile" :before-upload="checkSize">
|
||||||
:on-success="handleAvatarSuccess" ref="upload" :limit="100" multiple :on-preview="previewFile"
|
|
||||||
:on-remove="removeFile">
|
|
||||||
<template #tip>
|
<template #tip>
|
||||||
<span class="text-primary" style="margin-left:5px;font-size:11px">提示:文件单个大小不能超过1个G</span>
|
<span class="text-primary" style="margin-left:5px;font-size:11px">提示:文件单个大小不能超过1个G</span>
|
||||||
</template>
|
</template>
|
||||||
<el-button type="primary">
|
<template #default>
|
||||||
上传
|
<el-button type="primary">
|
||||||
</el-button>
|
上传
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@ -17,6 +17,7 @@ import { ref, defineProps } from "vue"
|
|||||||
import configs from "@/config"
|
import configs from "@/config"
|
||||||
import useUserStore from "@/stores/modules/user";
|
import useUserStore from "@/stores/modules/user";
|
||||||
|
|
||||||
|
const acceptList = reactive('doc, docx, xls, xlsx, ppt, pptx, pdf, txt, zip, rar, tar, jpg, png, gif, jpeg, webp, wmv, avi, mpg, mpeg, 3gp, mov, mp4, flv, f4v, rmvb, mkv')
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const base_url = ref(configs.baseUrl + configs.urlPrefix)
|
const base_url = ref(configs.baseUrl + configs.urlPrefix)
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
@ -30,6 +31,14 @@ const props = defineProps({
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const checkSize = (e) => {
|
||||||
|
if (e.size > 1024000000) {
|
||||||
|
ElMessage.error('文件大小不能超过1个G')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
const handleAvatarSuccess = (response: any) => {
|
const handleAvatarSuccess = (response: any) => {
|
||||||
props.formData[props.value] ||= []
|
props.formData[props.value] ||= []
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
|
Loading…
x
Reference in New Issue
Block a user