@keyblade/tinymce-editor-vue2 0.0.12-alpha.12 → 0.0.12-alpha.14

package/README.md

@@ -110,6 +110,7 @@ import { oneTravelImageCheck, oneTravelImageCompressor } from '@keyblade/tinymce
 ```typescript
 export async function oneTravelImageCheck(data: File | Blob, options?: {
   imageMaxSize?: number;
+  imageAllowedType?: string[];
   imageAllowedMineType?: string[]
   imageMinWidth?: number;
   imageMinHeight?: number;
@@ -126,7 +127,9 @@ export async function oneTravelImageCheck(data: File | Blob, options?: {
     format?: boolean;
     pixel?: boolean;
     message?: string
-  }
+  },
+  /** 错误消息 */
+  errorMessage?: string;
 }> {}
 
 export async function oneTravelImageCompressor(data: File | Blob): Promise<{

package/es/editor.vue.d.ts

@@ -237,6 +237,7 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     options: () => {};
 }>>>, {
     imageMaxSize: number;
+    imageAllowedType: string[];
     imageAllowedMineType: string[];
     imageMinWidth: number;
     imageMinHeight: number;
@@ -246,7 +247,6 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     modelValue: string;
     imageUploadMaxCount: number;
     imageUploadTip: string;
-    imageAllowedType: string[];
     audioEnable: boolean;
     audioMaxSize: number;
     audioAllowedType: string[];

package/es/editor.vue2.js

@@ -32,7 +32,7 @@ import "tinymce/plugins/table";
 import "tinymce/plugins/visualblocks";
 import "tinymce/plugins/visualchars";
 import "tinymce/plugins/wordcount";
-import { globalProps as b } from "./index.js";
+import { globalProps as y } from "./index.js";
 import { Loading as xe, Message as h } from "element-ui";
 const ia = /* @__PURE__ */ ce({
   __name: "editor",
@@ -140,6 +140,7 @@ const ia = /* @__PURE__ */ ce({
       var p, c;
       const t = await N(i, {
         imageMaxSize: a.imageMaxSize,
+        imageAllowedType: a.imageAllowedType,
         imageAllowedMineType: a.imageAllowedMineType,
         imageMinWidth: a.imageMinWidth,
         imageMinHeight: a.imageMinHeight,
@@ -190,16 +191,16 @@ const ia = /* @__PURE__ */ ce({
         }
       }
     }
-    const y = M(() => x([a.videoUploadOptions, b.videoUploadOptions]) || {}), _ = M(() => x([a.audioUploadOptions, b.audioUploadOptions]) || {}), $ = M(() => x([a.imgPondOptions, b.imgPondOptions]) || {}), C = M(
-      () => x([a.paste_preprocess, b.paste_preprocess], {
+    const b = M(() => x([a.videoUploadOptions, y.videoUploadOptions]) || {}), _ = M(() => x([a.audioUploadOptions, y.audioUploadOptions]) || {}), $ = M(() => x([a.imgPondOptions, y.imgPondOptions]) || {}), C = M(
+      () => x([a.paste_preprocess, y.paste_preprocess], {
         type: Function
       })
     ), D = M(
-      () => x([a.paste_postprocess, b.paste_postprocess], {
+      () => x([a.paste_postprocess, y.paste_postprocess], {
         type: Function
       })
     ), f = M(
-      () => x([a.imageUploadHandle, b.imageUploadHandle], {
+      () => x([a.imageUploadHandle, y.imageUploadHandle], {
         type: Function
       })
     );
@@ -301,6 +302,7 @@ const ia = /* @__PURE__ */ ce({
             let u = o.blob();
             const v = o.filename(), p = await N(u, {
               imageMaxSize: a.imageMaxSize,
+              imageAllowedType: a.imageAllowedType,
               imageAllowedMineType: a.imageAllowedMineType,
               imageMinWidth: a.imageMinWidth,
               imageMinHeight: a.imageMinHeight,
@@ -386,7 +388,7 @@ const ia = /* @__PURE__ */ ce({
       }, l = x(
         [
           a.options,
-          b.tinymceOptions,
+          y.tinymceOptions,
           i
         ],
         {
@@ -434,13 +436,13 @@ const ia = /* @__PURE__ */ ce({
       h.error("上传发生错误，请重试!"), r.value.formData.file = o;
     }, re = () => {
       var i, l;
-      return ((l = (i = y.value) == null ? void 0 : i.data) == null ? void 0 : l.call(i, { ...s.value.additionalData || {}, extParameters: a.extParameters })) || {};
+      return ((l = (i = b.value) == null ? void 0 : i.data) == null ? void 0 : l.call(i, { ...s.value.additionalData || {}, extParameters: a.extParameters })) || {};
     }, se = () => {
       var i, l;
-      return ((l = (i = y.value) == null ? void 0 : i.headers) == null ? void 0 : l.call(i, { ...s.value.additionalData || {}, extParameters: a.extParameters })) || {};
+      return ((l = (i = b.value) == null ? void 0 : i.headers) == null ? void 0 : l.call(i, { ...s.value.additionalData || {}, extParameters: a.extParameters })) || {};
     }, de = (i, l, o) => {
       var t, n;
-      const e = (n = (t = y == null ? void 0 : y.value) == null ? void 0 : t.handlerResponse) == null ? void 0 : n.call(t, i);
+      const e = (n = (t = b == null ? void 0 : b.value) == null ? void 0 : t.handlerResponse) == null ? void 0 : n.call(t, i);
       e != null && e.url ? o[o.length - 1].url = e.url : e != null && e.errorMessage && (h.error(e.errorMessage), o.splice(o.length - 1, 1)), s.value.formData.file = o;
     }, ue = (i, l) => new Promise((o, e) => {
       const t = i.name.split(".").filter(Boolean).pop() ? i.name.split(".").filter(Boolean).pop() : "";
@@ -475,7 +477,7 @@ const ia = /* @__PURE__ */ ce({
         V.value = !0, (i = d.value) == null || i.setContent(a.value ? a.value : a.modelValue ? a.modelValue : "");
       },
       { immediate: !0 }
-    ), { __sfc: !0, insRef: k, editorRef: d, preventSettingContent: U, preventUpdatingModelValue: V, uploadImage: g, uploadImageFormRef: z, onUploadImageClose: L, onUploadImageConfirm: J, uploadAudio: r, uploadAudioFormRef: H, onUploadAudioConfirm: K, onUploadAudioClose: Q, uploadVideo: s, uploadVideoFormRef: W, onUploadVideoConfirm: X, onUploadVideoClose: Y, onImageUploadUpload: Z, props: a, emits: S, imgPondAccept: ee, processPastedImage: B, mergeVideoUploadOptions: y, mergeAudioUploadOptions: _, mergeImgPondOptions: $, paste_preprocess: C, paste_postprocess: D, imageUploadHandle: f, getUploadAudioData: ae, getUploadAudioHeaders: ie, onUploadAudioSuccess: oe, onUploadAudioBeforeUpload: te, onUploadAudioRemove: le, onUploadAudioError: ne, getUploadVideoData: re, getUploadVideoHeaders: se, onUploadVideoSuccess: de, onUploadVideoBeforeUpload: ue, onUploadVideoRemove: me, onUploadVideoError: pe, ImgPond: he };
+    ), { __sfc: !0, insRef: k, editorRef: d, preventSettingContent: U, preventUpdatingModelValue: V, uploadImage: g, uploadImageFormRef: z, onUploadImageClose: L, onUploadImageConfirm: J, uploadAudio: r, uploadAudioFormRef: H, onUploadAudioConfirm: K, onUploadAudioClose: Q, uploadVideo: s, uploadVideoFormRef: W, onUploadVideoConfirm: X, onUploadVideoClose: Y, onImageUploadUpload: Z, props: a, emits: S, imgPondAccept: ee, processPastedImage: B, mergeVideoUploadOptions: b, mergeAudioUploadOptions: _, mergeImgPondOptions: $, paste_preprocess: C, paste_postprocess: D, imageUploadHandle: f, getUploadAudioData: ae, getUploadAudioHeaders: ie, onUploadAudioSuccess: oe, onUploadAudioBeforeUpload: te, onUploadAudioRemove: le, onUploadAudioError: ne, getUploadVideoData: re, getUploadVideoHeaders: se, onUploadVideoSuccess: de, onUploadVideoBeforeUpload: ue, onUploadVideoRemove: me, onUploadVideoError: pe, ImgPond: he };
   }
 });
 export {

package/es/index.d.ts

@@ -61,6 +61,10 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<number>;
         default: number;
     };
+    imageAllowedType: {
+        type: import('vue').PropType<string[]>;
+        default: () => string[];
+    };
     imageAllowedMineType: {
         type: import('vue').PropType<string[]>;
         default: () => string[];
@@ -103,10 +107,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<string>;
         default: string;
     };
-    imageAllowedType: {
-        type: import('vue').PropType<string[]>;
-        default: () => string[];
-    };
     audioEnable: {
         type: import('vue').PropType<boolean>;
         default: boolean;
@@ -203,6 +203,10 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<number>;
         default: number;
     };
+    imageAllowedType: {
+        type: import('vue').PropType<string[]>;
+        default: () => string[];
+    };
     imageAllowedMineType: {
         type: import('vue').PropType<string[]>;
         default: () => string[];
@@ -245,10 +249,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<string>;
         default: string;
     };
-    imageAllowedType: {
-        type: import('vue').PropType<string[]>;
-        default: () => string[];
-    };
     audioEnable: {
         type: import('vue').PropType<boolean>;
         default: boolean;
@@ -345,6 +345,7 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
     "update:modelValue": (value: string) => void;
 }, {
     imageMaxSize: number;
+    imageAllowedType: string[];
     imageAllowedMineType: string[];
     imageMinWidth: number;
     imageMinHeight: number;
@@ -354,7 +355,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
     modelValue: string;
     imageUploadMaxCount: number;
     imageUploadTip: string;
-    imageAllowedType: string[];
     audioEnable: boolean;
     audioMaxSize: number;
     audioAllowedType: string[];
@@ -367,6 +367,10 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<number>;
         default: number;
     };
+    imageAllowedType: {
+        type: import('vue').PropType<string[]>;
+        default: () => string[];
+    };
     imageAllowedMineType: {
         type: import('vue').PropType<string[]>;
         default: () => string[];
@@ -409,10 +413,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<string>;
         default: string;
     };
-    imageAllowedType: {
-        type: import('vue').PropType<string[]>;
-        default: () => string[];
-    };
     audioEnable: {
         type: import('vue').PropType<boolean>;
         default: boolean;
@@ -509,6 +509,10 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<number>;
         default: number;
     };
+    imageAllowedType: {
+        type: import('vue').PropType<string[]>;
+        default: () => string[];
+    };
     imageAllowedMineType: {
         type: import('vue').PropType<string[]>;
         default: () => string[];
@@ -551,10 +555,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<string>;
         default: string;
     };
-    imageAllowedType: {
-        type: import('vue').PropType<string[]>;
-        default: () => string[];
-    };
     audioEnable: {
         type: import('vue').PropType<boolean>;
         default: boolean;
@@ -651,6 +651,10 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<number>;
         default: number;
     };
+    imageAllowedType: {
+        type: import('vue').PropType<string[]>;
+        default: () => string[];
+    };
     imageAllowedMineType: {
         type: import('vue').PropType<string[]>;
         default: () => string[];
@@ -693,10 +697,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
         type: import('vue').PropType<string>;
         default: string;
     };
-    imageAllowedType: {
-        type: import('vue').PropType<string[]>;
-        default: () => string[];
-    };
     audioEnable: {
         type: import('vue').PropType<boolean>;
         default: boolean;
@@ -793,6 +793,7 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
     "update:modelValue": (value: string) => void;
 }, string, {
     imageMaxSize: number;
+    imageAllowedType: string[];
     imageAllowedMineType: string[];
     imageMinWidth: number;
     imageMinHeight: number;
@@ -802,7 +803,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
     modelValue: string;
     imageUploadMaxCount: number;
     imageUploadTip: string;
-    imageAllowedType: string[];
     audioEnable: boolean;
     audioMaxSize: number;
     audioAllowedType: string[];
@@ -816,6 +816,10 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
             type: import('vue').PropType<number>;
             default: number;
         };
+        imageAllowedType: {
+            type: import('vue').PropType<string[]>;
+            default: () => string[];
+        };
         imageAllowedMineType: {
             type: import('vue').PropType<string[]>;
             default: () => string[];
@@ -858,10 +862,6 @@ declare const TinymceEditor: import('vue/types/v3-component-public-instance').Co
             type: import('vue').PropType<string>;
             default: string;
         };
-        imageAllowedType: {
-            type: import('vue').PropType<string[]>;
-            default: () => string[];
-        };
         audioEnable: {
             type: import('vue').PropType<boolean>;
             default: boolean;

package/es/util.d.ts

@@ -3,6 +3,7 @@
  */
 export declare function oneTravelImageCheck(data: File | Blob, options?: {
     imageMaxSize?: number;
+    imageAllowedType?: string[];
     imageAllowedMineType?: string[];
     imageMinWidth?: number;
     imageMinHeight?: number;

package/es/util.js

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

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.12",
+  "version": "0.0.12-alpha.14",
   "private": false,
   "type": "module",
   "main": "es/index.js",