widget.qw 1.0.71 → 1.0.72

package/build/style.css

@@ -412,10 +412,10 @@
   text-align: center;
   display: inline-block;
   border-radius: 2px;
-}[data-v-7352dfa0] .label {
+}[data-v-0c20dca4] .label {
   color: #000 !important;
 }
-[data-v-7352dfa0] .van-field__control:disabled {
+[data-v-0c20dca4] .van-field__control:disabled {
   color: #000 !important;
   cursor: not-allowed;
   opacity: 1;

package/build/widget.qw.es.js

@@ -18730,21 +18730,25 @@ const _sfc_main$i = {
   }
 };
 var ImagesPicker = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-8fca1c96"]]);
-var FilePicker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-7352dfa0] .label {\n  color: #000 !important;\n}\n[data-v-7352dfa0] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
+var FilePicker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-0c20dca4] .label {\n  color: #000 !important;\n}\n[data-v-0c20dca4] .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$b = {
-  class: "image-box"
+  class: "file-box"
 };
 const _sfc_main$h = {
   __name: "FilePicker",
   props: {
     modelValue: {
-      type: String,
-      default: ""
+      type: [String, Array],
+      default: null
     },
     label: {
       type: String,
       default: ""
     },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
     required: {
       type: Boolean,
       default: false
@@ -18791,22 +18795,44 @@ const _sfc_main$h = {
         file: file.file
       };
       return util.file_upload(params).then((res) => {
-        modelValue.value = res.data;
+        if (props.multiple)
+          modelValue.value = [...modelValue.value || [], res.data];
+        else
+          modelValue.value = res.data;
         return Promise.resolve(file);
       });
     });
     const onBeforeDelete = (e) => {
-      modelValue.value = "";
+      if (props.multiple) {
+        let newUrls = props.modelValue.filter((item) => {
+          return item != e.url;
+        });
+        emit("update:modelValue", newUrls);
+      } else {
+        modelValue.value = "";
+      }
       return Promise.resolve(e);
     };
     watch(() => props.modelValue, (newVal, oldVal) => {
-      if (!props.modelValue) {
-        files.value = [];
-        return;
+      if (props.multiple) {
+        if (!props.modelValue || props.modelValue.length < 1) {
+          files.value = [];
+          return;
+        }
+        files.value = props.modelValue.map((item) => {
+          return {
+            url: item
+          };
+        });
+      } else {
+        if (!props.modelValue) {
+          files.value = [];
+          return;
+        }
+        files.value = [{
+          url: props.modelValue
+        }];
       }
-      files.value = [{
-        url: props.modelValue
-      }];
     }, {
       immediate: true
     });
@@ -18825,20 +18851,20 @@ const _sfc_main$h = {
         input: withCtx(() => [createElementVNode("div", _hoisted_1$b, [createVNode(_component_van_uploader, {
           modelValue: files.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => files.value = $event),
-          "max-count": 1,
+          "max-count": props.max,
           afterRead: onAfterRead,
           disabled: unref(isDisabled),
           accept: props.accept,
           "upload-icon": "plus",
           deletable: !unref(isDisabled),
           "before-delete": onBeforeDelete
-        }, null, 8, ["modelValue", "disabled", "accept", "deletable"])])]),
+        }, null, 8, ["modelValue", "max-count", "disabled", "accept", "deletable"])])]),
         _: 1
       }, 8, ["label", "required", "rules", "placeholder"])) : createCommentVNode("", true);
     };
   }
 };
-var FilePicker = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-7352dfa0"]]);
+var FilePicker = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-0c20dca4"]]);
 var SingleUserSelector_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "\n.user-popup[data-v-a489ca4c] {\r\n  width: 100%;\r\n  overflow: hidden;\n}\n.department-selector[data-v-a489ca4c] {\r\n  padding: 10px;\n}\n.search-buttons[data-v-a489ca4c] {\r\n  display: flex;\r\n  gap: 10px;\n}\n.clear-btn[data-v-a489ca4c] {\r\n  background-color: #f2f3f5;\r\n  border: none;\r\n  border-radius: 4px;\r\n  padding: 4px 8px;\r\n  font-size: 14px;\n}\n.confirm-btn[data-v-a489ca4c] {\r\n  background-color: #1989fa;\r\n  color: white;\r\n  border: none;\r\n  border-radius: 4px;\r\n  padding: 4px 8px;\r\n  font-size: 14px;\n}\n.no-results[data-v-a489ca4c] {\r\n  text-align: center;\r\n  padding: 20px;\r\n  color: #969799;\n}\n.picker-header[data-v-a489ca4c] {\r\n  padding: 10px;\r\n  border-bottom: 1px solid #ebedf0;\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\n}\n.current-path[data-v-a489ca4c] {\r\n  flex: 1;\r\n  font-size: 14px;\r\n  color: #323233;\r\n  white-space: nowrap;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\n}\n.header-right[data-v-a489ca4c] {\r\n  display: flex;\r\n  gap: 8px;\r\n  margin-left: auto;\n}\n.cancel-btn[data-v-a489ca4c] {\r\n  color: #969799;\r\n  margin-right: 5px;\n}\n.scroll-container[data-v-a489ca4c] {\r\n  height: calc(80vh - 150px);\r\n  overflow-y: auto;\n}\r\n")();
 const _hoisted_1$a = {
   class: "department-selector"

package/build/widget.qw.umd.js

@@ -18733,21 +18733,25 @@ var __async = (__this, __arguments, generator) => {
     }
   };
   var ImagesPicker = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-8fca1c96"]]);
-  var FilePicker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-7352dfa0] .label {\n  color: #000 !important;\n}\n[data-v-7352dfa0] .van-field__control:disabled {\n  color: #000 !important;\n  cursor: not-allowed;\n  opacity: 1;\n  -webkit-text-fill-color: #000;\n}")();
+  var FilePicker_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "[data-v-0c20dca4] .label {\n  color: #000 !important;\n}\n[data-v-0c20dca4] .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$b = {
-    class: "image-box"
+    class: "file-box"
   };
   const _sfc_main$h = {
     __name: "FilePicker",
     props: {
       modelValue: {
-        type: String,
-        default: ""
+        type: [String, Array],
+        default: null
       },
       label: {
         type: String,
         default: ""
       },
+      multiple: {
+        type: Boolean,
+        default: false
+      },
       required: {
         type: Boolean,
         default: false
@@ -18794,22 +18798,44 @@ var __async = (__this, __arguments, generator) => {
           file: file.file
         };
         return util.file_upload(params).then((res) => {
-          modelValue.value = res.data;
+          if (props.multiple)
+            modelValue.value = [...modelValue.value || [], res.data];
+          else
+            modelValue.value = res.data;
           return Promise.resolve(file);
         });
       });
       const onBeforeDelete = (e) => {
-        modelValue.value = "";
+        if (props.multiple) {
+          let newUrls = props.modelValue.filter((item) => {
+            return item != e.url;
+          });
+          emit("update:modelValue", newUrls);
+        } else {
+          modelValue.value = "";
+        }
         return Promise.resolve(e);
       };
       vue.watch(() => props.modelValue, (newVal, oldVal) => {
-        if (!props.modelValue) {
-          files.value = [];
-          return;
+        if (props.multiple) {
+          if (!props.modelValue || props.modelValue.length < 1) {
+            files.value = [];
+            return;
+          }
+          files.value = props.modelValue.map((item) => {
+            return {
+              url: item
+            };
+          });
+        } else {
+          if (!props.modelValue) {
+            files.value = [];
+            return;
+          }
+          files.value = [{
+            url: props.modelValue
+          }];
         }
-        files.value = [{
-          url: props.modelValue
-        }];
       }, {
         immediate: true
       });
@@ -18828,20 +18854,20 @@ var __async = (__this, __arguments, generator) => {
           input: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_1$b, [vue.createVNode(_component_van_uploader, {
             modelValue: files.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => files.value = $event),
-            "max-count": 1,
+            "max-count": props.max,
             afterRead: onAfterRead,
             disabled: vue.unref(isDisabled),
             accept: props.accept,
             "upload-icon": "plus",
             deletable: !vue.unref(isDisabled),
             "before-delete": onBeforeDelete
-          }, null, 8, ["modelValue", "disabled", "accept", "deletable"])])]),
+          }, null, 8, ["modelValue", "max-count", "disabled", "accept", "deletable"])])]),
           _: 1
         }, 8, ["label", "required", "rules", "placeholder"])) : vue.createCommentVNode("", true);
       };
     }
   };
-  var FilePicker = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-7352dfa0"]]);
+  var FilePicker = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-0c20dca4"]]);
   var SingleUserSelector_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "\n.user-popup[data-v-a489ca4c] {\r\n  width: 100%;\r\n  overflow: hidden;\n}\n.department-selector[data-v-a489ca4c] {\r\n  padding: 10px;\n}\n.search-buttons[data-v-a489ca4c] {\r\n  display: flex;\r\n  gap: 10px;\n}\n.clear-btn[data-v-a489ca4c] {\r\n  background-color: #f2f3f5;\r\n  border: none;\r\n  border-radius: 4px;\r\n  padding: 4px 8px;\r\n  font-size: 14px;\n}\n.confirm-btn[data-v-a489ca4c] {\r\n  background-color: #1989fa;\r\n  color: white;\r\n  border: none;\r\n  border-radius: 4px;\r\n  padding: 4px 8px;\r\n  font-size: 14px;\n}\n.no-results[data-v-a489ca4c] {\r\n  text-align: center;\r\n  padding: 20px;\r\n  color: #969799;\n}\n.picker-header[data-v-a489ca4c] {\r\n  padding: 10px;\r\n  border-bottom: 1px solid #ebedf0;\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\n}\n.current-path[data-v-a489ca4c] {\r\n  flex: 1;\r\n  font-size: 14px;\r\n  color: #323233;\r\n  white-space: nowrap;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\n}\n.header-right[data-v-a489ca4c] {\r\n  display: flex;\r\n  gap: 8px;\r\n  margin-left: auto;\n}\n.cancel-btn[data-v-a489ca4c] {\r\n  color: #969799;\r\n  margin-right: 5px;\n}\n.scroll-container[data-v-a489ca4c] {\r\n  height: calc(80vh - 150px);\r\n  overflow-y: auto;\n}\r\n")();
   const _hoisted_1$a = {
     class: "department-selector"

package/package.json

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

package/src/components/FilePicker.vue

@@ -2,9 +2,10 @@
     <van-field v-if="!isGone" name="image" :label="props.label" :required="isRequired" :rules="props.rules"
         label-class="label" :placeholder="props.placeholder">
         <template #input>
-            <div class="image-box">
-                <van-uploader v-model="files" :max-count="1" :afterRead="onAfterRead" :disabled="isDisabled"
-                    :accept="props.accept" upload-icon="plus" :deletable="!isDisabled" :before-delete="onBeforeDelete" />
+            <div class="file-box">
+                <van-uploader v-model="files" :max-count="props.max" :afterRead="onAfterRead" :disabled="isDisabled"
+                    :accept="props.accept" upload-icon="plus" :deletable="!isDisabled"
+                    :before-delete="onBeforeDelete" />
             </div>
         </template>
     </van-field>
@@ -17,13 +18,17 @@ import { useVModel } from "@vueuse/core"
 
 const props = defineProps({
     modelValue: {
-        type: String,
-        default: ''
+        type: [String, Array],
+        default: null
     },
     label: {
         type: String,
         default: ''
     },
+    multiple: {
+        type: Boolean,
+        default: false
+    },
     required: {
         type: Boolean,
         default: false
@@ -67,26 +72,50 @@ const onAfterRead = async (file) => {
     }
 
     return util.file_upload(params).then(res => {
-        modelValue.value = res.data
+        if (props.multiple)
+            modelValue.value = [...(modelValue.value || []), res.data]
+        else
+            modelValue.value = res.data
         return Promise.resolve(file)
     })
 }
 
 const onBeforeDelete = (e) => {
-    modelValue.value = ''
+    if (props.multiple) {
+        let newUrls = props.modelValue.filter(item => {
+            return item != e.url
+        })
+        emit('update:modelValue', newUrls)
+    } else {
+        modelValue.value = ''
+    }
+
     return Promise.resolve(e)
 }
 
 watch(() => props.modelValue,
     (newVal, oldVal) => {
-        if (!props.modelValue) {
-            files.value = []
-            return
-        }
+        if (props.multiple) {
+            if (!props.modelValue || props.modelValue.length < 1) {
+                files.value = []
+                return
+            }
 
-        files.value = [{
-            url: props.modelValue
-        }]
+            files.value = props.modelValue.map(item => {
+                return {
+                    url: item
+                }
+            })
+        } else {
+            if (!props.modelValue) {
+                files.value = []
+                return
+            }
+
+            files.value = [{
+                url: props.modelValue
+            }]
+        }
     },
     {
         immediate: true

package/src/views/filepicker/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="page">
-      <widget-qw-file-picker label="文件" v-model="data.url" :auth="data.auth" accept=".xls,.xlsx" />
+      <widget-qw-file-picker label="文件" multiple v-model="data.urls" :auth="data.auth" accept=".jpg,.png" />
   </div>
 </template>
 
@@ -8,8 +8,8 @@
 import { onMounted, reactive, watch } from "vue";
 
 const data = reactive({
-  auth:'readonly',
-  url: 'https://1.pdf'
+  auth:'require',
+  urls: ['https://1.pdf']
 })
 
 watch(()=>data.url,(newVal,oldVal)=>{