widget.qw 1.0.57 → 1.0.58

package/build/style.css

@@ -387,18 +387,18 @@
   color: #969799;
   margin-right: 5px;
 }
-[data-v-6008668e] .label {
+[data-v-0c9127e8] .label {
   color: #000 !important;
 }
-[data-v-6008668e] .van-field__control:disabled {
+[data-v-0c9127e8] .van-field__control:disabled {
   color: #000 !important;
   cursor: not-allowed;
   opacity: 1;
   -webkit-text-fill-color: #000;
-}.widget[data-v-1b4c046a] {
+}.widget[data-v-8a570fc4] {
   text-align: center;
 }
-.widget .btn[data-v-1b4c046a] {
+.widget .btn[data-v-8a570fc4] {
   position: fixed;
   bottom: 1rem;
   left: 0;

package/build/widget.qw.es.js

@@ -10171,8 +10171,8 @@ const compress_image = (file) => __async(this, null, function* () {
   return new Promise((resolve, reject) => {
     new Compressor(file, {
       quality: 0.7,
-      maxWidth: 1400,
-      maxHeight: 1400,
+      maxWidth: 800,
+      maxHeight: 800,
       success(result) {
         console.log("\u538B\u7F29\u540E\u7684\u56FE\u7247", result);
         let compress_file = blob2file(result, result.name);
@@ -18448,7 +18448,7 @@ const _sfc_main$k = {
   }
 };
 var UserSelector = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-6c4b4fc8"]]);
-var image_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-6008668e] .label {\n  color: #000 !important;\n}\n[data-v-6008668e] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
+var image_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-0c9127e8] .label {\n  color: #000 !important;\n}\n[data-v-0c9127e8] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
 const _hoisted_1$c = {
   class: "image-box"
 };
@@ -18525,6 +18525,10 @@ const _sfc_main$j = {
       modelValue.value = "";
       return Promise.resolve(e);
     };
+    const onPreview = (e) => {
+      console.log("onPreview", e);
+      window.open(e.url, "_blank");
+    };
     watch(() => props.modelValue, (newVal, oldVal) => {
       if (!props.modelValue) {
         files.value = [];
@@ -18558,7 +18562,8 @@ const _sfc_main$j = {
           afterRead: onAfterRead,
           disabled: unref(isDisabled),
           deletable: !unref(isDisabled),
-          "before-delete": onBeforeDelete
+          "before-delete": onBeforeDelete,
+          onClickPreview: onPreview
         }, null, 8, ["modelValue", "capture", "disabled", "deletable"])) : (openBlock(), createBlock(_component_van_uploader, {
           key: 1,
           modelValue: files.value,
@@ -18568,15 +18573,16 @@ const _sfc_main$j = {
           afterRead: onAfterRead,
           disabled: unref(isDisabled),
           deletable: !unref(isDisabled),
-          "before-delete": onBeforeDelete
+          "before-delete": onBeforeDelete,
+          onClickPreview: onPreview
         }, null, 8, ["modelValue", "disabled", "deletable"]))])]),
         _: 1
       }, 8, ["label", "required", "rules", "placeholder"])) : createCommentVNode("", true);
     };
   }
 };
-var ImagePicker = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-6008668e"]]);
-var images_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => ".widget[data-v-1b4c046a] {\n  text-align: center;\n}\n.widget .btn[data-v-1b4c046a] {\n  position: fixed;\n  bottom: 1rem;\n  left: 0;\n  right: 0;\n  margin: auto auto;\n  color: white;\n  font-size: 14px;\n  background: rgb(58, 136, 255);\n  padding: 8px 35px;\n  width: 100px;\n  text-align: center;\n  display: inline-block;\n  border-radius: 2px;\n}")();
+var ImagePicker = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-0c9127e8"]]);
+var images_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => ".widget[data-v-8a570fc4] {\n  text-align: center;\n}\n.widget .btn[data-v-8a570fc4] {\n  position: fixed;\n  bottom: 1rem;\n  left: 0;\n  right: 0;\n  margin: auto auto;\n  color: white;\n  font-size: 14px;\n  background: rgb(58, 136, 255);\n  padding: 8px 35px;\n  width: 100px;\n  text-align: center;\n  display: inline-block;\n  border-radius: 2px;\n}")();
 const _hoisted_1$b = {
   class: "image-box"
 };
@@ -18665,6 +18671,10 @@ const _sfc_main$i = {
       emit("update:modelValue", newUrls);
       return Promise.resolve(e);
     };
+    const onPreview = (e) => {
+      console.log("onPreview", e);
+      window.open(e.url, "_blank");
+    };
     watch(() => props.modelValue, (newVal, oldVal) => {
       if (!props.modelValue || props.modelValue.length < 1) {
         files.value = [];
@@ -18700,7 +18710,8 @@ const _sfc_main$i = {
           disabled: unref(isDisabled),
           deletable: !unref(isDisabled),
           afterRead: onAfterRead,
-          "before-delete": onBeforeDelete
+          "before-delete": onBeforeDelete,
+          onClickPreview: onPreview
         }, null, 8, ["modelValue", "max-count", "capture", "disabled", "deletable"])) : (openBlock(), createBlock(_component_van_uploader, {
           key: 1,
           modelValue: files.value,
@@ -18710,14 +18721,15 @@ const _sfc_main$i = {
           disabled: unref(isDisabled),
           deletable: !unref(isDisabled),
           afterRead: onAfterRead,
-          "before-delete": onBeforeDelete
+          "before-delete": onBeforeDelete,
+          onClickPreview: onPreview
         }, null, 8, ["modelValue", "max-count", "disabled", "deletable"]))])]),
         _: 1
       }, 8, ["label", "required", "rules", "placeholder"]);
     };
   }
 };
-var ImagesPicker = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-1b4c046a"]]);
+var ImagesPicker = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-8a570fc4"]]);
 var FilePicker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-a0846250] .label {\n  color: #000 !important;\n}\n[data-v-a0846250] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
 const _hoisted_1$a = {
   class: "image-box"

package/build/widget.qw.umd.js

@@ -10174,8 +10174,8 @@ var __async = (__this, __arguments, generator) => {
     return new Promise((resolve, reject) => {
       new Compressor(file, {
         quality: 0.7,
-        maxWidth: 1400,
-        maxHeight: 1400,
+        maxWidth: 800,
+        maxHeight: 800,
         success(result) {
           console.log("\u538B\u7F29\u540E\u7684\u56FE\u7247", result);
           let compress_file = blob2file(result, result.name);
@@ -18451,7 +18451,7 @@ var __async = (__this, __arguments, generator) => {
     }
   };
   var UserSelector = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-6c4b4fc8"]]);
-  var image_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-6008668e] .label {\n  color: #000 !important;\n}\n[data-v-6008668e] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
+  var image_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-0c9127e8] .label {\n  color: #000 !important;\n}\n[data-v-0c9127e8] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
   const _hoisted_1$c = {
     class: "image-box"
   };
@@ -18528,6 +18528,10 @@ var __async = (__this, __arguments, generator) => {
         modelValue.value = "";
         return Promise.resolve(e);
       };
+      const onPreview = (e) => {
+        console.log("onPreview", e);
+        window.open(e.url, "_blank");
+      };
       vue.watch(() => props.modelValue, (newVal, oldVal) => {
         if (!props.modelValue) {
           files.value = [];
@@ -18561,7 +18565,8 @@ var __async = (__this, __arguments, generator) => {
             afterRead: onAfterRead,
             disabled: vue.unref(isDisabled),
             deletable: !vue.unref(isDisabled),
-            "before-delete": onBeforeDelete
+            "before-delete": onBeforeDelete,
+            onClickPreview: onPreview
           }, null, 8, ["modelValue", "capture", "disabled", "deletable"])) : (vue.openBlock(), vue.createBlock(_component_van_uploader, {
             key: 1,
             modelValue: files.value,
@@ -18571,15 +18576,16 @@ var __async = (__this, __arguments, generator) => {
             afterRead: onAfterRead,
             disabled: vue.unref(isDisabled),
             deletable: !vue.unref(isDisabled),
-            "before-delete": onBeforeDelete
+            "before-delete": onBeforeDelete,
+            onClickPreview: onPreview
           }, null, 8, ["modelValue", "disabled", "deletable"]))])]),
           _: 1
         }, 8, ["label", "required", "rules", "placeholder"])) : vue.createCommentVNode("", true);
       };
     }
   };
-  var ImagePicker = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-6008668e"]]);
-  var images_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => ".widget[data-v-1b4c046a] {\n  text-align: center;\n}\n.widget .btn[data-v-1b4c046a] {\n  position: fixed;\n  bottom: 1rem;\n  left: 0;\n  right: 0;\n  margin: auto auto;\n  color: white;\n  font-size: 14px;\n  background: rgb(58, 136, 255);\n  padding: 8px 35px;\n  width: 100px;\n  text-align: center;\n  display: inline-block;\n  border-radius: 2px;\n}")();
+  var ImagePicker = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-0c9127e8"]]);
+  var images_picker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => ".widget[data-v-8a570fc4] {\n  text-align: center;\n}\n.widget .btn[data-v-8a570fc4] {\n  position: fixed;\n  bottom: 1rem;\n  left: 0;\n  right: 0;\n  margin: auto auto;\n  color: white;\n  font-size: 14px;\n  background: rgb(58, 136, 255);\n  padding: 8px 35px;\n  width: 100px;\n  text-align: center;\n  display: inline-block;\n  border-radius: 2px;\n}")();
   const _hoisted_1$b = {
     class: "image-box"
   };
@@ -18668,6 +18674,10 @@ var __async = (__this, __arguments, generator) => {
         emit("update:modelValue", newUrls);
         return Promise.resolve(e);
       };
+      const onPreview = (e) => {
+        console.log("onPreview", e);
+        window.open(e.url, "_blank");
+      };
       vue.watch(() => props.modelValue, (newVal, oldVal) => {
         if (!props.modelValue || props.modelValue.length < 1) {
           files.value = [];
@@ -18703,7 +18713,8 @@ var __async = (__this, __arguments, generator) => {
             disabled: vue.unref(isDisabled),
             deletable: !vue.unref(isDisabled),
             afterRead: onAfterRead,
-            "before-delete": onBeforeDelete
+            "before-delete": onBeforeDelete,
+            onClickPreview: onPreview
           }, null, 8, ["modelValue", "max-count", "capture", "disabled", "deletable"])) : (vue.openBlock(), vue.createBlock(_component_van_uploader, {
             key: 1,
             modelValue: files.value,
@@ -18713,14 +18724,15 @@ var __async = (__this, __arguments, generator) => {
             disabled: vue.unref(isDisabled),
             deletable: !vue.unref(isDisabled),
             afterRead: onAfterRead,
-            "before-delete": onBeforeDelete
+            "before-delete": onBeforeDelete,
+            onClickPreview: onPreview
           }, null, 8, ["modelValue", "max-count", "disabled", "deletable"]))])]),
           _: 1
         }, 8, ["label", "required", "rules", "placeholder"]);
       };
     }
   };
-  var ImagesPicker = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-1b4c046a"]]);
+  var ImagesPicker = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-8a570fc4"]]);
   var FilePicker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-a0846250] .label {\n  color: #000 !important;\n}\n[data-v-a0846250] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
   const _hoisted_1$a = {
     class: "image-box"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "widget.qw",
   "private": false,
-  "version": "1.0.57",
+  "version": "1.0.58",
   "description": "marqstree Vue3组件库",
   "main": "build/widget.qw.es.js",
   "keywords": [

package/src/components/image_picker.vue

@@ -5,10 +5,12 @@
             <div class="image-box">
                 <van-uploader v-if="props.capture" v-model="files" :max-count="1" :capture="props.capture"
                     accept="image/jpeg,image/png" :afterRead="onAfterRead" :disabled="isDisabled"
-                    :deletable="!isDisabled" :before-delete="onBeforeDelete" />
+                    :deletable="!isDisabled" :before-delete="onBeforeDelete"
+                    @click-preview="onPreview" />
                 <van-uploader v-else v-model="files" :max-count="1" accept="image/jpeg,image/png"
                     :afterRead="onAfterRead" :disabled="isDisabled" :deletable="!isDisabled"
-                    :before-delete="onBeforeDelete" />
+                    :before-delete="onBeforeDelete"
+                    @click-preview="onPreview" />
             </div>
         </template>
     </van-field>
@@ -91,6 +93,11 @@ const onBeforeDelete = (e) => {
     return Promise.resolve(e)
 }
 
+const onPreview = (e) => {
+    console.log('onPreview', e)
+    window.open(e.url, "_blank");
+}
+
 watch(() => props.modelValue,
     (newVal, oldVal) => {
         if (!props.modelValue) {

package/src/components/images_picker.vue

@@ -5,10 +5,12 @@
             <div class="image-box">
                 <van-uploader v-if="props.capture" v-model="files" :max-count="props.max" :capture="props.capture"
                     accept="image/jpeg,image/png" :disabled="isDisabled" :deletable="!isDisabled"
-                    :afterRead="onAfterRead" :before-delete="onBeforeDelete" />
+                    :afterRead="onAfterRead" :before-delete="onBeforeDelete"
+                    @click-preview="onPreview" />
                 <van-uploader v-else v-model="files" :max-count="props.max" accept="image/jpeg,image/png"
                     :disabled="isDisabled" :deletable="!isDisabled" :afterRead="onAfterRead"
-                    :before-delete="onBeforeDelete" />
+                    :before-delete="onBeforeDelete"
+                    @click-preview="onPreview" />
             </div>
         </template>
     </van-field>
@@ -102,6 +104,11 @@ const onBeforeDelete = (e) => {
     return Promise.resolve(e)
 }
 
+const onPreview = (e) => {
+    console.log('onPreview', e)
+    window.open(e.url, "_blank");
+}
+
 watch(() => props.modelValue,
     (newVal, oldVal) => {
         if (!props.modelValue || props.modelValue.length < 1) {

package/src/util/image_util.js

@@ -5,8 +5,8 @@ export const compress_image = async (file) => {
     return new Promise((resolve, reject) => {
         new Compressor(file, {
             quality: 0.7,
-            maxWidth: 1400,
-            maxHeight: 1400,
+            maxWidth: 800,
+            maxHeight: 800,
             success(result) {
                 console.log('压缩后的图片', result);
                 let compress_file = blob2file(result, result.name)