1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111import React , {Fragment} from "react";
import Sidebar from "../components/Sidebar";
import GHeader from "../components/GHeader";
import GFooter from '../components/GFooter';
import { Switch , Route , Redirect} from 'react-router-dom';
import { Layout, Icon, message } from 'antd';
import 'antd/dist/antd.css';
import logo from '../assets/logo.svg';
import "../assets/index.css"
import adminRoutes from "../routes/admin.js";
import menuData from "../common/menu.js"
const { Content, Header, Footer } = Layout;
class Admin extends React.Component {
state = {
isMobile:true,
collapsed:false //是否收缩
};
constructor(){
super()
//console.log("super",this.props)
}
handleMenuCollapse = collapsed => {
console.log("admin collapse",this.state.collapsed)
this.setState({collapsed:!this.state.collapsed});
};
componentWillMount(){
console.log("will go");
// 临时先这样处理
if(!localStorage.user){
const {history} = this.props;
history.replace("/login")
setTimeout(() => {
history.replace("/login");
}, 500)
}
}
componentDidMount(){
}
render() {
return (
<Layout>
<Sidebar logo={logo} collapsed={this.state.collapsed} menuData={menuData} />
<Layout>
<Header style={{ padding: 0 }}>
<GHeader
logo={logo}
isMobile={false}
collapsed={this.state.collapsed}
onCollapse={this.handleMenuCollapse}
/>
</Header>
<Content style={{ margin: '24px 24px 0', height: '100%' }}>
<Switch>
{adminRoutes.map((prop, key) => {
if (prop.redirect)
return <Redirect from={prop.path} to={prop.to} key={key} />;
return <Route path={prop.path} component={prop.component} key={key} />;
})}
</Switch>
</Content>
<Footer style={{ padding: 0 }}>
<GFooter
links={[
{
key: 'github',
title: <Icon type="github" />,
href: 'https://github.com/ant-design/ant-design-pro',
blankTarget: true,
},
]}
copyright={
<Fragment>
Copyright <Icon type="copyright" /> 2018 技术部出品
</Fragment>
}
/>
</Footer>
</Layout>
</Layout>
);
}
}
export default Admin;