shradmin/lib/pages/Layout/index.js

A frontend Framework for building admin application, using antd and mirrorjs.

'use strict';

exports.__esModule = true;

var _style2 = require('antd/lib/layout/style');

var _layout = require('antd/lib/layout');

var _layout2 = _interopRequireDefault(_layout);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _mirrorx = require('mirrorx');

var _compose = require('recompose/compose');

var _compose2 = _interopRequireDefault(_compose);

var _Breadcrumb = require('../Breadcrumb');

var _Breadcrumb2 = _interopRequireDefault(_Breadcrumb);

var _i18n = require('../../i18n');

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

var Sider = _layout2.default.Sider,
    Header = _layout2.default.Header,
    Content = _layout2.default.Content,
    Footer = _layout2.default.Footer;


var style = {
  container: {
    minHeight: "100vh"
  },
  header: {
    background: "#fff",
    padding: 0,
    borderBottom: "thin solid #d9d9d9",
    lineHeight: "64px"
  },
  sider: {
    background: "#fff"
  },
  content: {
    margin: "0px 16px"
  },
  body: {
    padding: "24px",
    background: "#fff",
    minHeight: "90vh"
  },
  footer: {
    textAlign: "center"
  }
};

var AppLayout = function AppLayout(_ref) {
  var title = _ref.title,
      menu = _ref.menu,
      routes = _ref.routes,
      collapsed = _ref.collapsed,
      translate = _ref.translate,
      userMenu = _ref.userMenu,
      appBar = _ref.appBar;
  return _react2.default.createElement(
    _layout2.default,
    { style: style.container },
    _react2.default.createElement(
      Header,
      { style: style.header },
      _react2.default.cloneElement(appBar, {
        title: title,
        collapsed: collapsed,
        translate: translate,
        userMenu: userMenu
      })
    ),
    _react2.default.createElement(
      _layout2.default,
      null,
      _react2.default.createElement(
        Sider,
        { style: style.sider, collapsible: true, trigger: null, collapsed: collapsed },
        menu
      ),
      _react2.default.createElement(
        _layout2.default,
        null,
        _react2.default.createElement(
          Content,
          { style: style.content },
          _react2.default.createElement(_Breadcrumb2.default, { className: 'breadcrumb' }),
          _react2.default.createElement(
            'div',
            { style: style.body },
            routes
          )
        ),
        _react2.default.createElement(
          Footer,
          { style: style.footer },
          _react2.default.createElement(
            'span',
            null,
            title + ' \xA92017 Created by '
          ),
          _react2.default.createElement(
            'a',
            { href: 'https://github.com/shrimpliu/shradmin', target: '__blank' },
            'Shradmin'
          )
        )
      )
    )
  );
};

AppLayout.defaultProps = {};

AppLayout.propTypes = process.env.NODE_ENV !== "production" ? {
  title: _propTypes2.default.node.isRequired,
  userMenu: _propTypes2.default.node
} : {};

var enhance = (0, _compose2.default)((0, _mirrorx.connect)(function (_ref2) {
  var collapsed = _ref2.collapsed;
  return {
    collapsed: collapsed
  };
}), _i18n.translate);

exports.default = enhance(AppLayout);
module.exports = exports['default'];