@huang6349/manage-layout

管理系统布局组件

介绍

@huang6349/manage-layout 是一个基于 Ant Design 的管理系统布局组件

使用方式

注意，组件默认依赖于 [email protected]，需要保证 antd 版本的一致性。

$ yarn add @huang6349/manage-layout

import * as React from 'react';
import Manage, { PageHeader } from '@huang6349/manage-layout';
import {
  render,
} from 'react-dom';

function Example() {
  return (
    <Manage {...}>
      <Manage.NavBar {...}>
        <Manage.NavBar.Brand {...} />
        <Manage.NavBar.MenuLeft {...} />
        <Manage.NavBar.BigScreen {...} />
        <Manage.NavBar.Search {...} />
        <Manage.NavBar.User {...}>
          <Manage.NavBar.User.Menu {...} />
          <Manage.NavBar.User.Notice {...} />
        </Manage.NavBar.User>
        <Manage.NavBar.MenuRight {...} />
      </Manage.NavBar>
      <Manage.Left theme="grey" {...} />
      <Manage.Page>
        <PageHeader {...} />
        {...}
      </Manage.Page>
    </Manage>
  );
}

render(<Example />, document.querySelector('#demo'));

API

查看文档

DEMO

查看源码

待办事项

• [x] 顶部导航栏组件
  • [x] 网站的铭牌组件
  • [x] 左侧工具栏组件
  • [x] 全屏模式组件
  • [x] 全局搜索组件
  • [x] 用户通知组件
  • [x] 用户菜单组件
  • [x] 右侧工具栏组件
• [x] 左侧导航栏组件
• [x] 主体内容页头组件
• [ ] 底部导航栏组件
• [ ] 主题设置器组件

更新日志

1.0.0-alpha.2

2018-08-14

• 发布第二个内测版本
• 顶部导航栏-用户菜单组件由 Manage.NavBar.User.UserMenu 变更为 Manage.NavBar.User.Menu

1.0.0-alpha.1

2018-08-10

• 发布第一个内测版本

开源协议

MIT