bkui-vue 2.0.1-beta.70.search.1 → 2.0.1-beta.72

package/lib/upload/index.js

@@ -1255,6 +1255,10 @@ const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBP
 // EXTERNAL MODULE: ../../node_modules/@babel/runtime/regenerator/index.js
 var regenerator = __webpack_require__(2841);
 var regenerator_default = /*#__PURE__*/__webpack_require__.n(regenerator);
+;// CONCATENATED MODULE: external "../config-provider"
+var config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var config_provider_y = x => () => x
+const config_provider_namespaceObject = config_provider_x({ ["useLocale"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.useLocale, ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix });
 ;// CONCATENATED MODULE: ../../packages/upload/src/upload.type.ts
 /*
  * Tencent is pleased to support the open source community by making
@@ -1281,19 +1285,24 @@ var regenerator_default = /*#__PURE__*/__webpack_require__.n(regenerator);
  * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
  * IN THE SOFTWARE.
  */
-var CLASS_PREFIX = 'bk-upload';
+var CLASS_PREFIX = 'upload';
 var EThemes;
 (function (EThemes) {
   EThemes["BUTTON"] = "button";
   EThemes["DRAGGABLE"] = "draggable";
   EThemes["PICTURE"] = "picture";
 })(EThemes || (EThemes = {}));
+var ETypes;
+(function (ETypes) {
+  ETypes["BINARY"] = "binary";
+  ETypes["FORMDATA"] = "formdata";
+})(ETypes || (ETypes = {}));
 var EUploadStatus;
 (function (EUploadStatus) {
+  EUploadStatus["FAIL"] = "fail";
   EUploadStatus["NEW"] = "new";
-  EUploadStatus["UPLOADING"] = "uploading";
   EUploadStatus["SUCCESS"] = "success";
-  EUploadStatus["FAIL"] = "fail";
+  EUploadStatus["UPLOADING"] = "uploading";
 })(EUploadStatus || (EUploadStatus = {}));
 ;// CONCATENATED MODULE: ../../packages/upload/src/props.ts
 /*
@@ -1323,7 +1332,19 @@ var EUploadStatus;
  */
 
 var themes = [EThemes.BUTTON, EThemes.DRAGGABLE, EThemes.PICTURE];
+var types = [ETypes.FORMDATA, ETypes.BINARY];
 /* harmony default export */ const props = ({
+  type: {
+    type: String,
+    "default": 'formdata',
+    validator: function validator(val) {
+      if (!val || types.includes(val)) {
+        return true;
+      }
+      console.error("invalid type, ".concat(val, ", the type must be one of \u3010").concat(types.join(' | '), "\u3011"));
+      return false;
+    }
+  },
   theme: {
     type: String,
     "default": 'draggable',
@@ -1517,10 +1538,6 @@ function _nonIterableRest() {
 function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
-;// CONCATENATED MODULE: external "../config-provider"
-var config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var config_provider_y = x => () => x
-const config_provider_namespaceObject = config_provider_x({ ["useLocale"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.useLocale });
 ;// CONCATENATED MODULE: external "../icon"
 var icon_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var icon_y = x => () => x
@@ -1586,11 +1603,13 @@ function _isSlot(s) {
     var slots = _ref.slots,
       emit = _ref.emit;
     var t = (0,config_provider_namespaceObject.useLocale)('upload');
+    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
+      resolveClassName = _usePrefix.resolveClassName;
     var _toRefs = (0,external_vue_namespaceObject.toRefs)(props),
       theme = _toRefs.theme,
       disabled = _toRefs.disabled,
       multiple = _toRefs.multiple;
-    var classBlock = "".concat(CLASS_PREFIX, "-list");
+    var classBlock = "".concat(resolveClassName(CLASS_PREFIX), "-list");
     var isPhotowall = (0,external_vue_namespaceObject.computed)(function () {
       return theme.value === EThemes.PICTURE;
     });
@@ -1632,19 +1651,19 @@ function _isSlot(s) {
     };
     var PhotoItem = function PhotoItem(file) {
       return [(0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("img", {
-        "src": file.url,
         "class": "".concat(classBlock, "__picture-item-thumbnail"),
-        "alt": ""
+        "alt": "",
+        "src": file.url
       }, null), [[external_vue_namespaceObject.vShow, file.status !== 'uploading']]), (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [file.status === 'uploading' && (0,external_vue_namespaceObject.createVNode)(progress_namespaceObject["default"], {
+        "width": 50,
         "class": "".concat(classBlock, "__picture-item-progress"),
-        "type": "circle",
-        "color": "#3a84ff",
         "bgColor": "#333",
-        "width": 50,
+        "color": "#3a84ff",
+        "percent": file.percentage,
         "titleStyle": {
           color: '#fff'
         },
-        "percent": file.percentage
+        "type": "circle"
       }, null)]), (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [!disabled.value && (0,external_vue_namespaceObject.createVNode)("div", {
         "class": "".concat(classBlock, "__picture-item-actions")
       }, [(0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Del, {
@@ -1698,9 +1717,9 @@ function _isSlot(s) {
       return [(0,external_vue_namespaceObject.createVNode)("div", {
         "class": "".concat(classBlock, "__item-icon")
       }, [file.isPic ? (0,external_vue_namespaceObject.createVNode)("img", {
-        "src": file.url,
         "class": "".concat(classBlock, "__item-thumbnail"),
-        "alt": ""
+        "alt": "",
+        "src": file.url
       }, null) : FileIcon(file)]), (0,external_vue_namespaceObject.createVNode)("div", {
         "class": "".concat(classBlock, "__item-summary")
       }, [(0,external_vue_namespaceObject.createVNode)("div", {
@@ -1713,8 +1732,8 @@ function _isSlot(s) {
         "class": "".concat(classBlock, "__item-message-success-icon")
       }, null), file.statusText || t.value.uploadSuccess]), file.status === 'fail' && (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [file.statusText || t.value.uploadFailed])]), file.status === 'uploading' && (0,external_vue_namespaceObject.createVNode)(progress_namespaceObject["default"], {
         "class": "".concat(classBlock, "__item-progress"),
-        "showText": false,
         "percent": file.percentage,
+        "showText": false,
         "size": "small"
       }, null), file.status !== 'fail' && (0,external_vue_namespaceObject.createVNode)("div", {
         "class": "".concat(classBlock, "__item-speed")
@@ -1807,13 +1826,15 @@ const button_less_namespaceObject = button_less_x({  });
     var slots = _ref.slots,
       emit = _ref.emit;
     var t = (0,config_provider_namespaceObject.useLocale)('upload');
+    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
+      resolveClassName = _usePrefix.resolveClassName;
     var _toRefs = (0,external_vue_namespaceObject.toRefs)(props),
       theme = _toRefs.theme,
       disabled = _toRefs.disabled,
       file = _toRefs.file,
       multiple = _toRefs.multiple,
       accept = _toRefs.accept;
-    var classBlock = "".concat(CLASS_PREFIX, "-trigger");
+    var classBlock = "".concat(resolveClassName(CLASS_PREFIX), "-trigger");
     var isButton = (0,external_vue_namespaceObject.computed)(function () {
       return theme.value === EThemes.BUTTON;
     });
@@ -1891,9 +1912,9 @@ const button_less_namespaceObject = button_less_x({  });
       var classNames = (0,shared_namespaceObject.classes)(_defineProperty({}, "".concat(classBlock, "__draggable"), true));
       return (0,external_vue_namespaceObject.createVNode)("div", {
         "class": classNames,
-        "onDrop": handleDrop,
+        "onDragleave": handleDragleave,
         "onDragover": handleDragover,
-        "onDragleave": handleDragleave
+        "onDrop": handleDrop
       }, [slots["default"] ? slots["default"]() : (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Upload, {
         "class": "".concat(classBlock, "__draggable-icon")
       }, null), (0,external_vue_namespaceObject.createVNode)("div", {
@@ -1916,19 +1937,19 @@ const button_less_namespaceObject = button_less_x({  });
     };
     var SinglePicture = function SinglePicture(file) {
       return [(0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("img", {
-        "src": file.url,
         "class": "".concat(classBlock, "__picture-thumbnail"),
-        "alt": ""
+        "alt": "",
+        "src": file.url
       }, null), [[external_vue_namespaceObject.vShow, file.status !== 'uploading']]), (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [file.status === 'uploading' && (0,external_vue_namespaceObject.createVNode)(progress_namespaceObject["default"], {
+        "width": 50,
         "class": "".concat(classBlock, "__picture-progress"),
-        "type": "circle",
-        "color": "#3a84ff",
         "bgColor": "#333",
-        "width": 50,
+        "color": "#3a84ff",
+        "percent": file.percentage,
         "titleStyle": {
           color: '#fff'
         },
-        "percent": file.percentage
+        "type": "circle"
       }, null)]), (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [!props.disabled && (0,external_vue_namespaceObject.createVNode)("div", {
         "class": "".concat(classBlock, "__picture-actions")
       }, [(0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Del, {
@@ -1966,12 +1987,12 @@ const button_less_namespaceObject = button_less_x({  });
       }, [slots.trigger ? [slots.trigger(), slots === null || slots === void 0 || (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)] : Trigger(), (0,external_vue_namespaceObject.createVNode)("input", {
         "ref": inputEl,
         "class": "".concat(classBlock, "__input-file"),
-        "tabindex": "-1",
-        "onChange": handleFileChange,
         "accept": acceptTypes.value,
-        "multiple": multiple.value,
         "disabled": disabled.value,
-        "type": "file"
+        "multiple": multiple.value,
+        "tabindex": "-1",
+        "type": "file",
+        "onChange": handleFileChange
       }, null)]);
     };
   }
@@ -2032,10 +2053,11 @@ var spark_md5_default = /*#__PURE__*/__webpack_require__.n(spark_md5);
  */
 
 
+var errMsg = 'An error occurred during upload';
 function getRes(xhr) {
   var res = xhr.responseText || xhr.response;
   if (!res) {
-    return res;
+    return res || {};
   }
   try {
     return JSON.parse(res);
@@ -2048,7 +2070,9 @@ var ajaxUpload = function ajaxUpload(option) {
     throw new Error('XMLHttpRequest is undefined');
   }
   var xhr = new XMLHttpRequest();
-  var action = option.action;
+  var action = option.action,
+    type = option.type;
+  var isFormdata = type === 'formdata';
   if (xhr.upload) {
     xhr.upload.addEventListener('progress', function (event) {
       var progressEvent = event;
@@ -2057,7 +2081,7 @@ var ajaxUpload = function ajaxUpload(option) {
     });
   }
   var formData = new FormData();
-  if (option.data) {
+  if (isFormdata && option.data) {
     var appendData = option.data;
     if (!Array.isArray(appendData)) {
       appendData = [appendData];
@@ -2071,7 +2095,7 @@ var ajaxUpload = function ajaxUpload(option) {
       }
     });
   }
-  if (option.formDataAttributes) {
+  if (isFormdata && option.formDataAttributes) {
     var _appendData = option.formDataAttributes;
     if (!Array.isArray(_appendData)) {
       _appendData = [_appendData];
@@ -2080,13 +2104,27 @@ var ajaxUpload = function ajaxUpload(option) {
       if (Array.isArray(item.value)) formData.append.apply(formData, [item.name].concat(_toConsumableArray(item.value)));else formData.append(item.name, item.value);
     });
   }
-  formData.append(option.filename, option.file, option.file.name);
+  if (isFormdata) {
+    formData.append(option.filename, option.file, option.file.name);
+  }
   xhr.addEventListener('error', function () {
-    option.onError(new Error('An error occurred during upload'));
+    var msg = new Error(errMsg);
+    var responseText = getRes(xhr);
+    if (responseText) {
+      msg = new Error(responseText.message || errMsg);
+    }
+    console.log(responseText, msg);
+    option.onError(msg);
+    // option.onError(new Error('An error occurred during upload'));
   });
   xhr.addEventListener('load', function () {
     if (xhr.status < 200 || xhr.status >= 300) {
-      return option.onError(new Error('An error occurred during upload'));
+      var responseText = getRes(xhr);
+      var msg = new Error(errMsg);
+      if (responseText) {
+        msg = new Error(responseText.message || errMsg);
+      }
+      return option.onError(msg);
     }
     option.onSuccess(getRes(xhr));
   });
@@ -2124,7 +2162,7 @@ var ajaxUpload = function ajaxUpload(option) {
       xhr.setRequestHeader(key, String(value));
     }
   }
-  xhr.send(formData);
+  xhr.send(isFormdata ? formData : option.file);
   return xhr;
 };
 // 该方法用于在不同的浏览器使用不同的方式
@@ -2164,10 +2202,15 @@ var ajaxSliceUpload = /*#__PURE__*/function () {
             req.open(option.method, option.mergeUrl, true);
             req.onreadystatechange = function () {
               if (req.readyState === 4) {
+                var responseText = getRes(req);
                 if (req.status < 200 || req.status >= 300) {
-                  return option.onError(new Error('An error occurred during upload'));
+                  var msg = new Error(errMsg);
+                  if (responseText) {
+                    msg = new Error(responseText.message || errMsg);
+                  }
+                  return option.onError(msg);
                 }
-                option.onSuccess(getRes(req));
+                option.onSuccess(responseText);
               }
             };
             req.onloadend = function () {
@@ -2189,7 +2232,6 @@ var ajaxSliceUpload = /*#__PURE__*/function () {
 // 请求分片上传，保存在progressList中
 var sliceSend = function sliceSend(option, file, blockCount, hash, progressList, chunkSize) {
   var _loop = function _loop(i) {
-    // eslint-disable-next-line no-loop-func
     var pooltask = new Promise(function (resolve, reject) {
       var start = i * chunkSize;
       var end = Math.min(file.size, start + chunkSize);
@@ -2227,10 +2269,14 @@ var sliceSend = function sliceSend(option, file, blockCount, hash, progressList,
       var xhr = new XMLHttpRequest();
       xhr.onreadystatechange = function () {
         if (xhr.readyState === 4) {
-          var res = getRes(xhr);
+          var responseText = getRes(xhr);
           if (xhr.status < 200 || xhr.status >= 300) {
-            reject(res);
-            option.onError(new Error('An error occurred during upload'));
+            reject(responseText);
+            var msg = new Error(errMsg);
+            if (responseText) {
+              msg = new Error(responseText.message || errMsg);
+            }
+            option.onError(msg);
           } else {
             resolve('reponseText');
           }
@@ -2308,7 +2354,7 @@ var hashFile = function hashFile(file, chunkSize) {
       }
     };
     fileReader.onerror = function () {
-      reject(new Error('File slcie failed'));
+      reject(new Error('File slice failed'));
     };
     loadNext();
   })["catch"](function (err) {
@@ -2601,6 +2647,7 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
 
 
 
+
 /* harmony default export */ const upload = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'Upload',
   props: props,
@@ -2609,6 +2656,8 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
     var slots = _ref.slots,
       emit = _ref.emit,
       expose = _ref.expose;
+    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
+      resolveClassName = _usePrefix.resolveClassName;
     var requests = (0,external_vue_namespaceObject.shallowRef)({});
     var isPhotowall = (0,external_vue_namespaceObject.computed)(function () {
       return props.theme === EThemes.PICTURE;
@@ -2618,7 +2667,7 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
     });
     var classNames = (0,external_vue_namespaceObject.computed)(function () {
       var _props$extCls;
-      return (0,shared_namespaceObject.classes)(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, CLASS_PREFIX, true), "".concat(CLASS_PREFIX, "--").concat(props.theme), true), "".concat(CLASS_PREFIX, "--disabled"), props.disabled), "".concat(CLASS_PREFIX, "--single-picture"), isSinglePhoto.value), props.extCls, (_props$extCls = props.extCls) !== null && _props$extCls !== void 0 ? _props$extCls : false));
+      return (0,shared_namespaceObject.classes)(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(resolveClassName(CLASS_PREFIX)), true), "".concat(resolveClassName(CLASS_PREFIX), "--").concat(props.theme), true), "".concat(resolveClassName(CLASS_PREFIX), "--disabled"), props.disabled), "".concat(resolveClassName(CLASS_PREFIX), "--single-picture"), isSinglePhoto.value), props.extCls, (_props$extCls = props.extCls) !== null && _props$extCls !== void 0 ? _props$extCls : false));
     });
     var triggerProps = (0,external_vue_namespaceObject.computed)(function () {
       return {
@@ -2700,7 +2749,7 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
             case 2:
               _context.prev = 2;
               _context.next = 5;
-              return (_props$beforeUpload = props.beforeUpload) === null || _props$beforeUpload === void 0 ? void 0 : _props$beforeUpload.call(props, file);
+              return (_props$beforeUpload = props.beforeUpload) === null || _props$beforeUpload === void 0 ? void 0 : _props$beforeUpload.call(props, file, sendFiles);
             case 5:
               beforeResult = _context.sent;
               _context.next = 11;
@@ -2727,7 +2776,8 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
       return _upload.apply(this, arguments);
     }
     function send(file, sendFiles) {
-      var headers = props.headers,
+      var type = props.type,
+        headers = props.headers,
         header = props.header,
         data = props.data,
         formDataAttributes = props.formDataAttributes,
@@ -2741,6 +2791,7 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
         customRequest = props.customRequest;
       var uid = file.uid;
       var options = {
+        type: type,
         headers: headers,
         header: header,
         withCredentials: withCredentials,
@@ -2820,12 +2871,12 @@ function upload_arrayLikeToArray(arr, len) { if (len == null || len > arr.length
       }, [!isPhotowall.value && (0,external_vue_namespaceObject.createVNode)(upload_trigger, (0,external_vue_namespaceObject.mergeProps)(triggerProps.value, {
         "onChange": handleFiles
       }), slots), slots.tip ? slots.tip() : props.tip && (0,external_vue_namespaceObject.createVNode)("div", {
-        "class": "".concat(CLASS_PREFIX, "__tip")
+        "class": "".concat(resolveClassName(CLASS_PREFIX), "__tip")
       }, [props.tip]), (0,external_vue_namespaceObject.createVNode)(upload_list, {
-        "files": fileList.value,
-        "theme": props.theme,
         "disabled": props.disabled,
+        "files": fileList.value,
         "multiple": props.multiple,
+        "theme": props.theme,
         "onRemove": handleRemove,
         "onRetry": handleRetry
       }, {

package/lib/upload/props.d.ts

@@ -1,6 +1,11 @@
+import { APIResponse, EThemes, ETypes, ExtraFormData, FormDataAttr, HeaderDataAttr, MaxSize, UploadFile, UploadRawFile, UploadRequestHandler } from './upload.type';
 import type { PropType } from 'vue';
-import { APIResponse, EThemes, ExtraFormData, FormDataAttr, HeaderDataAttr, MaxSize, UploadFile, UploadRawFile, UploadRequestHandler } from './upload.type';
 declare const _default: {
+    type: {
+        type: PropType<"formdata" | "binary">;
+        default: "formdata" | "binary";
+        validator: (val: ETypes) => boolean;
+    };
     theme: {
         type: PropType<"button" | "picture" | "draggable">;
         default: "button" | "picture" | "draggable";
@@ -89,7 +94,7 @@ declare const _default: {
         type: PropType<(event: Event) => boolean | void>;
     };
     beforeUpload: {
-        type: PropType<(file: UploadRawFile) => Promise<boolean> | boolean>;
+        type: PropType<(file: UploadRawFile, uploadFiles: File[]) => Promise<boolean> | boolean>;
     };
     beforeRemove: {
         type: PropType<(file: UploadFile, uploadFiles: UploadFile[]) => Promise<boolean> | boolean>;