fix bug 4

src/components/UploadPic.vue

@@ -9,6 +9,7 @@
       :headers="fileHeader"
       accept="image/*"
       :before-upload="beforeUpload"
+      :custom-request="customRequest"
       @change="handelChange"
     >
       <div
@@ -45,7 +46,10 @@ import { message } from 'ant-design-vue'
 import type { UploadProps } from 'ant-design-vue'
 import { getToken } from '@/utils'
 import { fixFileCapture } from '@/utils/fixFileCapture'
-import { createWebpBeforeUpload } from '@/utils/prepareImageForUpload'
+import {
+  createImageBeforeUpload,
+  createImageCustomRequest
+} from '@/utils/prepareImageForUpload'
 import { normalizeUploadFileResponse, toAbsoluteFileUrl } from '@/utils/file'
 
 const loading = ref<boolean>(false)
@@ -72,37 +76,45 @@ const emit = defineEmits<{
   (e: 'errorUpload'): void
 }>()
 
-const beforeUpload: UploadProps['beforeUpload'] = createWebpBeforeUpload((msg) =>
+const beforeUpload: UploadProps['beforeUpload'] = createImageBeforeUpload((msg) =>
   message.error(msg)
 )
 
-function handelChange({ file, fileList }) {
-  if (Object.hasOwn(file, 'percent')) {
+const customRequest: UploadProps['customRequest'] = createImageCustomRequest({
+  action: () => url.value || uploadURL,
+  getHeaders: () => fileHeader.value,
+  messageError: (msg) => message.error(msg),
+  onStarted: () => {
+    loading.value = true
+    percent.value = 0
+    emit('startUpload')
+  },
+  onUploaded: (body) => {
+    const fileResource = normalizeUploadFileResponse(body)
+    const record = body && typeof body === 'object' ? (body as Record<string, any>) : undefined
+    imageUrl.value =
+      fileResource?.full_src ||
+      toAbsoluteFileUrl(record?.full_src || record?.src) ||
+      ''
+    loading.value = false
+    percent.value = 100
+    emit('upload', body)
+    message.success('فایل با موفقیت آپلود شد')
+  },
+  onFailed: () => {
+    loading.value = false
+    emit('errorUpload')
+  }
+})
+
+function handelChange({ file }) {
+  if (Object.hasOwn(file, 'percent') && file.percent != null) {
     percent.value = Math.floor(file.percent)
   }
   fixFileCapture()
 
   if (file.status === 'uploading') {
     loading.value = true
-    emit('startUpload')
-    return
-  }
-
-  if (file.status === 'error') {
-    loading.value = false
-    emit('errorUpload')
-    message.error('خطا در آپلود فایل')
-  }
-  if (file.status == 'done') {
-    const fileResource = normalizeUploadFileResponse(file.response)
-    imageUrl.value =
-      fileResource?.full_src ||
-      toAbsoluteFileUrl(file.response?.full_src || file.response?.src) ||
-      ''
-    loading.value = false
-    emit('upload', file.response)
-    message.success('فایل با موفقیت آپلود شد')
-  } else if (fileList.status == 'removed') {
   }
 }