perf: editor image upload

yudao-ui-admin-vue3/src/components/Editor/src/Editor.vue

@@ -8,6 +8,8 @@ import { ElMessage } from 'element-plus'
 import { useLocaleStore } from '@/store/modules/locale'
 import { getAccessToken, getTenantId } from '@/utils/auth'
 
+type InsertFnType = (url: string, alt: string, href: string) => void
+
 const localeStore = useLocaleStore()
 
 const currentLocale = computed(() => localeStore.getCurrentLocale)
@@ -85,29 +87,58 @@ const editorConfig = computed((): IEditorConfig => {
         ['uploadImage']: {
           server: import.meta.env.VITE_UPLOAD_URL,
           // 单个文件的最大体积限制，默认为 2M
-          maxFileSize: 2 * 1024 * 1024,
+          maxFileSize: 5 * 1024 * 1024,
           // 最多可上传几个文件，默认为 100
           maxNumberOfFiles: 10,
           // 选择文件时的类型限制，默认为 ['image/*'] 。如不想限制，则设置为 []
           allowedFileTypes: ['image/*'],
 
           // 自定义上传参数，例如传递验证的 token 等。参数会被添加到 formData 中，一起上传到服务端。
-          meta: {},
+          meta: { updateSupport: 0 },
           // 将 meta 拼接到 url 参数中，默认 false
-          metaWithUrl: false,
+          metaWithUrl: true,
 
           // 自定义增加 http  header
           headers: {
-            Accept: 'image/*',
+            Accept: '*',
             Authorization: 'Bearer ' + getAccessToken(),
             'tenant-id': getTenantId()
           },
 
           // 跨域是否传递 cookie ，默认为 false
-          withCredentials: false,
+          withCredentials: true,
 
           // 超时时间，默认为 10 秒
-          timeout: 5 * 1000 // 5 秒
+          timeout: 5 * 1000, // 5 秒
+
+          // form-data fieldName，后端接口参数名称，默认值wangeditor-uploaded-image
+          fieldName: 'file',
+
+          // 上传之前触发
+          onBeforeUpload(file: File) {
+            console.log(file)
+            return file
+          },
+          // 上传进度的回调函数
+          onProgress(progress: number) {
+            // progress 是 0-100 的数字
+            console.log('progress', progress)
+          },
+          onSuccess(file: File, res: any) {
+            console.log('onSuccess', file, res)
+          },
+          onFailed(file: File, res: any) {
+            alert(res.message)
+            console.log('onFailed', file, res)
+          },
+          onError(file: File, err: any, res: any) {
+            alert(err.message)
+            console.error('onError', file, err, res)
+          },
+          // 自定义插入图片
+          customInsert(res: any, insertFn: InsertFnType) {
+            insertFn(res.data, 'image', res.data)
+          }
         }
       },
       uploadImgShowBase64: true