es-grid-template/lib/table-component/body/TableBodyCell.js

es-grid-template

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactTable = require("@tanstack/react-table");
var _space = _interopRequireDefault(require("rc-master-ui/es/space"));
var _Command = _interopRequireDefault(require("../components/command/Command"));
var _utils = require("../hook/utils");
var _constant = require("../hook/constant");
var _Checkbox = _interopRequireDefault(require("rc-master-ui/lib/checkbox/Checkbox"));
var _react = _interopRequireWildcard(require("react"));
var _useContext = require("../useContext");
var _classnames = _interopRequireDefault(require("classnames"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
const renderCellIndex = props => {
  const {
    parrents,
    cell
  } = props;
  return /*#__PURE__*/_react.default.createElement("span", null, parrents.map(pr => {
    return `${pr.index + 1}.`;
  }), cell.row.index + 1);
};
const renderCommand = args => {
  const {
    cell,
    commandClick
  } = args;
  const col = cell.column.columnDef.meta ?? {};
  const record = cell.row.original;

  // const commandItems = args.cell.column.columnDef?.meta?.commandItems ?? []

  const commands = col.commandItems ? col.commandItems.map(it => {
    return {
      ...it,
      visible: typeof it.visible === 'function' ? it.visible?.(record) : it.visible
    };
  }) : [];
  return /*#__PURE__*/_react.default.createElement(_space.default, null, commands.filter(it => it.visible !== false).map(item => {
    return /*#__PURE__*/_react.default.createElement(_Command.default, {
      key: item.id,
      item: item,
      record: record,
      onClick: () => {
        commandClick?.({
          id: item.id,
          // rowId: getRowKey(record, index) as any,
          rowId: record.rowId,
          rowData: record,
          index: cell.row.index
          // rows: [...resource]
        });
      }
    });
  }));
};
const renderSelection = args => {
  const {
    row
  } = args.cell;
  const {
    selectionSettings,
    setIsSelectionChange
  } = args;
  return /*#__PURE__*/_react.default.createElement("div", {
    style: {

      // paddingLeft: `${row.depth * 2}rem`,
    }
  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
    checked: row.getIsSelected() || row.getIsAllSubRowsSelected(),
    indeterminate: row.getIsSomeSelected() && selectionSettings && selectionSettings.mode === 'checkbox' && selectionSettings.type !== 'single'
    // indeterminate={row.getIsSomeSelected() }
    ,
    onChange: e => {
      row.getToggleSelectedHandler()(e);
      setIsSelectionChange({
        isChange: true,
        type: 'rowSelected',
        rowData: row.original
      });
      // row.toggleSelected()

      // table.setRowSelection({
      //   [row.id]: true
      // })
    }
  })));
};
const TableBodyCell = props => {
  const {
    cell,
    commandClick,
    table
  } = props;
  const {
    prefix,
    setIsSelectionChange,
    selectionSettings
  } = (0, _react.useContext)(_useContext.TableContext);
  const parrents = cell.row.getParentRows();
  const isPinned = cell.column.getIsPinned();
  const isLastLeftPinnedColumn = isPinned === "left" && cell.column.getIsLastColumn("left");
  const isFirstRightPinnedColumn = isPinned === "right" && cell.column.getIsFirstColumn("right");
  return /*#__PURE__*/_react.default.createElement("td", {
    key: cell.id,
    className: (0, _classnames.default)(`${prefix}-grid-cell`, {
      [`${prefix}-grid-cell-ellipsis`]: true,
      [`${prefix}-grid-cell-fix-left-last`]: isLastLeftPinnedColumn,
      [`${prefix}-grid-cell-fix-right-first`]: isFirstRightPinnedColumn
    }),
    style: {
      display: 'flex',
      width: cell.column.getSize(),
      ...(0, _utils.getCommonPinningStyles)(cell.column)
    },
    onClick: event => {
      const element = event.target;
      const container = document.querySelector(".ui-rc-table-row-expand");
      const isInsideContainer = element.closest(".ui-rc-table-row-expand") && container;
      if (!isInsideContainer && selectionSettings?.checkboxOnly !== true || (0, _utils.isNullOrUndefined)(selectionSettings?.mode)) {
        cell.row.getToggleSelectedHandler()(event);
        setIsSelectionChange({
          isChange: true,
          type: 'rowSelected',
          rowData: cell.row.original
        });
      }
    }
  }, cell.column.id === "#" && renderCellIndex({
    parrents,
    cell
  }), cell.column.id === "command" && renderCommand({
    cell,
    commandClick
  }), cell.column.id === "selection_column" && renderSelection({
    cell,
    table,
    selectionSettings,
    setIsSelectionChange
  }), !_constant.nonActionColumn.includes(cell.column.id) && (0, _reactTable.flexRender)(cell.column.columnDef.cell, cell.getContext()));
};
var _default = exports.default = TableBodyCell;