Created Layout for dashboard

4.x.x
Jayasanka 6 years ago
parent 536a2ca81b
commit ab4b5d1764

@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import { Layout, Menu, Breadcrumb } from 'antd'; import { Layout, Menu, Breadcrumb, PageHeader } from 'antd';
const { Header, Content, Footer } = Layout; const { Header, Content, Footer } = Layout;
@ -8,15 +8,15 @@ import Logo from "../../../public/images/logo.svg";
import Login from "../Login"; import Login from "../Login";
import {renderRoutes} from "react-router-config"; import {renderRoutes} from "react-router-config";
import {NavLink} from "react-router-dom"; import {NavLink} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
class Dashboard extends React.Component { class Dashboard extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
route : props.route routes : props.routes
} }
console.log(props);
} }
render() { render() {
@ -35,19 +35,20 @@ class Dashboard extends React.Component {
<Menu.Item key="3">nav 3</Menu.Item> <Menu.Item key="3">nav 3</Menu.Item>
</Menu> </Menu>
</Header> </Header>
<Content style={{ padding: '0 50px' }}> <Content style={{ padding: '0 0' }}>
<Breadcrumb style={{ margin: '16px 0' }}> <Breadcrumb style={{ margin: '16px 50px' }}>
<Breadcrumb.Item>Home</Breadcrumb.Item> <Breadcrumb.Item>Home</Breadcrumb.Item>
<Breadcrumb.Item>List</Breadcrumb.Item> <Breadcrumb.Item>List</Breadcrumb.Item>
<Breadcrumb.Item>App</Breadcrumb.Item> <Breadcrumb.Item>App</Breadcrumb.Item>
</Breadcrumb> </Breadcrumb>
<NavLink exact to="/publisher/a" className="nav-link" > <PageHeader
Items title="Title"
</NavLink> />
<div style={{ background: '#fff', padding: 24, minHeight: 280 }}>
{/* child routes won't render without this */} {this.state.routes.map((route) => (
{renderRoutes(this.state.route.routes, { someProp: "these extra props are optional" })} <RouteWithSubRoutes key={route.path} {...route} />
<div style={{ background: '#fff', padding: 24, minHeight: 280 }}>Content</div> ))}
</div>
</Content> </Content>
<Footer style={{ textAlign: 'center' }}> <Footer style={{ textAlign: 'center' }}>
©2019 entgra.io ©2019 entgra.io

Loading…
Cancel
Save