wargerm 0.5.24 → 0.5.25

package/dist/index.esm.js

@@ -11,6 +11,8 @@ import 'antd/es/input/style';
 import _Input from 'antd/es/input';
 import 'antd/es/modal/style';
 import _Modal from 'antd/es/modal';
+import 'antd/es/progress/style';
+import _Progress from 'antd/es/progress';
 import 'antd/es/upload/style';
 import _Upload from 'antd/es/upload';
 import 'antd/es/message/style';
@@ -604,6 +606,11 @@ function Index$1(_ref, ref) {
       fileList = _useState2[0],
       setFileList = _useState2[1];
 
+  var _useState3 = useState(0),
+      _useState4 = _slicedToArray(_useState3, 2),
+      progress = _useState4[0],
+      setProgress = _useState4[1];
+
   useEffect(function () {
     setFileList(value ? value.split(splitStr).map(function (url) {
       return {
@@ -620,20 +627,20 @@ function Index$1(_ref, ref) {
     }), fileList);
   }, [fileList]);
 
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      previewVisible = _useState4[0],
-      setPreviewVisible = _useState4[1];
-
-  var _useState5 = useState(''),
+  var _useState5 = useState(false),
       _useState6 = _slicedToArray(_useState5, 2),
-      previewImage = _useState6[0],
-      setPreviewImage = _useState6[1];
+      previewVisible = _useState6[0],
+      setPreviewVisible = _useState6[1];
 
   var _useState7 = useState(''),
       _useState8 = _slicedToArray(_useState7, 2),
-      previewTitle = _useState8[0],
-      setPreviewTitle = _useState8[1];
+      previewImage = _useState8[0],
+      setPreviewImage = _useState8[1];
+
+  var _useState9 = useState(''),
+      _useState10 = _slicedToArray(_useState9, 2),
+      previewTitle = _useState10[0],
+      setPreviewTitle = _useState10[1];
 
   var getBase64 = function getBase64(file) {
     return new Promise(function (resolve, reject) {
@@ -668,63 +675,92 @@ function Index$1(_ref, ref) {
     }
 
     return beforeUpload ? beforeUpload(file) : isJpgOrPng && isLt2M;
-  };
-
-  var handleChange = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref2) {
-      var file, newFileList, url, urls;
+  }; // const handleChange: UploadProps['onChange'] = async ({ file, fileList: newFileList }) => {
+  //   if (file.status === 'done') {
+  //     file.url = file.response;
+  //     const urls = newFileList.map(file => file.url).join(splitStr)
+  //     onChange && onChange(urls)
+  //   }
+  //   setFileList(newFileList)
+  // };
+
+
+  var request = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(options) {
+      var onSuccess, onError, file, onProgress, url, fileObj, newFileList, urls;
       return regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              file = _ref2.file, newFileList = _ref2.fileList;
-
-              if (!(file.status === 'done')) {
-                _context.next = 6;
-                break;
-              }
-
+              onSuccess = options.onSuccess, onError = options.onError, file = options.file, onProgress = options.onProgress;
+              _context.prev = 1;
               _context.next = 4;
-              return fetchMethod ? fetchMethod(file.originFileObj) : file.originFileObj ? getBase64(file.originFileObj) : Promise.resolve(file.url);
+              return fetchMethod ? fetchMethod(file) : getBase64(file);
 
             case 4:
               url = _context.sent;
 
-              if (!file.url) {
-                file.url = url;
+              if (url) {
+                fileObj = {
+                  uid: options.file.uid,
+                  name: file.name,
+                  status: 'done',
+                  response: url,
+                  thumbUrl: url,
+                  originFileObj: file,
+                  xhr: onProgress
+                };
+                newFileList = [].concat(_toConsumableArray(fileList), [fileObj]);
+                urls = newFileList.map(function (file) {
+                  return file.url;
+                }).join(splitStr);
+                onChange && onChange(urls);
+                setFileList(newFileList);
+                onSuccess(url, file);
               }
 
-            case 6:
-              urls = newFileList.map(function (file) {
-                return file.url;
-              }).join(splitStr);
-              onChange && onChange(urls);
-              setFileList(newFileList);
+              _context.next = 12;
+              break;
+
+            case 8:
+              _context.prev = 8;
+              _context.t0 = _context["catch"](1);
+              console.log("Eroor: ", _context.t0);
+              onError({
+                err: _context.t0
+              });
 
-            case 9:
+            case 12:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee);
+      }, _callee, null, [[1, 8]]);
     }));
 
-    return function handleChange(_x) {
-      return _ref3.apply(this, arguments);
+    return function request(_x) {
+      return _ref2.apply(this, arguments);
     };
   }();
 
   var handleronRemove = function handleronRemove(file) {
     var index = fileList.indexOf(file);
-    onRemove && onRemove(file, function () {
+
+    if (onRemove) {
+      onRemove && onRemove(file, function () {
+        var newFileList = fileList.slice();
+        newFileList.splice(index, 1);
+        setFileList(newFileList);
+      });
+    } else {
       var newFileList = fileList.slice();
       newFileList.splice(index, 1);
       setFileList(newFileList);
-    });
+    }
   };
 
   var handlePreview = /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(file) {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(file) {
       return regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
@@ -754,7 +790,7 @@ function Index$1(_ref, ref) {
     }));
 
     return function handlePreview(_x2) {
-      return _ref4.apply(this, arguments);
+      return _ref3.apply(this, arguments);
     };
   }();
 
@@ -769,13 +805,29 @@ function Index$1(_ref, ref) {
     };
   });
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Upload, _objectSpread2({
+    accept: "image/*",
     fileList: fileList,
     listType: "picture-card",
     beforeUpload: beforeUploadIn,
     onPreview: handlePreview,
-    onChange: handleChange,
-    onRemove: handleronRemove
-  }, props), fileList.length >= maxCount ? null : uploadButton ? uploadButton : uploadButtonDom), /*#__PURE__*/React.createElement(_Modal, {
+    // onChange={handleChange}
+    onRemove: handleronRemove,
+    customRequest: request,
+    onProgress: function onProgress(_ref4) {
+      var percent = _ref4.percent;
+      console.log("progre...", percent);
+
+      if (percent === 100) {
+        setTimeout(function () {
+          return setProgress(0);
+        }, 1000);
+      }
+
+      return setProgress(Math.floor(percent));
+    }
+  }, props), fileList.length >= maxCount ? null : uploadButton ? uploadButton : uploadButtonDom), progress > 0 ? /*#__PURE__*/React.createElement(_Progress, {
+    percent: progress
+  }) : null, /*#__PURE__*/React.createElement(_Modal, {
     visible: previewVisible,
     title: previewTitle,
     footer: null,

package/dist/index.js

@@ -15,6 +15,8 @@ require('antd/es/input/style');
 var _Input = require('antd/es/input');
 require('antd/es/modal/style');
 var _Modal = require('antd/es/modal');
+require('antd/es/progress/style');
+var _Progress = require('antd/es/progress');
 require('antd/es/upload/style');
 var _Upload = require('antd/es/upload');
 require('antd/es/message/style');
@@ -93,6 +95,7 @@ var _Dropdown__default = /*#__PURE__*/_interopDefaultLegacy(_Dropdown);
 var _Menu__default = /*#__PURE__*/_interopDefaultLegacy(_Menu);
 var _Input__default = /*#__PURE__*/_interopDefaultLegacy(_Input);
 var _Modal__default = /*#__PURE__*/_interopDefaultLegacy(_Modal);
+var _Progress__default = /*#__PURE__*/_interopDefaultLegacy(_Progress);
 var _Upload__default = /*#__PURE__*/_interopDefaultLegacy(_Upload);
 var _message__default = /*#__PURE__*/_interopDefaultLegacy(_message);
 var _InputNumber__default = /*#__PURE__*/_interopDefaultLegacy(_InputNumber);
@@ -664,6 +667,11 @@ function Index$1(_ref, ref) {
       fileList = _useState2[0],
       setFileList = _useState2[1];
 
+  var _useState3 = React.useState(0),
+      _useState4 = _slicedToArray(_useState3, 2),
+      progress = _useState4[0],
+      setProgress = _useState4[1];
+
   React.useEffect(function () {
     setFileList(value ? value.split(splitStr).map(function (url) {
       return {
@@ -680,20 +688,20 @@ function Index$1(_ref, ref) {
     }), fileList);
   }, [fileList]);
 
-  var _useState3 = React.useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      previewVisible = _useState4[0],
-      setPreviewVisible = _useState4[1];
-
-  var _useState5 = React.useState(''),
+  var _useState5 = React.useState(false),
       _useState6 = _slicedToArray(_useState5, 2),
-      previewImage = _useState6[0],
-      setPreviewImage = _useState6[1];
+      previewVisible = _useState6[0],
+      setPreviewVisible = _useState6[1];
 
   var _useState7 = React.useState(''),
       _useState8 = _slicedToArray(_useState7, 2),
-      previewTitle = _useState8[0],
-      setPreviewTitle = _useState8[1];
+      previewImage = _useState8[0],
+      setPreviewImage = _useState8[1];
+
+  var _useState9 = React.useState(''),
+      _useState10 = _slicedToArray(_useState9, 2),
+      previewTitle = _useState10[0],
+      setPreviewTitle = _useState10[1];
 
   var getBase64 = function getBase64(file) {
     return new Promise(function (resolve, reject) {
@@ -728,63 +736,92 @@ function Index$1(_ref, ref) {
     }
 
     return beforeUpload ? beforeUpload(file) : isJpgOrPng && isLt2M;
-  };
-
-  var handleChange = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref2) {
-      var file, newFileList, url, urls;
+  }; // const handleChange: UploadProps['onChange'] = async ({ file, fileList: newFileList }) => {
+  //   if (file.status === 'done') {
+  //     file.url = file.response;
+  //     const urls = newFileList.map(file => file.url).join(splitStr)
+  //     onChange && onChange(urls)
+  //   }
+  //   setFileList(newFileList)
+  // };
+
+
+  var request = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(options) {
+      var onSuccess, onError, file, onProgress, url, fileObj, newFileList, urls;
       return regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              file = _ref2.file, newFileList = _ref2.fileList;
-
-              if (!(file.status === 'done')) {
-                _context.next = 6;
-                break;
-              }
-
+              onSuccess = options.onSuccess, onError = options.onError, file = options.file, onProgress = options.onProgress;
+              _context.prev = 1;
               _context.next = 4;
-              return fetchMethod ? fetchMethod(file.originFileObj) : file.originFileObj ? getBase64(file.originFileObj) : Promise.resolve(file.url);
+              return fetchMethod ? fetchMethod(file) : getBase64(file);
 
             case 4:
               url = _context.sent;
 
-              if (!file.url) {
-                file.url = url;
+              if (url) {
+                fileObj = {
+                  uid: options.file.uid,
+                  name: file.name,
+                  status: 'done',
+                  response: url,
+                  thumbUrl: url,
+                  originFileObj: file,
+                  xhr: onProgress
+                };
+                newFileList = [].concat(_toConsumableArray(fileList), [fileObj]);
+                urls = newFileList.map(function (file) {
+                  return file.url;
+                }).join(splitStr);
+                onChange && onChange(urls);
+                setFileList(newFileList);
+                onSuccess(url, file);
               }
 
-            case 6:
-              urls = newFileList.map(function (file) {
-                return file.url;
-              }).join(splitStr);
-              onChange && onChange(urls);
-              setFileList(newFileList);
+              _context.next = 12;
+              break;
+
+            case 8:
+              _context.prev = 8;
+              _context.t0 = _context["catch"](1);
+              console.log("Eroor: ", _context.t0);
+              onError({
+                err: _context.t0
+              });
 
-            case 9:
+            case 12:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee);
+      }, _callee, null, [[1, 8]]);
     }));
 
-    return function handleChange(_x) {
-      return _ref3.apply(this, arguments);
+    return function request(_x) {
+      return _ref2.apply(this, arguments);
     };
   }();
 
   var handleronRemove = function handleronRemove(file) {
     var index = fileList.indexOf(file);
-    onRemove && onRemove(file, function () {
+
+    if (onRemove) {
+      onRemove && onRemove(file, function () {
+        var newFileList = fileList.slice();
+        newFileList.splice(index, 1);
+        setFileList(newFileList);
+      });
+    } else {
       var newFileList = fileList.slice();
       newFileList.splice(index, 1);
       setFileList(newFileList);
-    });
+    }
   };
 
   var handlePreview = /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(file) {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(file) {
       return regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
@@ -814,7 +851,7 @@ function Index$1(_ref, ref) {
     }));
 
     return function handlePreview(_x2) {
-      return _ref4.apply(this, arguments);
+      return _ref3.apply(this, arguments);
     };
   }();
 
@@ -829,13 +866,29 @@ function Index$1(_ref, ref) {
     };
   });
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(_Upload__default['default'], _objectSpread2({
+    accept: "image/*",
     fileList: fileList,
     listType: "picture-card",
     beforeUpload: beforeUploadIn,
     onPreview: handlePreview,
-    onChange: handleChange,
-    onRemove: handleronRemove
-  }, props), fileList.length >= maxCount ? null : uploadButton ? uploadButton : uploadButtonDom), /*#__PURE__*/React__default['default'].createElement(_Modal__default['default'], {
+    // onChange={handleChange}
+    onRemove: handleronRemove,
+    customRequest: request,
+    onProgress: function onProgress(_ref4) {
+      var percent = _ref4.percent;
+      console.log("progre...", percent);
+
+      if (percent === 100) {
+        setTimeout(function () {
+          return setProgress(0);
+        }, 1000);
+      }
+
+      return setProgress(Math.floor(percent));
+    }
+  }, props), fileList.length >= maxCount ? null : uploadButton ? uploadButton : uploadButtonDom), progress > 0 ? /*#__PURE__*/React__default['default'].createElement(_Progress__default['default'], {
+    percent: progress
+  }) : null, /*#__PURE__*/React__default['default'].createElement(_Modal__default['default'], {
     visible: previewVisible,
     title: previewTitle,
     footer: null,

package/package.json

@@ -1,7 +1,7 @@
 {
   "private": false,
   "name": "wargerm",
-  "version": "0.5.24",
+  "version": "0.5.25",
   "scripts": {
     "dev": "dumi dev",
     "docs:build": "dumi build",
@@ -84,4 +84,4 @@
     "react": "^16.12.0",
     "yorkie": "^2.0.0"
   }
-}
+}