member signin redirect

This commit is contained in:
geek 2017-08-14 16:27:51 +09:00
parent efce4ccbe9
commit 3cd9585259
3 changed files with 52 additions and 41 deletions

View File

@ -7,12 +7,12 @@ import {
import State from '../redux/state/SignIn'; import State from '../redux/state/SignIn';
import * as signinActions from '../redux/action/signIn'; import * as signinActions from '../redux/action/signIn';
import { push as routerPush } from 'react-router-redux';
import * as asyncRequestActions from '@overflow/commons/redux/action/asyncRequest'; import * as asyncRequestActions from '@overflow/commons/redux/action/asyncRequest';
export function mapStateToProps(state: any, ownProps?: any): SignInStateProps { export function mapStateToProps(state: any, ownProps?: any): SignInStateProps {
return { return {
isAuthenticated: state.isAuthenticated,
}; };
} }
@ -22,6 +22,9 @@ export function mapDispatchToProps(dispatch: Dispatch<any>, ownProps?: any): Sig
// dispatch(signinActions.request(signinId, signinPw)); // dispatch(signinActions.request(signinId, signinPw));
dispatch(asyncRequestActions.request('MemberService', 'signin', signinActions.REQUEST, signinId, signinPw)); dispatch(asyncRequestActions.request('MemberService', 'signin', signinActions.REQUEST, signinId, signinPw));
}, },
onRedirectHome: () => {
dispatch(routerPush('/'));
},
}; };
} }

View File

@ -16,12 +16,14 @@ const options = [
{ key: 'unitedstates', value: '1', text: 'United States(1)' }, { key: 'unitedstates', value: '1', text: 'United States(1)' },
]; ];
export interface StateProps { export interface StateProps {
isAuthenticated?:boolean;
} }
export interface DispatchProps { export interface DispatchProps {
onSignIn?(signinId: string, signinPw: string ): void; onSignIn?(signinId: string, signinPw: string ): void;
onSignUp?(): void; onSignUp?(): void;
onResetPassword?():void; onResetPassword?():void;
onRedirectHome():void;
} }
export type Props = StateProps & DispatchProps; export type Props = StateProps & DispatchProps;
@ -46,54 +48,58 @@ export class SignIn extends React.Component<Props, State> {
} }
public render(): JSX.Element { public render(): JSX.Element {
return ( let signinElement = <Form>
<Form> <Form.Input fluid placeholder='Email' defaultValue={this.state.email} onChange={
<Form.Input fluid placeholder='Email' defaultValue={this.state.email} onChange={
(event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => { (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
this.setState({ email: data.value }); this.setState({ email: data.value });
}} /> }} />
<Form.Input fluid placeholder='Password' defaultValue={this.state.pass} type='password' onChange={ <Form.Input fluid placeholder='Password' defaultValue={this.state.pass} type='password' onChange={
(event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => { (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
this.setState({ pass: data.value }); this.setState({ pass: data.value });
}} /> }} />
<div style={{textAlign:'right'}}> <div style={{textAlign:'right'}}>
<Button size='tiny' style={{background:'#fff'}} onClick={this.forgotPopupOpen}>Forgot Password?</Button> <Button size='tiny' style={{background:'#fff'}} onClick={this.forgotPopupOpen}>Forgot Password?</Button>
</div> </div>
<Form.Group> <Form.Group>
<Button fluid primary style={{margin:'7'}} onClick={ this.signInClick.bind(this) }> Sign In </Button> <Button fluid primary style={{margin:'7'}} onClick={ this.signInClick.bind(this) }> Sign In </Button>
<Button fluid style={{margin:'7'}} href='/#/test2'> Sign Up </Button> <Button fluid style={{margin:'7'}} href='/#/test2'> Sign Up </Button>
</Form.Group> </Form.Group>
<Modal size='small' open={this.state.forgotPopup} onClose={this.PopupClose}> <Modal size='small' open={this.state.forgotPopup} onClose={this.PopupClose}>
<Modal.Header>Change your password</Modal.Header> <Modal.Header>Change your password</Modal.Header>
<Modal.Content > <Modal.Content >
Enter email address Enter email address
<Grid centered> <Grid centered>
<Grid.Column mobile={14} tablet={10} computer={10}> <Grid.Column mobile={14} tablet={10} computer={10}>
<Input fluid placeholder='Email' /> <Input fluid placeholder='Email' />
</Grid.Column> </Grid.Column>
</Grid> </Grid>
</Modal.Content> </Modal.Content>
<Modal.Actions> <Modal.Actions>
<Button primary onClick={this.sendComOpen}> Submit </Button> <Button primary onClick={this.sendComOpen}> Submit </Button>
<Button onClick={this.PopupClose}> Cancel </Button> <Button onClick={this.PopupClose}> Cancel </Button>
</Modal.Actions> </Modal.Actions>
</Modal> </Modal>
<Modal size='small' open={this.state.sendComPopup} onClose={this.PopupClose}> <Modal size='small' open={this.state.sendComPopup} onClose={this.PopupClose}>
<Modal.Header>Send Complete</Modal.Header> <Modal.Header>Send Complete</Modal.Header>
<Modal.Content> <Modal.Content>
<Modal.Description> <Modal.Description>
<Header> .</Header> <Header> .</Header>
<p> .</p> <p> .</p>
</Modal.Description> </Modal.Description>
</Modal.Content> </Modal.Content>
<Modal.Actions> <Modal.Actions>
<Button primary onClick={this.PopupClose}> Ok </Button> <Button primary onClick={this.PopupClose}> Ok </Button>
</Modal.Actions> </Modal.Actions>
</Modal> </Modal>
</Form> </Form>;
);
if( this.props.isAuthenticated ) {
this.props.onRedirectHome();
} else {
return signinElement;
}
} }
private forgotPopupOpen = () => this.setState({ forgotPopup: true }); private forgotPopupOpen = () => this.setState({ forgotPopup: true });

View File

@ -7,8 +7,10 @@ import SigninState, { defaultState as signinDefaultState } from '../state/SignIn
const reducer: ReducersMapObject = { const reducer: ReducersMapObject = {
[SigninActionTypes.REQUEST_SUCCESS]: (state: SigninState = signinDefaultState, action: Action<Member>): SigninState => { [SigninActionTypes.REQUEST_SUCCESS]: (state: SigninState = signinDefaultState, action: Action<Member>): SigninState => {
return {
return state; ...state,
isAuthenticated: true,
};
}, },
[SigninActionTypes.REQUEST_FAILURE]: (state: SigninState = signinDefaultState, action: Action<Error>): SigninState => { [SigninActionTypes.REQUEST_FAILURE]: (state: SigninState = signinDefaultState, action: Action<Error>): SigninState => {
return state; return state;