import _Search from "@alifd/next/es/search";
import _Pagination from "@alifd/next/es/pagination";
import _Icon from "@alifd/next/es/icon";
import _Button from "@alifd/next/es/button";
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
var _excluded = ["isDisabled", "title", "type", "disabled", "callback"];
import React from "react";
import classnames from "classnames";
import WebRowOrder from "./webRowOrder";
import WebLinkBar from "./webLinkBar";
var WebToolbar = /*#__PURE__*/function (_React$Component) {
  _inheritsLoose(WebToolbar, _React$Component);
  function WebToolbar() {
    return _React$Component.apply(this, arguments) || this;
  }
  var _proto = WebToolbar.prototype;
  _proto.render = function render() {
    var _classnames;
    var _this$props = this.props,
      nextTablePrefix = _this$props.nextTablePrefix,
      onSearch = _this$props.onSearch,
      onActionClick = _this$props.onActionClick,
      _this$props$locale = _this$props.locale,
      locale = _this$props$locale === void 0 ? {} : _this$props$locale,
      showActionBar = _this$props.showActionBar,
      actionBar = _this$props.actionBar,
      showLinkBar = _this$props.showLinkBar,
      linkBar = _this$props.linkBar,
      showSearch = _this$props.showSearch,
      searchBarPlaceholder = _this$props.searchBarPlaceholder,
      showCustomColumn = _this$props.showCustomColumn,
      onClickCustomColumn = _this$props.onClickCustomColumn,
      rowOrder = _this$props.rowOrder,
      customBarItem = _this$props.customBarItem,
      showMiniPager = _this$props.showMiniPager,
      paginationProps = _this$props.paginationProps,
      noPadding = _this$props.noPadding;
    var _ref = paginationProps || {},
      currentPage = _ref.currentPage,
      pageSize = _ref.pageSize,
      totalCount = _ref.totalCount,
      onChange = _ref.onChange,
      onPageSizeChange = _ref.onPageSizeChange;
    var renderCustomBarItem = !!(customBarItem && customBarItem.render);
    var renderCustomBarItemRight = !!(customBarItem && customBarItem.rightRender);
    var renderCustomBarItemBottom = !!(customBarItem && customBarItem.bottomRender);
    var renderActionBar = !!(showActionBar && actionBar && actionBar.length);
    var renderLeft = renderActionBar || renderCustomBarItem;
    var renderLinkBar = !!(showLinkBar && linkBar && linkBar.length);
    var renderRight = renderLinkBar || rowOrder || showCustomColumn || showMiniPager || showSearch || renderCustomBarItemRight;
    var renderToolbar = renderLeft || renderRight;
    if (!renderToolbar) {
      return null;
    }
    return /*#__PURE__*/React.createElement("div", {
      className: classnames(nextTablePrefix + "web-toolbar", (_classnames = {}, _classnames[nextTablePrefix + "no-padding"] = noPadding, _classnames))
    }, renderLeft ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "left-wrap"
    }, renderActionBar ? actionBar.map(function (action, index) {
      var isDisabled = action.isDisabled,
        title = action.title,
        type = action.type,
        disabled = action.disabled,
        callback = action.callback,
        rest = _objectWithoutPropertiesLoose(action, _excluded);
      var buttonType = type ? type : index === 0 ? 'secondary' : 'normal';
      var disable = disabled !== undefined ? disabled : isDisabled ? !!isDisabled() : false;
      return /*#__PURE__*/React.createElement(_Button, _extends({}, rest, {
        className: nextTablePrefix + "button",
        type: buttonType,
        disabled: disable,
        key: buttonType + "-" + (disable ? "0" : "1") + "-" + index,
        onClick: function onClick() {
          onActionClick && onActionClick(action, index);
        }
      }), title);
    }) : null, renderCustomBarItem ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "custom"
    }, customBarItem.render()) : null) : null, renderRight ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "right-wrap"
    }, renderLinkBar ? /*#__PURE__*/React.createElement(WebLinkBar, {
      nextTablePrefix: nextTablePrefix,
      linkBar: linkBar,
      onActionClick: onActionClick
    }) : null, rowOrder ? /*#__PURE__*/React.createElement(WebRowOrder, _extends({}, rowOrder, {
      nextTablePrefix: nextTablePrefix
    })) : null, showCustomColumn ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "custom-column",
      onClick: onClickCustomColumn
    }, /*#__PURE__*/React.createElement(_Icon, {
      className: nextTablePrefix + "icon",
      type: "custom-column",
      size: "small"
    }), /*#__PURE__*/React.createElement("span", {
      className: nextTablePrefix + "text"
    }, locale.customColumn)) : null, showMiniPager ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "pagination"
    }, /*#__PURE__*/React.createElement(_Pagination, {
      current: currentPage,
      pageSize: pageSize,
      total: totalCount,
      onChange: onChange,
      onPageSizeChange: onPageSizeChange,
      type: "simple",
      size: "small",
      shape: "arrow-only"
    })) : null, showSearch ? /*#__PURE__*/React.createElement(_Search, {
      className: nextTablePrefix + "search",
      shape: "simple",
      hasClear: true,
      placeholder: searchBarPlaceholder,
      onSearch: onSearch
    }) : null, renderCustomBarItemRight ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "custom-right"
    }, customBarItem.rightRender()) : null) : null, /*#__PURE__*/React.createElement("div", {
      style: {
        clear: 'both'
      }
    }), renderCustomBarItemBottom ? /*#__PURE__*/React.createElement("div", {
      className: nextTablePrefix + "custom-bottom"
    }, customBarItem.bottomRender()) : null);
  };
  return WebToolbar;
}(React.Component);
export { WebToolbar as default };