linkmore-design/lib/lm-upload/UploadList/index.js

🌈 🚀lm组件库。🚀

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _lmDrag = _interopRequireDefault(require("../../lm-drag"));
var _utils = require("../utils");
var _RenderItem = _interopRequireDefault(require("./RenderItem"));
const LmUploadList = ({
  instance
}) => {
  const {
    uid,
    getFileHasValue,
    getFileList,
    itemRender,
    listType,
    showUploadList,
    disabled,
    enableDrag,
    fileNames,
    move
  } = instance;
  if (!showUploadList) return null;
  const fileList = (0, _react.useMemo)(() => {
    /** 判断图片中哪一张是主图,如果没有，默认为第一张 */
    const findKey = getFileList().findIndex(list => !!list.isMain);
    return getFileList()?.sort((a, b) => a?.seq - b?.seq)?.map((item, index) => {
      return {
        ...item,
        isMain: index === findKey || findKey < 0 && index === 0
      };
    });
  }, [getFileList]);
  const handleMove = (active, over, fileList) => {
    try {
      const fileMap = fileList.map(v => {
        if (getFileHasValue(v) === getFileHasValue(active)) {
          return {
            ...v,
            seq: over[fileNames.seq]
          };
        }
        if (getFileHasValue(v) === getFileHasValue(over)) {
          return {
            ...v,
            seq: active[fileNames.seq]
          };
        }
        return v;
      });
      move(active, over, fileMap);
    } catch (error) {
      console.log('移动出现了错误', error);
    }
  };
  if (!disabled && enableDrag) {
    return /*#__PURE__*/_react.default.createElement(_lmDrag.default, {
      options: fileList,
      rowKey: uid,
      move: handleMove
    }, ({
      item,
      listeners,
      index
    }) => {
      return (0, _utils.render)(itemRender || _RenderItem.default, {
        type: listType,
        key: getFileHasValue(item) || index,
        index,
        file: item,
        fileList,
        instance,
        listeners
      });
    });
  }
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, fileList?.map((file, idx) => (0, _utils.render)(itemRender || _RenderItem.default, {
    type: listType,
    key: getFileHasValue(file) || idx,
    index: idx,
    file,
    fileList,
    instance
  })));
};
var _default = /*#__PURE__*/_react.default.memo(LmUploadList);
exports.default = _default;