@keyblade/tinymce-editor-vue2 0.0.12-alpha.16 → 0.0.12-alpha.18

package/README.md

@@ -99,88 +99,6 @@ onMounted(() => {
 </script>
 ```
 
-### 3.使用工具类（单独使用图片上传组件的，可使用以下工具类自行处理）
-```typescript
-import { oneTravelImageCheck, oneTravelImageCompressor, interceptImgPondBeforeAddFile } from '@keyblade/tinymce-editor-vue2'
-
-// oneTravelImageCheck: 一码游图片检测工具
-// oneTravelImageCompressor: 一码游图片压缩工具
-// interceptImgPondBeforeAddFile 统一处理拦截ImgPond方法，内部包含heif格式转换
-```
-
-#### interceptImgPondBeforeAddFile
-如果项目中单独有使用ImgPond组件，需要对内部方法进行拦截，否则上传 heif 格式的图片不能正常显示，以下是示例，使用组合式 Api 语法，选项式 Api 请自行替换
-
-1.绑定 ref 对象
-```html
-<ImgPond
-  ref="audioImageImgPondRef"
-  v-model="uploadAudio.formData.cover"
->
-</ImgPond>
-```
-
-2.拦截
-```typescript
-const uploadImageImgPondRef = ref()
-watch(() => uploadImageImgPondRef.value, () => {
-  if (uploadImageImgPondRef.value) {
-    let loadingIns: ElLoadingComponent
-    interceptImgPondBeforeAddFile(uploadImageImgPondRef.value, {
-      onStart: () => {
-        loadingIns = Loading.service({text: '加载中...', fullscreen: true, customClass: 'tinymce-loading' })
-      },
-      onEnd: () => {
-        loadingIns?.close()
-      }
-    })
-  }
-}, { immediate: true })
-```
-
-
-#### 工具类Api
-
-```typescript
-export async function oneTravelImageCheck(data: File | Blob, options?: {
-  imageMaxSize?: number;
-  imageAllowedType?: string[];
-  imageAllowedMineType?: string[]
-  imageMinWidth?: number;
-  imageMinHeight?: number;
-  imageMaxWidth?: number;
-  imageMaxHeight?: number;
-}): Promise<{
-  /** 是否成功 */
-  success: boolean;
-  /** 处理完成的文件（有可能不需要处理） */
-  file?: File | Blob;
-  /** 失败 */
-  error?: {
-    size?: boolean;
-    format?: boolean;
-    pixel?: boolean;
-    message?: string
-  },
-  /** 错误消息 */
-  errorMessage?: string;
-}> {}
-
-export async function oneTravelImageCompressor(data: File | Blob): Promise<{
-  // 文件
-  file: File | Blob,
-  // 是否经过处理（没有处理的话，会返回原 file 对象）
-  hasConversion: boolean;
-  success: boolean;
-  errorMessage?: string
-}>{}
-
-export async function interceptImgPondBeforeAddFile(imgPondIns: any, options?: {
-  onStart?: () => void,
-  onEnd?: () => void,
-}) {}
-```
-
 ## 三、Api
 ### 1.全局属性
 ```typescript

package/es/editor.vue2.js

@@ -1,9 +1,10 @@
-import { defineComponent as he, ref as d, watch as k, computed as M, onMounted as Me, onUnmounted as xe } from "vue";
-import { interceptImgPondBeforeAddFile as G, oneTravelImageCheck as L, oneTravelImageCompressor as J, getImagePixel as ye } from "./util.js";
-import be from "imgpond";
+import { defineComponent as me, ref as d, watch as D, computed as h, onMounted as ce, onUnmounted as pe } from "vue";
+import { oneTravelImgPondBeforeAddFile as $, oneTravelImageCheckAndTransform as fe, oneTravelImageCompressor as F } from "@keyblade/one-travel";
+import { getImagePixel as ge } from "./util.js";
+import ve from "imgpond";
 import { conclude as x } from "vue-global-config";
-import K from "tinymce";
-import _e from "./langs/zh_CN.js";
+import j from "tinymce";
+import he from "./langs/zh_CN.js";
 import "tinymce/skins/ui/oxide/skin";
 import "tinymce/models/dom";
 import "tinymce/themes/silver";
@@ -32,9 +33,9 @@ import "tinymce/plugins/table";
 import "tinymce/plugins/visualblocks";
 import "tinymce/plugins/visualchars";
 import "tinymce/plugins/wordcount";
-import { globalProps as y } from "./index.js";
-import { Loading as W, Message as h } from "element-ui";
-const la = /* @__PURE__ */ he({
+import { globalProps as b } from "./index.js";
+import { Loading as z, Message as c } from "element-ui";
+const oa = /* @__PURE__ */ me({
   __name: "editor",
   props: {
     value: { default: "" },
@@ -66,55 +67,61 @@ const la = /* @__PURE__ */ he({
     imgPondOptions: null
   },
   emits: ["input", "update:modelValue"],
-  setup(Q, { emit: z }) {
-    const o = Q;
-    K.addI18n("zh_CN", _e);
-    const R = d(), u = d(), U = d(!1), C = d(!1), V = d();
-    k(() => V.value, () => {
-      if (V.value) {
+  setup(q, { emit: C }) {
+    const i = q;
+    j.addI18n("zh_CN", he);
+    const B = d(), u = d(), A = d(!1), w = d(!1), T = d();
+    D(() => T.value, () => {
+      if (T.value) {
         let a;
-        G(V.value, {
+        $(T.value, {
           onStart: () => {
-            a = W.service({ text: "加载中...", fullscreen: !0, customClass: "tinymce-loading" });
+            a = z.service({ text: "加载中...", fullscreen: !0, customClass: "tinymce-loading" });
           },
-          onEnd: () => {
+          onSuccess: () => {
             a == null || a.close();
+          },
+          onError: (l) => {
+            a == null || a.close(), c.error(l);
           }
         });
       }
     }, { immediate: !0 });
-    const P = d();
-    k(() => P.value, () => {
-      if (P.value) {
+    const U = d();
+    D(() => U.value, () => {
+      if (U.value) {
         let a;
-        G(P.value, {
+        $(U.value, {
           onStart: () => {
-            a = W.service({ text: "加载中", fullscreen: !0, customClass: "tinymce-loading" });
+            a = z.service({ text: "加载中", fullscreen: !0, customClass: "tinymce-loading" });
           },
-          onEnd: () => {
+          onSuccess: () => {
             a == null || a.close();
+          },
+          onError: (l) => {
+            a == null || a.close(), c.error(l);
           }
         });
       }
     }, { immediate: !0 });
-    const g = d({
+    const p = d({
       dialogVisible: !1,
       formData: {
         images: []
       }
-    }), B = d(), X = () => {
-      g.value.dialogVisible = !1, g.value.formData = {
+    }), H = d(), N = () => {
+      p.value.dialogVisible = !1, p.value.formData = {
         images: []
       };
-    }, Y = () => {
+    }, G = () => {
       var a;
-      (a = B.value) == null || a.validate((l) => {
-        l && (g.value.formData.images.forEach((i) => {
+      (a = H.value) == null || a.validate((l) => {
+        l && (p.value.formData.images.forEach((o) => {
           var e, t;
-          if (H.value.srcAt)
-            return (e = u.value) == null ? void 0 : e.insertContent(`<img src=${i == null ? void 0 : i[H.value.srcAt]} alt="" />`);
-          (t = u.value) == null || t.insertContent(`<img src=${i} alt="" />`);
-        }), g.value.dialogVisible = !1, g.value.formData.images = []);
+          if (S.value.srcAt)
+            return (e = u.value) == null ? void 0 : e.insertContent(`<img src=${o == null ? void 0 : o[S.value.srcAt]} alt="" />`);
+          (t = u.value) == null || t.insertContent(`<img src=${o} alt="" />`);
+        }), p.value.dialogVisible = !1, p.value.formData.images = []);
       });
     }, r = d({
       dialogVisible: !1,
@@ -128,17 +135,17 @@ const la = /* @__PURE__ */ he({
       },
       // 用于临时保存上传前的参数 { file: File }
       additionalData: {}
-    }), E = d(), Z = () => {
+    }), R = d(), L = () => {
       var a;
-      (a = E.value) == null || a.validate((l) => {
-        var i, e;
-        l && ((e = u.value) == null || e.insertContent(`<audio controls data-name="${r.value.formData.name}" data-poster="${r.value.formData.cover[0]}" src="${(i = r.value.formData.file[0]) == null ? void 0 : i.url}"></audio>`), r.value.dialogVisible = !1, r.value.formData = {
+      (a = R.value) == null || a.validate((l) => {
+        var o, e;
+        l && ((e = u.value) == null || e.insertContent(`<audio controls data-name="${r.value.formData.name}" data-poster="${r.value.formData.cover[0]}" src="${(o = r.value.formData.file[0]) == null ? void 0 : o.url}"></audio>`), r.value.dialogVisible = !1, r.value.formData = {
           name: "",
           cover: [],
           file: []
         }, r.value.additionalData = {});
       });
-    }, ee = () => {
+    }, J = () => {
       r.value.dialogVisible = !1, r.value.formData = {
         name: "",
         cover: [],
@@ -152,92 +159,74 @@ const la = /* @__PURE__ */ he({
       },
       // 用于临时保存上传前的参数 { file: File }
       additionalData: {}
-    }), I = d(), ae = () => {
+    }), W = d(), K = () => {
       var a;
-      (a = I.value) == null || a.validate((l) => {
-        var i, e;
-        l && ((e = u.value) == null || e.insertContent(`<video controls controlslist="nodownload" src="${(i = s.value.formData.file[0]) == null ? void 0 : i.url}"></video>`), s.value.dialogVisible = !1, s.value.formData = {
+      (a = W.value) == null || a.validate((l) => {
+        var o, e;
+        l && ((e = u.value) == null || e.insertContent(`<video controls controlslist="nodownload" src="${(o = s.value.formData.file[0]) == null ? void 0 : o.url}"></video>`), s.value.dialogVisible = !1, s.value.formData = {
           file: []
         }, s.value.additionalData = {});
       });
-    }, oe = () => {
+    }, Q = () => {
       s.value.dialogVisible = !1, s.value.formData = {
         file: []
       }, s.value.additionalData = {};
-    }, ie = (a, l) => new Promise(async (i, e) => {
-      var p, c;
-      const t = await L(a, {
-        imageMaxSize: o.imageMaxSize,
-        imageAllowedType: o.imageAllowedType,
-        imageAllowedMineType: o.imageAllowedMineType,
-        imageMinWidth: o.imageMinWidth,
-        imageMinHeight: o.imageMinHeight,
-        imageMaxWidth: o.imageMaxWidth,
-        imageMaxHeight: o.imageMaxHeight
-      });
+    }, X = (a, l) => new Promise(async (o, e) => {
+      var m;
+      const t = await F(a);
       if (!t.success) {
         e(), setTimeout(() => {
-          var A, w, T;
-          (A = t.error) != null && A.size ? l.onError(`请上传大小不超过${o.imageMaxSize}M的图片`) : (w = t.error) != null && w.format ? l.onError(`请上传格式为${o.imageAllowedType.map(($) => $.toUpperCase()).join("、")}的图片`) : (T = t.error) != null && T.pixel && l.onError(`请上传像素不低于${o.imageMinWidth}*${o.imageMinHeight}且像素不高于${o.imageMaxWidth}*${o.imageMaxHeight}的图片`);
+          l.onError(t.errorMessage);
         });
         return;
       }
-      const n = await J(a);
+      const n = await ((m = f.value) == null ? void 0 : m.call(f, t.file, a.name, { extParameters: i.extParameters }));
       if (!n.success) {
         e(), setTimeout(() => {
           l.onError(n.errorMessage);
         });
         return;
       }
-      let m = a.name;
-      n.hasConversion && (m = `${(p = m.split(".")) == null ? void 0 : p[0]}.jpeg`);
-      const v = await ((c = f.value) == null ? void 0 : c.call(f, n.file, m, { extParameters: o.extParameters }));
-      if (!v.success) {
-        e(), setTimeout(() => {
-          l.onError(v.errorMessage);
-        });
-        return;
-      }
-      i(v.url);
-    }), te = M(() => o.imageAllowedMineType.map((a) => `.${a.split("/")[1]}`).join(",") || "");
-    async function O(a) {
-      var i, e;
+      o(n.url);
+    }), Y = h(() => i.imageAllowedMineType.map((a) => `.${a.split("/")[1]}`).join(",") || "");
+    async function E(a) {
+      var o, e;
       const l = a.getElementsByTagName("img");
       for (let t of l) {
         const n = t.src;
         if (n.startsWith("http://") || n.startsWith("https://")) {
-          const m = await ye(n);
-          if (m.width < o.imageMinWidth && m.height < o.imageMinHeight || m.width > o.imageMaxWidth && m.height > o.imageMaxHeight) {
-            (i = t == null ? void 0 : t.remove) == null || i.call(t);
+          const m = await ge(n);
+          if (m.width < i.imageMinWidth && m.height < i.imageMinHeight || m.width > i.imageMaxWidth && m.height > i.imageMaxHeight) {
+            (o = t == null ? void 0 : t.remove) == null || o.call(t);
             return;
           }
-          const v = n.split("."), p = v[v.length - 1].toLowerCase();
-          if (!o.imageAllowedType.includes(p)) {
+          const g = n.split("."), v = g[g.length - 1].toLowerCase();
+          if (!i.imageAllowedType.includes(v)) {
             (e = t == null ? void 0 : t.remove) == null || e.call(t);
             return;
           }
         }
       }
     }
-    const b = M(() => x([o.videoUploadOptions, y.videoUploadOptions]) || {}), _ = M(() => x([o.audioUploadOptions, y.audioUploadOptions]) || {}), H = M(() => x([o.imgPondOptions, y.imgPondOptions]) || {}), D = M(
-      () => x([o.paste_preprocess, y.paste_preprocess], {
+    const y = h(() => x([i.videoUploadOptions, b.videoUploadOptions]) || {}), M = h(() => x([i.audioUploadOptions, b.audioUploadOptions]) || {}), S = h(() => x([i.imgPondOptions, b.imgPondOptions]) || {}), V = h(
+      () => x([i.paste_preprocess, b.paste_preprocess], {
         type: Function
       })
-    ), S = M(
-      () => x([o.paste_postprocess, y.paste_postprocess], {
+    ), P = h(
+      () => x([i.paste_postprocess, b.paste_postprocess], {
         type: Function
       })
-    ), f = M(
-      () => x([o.imageUploadHandle, y.imageUploadHandle], {
+    ), f = h(
+      () => x([i.imageUploadHandle, b.imageUploadHandle], {
         type: Function
       })
     );
-    Me(() => {
+    ce(() => {
       const a = {
         // 设置语言
         language: "zh_CN",
         // 实例
-        target: R.value,
+        target: B.value,
         // 隐藏品牌
         branding: !1,
         // 隐藏右上角升级按钮
@@ -313,99 +302,93 @@ const la = /* @__PURE__ */ he({
         paste_webkit_styles: "all",
         paste_data_images: !0,
         // 粘贴前处理
-        paste_preprocess(i, e) {
+        paste_preprocess(o, e) {
           var t;
-          e.content = e.content.replace(/<video[^>]*(?:\/>|>[\s\S]*?<\/video>)/g, ""), e.content = e.content.replace(/<audio[^>]*(?:\/>|>[\s\S]*?<\/audio>)/g, ""), e.content = e.content.replace(/<nav/g, "<div").replace(/<\/nav>/g, "</div>"), e.content = e.content.replace(/<header/g, "<div").replace(/<\/header>/g, "</div>"), e.content = e.content.replace(/<footer/g, "<div").replace(/<\/footer>/g, "</div>"), e.content = e.content.replace(/<aside/g, "<div").replace(/<\/aside>/g, "</div>"), e.content = e.content.replace(/<section/g, "<div").replace(/<\/section>/g, "</div>"), e.content = e.content.replace(/<main/g, "<div").replace(/<\/main>/g, "</div>"), e.content = e.content.replace(/<article/g, "<div").replace(/<\/article>/g, "</div>"), e.content = e.content.replace(/<details/g, "<div").replace(/<\/details>/g, "</div>"), (t = D.value) == null || t.call(D, i, e);
+          e.content = e.content.replace(/<video[^>]*(?:\/>|>[\s\S]*?<\/video>)/g, ""), e.content = e.content.replace(/<audio[^>]*(?:\/>|>[\s\S]*?<\/audio>)/g, ""), e.content = e.content.replace(/<nav/g, "<div").replace(/<\/nav>/g, "</div>"), e.content = e.content.replace(/<header/g, "<div").replace(/<\/header>/g, "</div>"), e.content = e.content.replace(/<footer/g, "<div").replace(/<\/footer>/g, "</div>"), e.content = e.content.replace(/<aside/g, "<div").replace(/<\/aside>/g, "</div>"), e.content = e.content.replace(/<section/g, "<div").replace(/<\/section>/g, "</div>"), e.content = e.content.replace(/<main/g, "<div").replace(/<\/main>/g, "</div>"), e.content = e.content.replace(/<article/g, "<div").replace(/<\/article>/g, "</div>"), e.content = e.content.replace(/<details/g, "<div").replace(/<\/details>/g, "</div>"), (t = V.value) == null || t.call(V, o, e);
         },
         // 粘贴后处理(处理异步操作)
-        paste_postprocess(i, e) {
+        paste_postprocess(o, e) {
           var n;
           const t = e.node;
-          O(t), (n = S.value) == null || n.call(S, i, e);
+          E(t), (n = P.value) == null || n.call(P, o, e);
         },
-        images_upload_handler(i) {
+        images_upload_handler(o) {
           return new Promise(async (e, t) => {
-            var T, $, F, N, q;
-            const n = W.service({ text: "上传中" });
-            let m = i.blob();
-            const v = i.filename(), p = await L(m, {
-              imageMaxSize: o.imageMaxSize,
-              imageAllowedType: o.imageAllowedType,
-              imageAllowedMineType: o.imageAllowedMineType,
-              imageMinWidth: o.imageMinWidth,
-              imageMinHeight: o.imageMinHeight,
-              imageMaxWidth: o.imageMaxWidth,
-              imageMaxHeight: o.imageMaxHeight
+            var I;
+            if (!f.value)
+              return t({ message: "缺少图片上传配置", remove: !0 });
+            const n = z.service({ text: "上传中" });
+            let m = o.blob(), g = o.filename();
+            const v = await fe(m, {
+              imageMaxSize: i.imageMaxSize,
+              imageAllowedType: i.imageAllowedType,
+              imageAllowedMineType: i.imageAllowedMineType,
+              imageMinWidth: i.imageMinWidth,
+              imageMinHeight: i.imageMinHeight,
+              imageMaxWidth: i.imageMaxWidth,
+              imageMaxHeight: i.imageMaxHeight
             });
-            if (!p.success) {
-              if (n == null || n.close(), (T = p.error) != null && T.size)
-                return t({ message: `请上传大小不超过${o.imageMaxSize}M的图片`, remove: !0 });
-              if (($ = p.error) != null && $.format)
-                return t({ message: `请上传格式为${o.imageAllowedType.map((j) => j.toUpperCase()).join("、")}的图片`, remove: !0 });
-              if ((F = p.error) != null && F.pixel)
-                return t({ message: `请上传像素不低于${o.imageMinWidth}*${o.imageMinHeight}且像素不高于${o.imageMaxWidth}*${o.imageMaxHeight}的图片`, remove: !0 });
+            if (v.success || (n == null || n.close(), t({ message: (v == null ? void 0 : v.errorMessage) || "", remove: !0 })), v.hasTransform) {
+              const O = g == null ? void 0 : g.split(".");
+              O.pop(), g = `${O.join(",")}.jpeg`;
             }
-            const c = await J(m);
-            if (!c.success)
-              return n == null || n.close(), t({ message: c == null ? void 0 : c.errorMessage, remove: !0 });
-            if (!f.value)
-              return n == null || n.close(), t({ message: "缺少图片上传配置", remove: !0 });
-            let A = i.filename();
-            c.hasConversion && (A = `${(N = v.split(".")) == null ? void 0 : N[0]}.jpeg`);
-            const w = await ((q = f.value) == null ? void 0 : q.call(f, c.file, A, { extParameters: o.extParameters }));
-            if (!w.success)
-              return n == null || n.close(), t({ message: w.errorMessage, remove: !0 });
-            n == null || n.close(), e(w.url);
+            const _ = await F(m);
+            if (!_.success)
+              return n == null || n.close(), t({ message: _ == null ? void 0 : _.errorMessage, remove: !0 });
+            const k = await ((I = f.value) == null ? void 0 : I.call(f, _.file, g, { extParameters: i.extParameters }));
+            if (!k.success)
+              return n == null || n.close(), t({ message: k.errorMessage, remove: !0 });
+            n == null || n.close(), e(k.url);
           });
         },
-        setup(i) {
-          i.ui.registry.addMenuItem("localImage", {
+        setup(o) {
+          o.ui.registry.addMenuItem("localImage", {
             text: "图片",
             icon: "image",
             onAction: () => {
-              g.value.dialogVisible = !0, setTimeout(() => {
+              p.value.dialogVisible = !0, setTimeout(() => {
                 var t;
                 const e = (t = document == null ? void 0 : document.querySelector) == null ? void 0 : t.call(document, ".tinymce-editor-upload-image-dialog .el-upload__text > div");
-                e && (e.innerHTML = o.imageUploadTip || "上传");
+                e && (e.innerHTML = i.imageUploadTip || "上传");
               });
             }
-          }), i.ui.registry.addButton("localImage", {
+          }), o.ui.registry.addButton("localImage", {
             icon: "image",
             tooltip: "图片",
             onAction: () => {
-              g.value.dialogVisible = !0, setTimeout(() => {
+              p.value.dialogVisible = !0, setTimeout(() => {
                 var t;
                 const e = (t = document == null ? void 0 : document.querySelector) == null ? void 0 : t.call(document, ".tinymce-editor-upload-image-dialog .el-upload__text > div");
-                e && (e.innerHTML = o.imageUploadTip || "上传");
+                e && (e.innerHTML = i.imageUploadTip || "上传");
               });
             }
-          }), o.audioEnable && (i.ui.registry.addMenuItem("localAudio", {
+          }), i.audioEnable && (o.ui.registry.addMenuItem("localAudio", {
             text: "音频",
             icon: "arrow-right",
             onAction: () => {
               r.value.dialogVisible = !0, setTimeout(() => {
                 var t;
                 const e = (t = document == null ? void 0 : document.querySelector) == null ? void 0 : t.call(document, ".tinymce-editor-upload-audio-dialog .el-upload__text > div");
-                e && (e.innerHTML = o.imageUploadTip || "上传");
+                e && (e.innerHTML = i.imageUploadTip || "上传");
               });
             }
-          }), i.ui.registry.addButton("localAudio", {
+          }), o.ui.registry.addButton("localAudio", {
             icon: "arrow-right",
             tooltip: "音频",
             onAction: () => {
               r.value.dialogVisible = !0, setTimeout(() => {
                 var t;
                 const e = (t = document == null ? void 0 : document.querySelector) == null ? void 0 : t.call(document, ".tinymce-editor-upload-audio-dialog .el-upload__text > div");
-                e && (e.innerHTML = o.imageUploadTip || "上传");
+                e && (e.innerHTML = i.imageUploadTip || "上传");
               });
             }
-          })), o.videoEnable && (i.ui.registry.addMenuItem("localVideo", {
+          })), i.videoEnable && (o.ui.registry.addMenuItem("localVideo", {
             text: "视频",
             icon: "embed",
             onAction: () => {
               s.value.dialogVisible = !0;
             }
-          }), i.ui.registry.addButton("localVideo", {
+          }), o.ui.registry.addButton("localVideo", {
             icon: "embed",
             tooltip: "视频",
             onAction: () => {
@@ -415,99 +398,99 @@ const la = /* @__PURE__ */ he({
         }
       }, l = x(
         [
-          o.options,
-          y.tinymceOptions,
+          i.options,
+          b.tinymceOptions,
           a
         ],
         {
-          mergeFunction: (i, e) => (...t) => {
-            i(...t), e(...t);
+          mergeFunction: (o, e) => (...t) => {
+            o(...t), e(...t);
           },
           type: Object
         }
       );
-      K.init(l).then(([i]) => {
+      j.init(l).then(([o]) => {
         var e;
-        i && (i.customProps = { ...o }, i.on("change input Redo Undo SetContent", () => {
-          if (C.value) {
-            C.value = !1;
+        o && (o.customProps = { ...i }, o.on("change input Redo Undo SetContent", () => {
+          if (w.value) {
+            w.value = !1;
             return;
           }
-          U.value = !0, z("input", i.getContent()), z("update:modelValue", i.getContent());
-        }), (e = o.initComplete) == null || e.call(o, { editorIns: i }), u.value = i);
+          A.value = !0, C("input", o.getContent()), C("update:modelValue", o.getContent());
+        }), (e = i.initComplete) == null || e.call(i, { editorIns: o }), u.value = o);
       });
     });
-    const le = () => {
+    const Z = () => {
       var a, l;
-      return ((l = (a = _.value) == null ? void 0 : a.data) == null ? void 0 : l.call(a, { ...r.value.additionalData || {}, extParameters: o.extParameters })) || {};
-    }, ne = () => {
+      return ((l = (a = M.value) == null ? void 0 : a.data) == null ? void 0 : l.call(a, { ...r.value.additionalData || {}, extParameters: i.extParameters })) || {};
+    }, ee = () => {
       var a, l;
-      return ((l = (a = _.value) == null ? void 0 : a.headers) == null ? void 0 : l.call(a, { ...r.value.additionalData || {}, extParameters: o.extParameters })) || {};
-    }, re = (a, l, i) => {
+      return ((l = (a = M.value) == null ? void 0 : a.headers) == null ? void 0 : l.call(a, { ...r.value.additionalData || {}, extParameters: i.extParameters })) || {};
+    }, ae = (a, l, o) => {
       var t, n;
-      const e = (n = (t = _ == null ? void 0 : _.value) == null ? void 0 : t.handlerResponse) == null ? void 0 : n.call(t, a);
-      e != null && e.url ? i[i.length - 1].url = e.url : e != null && e.errorMessage && (h.error(e.errorMessage), i.splice(i.length - 1, 1)), r.value.formData.file = i;
-    }, se = (a, l) => new Promise((i, e) => {
+      const e = (n = (t = M == null ? void 0 : M.value) == null ? void 0 : t.handlerResponse) == null ? void 0 : n.call(t, a);
+      e != null && e.url ? o[o.length - 1].url = e.url : e != null && e.errorMessage && (c.error(e.errorMessage), o.splice(o.length - 1, 1)), r.value.formData.file = o;
+    }, oe = (a, l) => new Promise((o, e) => {
       const t = a.name.split(".").filter(Boolean).pop() ? a.name.split(".").filter(Boolean).pop() : "";
-      if (!o.audioAllowedType.includes(t.toUpperCase())) {
-        h.info(`请上传格式为${o.audioAllowedType.join("、")}的音频`), e();
+      if (!i.audioAllowedType.includes(t.toUpperCase())) {
+        c.info(`请上传格式为${i.audioAllowedType.join("、")}的音频`), e();
         return;
       }
-      if (a.size > o.audioMaxSize * 1024 * 1024) {
-        h.info(`请上传${o.audioMaxSize}M内的音频`), e();
+      if (a.size > i.audioMaxSize * 1024 * 1024) {
+        c.info(`请上传${i.audioMaxSize}M内的音频`), e();
         return;
       }
-      r.value.additionalData = { file: a }, i(!0);
-    }), de = (a, l) => {
+      r.value.additionalData = { file: a }, o(!0);
+    }), te = (a, l) => {
       r.value.formData.file = l;
-    }, ue = (a, l, i) => {
-      h.error("上传发生错误，请重试!"), r.value.formData.file = i;
-    }, me = () => {
+    }, ie = (a, l, o) => {
+      c.error("上传发生错误，请重试!"), r.value.formData.file = o;
+    }, le = () => {
       var a, l;
-      return ((l = (a = b.value) == null ? void 0 : a.data) == null ? void 0 : l.call(a, { ...s.value.additionalData || {}, extParameters: o.extParameters })) || {};
-    }, pe = () => {
+      return ((l = (a = y.value) == null ? void 0 : a.data) == null ? void 0 : l.call(a, { ...s.value.additionalData || {}, extParameters: i.extParameters })) || {};
+    }, ne = () => {
       var a, l;
-      return ((l = (a = b.value) == null ? void 0 : a.headers) == null ? void 0 : l.call(a, { ...s.value.additionalData || {}, extParameters: o.extParameters })) || {};
-    }, ce = (a, l, i) => {
+      return ((l = (a = y.value) == null ? void 0 : a.headers) == null ? void 0 : l.call(a, { ...s.value.additionalData || {}, extParameters: i.extParameters })) || {};
+    }, re = (a, l, o) => {
       var t, n;
-      const e = (n = (t = b == null ? void 0 : b.value) == null ? void 0 : t.handlerResponse) == null ? void 0 : n.call(t, a);
-      e != null && e.url ? i[i.length - 1].url = e.url : e != null && e.errorMessage && (h.error(e.errorMessage), i.splice(i.length - 1, 1)), s.value.formData.file = i;
-    }, ge = (a, l) => new Promise((i, e) => {
+      const e = (n = (t = y == null ? void 0 : y.value) == null ? void 0 : t.handlerResponse) == null ? void 0 : n.call(t, a);
+      e != null && e.url ? o[o.length - 1].url = e.url : e != null && e.errorMessage && (c.error(e.errorMessage), o.splice(o.length - 1, 1)), s.value.formData.file = o;
+    }, se = (a, l) => new Promise((o, e) => {
       const t = a.name.split(".").filter(Boolean).pop() ? a.name.split(".").filter(Boolean).pop() : "";
-      if (!o.videoAllowedType.includes(t.toUpperCase())) {
-        h.info(`请上传格式为${o.videoAllowedType.join("、")}的视频`), e();
+      if (!i.videoAllowedType.includes(t.toUpperCase())) {
+        c.info(`请上传格式为${i.videoAllowedType.join("、")}的视频`), e();
         return;
       }
-      if (a.size > o.videoMaxSize * 1024 * 1024) {
-        h.info(`请上传${o.videoMaxSize}M内的视频`), e();
+      if (a.size > i.videoMaxSize * 1024 * 1024) {
+        c.info(`请上传${i.videoMaxSize}M内的视频`), e();
         return;
       }
-      s.value.additionalData = { file: a }, i(!0);
-    }), fe = (a, l) => {
+      s.value.additionalData = { file: a }, o(!0);
+    }), de = (a, l) => {
       s.value.formData.file = l;
-    }, ve = (a, l, i) => {
-      h.error("上传发生错误，请重试!"), s.value.formData.file = i;
+    }, ue = (a, l, o) => {
+      c.error("上传发生错误，请重试!"), s.value.formData.file = o;
     };
-    return xe(() => {
+    return pe(() => {
       var a;
       (a = u.value) == null || a.destroy();
-    }), k(() => [o.disabled, u.value], () => {
+    }), D(() => [i.disabled, u.value], () => {
       var a, l;
-      (l = (a = u.value) == null ? void 0 : a.mode) == null || l.set(o.disabled ? "readonly" : "design");
-    }, { immediate: !0 }), k(
-      () => [o.value, o.modelValue, u.value],
+      (l = (a = u.value) == null ? void 0 : a.mode) == null || l.set(i.disabled ? "readonly" : "design");
+    }, { immediate: !0 }), D(
+      () => [i.value, i.modelValue, u.value],
       () => {
         var a;
-        if (U.value) {
-          U.value = !1;
+        if (A.value) {
+          A.value = !1;
           return;
         }
-        C.value = !0, (a = u.value) == null || a.setContent(o.value ? o.value : o.modelValue ? o.modelValue : "");
+        w.value = !0, (a = u.value) == null || a.setContent(i.value ? i.value : i.modelValue ? i.modelValue : "");
       },
       { immediate: !0 }
-    ), { __sfc: !0, insRef: R, editorRef: u, preventSettingContent: U, preventUpdatingModelValue: C, uploadImageImgPondRef: V, audioImageImgPondRef: P, uploadImage: g, uploadImageFormRef: B, onUploadImageClose: X, onUploadImageConfirm: Y, uploadAudio: r, uploadAudioFormRef: E, onUploadAudioConfirm: Z, onUploadAudioClose: ee, uploadVideo: s, uploadVideoFormRef: I, onUploadVideoConfirm: ae, onUploadVideoClose: oe, onImageUploadUpload: ie, props: o, emits: z, imgPondAccept: te, processPastedImage: O, mergeVideoUploadOptions: b, mergeAudioUploadOptions: _, mergeImgPondOptions: H, paste_preprocess: D, paste_postprocess: S, imageUploadHandle: f, getUploadAudioData: le, getUploadAudioHeaders: ne, onUploadAudioSuccess: re, onUploadAudioBeforeUpload: se, onUploadAudioRemove: de, onUploadAudioError: ue, getUploadVideoData: me, getUploadVideoHeaders: pe, onUploadVideoSuccess: ce, onUploadVideoBeforeUpload: ge, onUploadVideoRemove: fe, onUploadVideoError: ve, ImgPond: be };
+    ), { __sfc: !0, insRef: B, editorRef: u, preventSettingContent: A, preventUpdatingModelValue: w, uploadImageImgPondRef: T, audioImageImgPondRef: U, uploadImage: p, uploadImageFormRef: H, onUploadImageClose: N, onUploadImageConfirm: G, uploadAudio: r, uploadAudioFormRef: R, onUploadAudioConfirm: L, onUploadAudioClose: J, uploadVideo: s, uploadVideoFormRef: W, onUploadVideoConfirm: K, onUploadVideoClose: Q, onImageUploadUpload: X, props: i, emits: C, imgPondAccept: Y, processPastedImage: E, mergeVideoUploadOptions: y, mergeAudioUploadOptions: M, mergeImgPondOptions: S, paste_preprocess: V, paste_postprocess: P, imageUploadHandle: f, getUploadAudioData: Z, getUploadAudioHeaders: ee, onUploadAudioSuccess: ae, onUploadAudioBeforeUpload: oe, onUploadAudioRemove: te, onUploadAudioError: ie, getUploadVideoData: le, getUploadVideoHeaders: ne, onUploadVideoSuccess: re, onUploadVideoBeforeUpload: se, onUploadVideoRemove: de, onUploadVideoError: ue, ImgPond: ve };
   }
 });
 export {
-  la as default
+  oa as default
 };

package/es/index.js

@@ -1,18 +1,15 @@
 import './style.css';
 import o from "./editor.vue.js";
-import { Button as r, Slider as s, Dialog as m, Upload as n, Tag as i, Form as u, FormItem as l, ButtonGroup as g, InputNumber as c, Loading as d } from "element-ui";
-import { getImagePixel as y, interceptImgPondBeforeAddFile as B, oneTravelImageCheck as E, oneTravelImageCompressor as F } from "./util.js";
-const I = {}, b = Object.assign(o, {
+import { Button as s, Slider as r, Dialog as u, Upload as i, Tag as m, Form as n, FormItem as l, ButtonGroup as c, InputNumber as g, Loading as d } from "element-ui";
+import { getImagePixel as I } from "./util.js";
+const b = {}, x = Object.assign(o, {
   install: (e, t) => {
-    Object.assign(I, t || {}), e.use(r), e.use(s), e.use(m), e.use(n), e.use(i), e.use(u), e.use(l), e.use(g), e.use(c), e.use(d), e.component("KbTinymceEditor", o);
+    Object.assign(b, t || {}), e.use(s), e.use(r), e.use(u), e.use(i), e.use(m), e.use(n), e.use(l), e.use(c), e.use(g), e.use(d), e.component("KbTinymceEditor", o);
   }
 });
 export {
-  b as TinymceEditor,
-  b as default,
-  y as getImagePixel,
-  I as globalProps,
-  B as interceptImgPondBeforeAddFile,
-  E as oneTravelImageCheck,
-  F as oneTravelImageCompressor
+  x as TinymceEditor,
+  x as default,
+  I as getImagePixel,
+  b as globalProps
 };

package/es/util.d.ts

@@ -1,38 +1,3 @@
-/**
- * 一码游图片检测
- */
-export declare function oneTravelImageCheck(data: File | Blob, options?: {
-    imageMaxSize?: number;
-    imageAllowedType?: string[];
-    imageAllowedMineType?: string[];
-    imageMinWidth?: number;
-    imageMinHeight?: number;
-    imageMaxWidth?: number;
-    imageMaxHeight?: number;
-}): Promise<{
-    /** 是否成功 */
-    success: boolean;
-    /** 处理完成的文件（有可能不需要处理） */
-    file?: File | Blob;
-    /** 失败 */
-    error?: {
-        size?: boolean;
-        format?: boolean;
-        pixel?: boolean;
-        message?: string;
-    };
-    /** 错误消息 */
-    errorMessage?: string;
-}>;
-/**
- * 一码游图片压缩
- */
-export declare function oneTravelImageCompressor(data: File | Blob): Promise<{
-    file: File | Blob;
-    hasConversion: boolean;
-    success: boolean;
-    errorMessage?: string;
-}>;
 /**
  * 获取图片像素
  * @param src url或 base64
@@ -42,7 +7,3 @@ export declare function getImagePixel(src: string): Promise<{
     height: number;
     image: HTMLImageElement;
 }>;
-export declare function interceptImgPondBeforeAddFile(imgPondIns: any, options?: {
-    onStart?: () => void;
-    onEnd?: () => void;
-}): Promise<void>;

package/es/util.js

@@ -1,127 +1,11 @@
-import { compressAccurately as b } from "image-conversion";
-import x from "compressorjs";
-import A from "image-resizor";
-async function S(c, e) {
-  const {
-    imageMaxSize: i = 30,
-    imageAllowedType: a = ["jpg", "jpeg", "png", "bmp", "heif", "gif", "webp"],
-    imageAllowedMineType: r = ["image/jpg", "image/jpeg", "image/png", "image/bmp", "image/heif", "image/heic", "image/gif", "image/webp"],
-    imageMinWidth: t = 60,
-    imageMinHeight: g = 60,
-    imageMaxWidth: s = 6e3,
-    imageMaxHeight: l = 6e3
-  } = e || {}, f = c, n = await y(f);
-  if (f.size > i * 1024 * 1024)
-    return { success: !1, error: { size: !0 }, errorMessage: `请上传大小不超过${i}M的图片` };
-  if (!r.includes(f.type))
-    return { success: !1, error: { format: !0 }, errorMessage: `请上传格式为${a.map((u) => u.toUpperCase()).join("、")}的图片` };
-  const m = await d(n);
-  return m.width < t && m.height < g || m.width > s && m.height > l ? { success: !1, error: { pixel: !0 }, errorMessage: `请上传像素不低于${t}*${g}且像素不高于${s}*${l}的图片` } : { success: !0, file: f };
-}
-async function $(c) {
-  var l;
-  let e = c;
-  const i = await y(e);
-  let a = !1;
-  const r = {};
-  let t = "image-conversion", g = e.type;
-  ["image/heif", "image/heic", "image/webp"].includes(e.type) && (t = "compressor", r.convertTypes = [e.type], r.convertSize = 0, r.quality = 1, g = "image/jpeg", a = !0);
-  const s = 5 * 1024 * 1024;
-  if (e.size > s)
-    if (a) {
-      const f = await d(i);
-      t = "compressor", r.convertTypes = [e.type], r.convertSize = s, r.maxWidth = f.width * (s / e.size), r.quality = 0.92;
-    } else
-      t = "image-conversion", r.type = g, r.size = 5 * 1024;
-  if (Object.keys(r).length > 0) {
-    const f = await M(j(i), r, t);
-    if (f.success)
-      e = f.file;
-    else
-      return { file: e, success: !1, hasConversion: a, errorMessage: (l = f.error) == null ? void 0 : l.message };
-  }
-  return { file: e, hasConversion: a, success: !0 };
-}
-function M(c, e = {}, i) {
-  return new Promise((a) => {
-    i === "compressor" ? new x(c, {
-      ...e,
-      success: async (r) => {
-        a({ success: !0, file: r });
-      },
-      error(r) {
-        a({ success: !1, error: r });
-      }
-    }) : b(c, e).then((r) => {
-      a({ success: !0, file: r });
-    }).catch((r) => {
-      a({ success: !1, error: (r == null ? void 0 : r.message) || "" });
-    });
-  });
-}
-function d(c) {
-  return new Promise((e) => {
-    const i = new Image();
-    i.onload = function() {
-      e({ width: i.width, height: i.height, image: i });
-    }, i.src = c;
+function n(i) {
+  return new Promise((t) => {
+    const e = new Image();
+    e.onload = function() {
+      t({ width: e.width, height: e.height, image: e });
+    }, e.src = i;
   });
 }
-function j(c) {
-  const e = c.split(","), i = e[0].match(/:(.*?);/)[1], a = atob(e[1]);
-  let r = a.length;
-  const t = new Uint8Array(r);
-  for (; r--; )
-    t[r] = a.charCodeAt(r);
-  return new Blob([t], { type: i });
-}
-function y(c) {
-  return new Promise((e, i) => {
-    const a = new FileReader();
-    a.onloadend = () => {
-      const r = a.result;
-      e(r);
-    }, a.onerror = i, a.readAsDataURL(c);
-  });
-}
-async function C(c, e) {
-  const i = c == null ? void 0 : c.beforeAddFile;
-  c.beforeAddFile = (a) => {
-    var r;
-    return e != null && e.onStart && ((r = e == null ? void 0 : e.onStart) == null || r.call(e)), new Promise(async (t) => {
-      var g;
-      if (a.file.type === "image/heic" || a.file.type === "image/heif") {
-        const s = a.file.name, l = s == null ? void 0 : s.split(".");
-        l.pop();
-        const f = l.join(",");
-        new A(a.file, {
-          outputType: "image/jpeg",
-          quality: 0.9,
-          maxWidth: 1 / 0,
-          maxHeight: 1 / 0
-        }).init().then(async (n) => {
-          var h;
-          const m = await n.toBlob();
-          if (!m)
-            return t(!1);
-          const u = new File([m], `${f}.jpeg`, { type: m == null ? void 0 : m.type });
-          a.file = u, a.fileList[a.fileList.length - 1].raw = u;
-          const w = await i(a);
-          t(w), e != null && e.onEnd && ((h = e == null ? void 0 : e.onEnd) == null || h.call(e));
-        }).catch(() => {
-          var n;
-          t(!1), e != null && e.onEnd && ((n = e == null ? void 0 : e.onEnd) == null || n.call(e));
-        });
-      } else {
-        const s = await i(a);
-        t(s), e != null && e.onEnd && ((g = e == null ? void 0 : e.onEnd) == null || g.call(e));
-      }
-    });
-  };
-}
 export {
-  d as getImagePixel,
-  C as interceptImgPondBeforeAddFile,
-  S as oneTravelImageCheck,
-  $ as oneTravelImageCompressor
+  n as getImagePixel
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@keyblade/tinymce-editor-vue2",
   "description": "KeyBlade Tinymce Editor Vue2",
   "author": "yangshuai <704807396@qq.com>",
-  "version": "0.0.12-alpha.16",
+  "version": "0.0.12-alpha.18",
   "private": false,
   "type": "module",
   "main": "es/index.js",
@@ -20,12 +20,10 @@
     "*.css"
   ],
   "dependencies": {
-    "image-resizor": "^1.1.3",
-    "compressorjs": "^1.2.1",
-    "image-conversion": "^2.1.1",
     "vue-global-config": "^0.2.6",
     "tinymce": "^7.1.0",
-    "element-ui": "^2.15.14"
+    "element-ui": "^2.15.14",
+    "@keyblade/one-travel": "^2.0.0"
   },
   "peerDependencies": {
     "vue": "^2.7.0",