@antdp/antdp-ui/lib/ButtonGroupPro/index.js

基于antd封装的组件

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _icons = require("@ant-design/icons");
var _authorized = require("@antdp/authorized");
var _antd = require("antd");
var _classnames = _interopRequireDefault(require("classnames"));
var _react = _interopRequireWildcard(require("react"));
var _utils = require("../utils");
var _jsxRuntime = require("react/jsx-runtime");
var ButtonGroupPro = function ButtonGroupPro(props) {
  var button = props.button,
    className = props.className;
  var _useState = (0, _react.useState)({
      label: '',
      key: undefined
    }),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    menuDropdownLabel = _useState2[0],
    setmenuDropdownLabel = _useState2[1];
  var _useState3 = (0, _react.useState)(false),
    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
    ButtonandDropdown = _useState4[0],
    setButtonandDropdown = _useState4[1];
  (0, _react.useEffect)(function () {
    button && button.length > 0 && button.map(function (item) {
      if (item.ButtonandDropdown) {
        setButtonandDropdown(true);
      }
    });
  }, []);
  var handleMenuClick = function handleMenuClick() {
    var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
    var idx = arguments.length > 1 ? arguments[1] : undefined;
    var e = arguments.length > 2 ? arguments[2] : undefined;
    menus.forEach(function (menu, index) {
      if (String(index) === (e === null || e === void 0 ? void 0 : e.key) && menu.onClick) {
        setmenuDropdownLabel({
          label: menu.label,
          key: idx
        });
        menu.onClick();
      }
    });
  };
  var renderMenu = function renderMenu() {
    var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
    var idx = arguments.length > 1 ? arguments[1] : undefined;
    var items = (0, _utils.getMenusItems)(menus);
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Menu, {
      items: items || [],
      onClick: function onClick(e) {
        return handleMenuClick(menus, idx, e);
      }
    });
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: (0, _classnames["default"])('antdp-ButtonGroup', className),
    children: button && button.length > 0 && button.map(function (item, idx) {
      var props = (0, _objectSpread2["default"])({
        key: idx,
        size: 'middle',
        type: item.type || 'default',
        onClick: item.onClick,
        disabled: item.disabled,
        style: {
          margin: ButtonandDropdown ? '0 0 0 -3px' : "0px ".concat(idx === button.length - 1 ? 0 : 12, "px 0px 0px")
        }
      }, item);
      var buttondom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
        children: item.label
      }));
      var badgeaParams = item.badge && item.badge === 'dot' ? {
        dot: true
      } : {
        count: item.badge
      };
      // Menu多选菜单
      if (item.menu && item.menu.length > 0) {
        var DropdownButtonDom = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Button, {
          size: "middle",
          type: props.type || 'default',
          style: {
            margin: ButtonandDropdown ? '0 0 0 -3px' : "0px ".concat(idx === button.length - 1 ? 0 : 12, "px 0px 0px")
          },
          children: [menuDropdownLabel.key === idx ? menuDropdownLabel.label : item.label, ' ', /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.DownOutlined, {})]
        });
        return item.path ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, {
            dropdownRender: function dropdownRender() {
              return renderMenu(item.menu, idx);
            },
            children: DropdownButtonDom
          })
        }, idx) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, {
          dropdownRender: function dropdownRender() {
            return renderMenu(item.menu, idx);
          },
          children: DropdownButtonDom
        }, idx);
      }
      // 自定义render
      if (item.render) {
        return item.path ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_authorized.AuthorizedBtn, {
          path: item.path,
          children: item.render(item.label)
        }, idx) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
          children: item.render(item.label)
        }, idx);
      }
      // 单独Button
      if (item.path) {
        return item.badge ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_authorized.AuthorizedBtn, {
          path: item.path,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Badge, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, badgeaParams), {}, {
            style: {
              marginTop: '15px'
            },
            children: buttondom
          }))
        }, idx) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_authorized.AuthorizedBtn, {
          path: item.path,
          children: buttondom
        }, idx);
      } else {
        return item.badge ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Badge, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, badgeaParams), {}, {
            style: {
              marginTop: '15px'
            },
            children: buttondom
          }))
        }, idx) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
          children: item.label
        }));
      }
    })
  });
};
var _default = exports["default"] = ButtonGroupPro;
module.exports = exports.default;