fix: 修改多图片上传页面

src/components/Tinymce.vue

@@ -70,11 +70,11 @@ const props = defineProps({
     type: [String, Array],
     default: "微软雅黑=Microsoft YaHei,Helvetica Neue,PingFang SC,sans-serif;苹果苹方=PingFang SC,Microsoft YaHei,sans-serif;宋体=simsun,serif;仿宋体=FangSong,serif;黑体=SimHei,sans-serif;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;"
   },
-  width:{
+  width: {
     type: String,
     default: 'auto'
   },
-  height:{
+  height: {
     type: Number,
     default: 500
   }
@@ -90,7 +90,7 @@ const init = reactive({
   placeholder: "在这里输入文字", //textarea中的提示信息
   min_width: 300,
   min_height: 200,
-  width:props.width,
+  width: props.width,
   height: props.height, //注：引入autoresize插件时，此属性失效
   resize: "both", //编辑器宽高是否可变，false-否,true-高可变，'both'-宽高均可，注意引号
   promotion: false,
@@ -117,9 +117,15 @@ const init = reactive({
     let formData = new FormData()
     formData.append('file', blobInfo.blob())
     //上传图片接口 上传成功后返回图片地址，用于显示在富文本中
-    uploadFile(formData, props.imageUrl, success)
+    uploadFile(formData, props.imageUrl, success, true)
     // }),
   },
+  images_upload_handler_not_loading: (blobInfo, success) => {
+    let formData = new FormData()
+    formData.append('file', blobInfo.blob())
+    //上传图片接口
+    uploadFile(formData, props.imageUrl, success, false)
+  },
   file_picker_callback: (callback, value, meta) => {
     // 使用案例http://tinymce.ax-z.cn/general/upload-images.php
     // meta.filetype  //根据这个判断点击的是什么file image media
@@ -141,34 +147,34 @@ const init = reactive({
       let xhr, formData;
       xhr = new XMLHttpRequest();
       xhr.withCredentials = false;
-      xhr.open('POST', import.meta.env.VITE_BASE_URL+props.imageUrl);
+      xhr.open('POST', import.meta.env.VITE_BASE_URL + props.imageUrl);
       xhr.setRequestHeader(
-        'Authorization',getToken()
+          'Authorization', getToken()
       )
-      let loading= ElLoading.service({
+      let loading = ElLoading.service({
         lock: true,
         text: '文件上传中...',
         background: 'rgba(0, 0, 0, 0.7)',
       })
-      xhr.onload = function() {
+      xhr.onload = function () {
         let res;
         // if (xhr.status != 200) {
         //   failure('HTTP Error: ' + xhr.status);
         //   return;
         // }
         res = JSON.parse(xhr.responseText);
-          ElNotification({
-            title: '提示',
-            message: res.code === 1000 ? '上传成功' : '上传失败',
-            type: res.code === 1000 ? 'success' : 'error'
-          })
+        ElNotification({
+          title: '提示',
+          message: res.code === 1000 ? '上传成功' : '上传失败',
+          type: res.code === 1000 ? 'success' : 'error'
+        })
         loading.close()
         const fileUrl = res.data.url;
         // '?fileId='+res.data.id+
-        callback(fileUrl+'?fileName='+res.data.originalFilename, {text:file.name ,title: file.name });
+        callback(fileUrl + '?fileName=' + res.data.originalFilename, {text: file.name, title: file.name});
       };
       formData = new FormData();
-      formData.append('file', file, file.name );
+      formData.append('file', file, file.name);
       xhr.send(formData);
       //
       // let reader = new FileReader();
@@ -192,12 +198,16 @@ const init = reactive({
 watch(() => {
   emit("update:value", content.value);
 });
-const uploadFile = (formData, url,success) => {
- let loading= ElLoading.service({
-    lock: true,
-    text: '图片上传中...',
-    background: 'rgba(0, 0, 0, 0.7)',
-  })
+const uploadFile = (formData, url, success, isLoading) => {
+  let loading = null
+  if (isLoading) {
+    loading = ElLoading.service({
+      lock: true,
+      text: '图片上传中...',
+      background: 'rgba(0, 0, 0, 0.7)',
+    })
+  }
+
   axios.post(
       import.meta.env.VITE_BASE_URL + url,
       formData,
@@ -214,16 +224,24 @@ const uploadFile = (formData, url,success) => {
     let data = res.data
     if (data.code !== 1000) {
       ElMessage.error(data.msg)
-      loading.close()
-    }else {
-      success(data.data.url)
-      loading.close()
+      if (loading) {
+        loading.close()
+      }
+    } else {
+      if (isLoading) {
+        success(data.data.url)
+      } else {
+        success(data.data.url, data.data.originalFilename)
+      }
+      if (loading) {
+        loading.close()
+      }
     }
   })
 }
 </script>
 <style scoped lang="scss">
-.tox-sidebar-wrap{
+.tox-sidebar-wrap {
   &::-webkit-scrollbar {
     width: 6px;
   }
@@ -240,13 +258,14 @@ const uploadFile = (formData, url,success) => {
     border-radius: 10px;
   }
 }
+
 .tinymce-boxz > textarea {
   display: none;
 
 }
 
 </style>
-<style  lang="scss">
+<style lang="scss">
 /* 隐藏apikey没有绑定当前域名的提示 */
 .tox-notifications-container .tox-notification--warning {
   display: none !important;