@kmkf-fe-packages/basic-components 0.8.18-alpha.8 → 0.8.19-alpha.2

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import React, { useRef, useState, useEffect, useMemo, forwardRef, useImperativeHandle } from 'react';
 import { Cascader, DatePicker, InputNumber, Input, Select, Upload, Image, message, Radio, Space, Spin, Modal, Button, Checkbox, Row, Col, Slider, Rate, Form, Tabs, ConfigProvider, Pagination, Popover, Table } from 'antd';
-import { EyeOutlined, DeleteOutlined, InboxOutlined } from '@ant-design/icons';
+import { EyeOutlined, DeleteOutlined } from '@ant-design/icons';
 import request, { extend as extend$1 } from 'umi-request';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
 import { AddressData, BsAddressData, request as request$1, ExpressData, LogisticsAddressData, uuid } from '@kmkf-fe-packages/kmkf-utils';
@@ -1173,8 +1173,8 @@ var ApaasUploadAsync = function ApaasUploadAsync(_ref) {
   })));
 };
 
-var css_248z$2 = ".index-module_imageBox__1rpoB {\n  display: flex;\n  flex-wrap: wrap;\n}\n.index-module_imageBox__1rpoB .ant-upload-picture-card-wrapper {\n  width: auto;\n}\n.index-module_imageBox__1rpoB .index-module_inputImage__MyiR1 {\n  width: 80px;\n  height: 80px;\n  border: 1px dashed #ccc;\n  outline: none;\n  background-color: rgba(0, 0, 0, 0);\n  text-indent: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageShow__3BNqT {\n  padding: 8px;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP {\n  width: 100px;\n  height: 80px;\n  position: relative;\n  border-radius: 2px;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover {\n  background: transparent;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover .index-module_mask__uy8r2:before {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP img {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP .index-module_delete__28zCp {\n  position: absolute;\n  right: 0px;\n  top: 0px;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 {\n  position: relative;\n  height: 100%;\n  overflow: hidden;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2::before {\n  position: absolute;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: all 0.3s;\n  content: ' ';\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2:hover .index-module_actions__1-6f4 {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 10;\n  white-space: nowrap;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: all 0.3s;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 .index-module_icon__3yEcS {\n  font-size: 16px;\n  color: #fff;\n  padding: 0 4px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C {\n  display: inline-block;\n  margin-right: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- {\n  width: 80px;\n  height: 80px;\n  border-radius: 2px;\n  background: #F2F3F5;\n  text-align: center;\n  color: #86909C;\n  padding-top: 16px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_imageBox__1rpoB .index-module_upload__3Pe3e .ant-upload {\n  height: 80px;\n  width: 80px;\n  border: none;\n  background-color: #F2F3F5;\n  color: #86909C;\n}\n.index-module_imageBox__1rpoB .index-module_upload__3Pe3e .ant-upload .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_tips__168Vy {\n  color: #4E5969;\n  font-size: 12px;\n}\n";
-var styles$2 = {"imageBox":"index-module_imageBox__1rpoB","inputImage":"index-module_inputImage__MyiR1","imageShow":"index-module_imageShow__3BNqT","imageWrap":"index-module_imageWrap__LyKfP","-webkit-mask":"index-module_mask__uy8r2","mask":"index-module_mask__uy8r2","delete":"index-module_delete__28zCp","actions":"index-module_actions__1-6f4","icon":"index-module_icon__3yEcS","imagePaste":"index-module_imagePaste__Ac77C","fakeBox":"index-module_fakeBox__3W1d-","addBtn":"index-module_addBtn__3a1TQ","upload":"index-module_upload__3Pe3e","tips":"index-module_tips__168Vy"};
+var css_248z$2 = ".index-module_imageBox__1rpoB {\n  display: flex;\n  flex-wrap: wrap;\n}\n.index-module_imageBox__1rpoB .ant-upload-picture-card-wrapper {\n  width: auto;\n}\n.index-module_imageBox__1rpoB .index-module_inputImage__MyiR1 {\n  width: 80px;\n  height: 80px;\n  border: 1px dashed #ccc;\n  outline: none;\n  background-color: rgba(0, 0, 0, 0);\n  text-indent: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageShow__3BNqT {\n  padding: 8px;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP {\n  width: 100px;\n  height: 80px;\n  position: relative;\n  border-radius: 2px;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover {\n  background: transparent;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover .index-module_mask__uy8r2:before {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP img {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP .index-module_delete__28zCp {\n  position: absolute;\n  right: 0px;\n  top: 0px;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 {\n  position: relative;\n  height: 100%;\n  overflow: hidden;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2::before {\n  position: absolute;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: all 0.3s;\n  content: ' ';\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2:hover .index-module_actions__1-6f4 {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 10;\n  white-space: nowrap;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: all 0.3s;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 .index-module_icon__3yEcS {\n  font-size: 16px;\n  color: #fff;\n  padding: 0 4px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C {\n  display: inline-block;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- {\n  width: 80px;\n  height: 80px;\n  border-radius: 2px;\n  background: #F2F3F5;\n  text-align: center;\n  color: #86909C;\n  padding-top: 16px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_imageBox__1rpoB .ant-upload {\n  padding: 0;\n  height: 80px;\n  width: 80px;\n  border: none;\n  border-radius: 2px;\n  background: #F2F3F5;\n  text-align: center;\n  color: #86909C;\n  font-size: 14px;\n}\n.index-module_imageBox__1rpoB .ant-upload .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_tips__168Vy {\n  color: #4E5969;\n  font-size: 12px;\n}\n";
+var styles$2 = {"imageBox":"index-module_imageBox__1rpoB","inputImage":"index-module_inputImage__MyiR1","imageShow":"index-module_imageShow__3BNqT","imageWrap":"index-module_imageWrap__LyKfP","-webkit-mask":"index-module_mask__uy8r2","mask":"index-module_mask__uy8r2","delete":"index-module_delete__28zCp","actions":"index-module_actions__1-6f4","icon":"index-module_icon__3yEcS","imagePaste":"index-module_imagePaste__Ac77C","fakeBox":"index-module_fakeBox__3W1d-","addBtn":"index-module_addBtn__3a1TQ","tips":"index-module_tips__168Vy"};
 styleInject(css_248z$2);
 
 //! moment.js
@@ -6877,6 +6877,7 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     _ref$actionUrl = _ref.actionUrl,
     actionUrl = _ref$actionUrl === void 0 ? '/qy/common/uploadWorkOrderImg' : _ref$actionUrl,
     resetProps = _objectWithoutProperties(_ref, _excluded$7);
+  var inputRef = useRef(null);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     visible = _useState2[0],
@@ -6898,6 +6899,10 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     _useState10 = _slicedToArray(_useState9, 2),
     uploading = _useState10[0],
     setUploading = _useState10[1];
+  var _useState11 = useState(true),
+    _useState12 = _slicedToArray(_useState11, 2),
+    pasteDefaultStates = _useState12[0],
+    setPasteDefaultStates = _useState12[1];
   var fileList = useMemo(function () {
     return value.map(function (t, i) {
       return _objectSpread2(_objectSpread2({}, t), {}, {
@@ -6911,25 +6916,40 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
   useEffect(function () {
     valueRef.current = value;
   }, [value]);
+  useEffect(function () {
+    var _inputRef$current2;
+    if (!pasteDefaultStates) {
+      var _inputRef$current;
+      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
+    }
+    (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.addEventListener('paste', function (e) {
+      return clipboardDataChange(e);
+    });
+    return function () {
+      var _inputRef$current3;
+      (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.removeEventListener('paste', function (e) {
+        return clipboardDataChange(e);
+      });
+    };
+  }, [pasteDefaultStates]);
   var asyncUpload = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file) {
       var formData, fileName, _yield$request, success, data;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            console.log('asyncUpload', file);
             setUploading(true);
             formData = new FormData();
             formData.append('file', file);
             fileName = "".concat(hooks(new Date().getTime()).format('YYYY-MM-DD hh:mm:ss'), "_").concat(file.name);
             formData.append('fileName', fileName);
-            _context.prev = 6;
-            _context.next = 9;
+            _context.prev = 5;
+            _context.next = 8;
             return request(actionUrl, {
               method: 'post',
               body: formData
             });
-          case 9:
+          case 8:
             _yield$request = _context.sent;
             success = _yield$request.success;
             data = _yield$request.data;
@@ -6939,21 +6959,21 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
                 url: "".concat(hostUrl, "/").concat(data)
               }]));
             }
-            _context.next = 18;
+            _context.next = 17;
             break;
-          case 15:
-            _context.prev = 15;
-            _context.t0 = _context["catch"](6);
+          case 14:
+            _context.prev = 14;
+            _context.t0 = _context["catch"](5);
             message.error('文件上传失败');
-          case 18:
-            _context.prev = 18;
+          case 17:
+            _context.prev = 17;
             setUploading(false);
-            return _context.finish(18);
-          case 21:
+            return _context.finish(17);
+          case 20:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[6, 15, 18, 21]]);
+      }, _callee, null, [[5, 14, 17, 20]]);
     }));
     return function asyncUpload(_x) {
       return _ref2.apply(this, arguments);
@@ -7002,6 +7022,62 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
       window.open(file === null || file === void 0 ? void 0 : file.url);
     }
   };
+  var clipboardDataChange = function clipboardDataChange(e) {
+    var clipboardData = e.clipboardData || window.clipboardData;
+    var i = 0,
+      items,
+      item,
+      types;
+    if (clipboardData) {
+      items = clipboardData.items;
+      if (!items) return;
+      item = items[0];
+      types = clipboardData.types || [];
+      for (; i < types.length; i++) {
+        if (types[i] === 'Files') {
+          item = items[i];
+          break;
+        }
+      }
+      if (item && item.kind === 'file') {
+        imgReader(item);
+      }
+    }
+  };
+  var imgReader = function imgReader(item) {
+    var blob = item.getAsFile(),
+      reader = new FileReader();
+    if (blob.size > maxSize * 1024 * 1024) {
+      message.error("\u6587\u4EF6\u4E0D\u80FD\u5927\u4E8E".concat(maxSize, "MB"));
+      return;
+    }
+    if (valueRef.current.length >= maxCount) {
+      message.error("\u53EA\u80FD\u4E0A\u4F20".concat(maxCount, "\u4E2A\u6587\u4EF6"));
+      return;
+    }
+    reader.onload = /*#__PURE__*/function () {
+      var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(e) {
+        var _e$target;
+        var result, fileName, file;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              result = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.result;
+              fileName = blob.name;
+              file = dataURLtoFile(result, fileName);
+              asyncUpload(file);
+            case 4:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2);
+      }));
+      return function (_x2) {
+        return _ref3.apply(this, arguments);
+      };
+    }();
+    reader.readAsDataURL(blob);
+  };
   var handleCancel = function handleCancel() {
     setFileUrl('');
     setFileName('');
@@ -7011,7 +7087,28 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     spinning: uploading
   }, /*#__PURE__*/React.createElement("p", {
     className: styles$2.tips
-  }, "\u5141\u8BB8\u4E0A\u4F20", maxCount, "\u4E2A\u6587\u4EF6"), /*#__PURE__*/React.createElement(Dragger, _objectSpread2({
+  }, "\u5141\u8BB8\u4E0A\u4F20", maxCount, "\u4E2A\u6587\u4EF6"), /*#__PURE__*/React.createElement("div", {
+    className: styles$2.imageBox
+  }, !disabled && /*#__PURE__*/React.createElement("div", {
+    className: styles$2.imagePaste
+  }, pasteDefaultStates ? /*#__PURE__*/React.createElement("div", {
+    className: styles$2.fakeBox,
+    onClick: function onClick() {
+      setPasteDefaultStates(false);
+    }
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles$2.addBtn
+  }, "+"), /*#__PURE__*/React.createElement("p", {
+    className: styles$2.text
+  }, "\u590D\u5236\u7C98\u8D34")) : /*#__PURE__*/React.createElement("input", {
+    ref: inputRef,
+    type: "text",
+    placeholder: "\u590D\u5236\u7C98\u8D34",
+    onBlur: function onBlur() {
+      setPasteDefaultStates(true);
+    },
+    value: ""
+  })), /*#__PURE__*/React.createElement(Dragger, _objectSpread2({
     disabled: disabled,
     multiple: false,
     accept: accept,
@@ -7021,11 +7118,11 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     onPreview: onPreview,
     fileList: fileList,
     onRemove: onRemove
-  }, resetProps), /*#__PURE__*/React.createElement("p", {
-    className: "ant-upload-drag-icon"
-  }, /*#__PURE__*/React.createElement(InboxOutlined, null)), /*#__PURE__*/React.createElement("p", {
+  }, resetProps), /*#__PURE__*/React.createElement("span", {
+    className: styles$2.addBtn
+  }, "+"), /*#__PURE__*/React.createElement("p", {
     className: "ant-upload-text"
-  }, "\u70B9\u51FB\u201C\u9009\u62E9\u6587\u4EF6\u201D\u6216\u5C06\u6587\u4EF6\u62D6\u62FD\u5230\u6B64\u533A\u57DF")), /*#__PURE__*/React.createElement(Modal, {
+  }, "\u9009\u62E9\u6587\u4EF6")), /*#__PURE__*/React.createElement(Modal, {
     visible: visible,
     title: fileName,
     footer: null,
@@ -7051,7 +7148,7 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     autoPlay: true,
     controls: true,
     src: fileUrl
-  })));
+  }))));
 };
 
 var _excluded$8 = ["showOther", "horizontal", "options", "value", "onChange", "disabled"];

package/dist/index.js

@@ -1184,8 +1184,8 @@ var ApaasUploadAsync = function ApaasUploadAsync(_ref) {
   })));
 };
 
-var css_248z$2 = ".index-module_imageBox__1rpoB {\n  display: flex;\n  flex-wrap: wrap;\n}\n.index-module_imageBox__1rpoB .ant-upload-picture-card-wrapper {\n  width: auto;\n}\n.index-module_imageBox__1rpoB .index-module_inputImage__MyiR1 {\n  width: 80px;\n  height: 80px;\n  border: 1px dashed #ccc;\n  outline: none;\n  background-color: rgba(0, 0, 0, 0);\n  text-indent: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageShow__3BNqT {\n  padding: 8px;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP {\n  width: 100px;\n  height: 80px;\n  position: relative;\n  border-radius: 2px;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover {\n  background: transparent;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover .index-module_mask__uy8r2:before {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP img {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP .index-module_delete__28zCp {\n  position: absolute;\n  right: 0px;\n  top: 0px;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 {\n  position: relative;\n  height: 100%;\n  overflow: hidden;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2::before {\n  position: absolute;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: all 0.3s;\n  content: ' ';\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2:hover .index-module_actions__1-6f4 {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 10;\n  white-space: nowrap;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: all 0.3s;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 .index-module_icon__3yEcS {\n  font-size: 16px;\n  color: #fff;\n  padding: 0 4px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C {\n  display: inline-block;\n  margin-right: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- {\n  width: 80px;\n  height: 80px;\n  border-radius: 2px;\n  background: #F2F3F5;\n  text-align: center;\n  color: #86909C;\n  padding-top: 16px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_imageBox__1rpoB .index-module_upload__3Pe3e .ant-upload {\n  height: 80px;\n  width: 80px;\n  border: none;\n  background-color: #F2F3F5;\n  color: #86909C;\n}\n.index-module_imageBox__1rpoB .index-module_upload__3Pe3e .ant-upload .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_tips__168Vy {\n  color: #4E5969;\n  font-size: 12px;\n}\n";
-var styles$2 = {"imageBox":"index-module_imageBox__1rpoB","inputImage":"index-module_inputImage__MyiR1","imageShow":"index-module_imageShow__3BNqT","imageWrap":"index-module_imageWrap__LyKfP","-webkit-mask":"index-module_mask__uy8r2","mask":"index-module_mask__uy8r2","delete":"index-module_delete__28zCp","actions":"index-module_actions__1-6f4","icon":"index-module_icon__3yEcS","imagePaste":"index-module_imagePaste__Ac77C","fakeBox":"index-module_fakeBox__3W1d-","addBtn":"index-module_addBtn__3a1TQ","upload":"index-module_upload__3Pe3e","tips":"index-module_tips__168Vy"};
+var css_248z$2 = ".index-module_imageBox__1rpoB {\n  display: flex;\n  flex-wrap: wrap;\n}\n.index-module_imageBox__1rpoB .ant-upload-picture-card-wrapper {\n  width: auto;\n}\n.index-module_imageBox__1rpoB .index-module_inputImage__MyiR1 {\n  width: 80px;\n  height: 80px;\n  border: 1px dashed #ccc;\n  outline: none;\n  background-color: rgba(0, 0, 0, 0);\n  text-indent: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageShow__3BNqT {\n  padding: 8px;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP {\n  width: 100px;\n  height: 80px;\n  position: relative;\n  border-radius: 2px;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover {\n  background: transparent;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP:hover .index-module_mask__uy8r2:before {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP img {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n.index-module_imageBox__1rpoB .index-module_imageWrap__LyKfP .index-module_delete__28zCp {\n  position: absolute;\n  right: 0px;\n  top: 0px;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 {\n  position: relative;\n  height: 100%;\n  overflow: hidden;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2::before {\n  position: absolute;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: all 0.3s;\n  content: ' ';\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2:hover .index-module_actions__1-6f4 {\n  opacity: 1;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  z-index: 10;\n  white-space: nowrap;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: all 0.3s;\n}\n.index-module_imageBox__1rpoB .index-module_mask__uy8r2 .index-module_actions__1-6f4 .index-module_icon__3yEcS {\n  font-size: 16px;\n  color: #fff;\n  padding: 0 4px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C {\n  display: inline-block;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- {\n  width: 80px;\n  height: 80px;\n  border-radius: 2px;\n  background: #F2F3F5;\n  text-align: center;\n  color: #86909C;\n  padding-top: 16px;\n}\n.index-module_imageBox__1rpoB .index-module_imagePaste__Ac77C .index-module_fakeBox__3W1d- .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_imageBox__1rpoB .ant-upload {\n  padding: 0;\n  height: 80px;\n  width: 80px;\n  border: none;\n  border-radius: 2px;\n  background: #F2F3F5;\n  text-align: center;\n  color: #86909C;\n  font-size: 14px;\n}\n.index-module_imageBox__1rpoB .ant-upload .index-module_addBtn__3a1TQ {\n  color: #86909C;\n}\n.index-module_tips__168Vy {\n  color: #4E5969;\n  font-size: 12px;\n}\n";
+var styles$2 = {"imageBox":"index-module_imageBox__1rpoB","inputImage":"index-module_inputImage__MyiR1","imageShow":"index-module_imageShow__3BNqT","imageWrap":"index-module_imageWrap__LyKfP","-webkit-mask":"index-module_mask__uy8r2","mask":"index-module_mask__uy8r2","delete":"index-module_delete__28zCp","actions":"index-module_actions__1-6f4","icon":"index-module_icon__3yEcS","imagePaste":"index-module_imagePaste__Ac77C","fakeBox":"index-module_fakeBox__3W1d-","addBtn":"index-module_addBtn__3a1TQ","tips":"index-module_tips__168Vy"};
 styleInject(css_248z$2);
 
 //! moment.js
@@ -6888,6 +6888,7 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     _ref$actionUrl = _ref.actionUrl,
     actionUrl = _ref$actionUrl === void 0 ? '/qy/common/uploadWorkOrderImg' : _ref$actionUrl,
     resetProps = _objectWithoutProperties(_ref, _excluded$7);
+  var inputRef = React.useRef(null);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     visible = _useState2[0],
@@ -6909,6 +6910,10 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     _useState10 = _slicedToArray(_useState9, 2),
     uploading = _useState10[0],
     setUploading = _useState10[1];
+  var _useState11 = React.useState(true),
+    _useState12 = _slicedToArray(_useState11, 2),
+    pasteDefaultStates = _useState12[0],
+    setPasteDefaultStates = _useState12[1];
   var fileList = React.useMemo(function () {
     return value.map(function (t, i) {
       return _objectSpread2(_objectSpread2({}, t), {}, {
@@ -6922,25 +6927,40 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
   React.useEffect(function () {
     valueRef.current = value;
   }, [value]);
+  React.useEffect(function () {
+    var _inputRef$current2;
+    if (!pasteDefaultStates) {
+      var _inputRef$current;
+      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
+    }
+    (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.addEventListener('paste', function (e) {
+      return clipboardDataChange(e);
+    });
+    return function () {
+      var _inputRef$current3;
+      (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.removeEventListener('paste', function (e) {
+        return clipboardDataChange(e);
+      });
+    };
+  }, [pasteDefaultStates]);
   var asyncUpload = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file) {
       var formData, fileName, _yield$request, success, data;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            console.log('asyncUpload', file);
             setUploading(true);
             formData = new FormData();
             formData.append('file', file);
             fileName = "".concat(hooks(new Date().getTime()).format('YYYY-MM-DD hh:mm:ss'), "_").concat(file.name);
             formData.append('fileName', fileName);
-            _context.prev = 6;
-            _context.next = 9;
+            _context.prev = 5;
+            _context.next = 8;
             return request__default['default'](actionUrl, {
               method: 'post',
               body: formData
             });
-          case 9:
+          case 8:
             _yield$request = _context.sent;
             success = _yield$request.success;
             data = _yield$request.data;
@@ -6950,21 +6970,21 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
                 url: "".concat(hostUrl, "/").concat(data)
               }]));
             }
-            _context.next = 18;
+            _context.next = 17;
             break;
-          case 15:
-            _context.prev = 15;
-            _context.t0 = _context["catch"](6);
+          case 14:
+            _context.prev = 14;
+            _context.t0 = _context["catch"](5);
             antd.message.error('文件上传失败');
-          case 18:
-            _context.prev = 18;
+          case 17:
+            _context.prev = 17;
             setUploading(false);
-            return _context.finish(18);
-          case 21:
+            return _context.finish(17);
+          case 20:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[6, 15, 18, 21]]);
+      }, _callee, null, [[5, 14, 17, 20]]);
     }));
     return function asyncUpload(_x) {
       return _ref2.apply(this, arguments);
@@ -7013,6 +7033,62 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
       window.open(file === null || file === void 0 ? void 0 : file.url);
     }
   };
+  var clipboardDataChange = function clipboardDataChange(e) {
+    var clipboardData = e.clipboardData || window.clipboardData;
+    var i = 0,
+      items,
+      item,
+      types;
+    if (clipboardData) {
+      items = clipboardData.items;
+      if (!items) return;
+      item = items[0];
+      types = clipboardData.types || [];
+      for (; i < types.length; i++) {
+        if (types[i] === 'Files') {
+          item = items[i];
+          break;
+        }
+      }
+      if (item && item.kind === 'file') {
+        imgReader(item);
+      }
+    }
+  };
+  var imgReader = function imgReader(item) {
+    var blob = item.getAsFile(),
+      reader = new FileReader();
+    if (blob.size > maxSize * 1024 * 1024) {
+      antd.message.error("\u6587\u4EF6\u4E0D\u80FD\u5927\u4E8E".concat(maxSize, "MB"));
+      return;
+    }
+    if (valueRef.current.length >= maxCount) {
+      antd.message.error("\u53EA\u80FD\u4E0A\u4F20".concat(maxCount, "\u4E2A\u6587\u4EF6"));
+      return;
+    }
+    reader.onload = /*#__PURE__*/function () {
+      var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(e) {
+        var _e$target;
+        var result, fileName, file;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              result = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.result;
+              fileName = blob.name;
+              file = dataURLtoFile(result, fileName);
+              asyncUpload(file);
+            case 4:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2);
+      }));
+      return function (_x2) {
+        return _ref3.apply(this, arguments);
+      };
+    }();
+    reader.readAsDataURL(blob);
+  };
   var handleCancel = function handleCancel() {
     setFileUrl('');
     setFileName('');
@@ -7022,7 +7098,28 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     spinning: uploading
   }, /*#__PURE__*/React__default['default'].createElement("p", {
     className: styles$2.tips
-  }, "\u5141\u8BB8\u4E0A\u4F20", maxCount, "\u4E2A\u6587\u4EF6"), /*#__PURE__*/React__default['default'].createElement(Dragger, _objectSpread2({
+  }, "\u5141\u8BB8\u4E0A\u4F20", maxCount, "\u4E2A\u6587\u4EF6"), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: styles$2.imageBox
+  }, !disabled && /*#__PURE__*/React__default['default'].createElement("div", {
+    className: styles$2.imagePaste
+  }, pasteDefaultStates ? /*#__PURE__*/React__default['default'].createElement("div", {
+    className: styles$2.fakeBox,
+    onClick: function onClick() {
+      setPasteDefaultStates(false);
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("span", {
+    className: styles$2.addBtn
+  }, "+"), /*#__PURE__*/React__default['default'].createElement("p", {
+    className: styles$2.text
+  }, "\u590D\u5236\u7C98\u8D34")) : /*#__PURE__*/React__default['default'].createElement("input", {
+    ref: inputRef,
+    type: "text",
+    placeholder: "\u590D\u5236\u7C98\u8D34",
+    onBlur: function onBlur() {
+      setPasteDefaultStates(true);
+    },
+    value: ""
+  })), /*#__PURE__*/React__default['default'].createElement(Dragger, _objectSpread2({
     disabled: disabled,
     multiple: false,
     accept: accept,
@@ -7032,11 +7129,11 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     onPreview: onPreview,
     fileList: fileList,
     onRemove: onRemove
-  }, resetProps), /*#__PURE__*/React__default['default'].createElement("p", {
-    className: "ant-upload-drag-icon"
-  }, /*#__PURE__*/React__default['default'].createElement(icons.InboxOutlined, null)), /*#__PURE__*/React__default['default'].createElement("p", {
+  }, resetProps), /*#__PURE__*/React__default['default'].createElement("span", {
+    className: styles$2.addBtn
+  }, "+"), /*#__PURE__*/React__default['default'].createElement("p", {
     className: "ant-upload-text"
-  }, "\u70B9\u51FB\u201C\u9009\u62E9\u6587\u4EF6\u201D\u6216\u5C06\u6587\u4EF6\u62D6\u62FD\u5230\u6B64\u533A\u57DF")), /*#__PURE__*/React__default['default'].createElement(antd.Modal, {
+  }, "\u9009\u62E9\u6587\u4EF6")), /*#__PURE__*/React__default['default'].createElement(antd.Modal, {
     visible: visible,
     title: fileName,
     footer: null,
@@ -7062,7 +7159,7 @@ var ApaasUploadAsync$1 = function ApaasUploadAsync(_ref) {
     autoPlay: true,
     controls: true,
     src: fileUrl
-  })));
+  }))));
 };
 
 var _excluded$8 = ["showOther", "horizontal", "options", "value", "onChange", "disabled"];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kmkf-fe-packages/basic-components",
-  "version": "0.8.18-alpha.8",
+  "version": "0.8.19-alpha.2",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -20,7 +20,7 @@
     "watch": "nodemon --ignore dist/ --ignore node_modules/ --watch src/ -C -e ts,tsx,less --debug -x 'yarn async'"
   },
   "dependencies": {
-    "@kmkf-fe-packages/kmkf-utils": "^0.8.18-alpha.8",
+    "@kmkf-fe-packages/kmkf-utils": "^0.8.19-alpha.0",
     "lodash": "^4.17.21",
     "pubsub-js": "^1.9.4",
     "react-copy-to-clipboard": "^5.1.0",
@@ -60,5 +60,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "be77d53de8eb4ac0ac7cc7472f29ce1935b5750a"
+  "gitHead": "76df2a097b11436a61008de980d5b4626ad93f90"
 }