opti: add skip of menu

This commit is contained in:
yhui.yang 2017-07-20 21:30:35 +08:00
parent 39e0221587
commit 63f18dad65
6 changed files with 68 additions and 19 deletions

View File

@ -6,6 +6,7 @@ import Interface from './reducer/Interface/InterfaceReducer.js'
import news from './reducer/news/news.js' import news from './reducer/news/news.js'
import addInterface from './reducer/addInterface/addInterface.js' import addInterface from './reducer/addInterface/addInterface.js'
import user from './reducer/user/user.js' import user from './reducer/user/user.js'
import menu from './reducer/menu/menu.js'
export default { export default {
group, group,
@ -15,5 +16,6 @@ export default {
user, user,
project, project,
news, news,
addInterface addInterface,
menu
} }

10
client/actions/menu.js Normal file
View File

@ -0,0 +1,10 @@
import {
CHANGE_MENU_ITEM
} from '../constants/action-types.js'
export function changeMenuItem(curKey) {
return {
type: CHANGE_MENU_ITEM,
data: curKey
}
}

View File

@ -5,6 +5,7 @@ import { connect } from 'react-redux'
import { Link } from 'react-router-dom' import { Link } from 'react-router-dom'
import { Icon, Layout, Menu, Dropdown } from 'antd' import { Icon, Layout, Menu, Dropdown } from 'antd'
import { checkLoginState, logoutActions, loginTypeAction} from '../../actions/login' import { checkLoginState, logoutActions, loginTypeAction} from '../../actions/login'
import { changeMenuItem } from '../../actions/menu'
import { withRouter } from 'react-router'; import { withRouter } from 'react-router';
import Srch from './Search/Search' import Srch from './Search/Search'
const { Header } = Layout; const { Header } = Layout;
@ -66,9 +67,6 @@ ToolUser.propTypes={
class HeaderCom extends Component { class HeaderCom extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {
current : window.location.hash.split("#")[1]
}
} }
static propTypes ={ static propTypes ={
router: PropTypes.object, router: PropTypes.object,
@ -76,30 +74,36 @@ class HeaderCom extends Component {
msg: PropTypes.string, msg: PropTypes.string,
uid: PropTypes.number, uid: PropTypes.number,
login:PropTypes.bool, login:PropTypes.bool,
curKey:PropTypes.string,
relieveLink:PropTypes.func, relieveLink:PropTypes.func,
logoutActions:PropTypes.func, logoutActions:PropTypes.func,
checkLoginState:PropTypes.func, checkLoginState:PropTypes.func,
loginTypeAction:PropTypes.func, loginTypeAction:PropTypes.func,
changeMenuItem:PropTypes.func,
history: PropTypes.object, history: PropTypes.object,
location: PropTypes.object location: PropTypes.object
} }
linkTo = (e) =>{ linkTo = (e) =>{
this.setState({ this.props.changeMenuItem(e.key);
current : e.key // this.props.curKey = e.key;
}) // this.setState({
// current : e.key
// })
} }
relieveLink = () => { relieveLink = () => {
this.setState({ this.props.changeMenuItem("");
current : "" // this.setState({
}) // current : ""
// })
} }
logout = (e) => { logout = (e) => {
e.preventDefault(); e.preventDefault();
this.props.logoutActions(); this.props.logoutActions();
this.props.history.push('/'); this.props.history.push('/');
this.setState({ this.props.changeMenuItem("/");
current : "/" // this.setState({
}) // current : "/"
// })
} }
handleLogin = (e) => { handleLogin = (e) => {
e.preventDefault(); e.preventDefault();
@ -119,7 +123,8 @@ class HeaderCom extends Component {
}) })
} }
render () { render () {
const { login, user, msg, uid } = this.props; const { login, user, msg, uid, curKey } = this.props;
console.log(curKey);
return ( return (
<acticle className="header-box"> <acticle className="header-box">
<Layout className="'layout"> <Layout className="'layout">
@ -134,7 +139,7 @@ class HeaderCom extends Component {
theme="dark" theme="dark"
style={{ lineHeight : '.64rem'}} style={{ lineHeight : '.64rem'}}
onClick={this.linkTo} onClick={this.linkTo}
selectedKeys={[this.state.current]} selectedKeys={[curKey]}
> >
<Menu.Item key="/"> <Menu.Item key="/">
<Link to="/">首页</Link> <Link to="/">首页</Link>
@ -174,12 +179,14 @@ export default connect(
user: state.login.userName, user: state.login.userName,
uid: state.login.uid, uid: state.login.uid,
msg: null, msg: null,
login:state.login.isLogin login:state.login.isLogin,
curKey: state.menu.curKey
} }
}, },
{ {
loginTypeAction, loginTypeAction,
logoutActions, logoutActions,
checkLoginState checkLoginState,
changeMenuItem
} }
)(HeaderCom) )(HeaderCom)

View File

@ -36,6 +36,7 @@ export const REGISTER = 'REGISTER'; // 注册
//header //header
export const LOGIN_TYPE = 'LOGIN_TYPE'; export const LOGIN_TYPE = 'LOGIN_TYPE';
export const LOGIN_OUT = 'LOGIN_OUT'; export const LOGIN_OUT = 'LOGIN_OUT';
export const CHANGE_MENU_ITEM = 'CHANGE_MENU_ITEM';
// News // News
export const FETCH_NEWS_DATA = 'FETCH_NEWS_DATA'; export const FETCH_NEWS_DATA = 'FETCH_NEWS_DATA';

View File

@ -7,6 +7,7 @@ import PropTypes from "prop-types"
import Login from '../Login/LoginWrap' import Login from '../Login/LoginWrap'
import Intro from '../../components/Intro/Intro' import Intro from '../../components/Intro/Intro'
import Footer from "../../components/Footer/Footer"; import Footer from "../../components/Footer/Footer";
import { changeMenuItem } from '../../actions/menu'
const HomeGuest = (props) => ( const HomeGuest = (props) => (
<div> <div>
@ -50,7 +51,10 @@ HomeGuest.propTypes ={
@connect( @connect(
state => ({ state => ({
login: state.login.isLogin login: state.login.isLogin
}) }),
{
changeMenuItem
}
) )
class Home extends Component { class Home extends Component {
@ -59,7 +63,11 @@ class Home extends Component {
} }
static propTypes = { static propTypes = {
introList: PropTypes.array, introList: PropTypes.array,
login : PropTypes.bool login : PropTypes.bool,
changeMenuItem : PropTypes.func
}
toStart = () =>{
this.props.changeMenuItem('/ProjectGroups');
} }
render () { render () {
const { login } = this.props; const { login } = this.props;

View File

@ -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;
}
}