zartui 3.1.75 → 3.1.76

package/lib/zartui.cjs.js

@@ -16091,6 +16091,11 @@ const mediaPickerProps = {
   maxImageFileSize: makeNumberProp(1024),
   // 单个文件大小限制（本单位为KB，默认最大1M）
   maxFileSize: makeNumberProp(FILE_SIZE_LIMIT * 1024),
+  // 是否保持原始文件类型（不转换为jpg）
+  keepFileType: {
+    type: Boolean,
+    default: false
+  },
   /**
    * {
    *  maxImageSideLength,
@@ -16398,10 +16403,22 @@ var stdin_default$C = vue.defineComponent({
       }).finally(() => {
       });
     };
+    const getExtensionFromMimeType = (mimeType) => {
+      const mimeToExt = {
+        "image/jpeg": "jpg",
+        "image/jpg": "jpg",
+        "image/png": "png",
+        "image/gif": "gif",
+        "image/webp": "webp",
+        "image/bmp": "bmp",
+        "image/svg+xml": "svg"
+      };
+      return mimeToExt[mimeType] || "jpg";
+    };
     const transformImageFiles = (files) => {
       const promisesTodo = [];
       const resizeOptions = new appMediaUtils.ResizeOptions(props.maxImageSideLength);
-      const compressOptions = new appMediaUtils.CompressOptions(props.maxImageFileSize);
+      const compressOptions = new appMediaUtils.CompressOptions(props.maxImageFileSize, props.keepFileType);
       for (let i = 0; i < files.length; i++) {
         const file = files[i];
         const watermarkEnabled = props.watermarkOptions && props.watermarkOptions.watermarkConfigString && appMediaUtils.checkWatermarkConfigSupported(props.watermarkOptions.watermarkConfigString);
@@ -16427,7 +16444,8 @@ var stdin_default$C = vue.defineComponent({
             return Promise.resolve(null);
           }
           return file2DataURL(f).then((base64) => {
-            const uniqueFileName = getUniqueFileName(f, "jpg");
+            const ext = props.keepFileType ? getExtensionFromMimeType(f.type) : "jpg";
+            const uniqueFileName = getUniqueFileName(f, ext);
             const media = {
               showSrc: base64,
               type: "photo",
@@ -23499,7 +23517,7 @@ const Lazyload = {
     });
   }
 };
-const version = "3.1.75";
+const version = "3.1.76";
 function install(app) {
   const components = [
     ActionSheet,

package/lib/zartui.es.js

@@ -16089,6 +16089,11 @@ const mediaPickerProps = {
   maxImageFileSize: makeNumberProp(1024),
   // 单个文件大小限制（本单位为KB，默认最大1M）
   maxFileSize: makeNumberProp(FILE_SIZE_LIMIT * 1024),
+  // 是否保持原始文件类型（不转换为jpg）
+  keepFileType: {
+    type: Boolean,
+    default: false
+  },
   /**
    * {
    *  maxImageSideLength,
@@ -16396,10 +16401,22 @@ var stdin_default$C = defineComponent({
       }).finally(() => {
       });
     };
+    const getExtensionFromMimeType = (mimeType) => {
+      const mimeToExt = {
+        "image/jpeg": "jpg",
+        "image/jpg": "jpg",
+        "image/png": "png",
+        "image/gif": "gif",
+        "image/webp": "webp",
+        "image/bmp": "bmp",
+        "image/svg+xml": "svg"
+      };
+      return mimeToExt[mimeType] || "jpg";
+    };
     const transformImageFiles = (files) => {
       const promisesTodo = [];
       const resizeOptions = new ResizeOptions(props.maxImageSideLength);
-      const compressOptions = new CompressOptions(props.maxImageFileSize);
+      const compressOptions = new CompressOptions(props.maxImageFileSize, props.keepFileType);
       for (let i = 0; i < files.length; i++) {
         const file = files[i];
         const watermarkEnabled = props.watermarkOptions && props.watermarkOptions.watermarkConfigString && checkWatermarkConfigSupported(props.watermarkOptions.watermarkConfigString);
@@ -16425,7 +16442,8 @@ var stdin_default$C = defineComponent({
             return Promise.resolve(null);
           }
           return file2DataURL(f).then((base64) => {
-            const uniqueFileName = getUniqueFileName(f, "jpg");
+            const ext = props.keepFileType ? getExtensionFromMimeType(f.type) : "jpg";
+            const uniqueFileName = getUniqueFileName(f, ext);
             const media = {
               showSrc: base64,
               type: "photo",
@@ -23497,7 +23515,7 @@ const Lazyload = {
     });
   }
 };
-const version = "3.1.75";
+const version = "3.1.76";
 function install(app) {
   const components = [
     ActionSheet,

package/lib/zartui.js

@@ -15383,9 +15383,10 @@
     canvas.height = _height;
     const ctx = canvas.getContext("2d");
     if (ctx) {
-      ctx.fillStyle = "transparent";
-      if (type === "image/jpeg") {
+      const needWhiteBackground = type === "image/jpeg" || type === "image/jpg" || type === "image/bmp";
+      if (needWhiteBackground) {
         ctx.fillStyle = "#fff";
+        ctx.fillRect(0, 0, _width, _height);
       }
       ctx.drawImage(img, 0, 0, _width, _height);
       return Promise.resolve(canvas);
@@ -15468,13 +15469,14 @@
     }
   };
   var CompressOptions = class {
-    // 图片大小限制，单位kb
-    constructor(photoFileSizeLimit) {
+    // 是否保持原始文件类型
+    constructor(photoFileSizeLimit, keepFileType = false) {
       if (checkIsUndefinedOrNull(photoFileSizeLimit)) {
         this.photoFileSizeLimit = PHOTO_FILE_SIZE_LIMIT;
       } else {
         this.photoFileSizeLimit = photoFileSizeLimit;
       }
+      this.keepFileType = keepFileType;
     }
   };
   var ImageProcessor = class {
@@ -15488,12 +15490,15 @@
     process() {
       const filename = this.file.name;
       const { lastModified } = this.file;
-      let fileType = this.file.type;
-      if (this.file.size > this.compressOptions.photoFileSizeLimit * 1024) {
-        fileType = "image/jpeg";
-      }
-      if (fileType === "image/gif") {
-        fileType = "image/png";
+      const originalFileType = this.file.type;
+      let fileType = originalFileType;
+      if (!this.compressOptions.keepFileType) {
+        if (this.file.size > this.compressOptions.photoFileSizeLimit * 1024) {
+          fileType = "image/jpeg";
+        }
+        if (fileType === "image/gif") {
+          fileType = "image/png";
+        }
       }
       return file2Image(this.file).then((img) => {
         return resize(img, {
@@ -15505,7 +15510,13 @@
         const canvas = result;
         return yield renderWatermark(canvas, this.watermarkOptions);
       })).then((canvas) => {
-        const exportFilename = filename.replace(/\./g, "-") + ".jpg";
+        let exportFilename;
+        if (this.compressOptions.keepFileType) {
+          const ext = this.getExtensionFromMimeType(fileType);
+          exportFilename = filename.replace(/\.[^.]+$/, "") + "." + ext;
+        } else {
+          exportFilename = filename.replace(/\./g, "-") + ".jpg";
+        }
         return this.compress(
           canvas,
           exportFilename,
@@ -15515,6 +15526,21 @@
         );
       });
     }
+    /**
+     * 根据 MIME 类型获取文件扩展名
+     */
+    getExtensionFromMimeType(mimeType) {
+      const mimeToExt = {
+        "image/jpeg": "jpg",
+        "image/jpg": "jpg",
+        "image/png": "png",
+        "image/gif": "gif",
+        "image/webp": "webp",
+        "image/bmp": "bmp",
+        "image/svg+xml": "svg"
+      };
+      return mimeToExt[mimeType] || "jpg";
+    }
     compress(canvas, filename, lastModified, type, quality, lastCompressFileSize = -1) {
       return canvas2File(canvas, filename, lastModified, type, quality).then(
         (file) => {
@@ -17867,6 +17893,11 @@
     maxImageFileSize: makeNumberProp(1024),
     // 单个文件大小限制（本单位为KB，默认最大1M）
     maxFileSize: makeNumberProp(FILE_SIZE_LIMIT * 1024),
+    // 是否保持原始文件类型（不转换为jpg）
+    keepFileType: {
+      type: Boolean,
+      default: false
+    },
     /**
      * {
      *  maxImageSideLength,
@@ -18174,10 +18205,22 @@
         }).finally(() => {
         });
       };
+      const getExtensionFromMimeType = (mimeType) => {
+        const mimeToExt = {
+          "image/jpeg": "jpg",
+          "image/jpg": "jpg",
+          "image/png": "png",
+          "image/gif": "gif",
+          "image/webp": "webp",
+          "image/bmp": "bmp",
+          "image/svg+xml": "svg"
+        };
+        return mimeToExt[mimeType] || "jpg";
+      };
       const transformImageFiles = (files) => {
         const promisesTodo = [];
         const resizeOptions = new ResizeOptions(props.maxImageSideLength);
-        const compressOptions = new CompressOptions(props.maxImageFileSize);
+        const compressOptions = new CompressOptions(props.maxImageFileSize, props.keepFileType);
         for (let i = 0; i < files.length; i++) {
           const file = files[i];
           const watermarkEnabled = props.watermarkOptions && props.watermarkOptions.watermarkConfigString && checkWatermarkConfigSupported(props.watermarkOptions.watermarkConfigString);
@@ -18203,7 +18246,8 @@
               return Promise.resolve(null);
             }
             return file2DataURL$1(f).then((base64) => {
-              const uniqueFileName = getUniqueFileName(f, "jpg");
+              const ext = props.keepFileType ? getExtensionFromMimeType(f.type) : "jpg";
+              const uniqueFileName = getUniqueFileName(f, ext);
               const media = {
                 showSrc: base64,
                 type: "photo",
@@ -27559,7 +27603,7 @@
       });
     }
   };
-  const version = "3.1.75";
+  const version = "3.1.76";
   function install(app) {
     const components = [
       ActionSheet,