kenote-react-admin-layout

Admin Layout for React

[![NPM Version][npm-image]][npm-url]
[![NPM Downloads][downloads-image]][downloads-url]
[![Build Status][travis-image]][travis-url]
[![Codecov Status][codecov-image]][codecov-url]
[![Gratipay][licensed-image]][licensed-url]

[npm-image]: https://img.shields.io/npm/v/kenote-react-admin-layout.svg
[npm-url]: https://www.npmjs.org/package/kenote-react-admin-layout
[downloads-image]: https://img.shields.io/npm/dm/kenote-react-admin-layout.svg
[downloads-url]: https://npmjs.org/package/kenote-react-admin-layout
[travis-image]: https://travis-ci.org/thondery/kenote-react-admin-layout.svg?branch=master
[travis-url]: https://travis-ci.org/thondery/kenote-react-admin-layout
[codecov-image]: https://img.shields.io/codecov/c/github/thondery/kenote-react-admin-layout/master.svg
[codecov-url]: https://codecov.io/github/thondery/kenote-react-admin-layout?branch=master
[licensed-image]: https://img.shields.io/badge/license-MIT-blue.svg
[licensed-url]: https://github.com/thondery/kenote-react-admin-layout/blob/master/LICENSE

Install

``bash
yarn add kenote-react-admin-layout
`

Usages

sider.js

`js
import React from 'react'
import { Sider } from 'kenote-react-admin-layout'
import { Icon } from 'antd'

export default ({ location }) => (
{...{ location }}
menuSubs={{
menuSubHome: {
key: 'home',
name: '主页',
icon: ,
data: []
},
menuSubAdmins: {
key: 'admins',
name: '帐号管理',
icon: ,
data: [
{ key: 'group', name: '管理组设定', path: 'admins' },
{ key: 'user', name: '用户管理', path: 'admins' },
{ key: 'log', name: '操作日志', path: 'admins' }
]
}
}}
footer={ (collapsed) => (


header.js

`js
import React from 'react'
import { Icon } from 'antd'
import { Header, getMenuList } from 'kenote-react-admin-layout'
import _ from 'lodash'

export default ({ auth }) => {
const menus = [
{
key: 'expense',
name: '费用',
data: [
{
key: '1001',
name: '充值'
},
{
key: '1002',
name: '订单'
},
{
key: '1003',
name: '发票'
},
{
key: '1004',
name: '消费记录'
},
{
key: '1005',
name: '续费管理'
},
{
type: 'driver'
},
{
key: '1006',
name: '进入费用中心'
}
]
},
{
key: 'workorder',
name: '工单',
data: [
{
key: '1011',
name: '我的工单'
},
{
key: '1012',
name: '提交工单'
}
]
},
{
key: 'bsn',
name: '备案',
data: [
{
key: '1021',
name: '申请备案服务号'
},
{
key: '1022',
name: '备案服务号管理'
},
{
key: '1023',
name: '备案专区'
},
{
key: '1024',
name: 'ICP备案系统'
}
]
},
{
key: 'help',
name: '支持',
data: [
{
key: '1031',
name: '帮助与文档'
},
{
key: '1032',
name: '提交意见'
},
{
key: '1033',
name: '论坛'
},
{
key: '1034',
name: '博客'
}
]
},
{
key: 'auth',
name: ${auth && auth.username || '\'},
data: [
{
key: '9001',
name: '基本资料',
icon: ()
},
{
key: '9002',
name: '实名认证',
icon: ()
},
{
key: '9003',
name: '安全设置',
icon: ()
},
{
key: '9004',
name: '安全管控',
icon: ()
},
{
key: '9005',
name: '访问控制',
icon: ()
},
{
key: '9006',
name: 'accesskeys',
icon: ()
},
{
key: '9007',
name: '会员权益',
icon: ()
},
{
key: '9008',
name: '会员积分',
icon: ()
},
{
key: '9009',
name: '云大使管理',
icon: ()
},
{
type: 'driver'
},
{
key: '-1',
name: '退出管理控制台',
type: 'quit',
onPress: () => notification.info({
message: Open Menu.Item,
description: 您点击了菜单 => [-1]退出管理控制台,
duration: 8,
placement: 'bottomRight'
})
}
]
},
{
key: 'lanage',
name: '简体中文',
data: [
{
key: '1041',
name: 'English'
}
]
},
]
return (