mirror of
https://repository.entgra.net/community/device-mgt-core.git
synced 2025-10-06 02:01:45 +00:00
Added routings
This commit is contained in:
parent
3dc7758d20
commit
c7cb3319eb
@ -13,8 +13,9 @@
|
||||
"antd": "^3.15.0",
|
||||
"react": "^16.8.4",
|
||||
"react-dom": "^16.8.4",
|
||||
"react-scripts": "2.1.8",
|
||||
"react-router-dom": "latest"
|
||||
"react-router-config": "^5.0.0",
|
||||
"react-router-dom": "latest",
|
||||
"react-scripts": "2.1.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.0.0",
|
||||
|
||||
@ -1,18 +1,20 @@
|
||||
import React from "react";
|
||||
import "antd/dist/antd.css";
|
||||
import {BrowserRouter, Route, Switch} from 'react-router-dom';
|
||||
import Dashboard from "./pages/dashboard"
|
||||
import Login from "./pages/Login"
|
||||
import { renderRoutes } from "react-router-config";
|
||||
|
||||
class App extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
route : props.route
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<BrowserRouter>
|
||||
<Switch>
|
||||
<Route path="/publisher" component={Dashboard} exact/>
|
||||
<Route path="/publisher/login" component={Login}/>
|
||||
</Switch>
|
||||
</BrowserRouter>
|
||||
<div>
|
||||
{renderRoutes(this.state.route.routes)}
|
||||
</div>
|
||||
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -3,8 +3,39 @@ import ReactDOM from 'react-dom';
|
||||
import './index.css';
|
||||
import App from './App';
|
||||
import * as serviceWorker from './serviceWorker';
|
||||
import { renderRoutes } from "react-router-config";
|
||||
import Dashboard from "./pages/dashboard/Dashboard"
|
||||
import Login from "./pages/Login";
|
||||
import {BrowserRouter} from "react-router-dom";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById('root'));
|
||||
|
||||
const routes = [
|
||||
{
|
||||
component: App,
|
||||
routes: [
|
||||
{
|
||||
path: "/publisher",
|
||||
exact: true,
|
||||
component: Dashboard,
|
||||
routes: [
|
||||
{
|
||||
path: "/publisher/a",
|
||||
component: Login
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: "/publisher/login",
|
||||
component: Login
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
ReactDOM.render( <BrowserRouter>
|
||||
{/* kick it all off with the root route */}
|
||||
{renderRoutes(routes)}
|
||||
</BrowserRouter>, document.getElementById('root'));
|
||||
|
||||
// If you want your app to work offline and load faster, you can change
|
||||
// unregister() to register() below. Note this comes with some pitfalls.
|
||||
|
||||
@ -0,0 +1,60 @@
|
||||
import React from "react";
|
||||
import { Layout, Menu, Breadcrumb } from 'antd';
|
||||
|
||||
const { Header, Content, Footer } = Layout;
|
||||
|
||||
import styles from './Dashboard.less';
|
||||
import Logo from "../../../public/images/logo.svg";
|
||||
import Login from "../Login";
|
||||
import {renderRoutes} from "react-router-config";
|
||||
import {NavLink} from "react-router-dom";
|
||||
|
||||
|
||||
class Dashboard extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
route : props.route
|
||||
}
|
||||
console.log(props);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Layout className="layout">
|
||||
<Header>
|
||||
<div style={{backgroundImage: "url(" + { Logo} + ")"}} className={styles.logo}/>
|
||||
<Menu
|
||||
theme="light"
|
||||
mode="horizontal"
|
||||
defaultSelectedKeys={['2']}
|
||||
style={{ lineHeight: '64px' }}
|
||||
>
|
||||
<Menu.Item key="1">nav 1</Menu.Item>
|
||||
<Menu.Item key="2">nav 2</Menu.Item>
|
||||
<Menu.Item key="3">nav 3</Menu.Item>
|
||||
</Menu>
|
||||
</Header>
|
||||
<Content style={{ padding: '0 50px' }}>
|
||||
<Breadcrumb style={{ margin: '16px 0' }}>
|
||||
<Breadcrumb.Item>Home</Breadcrumb.Item>
|
||||
<Breadcrumb.Item>List</Breadcrumb.Item>
|
||||
<Breadcrumb.Item>App</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
<NavLink exact to="/publisher/a" className="nav-link" >
|
||||
Items
|
||||
</NavLink>
|
||||
|
||||
{/* child routes won't render without this */}
|
||||
{renderRoutes(this.state.route.routes, { someProp: "these extra props are optional" })}
|
||||
<div style={{ background: '#fff', padding: 24, minHeight: 280 }}>Content</div>
|
||||
</Content>
|
||||
<Footer style={{ textAlign: 'center' }}>
|
||||
©2019 entgra.io
|
||||
</Footer>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Dashboard;
|
||||
@ -0,0 +1,7 @@
|
||||
.logo {
|
||||
width: 120px;
|
||||
height: 31px;
|
||||
background: rgba(0,0,0,.2);
|
||||
margin: 16px 24px 16px 0;
|
||||
float: left;
|
||||
}
|
||||
@ -1,19 +0,0 @@
|
||||
import React from "react";
|
||||
import { version, Button } from 'antd';
|
||||
import {Link} from 'react-router-dom';
|
||||
|
||||
class Dashboard extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="App">
|
||||
<p>Currentdddddd antd version: {version}</p>
|
||||
<p>Please fork this codesandbox to reproduce your issue.</p>
|
||||
<p>请 fork 这个链接来重现你碰到的问题。</p>
|
||||
<Link to="/publisher/login">login</Link>
|
||||
<Button type="primary">Hello</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Dashboard;
|
||||
Loading…
Reference in New Issue
Block a user