diff --git a/client/ReduxContainer.js b/client/ReduxContainer.js index e79b22cb..c52522de 100644 --- a/client/ReduxContainer.js +++ b/client/ReduxContainer.js @@ -6,6 +6,7 @@ import Interface from './reducer/Interface/InterfaceReducer.js' import news from './reducer/news/news.js' import addInterface from './reducer/addInterface/addInterface.js' import user from './reducer/user/user.js' +import menu from './reducer/menu/menu.js' export default { group, @@ -15,5 +16,6 @@ export default { user, project, news, - addInterface + addInterface, + menu } diff --git a/client/actions/menu.js b/client/actions/menu.js new file mode 100644 index 00000000..1fa483e8 --- /dev/null +++ b/client/actions/menu.js @@ -0,0 +1,10 @@ +import { + CHANGE_MENU_ITEM +} from '../constants/action-types.js' + +export function changeMenuItem(curKey) { + return { + type: CHANGE_MENU_ITEM, + data: curKey + } +} diff --git a/client/components/Header/Header.js b/client/components/Header/Header.js index 84e8c3f6..abb85e4d 100644 --- a/client/components/Header/Header.js +++ b/client/components/Header/Header.js @@ -5,6 +5,7 @@ import { connect } from 'react-redux' import { Link } from 'react-router-dom' import { Icon, Layout, Menu, Dropdown } from 'antd' import { checkLoginState, logoutActions, loginTypeAction} from '../../actions/login' +import { changeMenuItem } from '../../actions/menu' import { withRouter } from 'react-router'; import Srch from './Search/Search' const { Header } = Layout; @@ -66,9 +67,6 @@ ToolUser.propTypes={ class HeaderCom extends Component { constructor(props) { super(props); - this.state = { - current : window.location.hash.split("#")[1] - } } static propTypes ={ router: PropTypes.object, @@ -76,30 +74,36 @@ class HeaderCom extends Component { msg: PropTypes.string, uid: PropTypes.number, login:PropTypes.bool, + curKey:PropTypes.string, relieveLink:PropTypes.func, logoutActions:PropTypes.func, checkLoginState:PropTypes.func, loginTypeAction:PropTypes.func, + changeMenuItem:PropTypes.func, history: PropTypes.object, location: PropTypes.object } linkTo = (e) =>{ - this.setState({ - current : e.key - }) + this.props.changeMenuItem(e.key); + // this.props.curKey = e.key; + // this.setState({ + // current : e.key + // }) } relieveLink = () => { - this.setState({ - current : "" - }) + this.props.changeMenuItem(""); + // this.setState({ + // current : "" + // }) } logout = (e) => { e.preventDefault(); this.props.logoutActions(); this.props.history.push('/'); - this.setState({ - current : "/" - }) + this.props.changeMenuItem("/"); + // this.setState({ + // current : "/" + // }) } handleLogin = (e) => { e.preventDefault(); @@ -119,7 +123,8 @@ class HeaderCom extends Component { }) } render () { - const { login, user, msg, uid } = this.props; + const { login, user, msg, uid, curKey } = this.props; + console.log(curKey); return ( @@ -134,7 +139,7 @@ class HeaderCom extends Component { theme="dark" style={{ lineHeight : '.64rem'}} onClick={this.linkTo} - selectedKeys={[this.state.current]} + selectedKeys={[curKey]} > 首页 @@ -174,12 +179,14 @@ export default connect( user: state.login.userName, uid: state.login.uid, msg: null, - login:state.login.isLogin + login:state.login.isLogin, + curKey: state.menu.curKey } }, { loginTypeAction, logoutActions, - checkLoginState + checkLoginState, + changeMenuItem } )(HeaderCom) diff --git a/client/constants/action-types.js b/client/constants/action-types.js index fa3bb855..3baacde0 100644 --- a/client/constants/action-types.js +++ b/client/constants/action-types.js @@ -36,6 +36,7 @@ export const REGISTER = 'REGISTER'; // 注册 //header export const LOGIN_TYPE = 'LOGIN_TYPE'; export const LOGIN_OUT = 'LOGIN_OUT'; +export const CHANGE_MENU_ITEM = 'CHANGE_MENU_ITEM'; // News export const FETCH_NEWS_DATA = 'FETCH_NEWS_DATA'; diff --git a/client/containers/Home/Home.js b/client/containers/Home/Home.js index 7d003808..d2fc8244 100644 --- a/client/containers/Home/Home.js +++ b/client/containers/Home/Home.js @@ -7,6 +7,7 @@ import PropTypes from "prop-types" import Login from '../Login/LoginWrap' import Intro from '../../components/Intro/Intro' import Footer from "../../components/Footer/Footer"; +import { changeMenuItem } from '../../actions/menu' const HomeGuest = (props) => (
@@ -50,7 +51,10 @@ HomeGuest.propTypes ={ @connect( state => ({ login: state.login.isLogin - }) + }), + { + changeMenuItem + } ) class Home extends Component { @@ -59,7 +63,11 @@ class Home extends Component { } static propTypes = { introList: PropTypes.array, - login : PropTypes.bool + login : PropTypes.bool, + changeMenuItem : PropTypes.func + } + toStart = () =>{ + this.props.changeMenuItem('/ProjectGroups'); } render () { const { login } = this.props; diff --git a/client/reducer/menu/menu.js b/client/reducer/menu/menu.js new file mode 100644 index 00000000..858c7add --- /dev/null +++ b/client/reducer/menu/menu.js @@ -0,0 +1,21 @@ +import { + CHANGE_MENU_ITEM +} from '../../constants/action-types.js' + +const initialState = { + curKey: window.location.hash.split("#")[1] +} + +export default (state = initialState, action) => { + switch (action.type) { + case CHANGE_MENU_ITEM: { + return { + ...state, + curKey: action.data + }; + } + default: + return state; + } +} +