choerodon-ui/pro/es/performance-table/tool-bar/index.js

An enterprise-class UI design language and React-based implementation

import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import React, { useContext, useMemo } from 'react';
import classNames from 'classnames';
import isString from 'lodash/isString';
import Tooltip from '../../tooltip';
import tableContext from '../TableContext';
import ColumnFilter from './ColumnFilter';
/**
 * 获取配置区域 DOM Item
 *
 * @param setting 配置项
 * @param prefixCls
 */

function getSettingItem(setting, prefixCls) {
  if (isString(setting) && setting === 'columnFilter') {
    return /*#__PURE__*/React.createElement(ColumnFilter, {
      prefixCls: prefixCls
    });
  }

  if ( /*#__PURE__*/React.isValidElement(setting)) {
    return setting;
  }

  if (setting) {
    var settingConfig = setting;
    var icon = settingConfig.icon,
        tooltip = settingConfig.tooltip,
        _onClick = settingConfig.onClick,
        key = settingConfig.key;

    if (icon && tooltip) {
      return /*#__PURE__*/React.createElement(Tooltip, {
        title: tooltip
      }, /*#__PURE__*/React.createElement("span", {
        key: key,
        onClick: function onClick() {
          if (_onClick) {
            _onClick(key);
          }
        }
      }, icon));
    }

    return icon;
  }

  return null;
}

var ToolBar = function ToolBar(_ref) {
  var header = _ref.header,
      hideToolbar = _ref.hideToolbar,
      className = _ref.className,
      style = _ref.style,
      _ref$buttons = _ref.buttons,
      buttons = _ref$buttons === void 0 ? [] : _ref$buttons,
      _ref$settings = _ref.settings,
      settings = _ref$settings === void 0 ? [] : _ref$settings;

  var _useContext = useContext(tableContext),
      prefixCls = _useContext.tableStore.prefixCls;

  var toolbarPrefixCls = "".concat(prefixCls, "-toolbar");
  var buttonsDom = useMemo(function () {
    if (!Array.isArray(buttons)) {
      return buttons;
    }

    if (buttons.length < 1) {
      return null;
    }

    return /*#__PURE__*/React.createElement("div", {
      className: "".concat(toolbarPrefixCls, "-buttons")
    }, buttons.map(function (btn, index) {
      if (! /*#__PURE__*/React.isValidElement(btn)) {
        // eslint-disable-next-line react/no-array-index-key
        return /*#__PURE__*/React.createElement(React.Fragment, {
          key: index
        }, btn);
      }

      return /*#__PURE__*/React.cloneElement(btn, _objectSpread({
        // eslint-disable-next-line react/no-array-index-key
        key: index
      }, btn.props));
    }));
  }, [buttons]);
  var headerNode = useMemo(function () {
    return /*#__PURE__*/React.createElement("div", {
      className: "".concat(toolbarPrefixCls, "-header")
    }, header);
  }, [header]);
  var settingsDom = useMemo(function () {
    if (!Array.isArray(settings)) {
      return settings;
    }

    if (settings.length < 1) {
      return null;
    }

    return settings.length ? /*#__PURE__*/React.createElement("div", {
      className: "".concat(toolbarPrefixCls, "-setting-items")
    }, settings.map(function (setting, index) {
      var settingItem = getSettingItem(setting, prefixCls);
      return (
        /*#__PURE__*/
        // eslint-disable-next-line react/no-array-index-key
        React.createElement("div", {
          key: index,
          className: "".concat(toolbarPrefixCls, "-setting-item")
        }, settingItem)
      );
    })) : null;
  }, [settings]); // 不展示 toolbar

  if (hideToolbar) {
    return null;
  }

  return /*#__PURE__*/React.createElement("div", {
    style: style,
    className: classNames("".concat(toolbarPrefixCls), className)
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(toolbarPrefixCls, "-container")
  }, headerNode, /*#__PURE__*/React.createElement("div", {
    className: "".concat(toolbarPrefixCls, "-right")
  }, buttonsDom, settingsDom)));
};

export default ToolBar;
//# sourceMappingURL=index.js.map