@lvxiaowu/antd4/es/Upload/index.js

antd4-components

var _excluded = ["uid"],
    _excluded2 = ["securityToken"],
    _excluded3 = ["maxSize", "children", "value", "onChange", "getOSSConfig", "dirname", "maxCount"],
    _excluded4 = ["response"];

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }

function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React from "react";
import { useEffect, useState } from 'react';
import { DataType } from '@lvxiaowu/utils';
import { Upload, message, Image } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
var SDK_ID = 'ali-oss-sdk-script';

var NOOP = function NOOP() {};

function optimizeValue(value) {
  var list = value;

  if (DataType.isPlainObj(value)) {
    list = value.url;
  }

  if (DataType.isStr(list)) {
    return [{
      url: list,
      uid: list,
      name: list
    }];
  }

  if (!DataType.isArr(list)) {
    return [];
  }

  return list.filter(Boolean).map(function (item, index) {
    if (DataType.isStr(item)) {
      return {
        url: item,
        uid: index,
        name: item
      };
    }

    var uid = item.uid,
        rest = _objectWithoutProperties(item, _excluded);

    return _objectSpread({
      uid: uid || index
    }, rest);
  });
}

function loadSdk(callback) {
  if (!window.OSS) {
    var script = document.createElement('script');
    script.setAttribute('id', SDK_ID);

    script.onload = function () {
      callback === null || callback === void 0 ? void 0 : callback();
    };

    script.onerror = function () {
      callback === null || callback === void 0 ? void 0 : callback({
        msg: '加载oss-sdk脚本失败'
      });
    };

    script.src = 'https://gosspublic.alicdn.com/aliyun-oss-sdk-6.8.0.min.js';
    document.body.appendChild(script);
  } else {
    callback === null || callback === void 0 ? void 0 : callback();
  }
}

function upload(file, config) {
  var _ref = config || {},
      onProgress = _ref.onProgress,
      onSuccess = _ref.onSuccess,
      _ref$onError = _ref.onError,
      onError = _ref$onError === void 0 ? NOOP : _ref$onError,
      maxSize = _ref.maxSize,
      getOSSConfig = _ref.getOSSConfig,
      dirname = _ref.dirname;

  if (!file) {
    return onError({
      msg: '文件不存在'
    });
  }

  if (!DataType.isFunc(getOSSConfig)) {
    return onError({
      msg: '没有传 getOSSConfig 属性'
    });
  }

  if (file.size > maxSize) {
    return onError({
      msg: "\u4E0A\u4F20\u6587\u4EF6\u5927\u5C0F\u4E0D\u5F97\u8D85\u8FC7".concat(maxSize / 1024 / 1024, "M")
    });
  }

  loadSdk( /*#__PURE__*/function () {
    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(err) {
      var fileName, _yield$getOSSConfig, securityToken, ossConfig, client, result, url;

      return regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              if (!err) {
                _context.next = 4;
                break;
              }

              onError(err);
              _context.next = 23;
              break;

            case 4:
              fileName = file.name;
              _context.next = 7;
              return getOSSConfig();

            case 7:
              _yield$getOSSConfig = _context.sent;
              securityToken = _yield$getOSSConfig.securityToken;
              ossConfig = _objectWithoutProperties(_yield$getOSSConfig, _excluded2);
              client = new window.OSS(_objectSpread({
                stsToken: securityToken
              }, ossConfig));
              _context.prev = 11;
              _context.next = 14;
              return client.multipartUpload("".concat(dirname ? dirname + '/' : '').concat(fileName), file, {
                progress: function progress(percent) {
                  onProgress === null || onProgress === void 0 ? void 0 : onProgress({
                    percent: percent * 100
                  });
                }
              });

            case 14:
              result = _context.sent;
              url = client.signatureUrl(result.name);
              onSuccess({
                url: url,
                name: fileName
              });
              _context.next = 23;
              break;

            case 19:
              _context.prev = 19;
              _context.t0 = _context["catch"](11);
              console.error(_context.t0);
              onError({
                msg: '上传出错，请重试'
              });

            case 23:
            case "end":
              return _context.stop();
          }
        }
      }, _callee, null, [[11, 19]]);
    }));

    return function (_x) {
      return _ref2.apply(this, arguments);
    };
  }());
}

function SdUpload(_ref3) {
  var _ref3$maxSize = _ref3.maxSize,
      maxSize = _ref3$maxSize === void 0 ? 50 * 1024 * 1024 : _ref3$maxSize,
      children = _ref3.children,
      value = _ref3.value,
      onChange = _ref3.onChange,
      getOSSConfig = _ref3.getOSSConfig,
      dirname = _ref3.dirname,
      maxCount = _ref3.maxCount,
      restProps = _objectWithoutProperties(_ref3, _excluded3);

  var _useState = useState({}),
      _useState2 = _slicedToArray(_useState, 2),
      preview = _useState2[0],
      setPreview = _useState2[1];

  var list = optimizeValue(value);
  useEffect(function () {
    loadSdk();
  }, []);

  var beforeUpload = function beforeUpload(file) {
    if (file.size >= maxSize) {
      message.error("\u4E0A\u4F20\u6587\u4EF6\u5927\u5C0F\u4E0D\u5F97\u8D85\u8FC7".concat(maxSize / 1024 / 1024, "M"));
      return false;
    }

    return true;
  };

  var customRequest = function customRequest(e) {
    var file = e.file,
        onProgress = e.onProgress,
        onError = e.onError,
        onSuccess = e.onSuccess;
    upload(file, {
      dirname: dirname,
      maxSize: maxSize,
      getOSSConfig: getOSSConfig,
      onProgress: onProgress,
      onSuccess: onSuccess,
      onError: onError
    });
  };

  var handleChange = function handleChange(_ref4) {
    var file = _ref4.file,
        fileList = _ref4.fileList;

    if (file.size >= maxSize) {
      return false;
    }

    var resList = fileList.map(function (item) {
      var response = item.response,
          other = _objectWithoutProperties(item, _excluded4);

      return _objectSpread(_objectSpread({}, other), response);
    });

    if (file.status === 'error') {
      message.error(file.error.msg);
      resList.splice(resList.length - 1, 1);
    }

    return onChange === null || onChange === void 0 ? void 0 : onChange(resList);
  };

  var handlePreview = function handlePreview(file) {
    setPreview({
      visible: true,
      current: list.findIndex(function (item) {
        return item.url === file.url;
      })
    });
  };

  var onPreviewVisibleChange = function onPreviewVisibleChange(visible) {
    setPreview({
      visible: visible
    });
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Upload, _extends({
    accept: "image/*",
    fileList: list,
    listType: children ? 'picture' : 'picture-card',
    beforeUpload: beforeUpload,
    customRequest: customRequest,
    onChange: handleChange,
    onPreview: handlePreview,
    maxCount: maxCount
  }, restProps), list.length >= maxCount ? null : children || /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(PlusOutlined, null), /*#__PURE__*/React.createElement("div", {
    className: "ant-upload-text"
  }, "\u4E0A\u4F20"))), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'none'
    }
  }, /*#__PURE__*/React.createElement(Image.PreviewGroup, {
    preview: _objectSpread(_objectSpread({}, preview), {}, {
      onVisibleChange: onPreviewVisibleChange
    })
  }, list.map(function (item, index) {
    return /*#__PURE__*/React.createElement(Image, {
      src: item.url,
      key: index
    });
  }))));
}

export default SdUpload;