bri-components 1.6.5 → 1.6.6

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "bri-components",
-    "version": "1.6.5",
+    "version": "1.6.6",
     "author": "dengshanghui",
     "description": "a component lib for vue project",
     "main": "src/index.js",

package/src/components/controls/base/BriUpload/BriUploadImage.vue

@@ -149,8 +149,7 @@
                     _canAction: false, // 是否使用操作图标
                     _cropper: false, // 使用裁剪
                     _useBorderRadius: false, // 用圆角
-
-                    _requestOssType: "", //
+                    _imageResizeConfig: undefined,
                     _aliOssType: "binaryMultipartUpload", // 阿里云上传方式
 
                     ...this.propsObj
@@ -184,9 +183,6 @@
                     h: 100
                 };
             },
-            requestOssType () {
-                return this.selfPropsObj._requestOssType;
-            },
 
             modalPropsObj () {
                 return {
@@ -207,6 +203,29 @@
         },
         created () {},
         methods: {
+            // 点击文件预览
+            handlePreview (file) {
+                let viewerImage = this.$refs.viewerImage;
+                let viewer = new Viewer(viewerImage, {
+                    url: "data-original",
+                    hidden: function () {
+                        viewer.destroy();
+                    },
+                    loop: false,
+                    zIndex: 2147483647
+                });
+                viewer.show();
+            },
+            // 点击文件删除 - fileList服务器的数据列表
+            handleRemove (file) {
+                this.uploadType = "file"; // 删除后可以重新上传
+                this.curVal = "";
+                this.change(this.value);
+            },
+            change (...params) {
+                this.$emit("change", ...params);
+            },
+
             handleChange (event) {
                 if (event.target.files.length) {
                     const file = event.target.files[0];
@@ -242,11 +261,18 @@
             },
             // 提交裁剪后的图片
             submitCropImage () {
-                const cropImg = this.$refs.cropperDom.getCroppedCanvas().toDataURL(); // base64格式
-                this.dealPostImage(cropImg);
+                this.dealPostImage(this.$refs.cropperDom.getCroppedCanvas().toDataURL()); // base64格式
 
                 this.closeAvatarModal();
             },
+            // 处理图片的提交
+            dealPostImage (fileData) {
+                this.handlePost((ossType) => {
+                    return ossType === "local"
+                        ? this.dataURLtoFile(fileData, "") // 本地上传，将图片Base64转成文件
+                        : Buffer.from(fileData.split(",")[1], "base64"); // 阿里上传，object类型
+                });
+            },
             successCb (response, res) {
                 this.curVal = res.data.downloadUrl;
                 this.$emit("change", res);
@@ -260,26 +286,6 @@
                 // get image data for post processing, e.g. upload or setting image src
                 this.cropImg = this.$refs.cropperDom.getCroppedCanvas().toDataURL(); // base64格式
             },
-            // 处理图片的提交
-            dealPostImage (data) {
-                // 本地上传
-                if (this.requestOssType === "local") {
-                    const imgFile = this.dataURLtoFile(data, ""); // 将图片Base64转成文件
-                    this.handlePost(imgFile); // object类型
-                    // {
-                    //     lastModified: 1752065308269
-                    //     name: ".png"
-                    //     size: 528557
-                    //     type: "image/png"
-                    //     webkitRelativePath: ""
-                    // }
-                }
-                // 阿里上传用
-                else {
-                    const dataBuffer = Buffer.from(data.split(",")[1], "base64");
-                    this.handlePost(dataBuffer); // object类型
-                }
-            },
             // 将图片Base64转成文件
             dataURLtoFile (dataurl, filename) {
                 // 获取文件扩展名称
@@ -292,30 +298,15 @@
                 while (n--) {
                     u8arr[n] = bstr.charCodeAt(n);
                 }
-                return new File([u8arr], `${filename}.${extension}`, { type: mime });
-            },
 
-            // 点击文件预览
-            handlePreview (file) {
-                let viewerImage = this.$refs.viewerImage;
-                let viewer = new Viewer(viewerImage, {
-                    url: "data-original",
-                    hidden: function () {
-                        viewer.destroy();
-                    },
-                    loop: false,
-                    zIndex: 2147483647
-                });
-                viewer.show();
-            },
-            // 点击文件删除 - fileList服务器的数据列表
-            handleRemove (file) {
-                this.uploadType = "file"; // 删除后可以重新上传
-                this.curVal = "";
-                this.change(this.value);
-            },
-            change (...params) {
-                this.$emit("change", ...params);
+                return new File([u8arr], `${filename}.${extension}`, { type: mime });
+                // {
+                //     lastModified: 1752065308269
+                //     name: ".png"
+                //     size: 528557
+                //     type: "image/png"
+                //     webkitRelativePath: ""
+                // }
             },
 
             // 打开修改头像
@@ -344,9 +335,9 @@
             width: 100%;
 
             &-img {
+                float: left;
                 width: 100px;
                 height: 100px;
-                float: left;
                 background-repeat: no-repeat;
                 background-position: center;
                 background-size: contain;
@@ -357,7 +348,9 @@
                 overflow: hidden;
 
                 &-action {
+                    font-weight: 600;
                     color: @themeColor;
+                    // color: #ffffff;
                     cursor: pointer;
                 }
 

package/src/components/controls/base/BriUpload/uploadMixin.js

@@ -41,6 +41,11 @@ export default {
                 callback: res => {
                     this.uploadType = "file";
 
+                    // BriUploadImage使用时，file参数是个函数
+                    if (typeof file === "function") {
+                        file = file(res.ossType);
+                    }
+
                     if (res.ossType === "ali-oss") {
                         // 上传到阿里云res
                         if (this.aliOssType === "binaryMultipartUpload") {