Commit 72ee8940 by 郑永杰
2 parents c72a9c80 a229f795
...@@ -8361,6 +8361,11 @@ ...@@ -8361,6 +8361,11 @@
} }
} }
}, },
"loading-bar": {
"version": "0.2.7",
"resolved": "http://47.107.176.206:8089/repository/xbdnpm/loading-bar/-/loading-bar-0.2.7.tgz",
"integrity": "sha512-LFCwLHDPZAHneBg/0bQL9lkqS+eiB1DYkRkpIFHxsodkc5auZJW30/Q1bW+KVhSsJneY/pghr9EO5SggI66u6Q=="
},
"locate-path": { "locate-path": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "http://47.107.176.206:8089/repository/xbdnpm/locate-path/-/locate-path-3.0.0.tgz", "resolved": "http://47.107.176.206:8089/repository/xbdnpm/locate-path/-/locate-path-3.0.0.tgz",
......
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
"@testing-library/user-event": "^7.2.1", "@testing-library/user-event": "^7.2.1",
"antd": "^4.4.2", "antd": "^4.4.2",
"axios": "^0.19.2", "axios": "^0.19.2",
"loading-bar": "^0.2.7",
"react": "^16.13.1", "react": "^16.13.1",
"react-dom": "^16.13.1", "react-dom": "^16.13.1",
"react-redux": "^7.2.0", "react-redux": "^7.2.0",
......
import http from '@/libs/fetch'
export const getMenu = () => {
return http.request({
url: '/user/sysLogin/getMenu',
params: { applyPlatform: 0, applyCarrier: 0, productId: 100005 }
})
}
\ No newline at end of file
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import { NavLink } from 'react-router-dom' import { NavLink, useLocation } from 'react-router-dom'
import { Layout, Menu } from 'antd' import { Layout, Menu } from 'antd'
import { getAllRouter } from '@/libs/utilts' import { getAllRouter } from '@/libs/utilts'
import { APP } from '../../config' import { APP } from '../../config'
...@@ -16,9 +16,10 @@ const Item = ({url, children, ...props}) => { ...@@ -16,9 +16,10 @@ const Item = ({url, children, ...props}) => {
) )
} }
const Page = ({ children, userRoute = [], location }) => { const Page = ({ children, userRoute = [] }) => {
const [collapsed, setCollapsed] = useState(false) const [collapsed, setCollapsed] = useState(false)
const [index, setIdex] = useState([]) const [index, setIdex] = useState([])
const location = useLocation()
const onCollapse = () => setCollapsed(!collapsed) const onCollapse = () => setCollapsed(!collapsed)
......
...@@ -8,7 +8,7 @@ const USER_CONFIG = { ...@@ -8,7 +8,7 @@ const USER_CONFIG = {
const APP = { const APP = {
/** @description token存储的名称 */ /** @description token存储的名称 */
tokenName: 'token', tokenName: 'sessionid',
/** @description token在存储的时长,默认无操作后的30分钟。0 表示关闭浏览器即删除。单位 秒 */ /** @description token在存储的时长,默认无操作后的30分钟。0 表示关闭浏览器即删除。单位 秒 */
tokenExpires: 0, tokenExpires: 0,
/** @description token使用的存储类型,可选值: coookie, session, 默认值是session*/ /** @description token使用的存储类型,可选值: coookie, session, 默认值是session*/
......
...@@ -4,7 +4,10 @@ import './index.css'; ...@@ -4,7 +4,10 @@ import './index.css';
import App from './App'; import App from './App';
import * as serviceWorker from './serviceWorker'; import * as serviceWorker from './serviceWorker';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import { init } from 'loading-bar'
import 'loading-bar/src/index.css'
init()
ReactDOM.render( ReactDOM.render(
<App />, <App />,
document.getElementById('root') document.getElementById('root')
......
...@@ -135,7 +135,7 @@ class HttpRequest { ...@@ -135,7 +135,7 @@ class HttpRequest {
saveLoginInfo(jwt, sessionid, vid, data) { saveLoginInfo(jwt, sessionid, vid, data) {
data = JSON.parse(data) data = JSON.parse(data)
const { applyCarrier, applyPlatform } = data const { applyCarrier, applyPlatform } = data
store.commit('SYSTEM_LOGIN', { jwt , sessionid, vid, applyCarrier, applyPlatform}) store.commit('SYSTEM_LOGIN', { jwt, sessionid, vid, applyCarrier, applyPlatform })
} }
} }
......
import React from 'react'
import { show, hide } from 'loading-bar'
// 路由守卫
export const Guards = (Page) => {
return class extends React.Component {
/** 进入页面 */
componentDidMount() {
hide()
}
/** 离开页面 */
componentWillUnmount() {
show()
}
render() {
return <Page {...this.props} />
}
}
}
\ No newline at end of file
...@@ -5,6 +5,6 @@ export default [ ...@@ -5,6 +5,6 @@ export default [
{ {
url: '/404', url: '/404',
exact, exact,
component: loadable(() => import('@/view/error/404')) component: loadable(() => import('@/view/error/404')) // 懒加载
} }
] ]
\ No newline at end of file
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import Layout from '@/components/Layout' import { Switch, Route, useHistory } from 'react-router-dom'
import { Switch, Route } from 'react-router-dom' import { Guards } from './guards'
import { APP } from '@/config' import { APP } from '@/config'
import connect from '../store/modules/route/connect' import connect from '../store/modules/route/connect'
import { getAllRouter } from '../libs/utilts' import { getAllRouter } from '../libs/utilts'
import { getToken } from 'xbd-cookie'
import Layout from '@/components/Layout'
import { show, hide } from 'loading-bar'
import http from '@/libs/fetch'
import { getMenu } from '@/api/user'
import { Modal } from 'antd'
import error401 from "@/view/error/401"
import error404 from "@/view/error/404"
import fullScreenRoute from './modules/fullScreenRoute' import fullScreenRoute from './modules/fullScreenRoute'
/** 获取全部路由的路径 */ /** 获取全部路由的路径 */
const getAllRouterName = route => route.map(e => e.url) const getAllRouterName = route => route.map(e => e.url)
const RouterView = ({basisRoute = [], serviceRoute = [], userRoute = [], userSatatus }) => { /** 路由视图 */
const RouterView = ({basisRoute = [], serviceRoute = [], userRoute = [], userSatatus, SYSTEM_LOGIN}) => {
const [openRoute, setOpenRoute] = useState([]) const [openRoute, setOpenRoute] = useState([])
const history = useHistory()
useEffect(() => { useEffect(() => {
// 二级路由转一级路由 // 二级路由转一级路由
...@@ -38,27 +49,44 @@ const RouterView = ({basisRoute = [], serviceRoute = [], userRoute = [], userSat ...@@ -38,27 +49,44 @@ const RouterView = ({basisRoute = [], serviceRoute = [], userRoute = [], userSat
}) })
setOpenRoute(newRoutes) setOpenRoute(newRoutes)
}, [userRoute, serviceRoute]) }, [userRoute, serviceRoute])
useEffect(() => {
const token = getToken()
if (userSatatus)
return
else if (token) {
show()
http.setHeader('sessionid', token)
getMenu()
.then(res => {
hide()
SYSTEM_LOGIN(res)
})
.catch(err => {
hide()
Modal.error({ title: '错误', content: err, onOk: () => history.replace('/login') })
})
} else
history.replace('/login')
}, [])
return ( return (
<> <>
{ {userSatatus ?
!userSatatus?( <Layout>
<Switch>
{
fullScreenRoute.map(val => <Route key={val.url} path={val.url} exact={val.exact} component={val.component} />)
}
</Switch>
):(
<Switch> <Switch>
{/* <Route path="/login" component={Login}></Route> */} {basisRoute.map(e => <Route path={e.url} exact={e.exact} component={Guards(e.component)} key={e.url} />)}
<Layout> {openRoute.map(e => <Route path={e.url} exact={e.exact} component={Guards(e.component)} key={e.url} />)}
{basisRoute.map(e => <Route path={e.url} exact={e.exact} component={e.component} key={e.url} />)} <Route component={error401} />
{openRoute.map(e => <Route path={e.url} exact={e.exact} component={e.component} key={e.url} />)}
</Layout>
</Switch> </Switch>
) </Layout>
:
<Switch>
{fullScreenRoute.map(e => <Route path={e.url} exact={e.exact} component={Guards(e.component)} key={e.url} />)}
<Route component={error404} />
</Switch>
} }
</> </>
) )
......
...@@ -7,7 +7,11 @@ const mapState = state => ({ ...@@ -7,7 +7,11 @@ const mapState = state => ({
const mapDispatch = dispatch => ({ const mapDispatch = dispatch => ({
add: route => dispatch.route.add(route), add: route => dispatch.route.add(route),
change: route => dispatch.route.change(route) change: route => dispatch.route.change(route),
SYSTEM_LOGIN: res =>{
dispatch.user.SYSTEM_LOGIN(res)
dispatch.route.change(res.menu)
}
}) })
......
import data from './data.json'
export default { export default {
state: { state: {
route: data route: []
}, },
reducers: { reducers: {
add(state, route) { add(state, route) {
return { route: [...state, route] } return { route: [...state.route, ...route] }
}, },
change(_, route) { change(_, route) {
return { route: [...route] } return { route: [...route] }
......
export default { export default {
state: { state: {
userSatatus: false userSatatus: false,
codes: [],
business: {},
company: {},
platformAccount: {},
user: {}
}, },
reducers: { reducers: {
loginSucess() { // 登录成功
SYSTEM_LOGIN(_, res) {
console.log(res)
const { loginUserVo, codes } = res
return {codes, userSatatus: true, ...loginUserVo}
},
// 退出登录
SYSTEM_OUT() {
} }
} }
} }
\ No newline at end of file
import React from 'react'
const Page = ({ history }) => {
return (
<div>
<h1 onClick={() => history.push('/')} >404错误,点击回到首页</h1>
</div>
)
}
export default Page
\ No newline at end of file
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!