"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _utils = require("@teamix/utils");
var _classnames2 = _interopRequireDefault(require("classnames"));
var _icon = _interopRequireDefault(require("@teamix/icon"));
var _components = require("@alicloudfe/components");
var _field = require("../field");
var _actions = require("../actions");
var _skeleton = require("../skeleton");
var _info = _interopRequireDefault(require("../info"));
require("./index.scss");
var _excluded = ["text", "children"],
  _excluded2 = ["color", "title", "num", "className"],
  _excluded3 = ["title", "titleTooltip", "description", "icon", "iconColor", "iconBackgroundType", "iconBackgroundColor", "goback", "operation", "extra", "image", "loading", "breadcrumb", "tags", "data", "info", "children", "className", "style", "tabs"];
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var cls = (0, _utils.usePrefixCls)('teamix-pro-page-header');
var Tooltip = _components.Balloon.Tooltip;
var renderNav = function renderNav(breadcrumbs) {
  if (breadcrumbs && breadcrumbs.length) {
    return /*#__PURE__*/_react.default.createElement(_components.Breadcrumb, null, breadcrumbs.map(function (b, i) {
      var text = b.text,
        children = b.children,
        others = _objectWithoutProperties(b, _excluded);
      return /*#__PURE__*/_react.default.createElement(_components.Breadcrumb.Item, _objectSpread({
        key: i
      }, others), text || children);
    }));
  }
  return null;
};
var renderActionGroup = function renderActionGroup(group, defaultProps) {
  var buttonType = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'primary';
  if (!group) {
    return null;
  }
  var actionGroup = group;
  if (actionGroup.actions instanceof Array && actionGroup.actions.length) {
    var actions = actionGroup.actions.map(function (item) {
      return Object.assign({
        type: buttonType
      }, item);
    });
    return /*#__PURE__*/_react.default.createElement(_actions.ProActionGroup, _objectSpread(_objectSpread(_objectSpread({}, defaultProps), actionGroup), {}, {
      actions: actions
    }));
  }
  return group;
};
var getColorAndStyle = function getColorAndStyle(color, backgroundColor, backgroundType) {
  var _classnames;
  var isColorPresetColor = (0, _utils.isPresetColor)(color);
  var isBgColorPresetColor = (0, _utils.isPresetColor)(backgroundColor);
  var className = (0, _classnames2.default)((_classnames = {}, _defineProperty(_classnames, "".concat((0, _utils.getColorClassName)(color)), isColorPresetColor), _defineProperty(_classnames, "".concat((0, _utils.getBackgroundColorClassName)(backgroundColor)), isBgColorPresetColor), _defineProperty(_classnames, "".concat(cls("bg-type-".concat(backgroundType))), !!backgroundType), _classnames));
  var styleColor = isColorPresetColor ? (0, _utils.getColor)(color) : color;
  var styleBgColor = isBgColorPresetColor ? (0, _utils.getColor)(backgroundColor) : backgroundColor;
  // debugger;
  // console.log('color', color);
  // console.log('backgroundColor', backgroundColor);
  // console.log('styleBgColor', styleBgColor);
  var style = {
    color: styleColor,
    backgroundColor: styleBgColor
  };
  return {
    className: className,
    style: style
  };
};
var renderData = function renderData(data) {
  if (!data) {
    return null;
  }
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, data.map(function (item, i) {
    var color = item.color,
      title = item.title,
      num = item.num,
      customClassName = item.className,
      others = _objectWithoutProperties(item, _excluded2);
    var _getColorAndStyle = getColorAndStyle(color),
      className = _getColorAndStyle.className,
      style = _getColorAndStyle.style;
    return /*#__PURE__*/_react.default.createElement("div", _objectSpread({
      key: i,
      className: (0, _classnames2.default)(cls('data-item'), customClassName)
    }, others), /*#__PURE__*/_react.default.createElement("div", {
      className: cls('data-item-title')
    }, title), /*#__PURE__*/_react.default.createElement("div", {
      className: (0, _classnames2.default)(cls('data-item-num'), className),
      style: style
    }, num));
  }));
};
var renderInfo = function renderInfo(info) {
  if (info === null || info === void 0 ? void 0 : info.columns) {
    return /*#__PURE__*/_react.default.createElement(_info.default, _objectSpread({
      type: "header"
    }, info));
  }
  return info;
};
var renderTabs = function renderTabs(tabs) {
  if (tabs) {
    return /*#__PURE__*/_react.default.createElement(_field.CapsuleTab, _objectSpread({}, tabs));
  }
  return null;
};
var ProPageHeader = function ProPageHeader(props) {
  var title = props.title,
    titleTooltip = props.titleTooltip,
    description = props.description,
    icon = props.icon,
    iconColor = props.iconColor,
    _props$iconBackground = props.iconBackgroundType,
    iconBackgroundType = _props$iconBackground === void 0 ? 'square' : _props$iconBackground,
    iconBackgroundColor = props.iconBackgroundColor,
    goback = props.goback,
    operation = props.operation,
    extra = props.extra,
    image = props.image,
    loading = props.loading,
    breadcrumb = props.breadcrumb,
    tags = props.tags,
    data = props.data,
    info = props.info,
    children = props.children,
    className = props.className,
    style = props.style,
    tabs = props.tabs,
    others = _objectWithoutProperties(props, _excluded3);
  var history = (0, _utils.useRealHistory)();
  var backgroundImage = image ? "url('".concat(image, "')") : undefined;
  var showList = function showList(list) {
    var _list$actions;
    if (loading) {
      return !!list;
    }
    return list && (list.length > 0 || (list === null || list === void 0 ? void 0 : (_list$actions = list.actions) === null || _list$actions === void 0 ? void 0 : _list$actions.length) > 0);
  };
  var renderTitle = function renderTitle() {
    var _getColorAndStyle2 = getColorAndStyle(iconColor, iconBackgroundColor, iconBackgroundType),
      iconClass = _getColorAndStyle2.className,
      iconStyle = _getColorAndStyle2.style;
    var onBack = function onBack(e) {
      if (!goback) {
        return;
      }
      if (typeof goback === 'function') {
        goback(e);
        return;
      }
      if (goback === true) {
        history && history.go && history.go(-1);
        return;
      }
      (0, _utils.goToLink)(goback, history);
    };
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, goback && /*#__PURE__*/_react.default.createElement(_icon.default, {
      className: cls('goback'),
      onClick: onBack,
      type: "return-line",
      size: "large"
    }), icon && (typeof icon === 'string' ? /*#__PURE__*/_react.default.createElement(_icon.default, {
      className: (0, _classnames2.default)(iconClass, cls('title-icon')),
      style: iconStyle,
      type: icon,
      size: "large"
    }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon)), /*#__PURE__*/_react.default.createElement("span", {
      className: cls('title-name')
    }, title, titleTooltip && /*#__PURE__*/_react.default.createElement(Tooltip, {
      trigger: /*#__PURE__*/_react.default.createElement("span", {
        className: cls('title-tooltip-icon')
      }, /*#__PURE__*/_react.default.createElement(_icon.default, {
        type: "info-circle-line",
        size: "xs"
      })),
      align: "t"
    }, titleTooltip)), (0, _field.renderTags)(tags, 'large'), renderTabs(tabs !== null && tabs !== void 0 ? tabs : {}));
  };
  return /*#__PURE__*/_react.default.createElement("header", _objectSpread({
    className: (0, _classnames2.default)(cls(), className),
    style: _objectSpread({
      backgroundImage: loading ? undefined : backgroundImage
    }, style)
  }, others), (showList(breadcrumb) || showList(extra)) && /*#__PURE__*/_react.default.createElement("section", {
    className: cls('section')
  }, /*#__PURE__*/_react.default.createElement("nav", {
    className: cls('nav')
  }, loading && /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Header.Nav, null), !loading && renderNav(breadcrumb)), /*#__PURE__*/_react.default.createElement("section", {
    className: cls('extra')
  }, !loading && renderActionGroup(extra, {
    type: 'text',
    divider: false
  }, 'normal'))), (goback || icon || title !== undefined || description !== undefined || data || tags || operation) && /*#__PURE__*/_react.default.createElement("section", {
    className: (0, _classnames2.default)(cls('section'), {
      'with-description': description
    })
  }, /*#__PURE__*/_react.default.createElement("section", {
    className: cls('left')
  }, /*#__PURE__*/_react.default.createElement("section", {
    className: cls('title')
  }, loading && /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Header.Title, null), !loading && renderTitle()), description !== undefined && /*#__PURE__*/_react.default.createElement("section", {
    className: cls('description')
  }, loading && /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Header.Description, null), !loading && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, description))), /*#__PURE__*/_react.default.createElement("section", {
    className: cls('right')
  }, data && !loading && /*#__PURE__*/_react.default.createElement("section", {
    className: cls('data')
  }, renderData(data)), /*#__PURE__*/_react.default.createElement("section", {
    className: cls('operation')
  }, !loading && renderActionGroup(operation)))), info && /*#__PURE__*/_react.default.createElement("section", {
    className: (0, _classnames2.default)(cls('section'), cls('info'))
  }, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !loading && renderInfo(info), loading && /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Info.Header, null))), children);
};
var _default = ProPageHeader;
exports.default = _default;