es-grid-template/lib/ali-table/pipeline/features/treeSelect.js

es-grid-template

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.treeSelect = treeSelect;
var _react = _interopRequireDefault(require("react"));
var _others = require("../../utils/others");
var _utils = require("../../../table-component/hook/utils");
var _utils2 = require("../../utils");
var _rcMasterUi = require("rc-master-ui");
var _selected = require("../../utils/selected");
var _TreeDataHelper = _interopRequireDefault(require("../../utils/tree-data-helpers/TreeDataHelper"));
var _StrictTreeDataHelper = _interopRequireDefault(require("../../utils/tree-data-helpers/StrictTreeDataHelper"));
function getFirstDefinedValue(...values) {
  for (let i = 0; i < values.length; i++) {
    const v = values[i];
    if (v !== undefined) {
      return v;
    }
  }
}
const STATE_KEY = 'treeSelect';
function treeSelect(opts) {
  return function treeSelectStep(pipeline) {
    const primaryKey = pipeline.ensurePrimaryKey('treeSelect');
    if (typeof primaryKey !== 'string') {
      throw new Error('Error');
    }

    // const {defaultValue} =  opts

    const clickArea = opts.clickArea ?? 'checkbox';
    const isDisabled = opts.isDisabled ?? (0, _others.always)(false);
    const isDetached = opts.isDetached ?? (0, _others.always)(false);
    const tree = opts.tree;
    const treeIndex = (0, _selected.buildTreeIndex)(tree, primaryKey);
    const checkedStrategy = opts.checkedStrategy ?? 'all';
    const checkStrictly = opts.checkStrictly ?? false;

    // const disableKeys = buildDisabledKeySet(treeIndex, isDisabled) // tất cả các key disable

    const enabledKeys = (0, _selected.getAllEnabledKeys)(tree, primaryKey, isDisabled); // tất cả các key enable
    const enabledParentKeys = (0, _selected.getAllEnabledParentKeys)(tree, primaryKey, isDisabled); // tất cả các key enable

    // make sure our internal representation is always a Set for easier checks
    // const stateValue = value ?? pipeline.getStateAtKey(STATE_KEY) ?? defaultValue
    const stateValue = pipeline.getStateAtKey(STATE_KEY);
    const multiValue = opts.value ?? (stateValue instanceof Set ? Array.from(stateValue) : stateValue) ?? opts.defaultValue ?? [];
    const siggleValue = getFirstDefinedValue(opts.value, stateValue instanceof Set ? Array.from(stateValue) : stateValue, opts.defaultValue);
    const initialArr = opts.type === 'single' ? siggleValue : multiValue;
    // const initialArr =  multiValue

    const getNodeValue = node => node[primaryKey];
    const treeDataHelper = opts.checkStrictly ? new _StrictTreeDataHelper.default({
      value: initialArr,
      getNodeValue,
      tree
    }) : new _TreeDataHelper.default({
      value: initialArr,
      getNodeValue,
      isDetached,
      tree,
      checkedStrategy: opts.checkedStrategy ?? 'parent'
    });
    const value = new Set(initialArr);
    const onToggleKey = (key, checked, row) => {
      if (opts.type === 'single') {
        if (value.has(key)) {
          pipeline.setStateAtKey(STATE_KEY, new Set());
          opts.onChange?.([], row, 'rowSelected');
        } else {
          pipeline.setStateAtKey(STATE_KEY, new Set([key]));
          opts.onChange?.([key], row, 'rowSelected');
        }
        return;
      }
      if (checkedStrategy === 'all') {
        const nextArr = (0, _selected.handleSelectOptimized)(treeIndex, value, key, checked, {
          primaryKey,
          checkStrictly: checkStrictly,
          checkedStrategy: checkedStrategy
        }, isDisabled);
        const nextValue = new Set(nextArr);
        pipeline.setStateAtKey(STATE_KEY, nextValue);
        opts.onChange?.(nextArr, row, 'rowSelected');
        return;
      }
      if (checkedStrategy === 'parent') {
        // const nextArr = toggleTreeSelection(key, value, treeIndex, isDisabled)

        // // const nextValue = new Set(nextArr)
        // const nextValue = Array.from(nextArr)

        // pipeline.setStateAtKey(STATE_KEY, nextArr)

        // opts.onChange?.(nextValue, row, 'rowSelected')

        const nextValue = treeDataHelper.getValueAfterToggle(key);
        const nextSetValue = new Set(nextValue);
        pipeline.setStateAtKey(STATE_KEY, nextSetValue);
        opts.onChange?.(nextValue, row, 'rowSelected');
      }
    };
    const onToggleAllKey = isChecked => {
      // const abc = buildDisabledKeySet(treeIndex, isDisabled) /// các key disable

      if (!isChecked) {
        if (checkedStrategy === 'parent') {
          // const nextValue = treeDataHelper.getValueAfterToggle('root')

          pipeline.setStateAtKey(STATE_KEY, new Set(enabledParentKeys));
          opts.onChange?.(enabledParentKeys, undefined, 'all');
        } else {
          const nextValue = (0, _selected.getAllEnabledKeys)(tree, primaryKey, isDisabled);
          pipeline.setStateAtKey(STATE_KEY, nextValue);
          opts.onChange?.(nextValue, undefined, 'all');
        }
      } else {
        pipeline.setStateAtKey(STATE_KEY, []);
        opts.onChange?.([], undefined, 'all');
      }
    };
    const makeCheckbox = (key, row) => {
      let isChecked = false;
      // if (checkedStrategy === 'all') {
      //   isChecked = value.has(key)
      // }
      // if (checkedStrategy === 'parent') {
      //   isChecked = isRowChecked(key, value, treeIndex, checkedStrategy, isDisabled)
      // }
      // const isChecked = isRowChecked(key, value, treeIndex, checkedStrategy, isDisabled)

      // const isChecked = isRowCheckedTree(key, value, treeIndex, isDisabled)

      const isCheckedNormal = treeDataHelper.isChecked(key);

      // if (checkedStrategy === 'parent') {
      //   // isChecked = isCheckedNormal && isRowCheckedTree(key, value, treeIndex, isDisabled)
      //   isChecked = isCheckedNormal
      // } else {
      //   isChecked = isCheckedNormal
      // }

      // const disabled = isNodeOrAncestorDisabled(key, treeIndex, isDisabled)
      const disabled = isDisabled(row);
      if (disabled) {
        // isChecked = isCheckedNormal && isRowCheckedTree(key, value, treeIndex, isDisabled)
        isChecked = isCheckedNormal && value.has(key);
      } else {
        isChecked = isCheckedNormal;
      }

      // const indeterminate = isRowIndeterminate(key, value, treeIndex, checkedStrategy, isDisabled)
      const indeterminate = treeDataHelper.isIndeterminate(key);
      const handleChange = () => {
        onToggleKey(key, !isChecked, row);
      };
      if (opts.type === 'single') {
        return /*#__PURE__*/_react.default.createElement(_rcMasterUi.Checkbox, {
          checked: value.has(key),
          indeterminate: false,
          disabled: disabled,
          onChange: clickArea === 'checkbox' ? handleChange : undefined
        });
      }
      return /*#__PURE__*/_react.default.createElement(_rcMasterUi.Checkbox, {
        checked: isChecked,
        indeterminate: indeterminate
        // indeterminate={treeDataHelper.isIndeterminate(key)}
        ,
        disabled: disabled
        // disabled={isDisabled(row)}
        ,
        onChange: clickArea === 'checkbox' ? handleChange : undefined
      });
    };
    const makeCheckboxAll = () => {
      let isChecked = false;
      if (checkedStrategy === 'all') {
        isChecked = (0, _selected.isEqualSetLarge)(value, new Set(enabledKeys));
      }
      if (checkedStrategy === 'parent') {
        isChecked = (0, _selected.isEqualSetLarge)(value, new Set(enabledParentKeys));
      }

      // const isChecked = isCheckedAll(value, treeIndex, checkedStrategy, isDisabled)
      // const isChecked = isEqualSetLarge(value, new Set(enabledKeys))

      // const indeterminate = isIndeterminateAll(value, treeIndex, checkedStrategy, isDisabled)
      const indeterminate = !!(value && value.size) && !isChecked;
      const handleChange = () => {
        onToggleAllKey(isChecked);
      };
      return /*#__PURE__*/_react.default.createElement(_rcMasterUi.Checkbox, {
        checked: isChecked,
        indeterminate: indeterminate
        // disabled={!root && isDisabled(row)}
        ,
        onChange: handleChange
      });
    };
    const nextColumns = pipeline.getColumns();
    const findSelectionColumn = (0, _utils.findItemByKey)(nextColumns, 'field', 'selection_column');
    const prevGetCellProps = findSelectionColumn?.getCellProps;
    const selectionColumn = {
      ...findSelectionColumn,
      align: 'center',
      title: opts.rootKey ? makeCheckboxAll() : '',
      // title: '',
      ...opts.checkboxColumn,
      textAlign: findSelectionColumn?.textAlign ?? 'center',
      template({
        rowData: record
      }) {
        return makeCheckbox(record[primaryKey], record);
      },
      getCellProps(val, row, rowIndex) {
        const prevCellProps = prevGetCellProps?.(value, row, rowIndex);
        const rowKey = row[primaryKey];
        // const isChecked = isRowChecked(value, rowKey)
        // const isChecked = isRowChecked(rowKey, value, treeIndex, checkedStrategy, isDisabled)
        const isChecked = treeDataHelper.isChecked(rowKey);
        if (clickArea !== 'cell') {
          return {};
        }

        // const disabled = isNodeOrAncestorDisabled(rowKey, treeIndex, isDisabled)
        const disabled = isDisabled(row);
        if (disabled) {
          return {
            style: {
              cursor: 'not-allowed'
            }
          };
        }
        return (0, _utils2.mergeCellProps)(prevCellProps, {
          style: {
            cursor: 'pointer'
          },
          onClick(e) {
            if (opts.stopClickEventPropagation) {
              e.stopPropagation();
            }
            onToggleKey(rowKey, !isChecked, row);
          }
        });
      }
    };
    const newColumns = (0, _utils.updateArrayByKey)(nextColumns, selectionColumn, 'field');
    pipeline.columns(newColumns);
    if (clickArea === 'row') {
      //  const prevRowGroup = pipeline.getProps().getRowProps

      pipeline.appendRowPropsGetter(row => {
        const rowKey = row[primaryKey];

        // const isChecked = isRowChecked(rowKey, value, treeIndex, checkedStrategy, isDisabled)
        // const disabled = isNodeOrAncestorDisabled(rowKey, treeIndex, isDisabled)

        const disabled = isDisabled(row);
        const isChecked = treeDataHelper.isChecked(rowKey);
        if (!disabled) {
          return {
            style: {
              cursor: 'pointer'
            },
            onClick(e) {
              if (opts.stopClickEventPropagation) {
                e.stopPropagation();
              }
              // prevRowGroup.onClick()
              onToggleKey(row[primaryKey], !isChecked, row);
            }
          };
        } else {
          return {};
        }
      });
    }

    // if (opts.highlightRowWhenSelected) {
    //   pipeline.appendRowPropsGetter((row) => {

    //     if (treeDataHelper.isChecked(row[primaryKey])) {
    //       return { className: 'highlight' }
    //     }
    //     else {
    //       return {}
    //     }
    //   })
    // }

    return pipeline;
  };
}