refactor: 事件函数命名:onXxx
This commit is contained in:
parent
b5fb700e4e
commit
84dcac77b1
@ -6,13 +6,13 @@
|
||||
:limit="1"
|
||||
:file-list="fileList"
|
||||
:data="uploadData"
|
||||
:on-progress="() => (uploading = true)"
|
||||
:on-error="(err: Error) => message.error(`上传失败: ${err.message}`)"
|
||||
:before-upload="beforeUpload"
|
||||
:on-success="handleUploadSuccess"
|
||||
:on-progress="(isUploading = true)"
|
||||
:on-error="onUploadError"
|
||||
:before-upload="onBeforeUpload"
|
||||
:on-success="onUploadSuccess"
|
||||
>
|
||||
<el-button type="primary" plain :loading="uploading" :disabled="uploading">
|
||||
{{ uploading ? '正在上传' : '点击上传' }}
|
||||
<el-button type="primary" plain :loading="isUploading" :disabled="isUploading">
|
||||
{{ isUploading ? '正在上传' : '点击上传' }}
|
||||
</el-button>
|
||||
<template #tip>
|
||||
<span class="el-upload__tip" style="margin-left: 5px">
|
||||
@ -46,11 +46,13 @@ const uploadData: UploadData = reactive({
|
||||
title: '',
|
||||
introduction: ''
|
||||
})
|
||||
const uploading = ref(false)
|
||||
const isUploading = ref(false)
|
||||
|
||||
const beforeUpload = props.type === MaterialType.Image ? beforeImageUpload : beforeVoiceUpload
|
||||
/** 上传前检查 */
|
||||
const onBeforeUpload = props.type === MaterialType.Image ? beforeImageUpload : beforeVoiceUpload
|
||||
|
||||
const handleUploadSuccess: UploadProps['onSuccess'] = (res: any) => {
|
||||
/** 上传成功处理 */
|
||||
const onUploadSuccess: UploadProps['onSuccess'] = (res: any) => {
|
||||
if (res.code !== 0) {
|
||||
message.alertError('上传出错:' + res.msg)
|
||||
return false
|
||||
@ -62,7 +64,16 @@ const handleUploadSuccess: UploadProps['onSuccess'] = (res: any) => {
|
||||
uploadData.introduction = ''
|
||||
|
||||
message.notifySuccess('上传成功')
|
||||
uploading.value = false
|
||||
isUploading.value = false
|
||||
emit('uploaded')
|
||||
}
|
||||
|
||||
/** 上传失败处理 */
|
||||
const onUploadError = (err: Error) => message.error('上传失败: ' + err.message)
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-upload__tip {
|
||||
margin-left: 5px;
|
||||
}
|
||||
</style>
|
||||
|
@ -8,9 +8,9 @@
|
||||
:file-list="fileList"
|
||||
:data="uploadData"
|
||||
:before-upload="beforeVideoUpload"
|
||||
:on-progress="() => (uploading = true)"
|
||||
:on-error="(err: Error) => message.error(`上传失败: ${err.message}`)"
|
||||
:on-success="handleUploadSuccess"
|
||||
:on-progress="(isUploading = true)"
|
||||
:on-error="onUploadError"
|
||||
:on-success="onUploadSuccess"
|
||||
ref="uploadVideoRef"
|
||||
:auto-upload="false"
|
||||
class="mb-5"
|
||||
@ -23,7 +23,7 @@
|
||||
>
|
||||
</el-upload>
|
||||
<el-divider />
|
||||
<el-form :model="uploadData" :rules="uploadRules" ref="uploadFormRef" v-loading="uploading">
|
||||
<el-form :model="uploadData" :rules="uploadRules" ref="uploadFormRef" v-loading="isUploading">
|
||||
<el-form-item label="标题" prop="title">
|
||||
<el-input
|
||||
v-model="uploadData.title"
|
||||
@ -41,7 +41,7 @@
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="showDialog = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitVideo" :loading="uploading" :disabled="uploading"
|
||||
<el-button type="primary" @click="submitVideo" :loading="isUploading" :disabled="isUploading"
|
||||
>提 交</el-button
|
||||
>
|
||||
</template>
|
||||
@ -76,7 +76,7 @@ const emit = defineEmits<{
|
||||
(e: 'uploaded', v: void)
|
||||
}>()
|
||||
|
||||
const showDialog = computed({
|
||||
const showDialog = computed<boolean>({
|
||||
get() {
|
||||
return props.modelValue
|
||||
},
|
||||
@ -85,7 +85,7 @@ const showDialog = computed({
|
||||
}
|
||||
})
|
||||
|
||||
const uploading = ref(false)
|
||||
const isUploading = ref(false)
|
||||
|
||||
const fileList = ref<UploadUserFile[]>([])
|
||||
|
||||
@ -107,8 +107,9 @@ const submitVideo = () => {
|
||||
})
|
||||
}
|
||||
|
||||
const handleUploadSuccess: UploadProps['onSuccess'] = (res: any) => {
|
||||
uploading.value = false
|
||||
/** 上传成功处理 */
|
||||
const onUploadSuccess: UploadProps['onSuccess'] = (res: any) => {
|
||||
isUploading.value = false
|
||||
if (res.code !== 0) {
|
||||
message.error('上传出错:' + res.msg)
|
||||
return false
|
||||
@ -123,4 +124,7 @@ const handleUploadSuccess: UploadProps['onSuccess'] = (res: any) => {
|
||||
message.notifySuccess('上传成功')
|
||||
emit('uploaded')
|
||||
}
|
||||
|
||||
/** 上传失败处理 */
|
||||
const onUploadError = (err: Error) => message.error(`上传失败: ${err.message}`)
|
||||
</script>
|
||||
|
@ -2,7 +2,6 @@ import type { UploadProps, UploadRawFile } from 'element-plus'
|
||||
import { getAccessToken } from '@/utils/auth'
|
||||
const message = useMessage() // 消息
|
||||
const HEADERS = { Authorization: 'Bearer ' + getAccessToken() } // 请求头
|
||||
// const UPLOAD_URL = 'http://127.0.0.1:8000/upload/' // 上传地址
|
||||
const UPLOAD_URL = import.meta.env.VITE_BASE_URL + '/admin-api/mp/material/upload-permanent' // 上传地址
|
||||
|
||||
enum MaterialType {
|
||||
|
Loading…
Reference in New Issue
Block a user