linkmore-design/lib/card-table/body/TableBodyRow.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 = exports.LmCardTableBodyRowVirtual = void 0;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _TableBodyCell = _interopRequireDefault(require("./TableBodyCell"));
const LmCardTableBodyRow = /*#__PURE__*/_react.default.memo(({
  row,
  rowIndex,
  table
}) => {
  const {
    state,
    rowConfig,
    cellConfig: {
      height
    },
    cellKey
  } = table;

  // 检测是否最后末行
  const isLastRow = (0, _react.useMemo)(() => {
    return state.rows.length === rowIndex + 1;
  }, [state.rows, rowIndex]);
  const style = {
    height: isLastRow ? height : height + rowConfig.gap,
    width: '100%',
    minWidth: '100%',
    gridGap: rowConfig.gap,
    gridTemplateColumns: `repeat(${state.columnCount}, 1fr)`,
    paddingBottom: isLastRow ? 0 : rowConfig.gap
  };
  return /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)('lm_card_table_body_row', isLastRow && 'last_row'),
    style: style
  }, row.map((cell, index) => /*#__PURE__*/_react.default.createElement(_TableBodyCell.default, {
    key: cell?.[cellKey] || index,
    index: index,
    cell: cell,
    table: table
  })));
});
const LmCardTableBodyRowVirtual = /*#__PURE__*/_react.default.memo(({
  row,
  start,
  rowIndex,
  table
}) => {
  const {
    state,
    rowConfig,
    cellConfig: {
      height
    },
    cellKey
  } = table;

  // 检测是否最后末行
  const isLastRow = (0, _react.useMemo)(() => {
    return state.rows.length === rowIndex + 1;
  });
  const style = {
    position: "absolute",
    top: 0,
    left: 0,
    height: isLastRow ? height : height + rowConfig.gap,
    width: '100%',
    minWidth: '100%',
    transform: `translateY(${start}px)`,
    gridGap: rowConfig.gap,
    gridTemplateColumns: `repeat(${state.columnCount}, 1fr)`,
    paddingBottom: isLastRow ? 0 : rowConfig.gap
  };
  return /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)('lm_card_table_body_row', isLastRow && 'last_row'),
    style: style
  }, row.map((cell, index) => /*#__PURE__*/_react.default.createElement(_TableBodyCell.default, {
    key: cell?.[cellKey] || index,
    index: index,
    cell: cell,
    table: table
  })));
});
exports.LmCardTableBodyRowVirtual = LmCardTableBodyRowVirtual;
var _default = LmCardTableBodyRow;
exports.default = _default;