antui-admin/lib/components/navpath/navpath.js

admin ui for antd

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');

var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactRouter = require('react-router');

var _breadcrumb = require('antd/lib/breadcrumb');

var _breadcrumb2 = _interopRequireDefault(_breadcrumb);

require('antd/lib/breadcrumb/style/css');

var _menu = require('antd/lib/menu');

var _menu2 = _interopRequireDefault(_menu);

require('antd/lib/menu/style/css');

var _dropdown = require('antd/lib/dropdown');

var _dropdown2 = _interopRequireDefault(_dropdown);

require('antd/lib/dropdown/style/css');

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

var SubMenu = _menu2.default.SubMenu;
/**
 *  显示当前页面在系统层级结构中的位置，并能向上返回
 */

var Navpath = function (_Component) {
  (0, _inherits3.default)(Navpath, _Component);

  function Navpath() {
    (0, _classCallCheck3.default)(this, Navpath);
    return (0, _possibleConstructorReturn3.default)(this, (Navpath.__proto__ || (0, _getPrototypeOf2.default)(Navpath)).apply(this, arguments));
  }

  (0, _createClass3.default)(Navpath, [{
    key: 'render',
    value: function render() {
      var BreadcrumbItem = this.props.routes.map(function (_ref) {
        var name = _ref.name,
            path = _ref.path;
        return _react2.default.createElement(
          _breadcrumb2.default.Item,
          { key: name },
          path ? _react2.default.createElement(
            _reactRouter.Link,
            { to: path },
            name
          ) : _react2.default.createElement(
            _reactRouter.Link,
            null,
            name
          )
        );
      });

      var loop = function loop(data) {
        return data.map(function (item) {
          var name = item.name,
              path = item.path,
              children = item.children;

          if (children === undefined) {
            return _react2.default.createElement(
              _menu2.default.Item,
              { key: path },
              _react2.default.createElement(
                _reactRouter.Link,
                { to: path },
                name
              )
            );
          } else {
            return _react2.default.createElement(
              SubMenu,
              { key: path, title: _react2.default.createElement(
                  'span',
                  { style: { paddingRight: 24 } },
                  name
                ) },
              loop(item.children)
            );
          }
        });
      };

      return _react2.default.createElement(
        _breadcrumb2.default,
        { className: 'antui-navpath' },
        this.props.catalog.length === 0 ? null : _react2.default.createElement(
          _breadcrumb2.default.Item,
          { key: 'home' },
          _react2.default.createElement(
            _dropdown2.default,
            { overlay: _react2.default.createElement(
                _menu2.default,
                null,
                loop(this.props.catalog)
              ) },
            _react2.default.createElement(
              _reactRouter.Link,
              { to: '/' },
              '\u76EE\u5F55'
            )
          )
        ),
        _react2.default.createElement(
          _breadcrumb2.default.Item,
          { key: 'home' },
          _react2.default.createElement(
            _reactRouter.Link,
            { to: '/' },
            '\u9996\u9875'
          )
        ),
        BreadcrumbItem
      );
    }
  }]);
  return Navpath;
}(_react.Component);

Navpath.propTypes = {
  /** 菜单信息 */
  catalog: _react.PropTypes.array,
  /** router 的路由栈信息 */
  routes: _react.PropTypes.array
};
Navpath.defaultProps = {
  catalog: [],
  routes: []
};
exports.default = Navpath;
module.exports = exports['default'];