linkmore-design/lib/card-table/card/PictureTextRow.js

🌈 🚀lm组件库。🚀

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _typography = _interopRequireDefault(require("../../typography"));
var _message = _interopRequireDefault(require("../../message"));
var _image = _interopRequireDefault(require("../../image"));
var _menu = _interopRequireDefault(require("../../menu"));
var _checkbox = _interopRequireDefault(require("../../checkbox"));
var _button = _interopRequireDefault(require("../../button"));
var _iconFont = _interopRequireDefault(require("../../icon-font"));
var _dropdown = _interopRequireDefault(require("../../dropdown"));
const {
  Paragraph
} = _typography.default;

// 左图右文
const PictureTextRow = ({
  index,
  cell,
  table,
  checked
}) => {
  const {
    cellKey,
    state,
    defaultConfig,
    cellClick,
    cellDoubleClick,
    toggleCheckboxKey,
    checkboxChange,
    ellipsis
  } = table;
  const {
    checkboxConfig: {
      trigger
    }
  } = state;
  const resetDefaultConfig = {
    checkbox: true,
    imgurl: 'imgurl',
    title: () => '物料名称',
    code: 'code',
    operate: null,
    extend: null,
    columns: null,
    footer: null,
    // 底部区域
    extra: null,
    // 右上角操作区域
    ...defaultConfig
  };

  // 复选框改变事件, 将复选数据保存到缓存中
  const onSelctChange = val => {
    toggleCheckboxKey(cell[cellKey]);
    checkboxChange?.(val, cell, index);
  };

  // 单元格单击事件
  const onClick = () => {
    cellClick?.(cell, index);
    if (trigger === 'cell') {
      onSelctChange?.(!checked);
    }
  };

  // 单元格双击事件: 双击时避免单击事件触发自己实现
  const onDoubleClick = () => {
    cellDoubleClick?.(cell, index);
  };
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "card_PTR"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)('card_PTR_container', checked && 'checked')
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "card_PTR_body",
    onClick: onClick,
    onDoubleClick: onDoubleClick
  }, resetDefaultConfig.checkbox && /*#__PURE__*/_react.default.createElement("div", {
    className: "card_checkbox",
    onClick: e => e.stopPropagation()
  }, /*#__PURE__*/_react.default.createElement(_checkbox.default, {
    checked: checked,
    onChange: e => onSelctChange(e.target.checked)
  })), resetDefaultConfig.extra ? /*#__PURE__*/_react.default.createElement("div", {
    className: "card_extra",
    onClick: e => e.stopPropagation()
  }, /*#__PURE__*/_react.default.createElement(_dropdown.default, {
    placement: "bottomRight",
    trigger: "click",
    overlay: () => resetDefaultConfig.extra(cell, table)
  }, /*#__PURE__*/_react.default.createElement(_iconFont.default, {
    type: "lmweb-gengduotianchong"
  }))) : null, /*#__PURE__*/_react.default.createElement("div", {
    className: "card_PTR_left"
  }, typeof resetDefaultConfig.imgurl === 'function' ? resetDefaultConfig.imgurl(cell, table) : /*#__PURE__*/_react.default.createElement(_image.default, {
    src: cell[resetDefaultConfig.imgurl],
    fallback: ""
  })), /*#__PURE__*/_react.default.createElement("div", {
    className: "card_PTR_right"
  }, resetDefaultConfig.title ? /*#__PURE__*/_react.default.createElement("div", {
    className: "card_title lm-font-middle-bold"
  }, typeof resetDefaultConfig.title === 'function' ? resetDefaultConfig.title(cell, table) : cell[resetDefaultConfig.title]) : null, resetDefaultConfig.code ? /*#__PURE__*/_react.default.createElement("div", {
    className: "card_copy_text"
  }, typeof resetDefaultConfig.code === 'function' ? resetDefaultConfig.code(cell, table) : /*#__PURE__*/_react.default.createElement(Paragraph, {
    copyable: {
      tooltips: false,
      onCopy: () => _message.default.success('复制成功！', 1.5)
    },
    ellipsis: true
  }, cell[resetDefaultConfig.code])) : null, resetDefaultConfig.columns ? /*#__PURE__*/_react.default.createElement("div", {
    className: "PTR_column"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "PTR_column_box"
  }, resetDefaultConfig.columns.map((v, idx) => {
    const isVisible = v.show || typeof v.show !== 'boolean';
    return isVisible ? /*#__PURE__*/_react.default.createElement("div", {
      key: v?.dataIndex || idx
    }, v.title, "\uFF1A", /*#__PURE__*/_react.default.createElement("div", {
      className: (0, _classnames.default)({
        ellipsis
      })
    }, typeof v.render === 'function' ? v.render(cell[v.dataIndex], cell, table) : cell[v.dataIndex])) : null;
  }))) : null, resetDefaultConfig.extend ? /*#__PURE__*/_react.default.createElement("div", {
    className: "PTR_extend"
  }, resetDefaultConfig.extend(cell, table)) : null, resetDefaultConfig.desc ? /*#__PURE__*/_react.default.createElement("div", {
    className: "PTR_desc"
  }, typeof resetDefaultConfig.desc === 'function' ? resetDefaultConfig.desc(cell, table) : cell[resetDefaultConfig.desc]) : null)), /*#__PURE__*/_react.default.createElement("div", {
    className: "card_PTR_footer"
  }, resetDefaultConfig.footer || resetDefaultConfig.operate ? (resetDefaultConfig.footer || resetDefaultConfig.operate)(cell, table) : null)));
};
var _default = PictureTextRow;
exports.default = _default;