maycur-business/lib/MkLayout/MkSider/MkSider.jsx

maycur business react components of web

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

require("maycur-antd/lib/menu/style/css");

var _menu = _interopRequireDefault(require("maycur-antd/lib/menu"));

require("maycur-antd/lib/layout/style/css");

var _layout = _interopRequireDefault(require("maycur-antd/lib/layout"));

var _react = _interopRequireDefault(require("react"));

var _lodash = _interopRequireDefault(require("lodash"));

var _utils = _interopRequireDefault(require("../../utils/utils"));

var _ScrollBar = _interopRequireDefault(require("../../ScrollBar"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var prefix = _utils["default"].prefixCls;
var Sider = _layout["default"].Sider;
var SubMenu = _menu["default"].SubMenu;

function loopPath(menus, pathArr) {
  var matchedMenu;
  if (!pathArr) return;

  _lodash["default"].forEach(menus, function (menu) {
    var pathReg = new RegExp('^' + menu.path);

    if (menu.routes) {
      var childMenu = loopPath(menu.routes, pathArr);
      if (childMenu) matchedMenu = childMenu;
    } else {
      if (pathReg.test(pathArr.join('/'))) matchedMenu = menu;
    }
  });

  return matchedMenu;
}

var MkSider = function MkSider(props) {
  var menus = props.menus,
      pathArr = props.pathArr,
      collapsed = props.collapsed,
      onToggleCollapsed = props.onToggleCollapsed,
      renderSiderExtra = props.renderSiderExtra;
  var matchedMenu = loopPath(menus, pathArr);
  var selectedKeys = matchedMenu ? [matchedMenu.path] : [];
  var defaultOpenKeys = pathArr.length > 2 ? [pathArr.slice(0, pathArr.length - 1).join('/')] : [];
  return _react["default"].createElement(_ScrollBar["default"], {
    className: "".concat(prefix, "-sider-scroll")
  }, renderSiderExtra && renderSiderExtra(), _react["default"].createElement(Sider, {
    breakpoint: "xl",
    theme: "light",
    className: "".concat(prefix, "-sider"),
    width: 220,
    trigger: null,
    collapsible: true,
    collapsed: collapsed,
    collapsedWidth: 56,
    onCollapse: onToggleCollapsed
  }, _react["default"].createElement(_menu["default"], {
    theme: "light",
    mode: "inline",
    inlineIndent: "44",
    selectedKeys: selectedKeys,
    defaultOpenKeys: defaultOpenKeys,
    style: {
      height: '100%',
      borderRight: 0
    }
  }, menus.map(function (menu, index) {
    /*TODO: 设置菜单根据功能块划分*/
    if (menu.split) {
      return _react["default"].createElement(_menu["default"].Divider, {
        key: index
      });
    }

    var MenuContent;
    menu.menuName = menu.meta.name;
    var content = props.renderMenu(menu);

    if (!content) {
      return null;
    }

    MenuContent = menu.hasSub ? _react["default"].createElement(SubMenu, {
      key: menu.path,
      title: props.renderMenu(menu)
    }, menu.routes.map(function (route, index) {
      route.menuName = route.meta.name;
      return props.renderMenu(route) && _react["default"].createElement(_menu["default"].Item, {
        key: route.path
      }, props.renderMenu(route));
    })) : _react["default"].createElement(_menu["default"].Item, {
      key: menu.path
    }, content);
    return MenuContent;
  }))));
};

var _default = MkSider;
exports["default"] = _default;