forked from huge/frontEnd/hugeOA

liyj
2020-05-27 b419b2add64d70bf1bdb2f491c3eb090dda2cfa3
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
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
/* eslint-disable */
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
 
import * as serviceWorker from './serviceWorker';
import { Router, Route, Switch, Redirect } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import { createHashHistory } from 'history';
import zh_CN from 'antd/lib/locale-provider/zh_CN';
import 'moment/locale/zh-cn';
 
import { Layout } from 'antd';
import 'react-app-polyfill/ie11';
import 'react-app-polyfill/stable';
 
// 公用结构组件
import Menu from './module/menu/menu';
import Header from './components/common/HeadView';
import Login from './module/login/login';
 
// oa路由映射
import OaRouteDom from './routeDom/oaRouteDom';
import UserRouteDom from './routeDom/userRouteDom';
 
export const Context = React.createContext();
 
const { Content } = Layout;
const history = createHashHistory();
 
class RouteDom extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      context: {
        role: 'oa',
        roleMenuList: [],
        setContext: this.setContext,
      },
    };
  }
 
  componentDidMount() {
    let pathname = history.location.pathname;
    let menusListByRole = window.localStorage.getItem('menusListByRole')
      ? JSON.parse(window.localStorage.getItem('menusListByRole'))
      : [];
 
    let role = Object.keys(menusListByRole).reduce((p, n) => {
      if (
        menusListByRole[n].menus
          .reduce((p, n) => {
            if (n.children) {
              return p.concat(n.children);
            } else {
              return p.concat(n);
            }
          }, [])
          .find(({ path }) => path == pathname)
      ) {
        return p.concat(n);
      } else {
        return p;
      }
    }, []);
 
    this.setState({
      context: {
        ...this.state.context,
        role,
      },
    });
  }
 
  setContext = (data) => {
    console.log('data', data);
    this.setState({
      context: {
        ...this.state.context,
        ...data,
      }, //更新context
    });
  };
 
  render() {
    let { context } = this.state;
    return (
      <ConfigProvider locale={zh_CN}>
        <Context.Provider value={context}>
          <Router history={history}>
            <Layout className="h-100">
              {/* 顶部-侧边布局-通栏 */}
              {/* 顶部 */}
              <Switch>
                <Route path="/login" component={null} />
                <Route
                  component={() => (
                    <Header setContext={this.setContext} props={this.props} />
                  )}
                />
              </Switch>
              <Layout>
                <Switch>
                  <Route path="/login" component={null} />
                  <Route component={Menu} />
                </Switch>
                <Layout>
                  <Content>
                    {context.role == 'oa' && <OaRouteDom />}
                    {context.role == 'user' && <UserRouteDom />}
                    <Route path="/login" component={Login} />
                  </Content>
                </Layout>
              </Layout>
            </Layout>
          </Router>
        </Context.Provider>
      </ConfigProvider>
    );
  }
}
 
ReactDOM.render(<RouteDom></RouteDom>, 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.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();