registerIn.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. import { Form, Input, Button, Checkbox, Row, Col, Alert } from 'antd';
  2. import { connect } from 'react-redux';
  3. import { actionFullRegister} from '../action';
  4. import {Router, Route, Link, Redirect, Switch, useHistory} from 'react-router-dom';
  5. import { useEffect, useState } from 'react';
  6. const Register = ({getState, auth}) => { console.log('auth', auth);
  7. const [regMessage, setRegMessage] = useState(false);
  8. let history = useHistory();
  9. useEffect(
  10. () => {
  11. if((auth).length !== 0) {
  12. history.push('/')
  13. }
  14. } , [auth])
  15. const onFinish = (values) => {
  16. console.log('Success:', values);
  17. getState(values.username, values.password);
  18. setRegMessage(!regMessage);
  19. };
  20. const onFinishFailed = (errorInfo) => {
  21. console.log('Failed:', errorInfo);
  22. };
  23. return (
  24. <Row>
  25. <Col span ={7}>
  26. </Col>
  27. <Form
  28. name="basic"
  29. labelCol={{ span: 8 }}
  30. wrapperCol={{ span: 16 }}
  31. initialValues={{ remember: true }}
  32. onFinish={onFinish}
  33. onFinishFailed={onFinishFailed}
  34. autoComplete="off"
  35. >
  36. <Form.Item
  37. label="Имя"
  38. name="username"
  39. rules={[{ required: true, message: 'Please input your username!' }]}
  40. >
  41. <Input />
  42. </Form.Item>
  43. <Form.Item
  44. label="Пароль"
  45. name="password"
  46. rules={[{ required: true, message: 'Please input your password!' }]}
  47. >
  48. <Input.Password />
  49. </Form.Item>
  50. <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
  51. <Button type="primary" htmlType="submit">
  52. Войти
  53. </Button>
  54. </Form.Item>
  55. { regMessage && (auth).length == 0 && <Form.Item wrapperCol={{ offset: 8, span: 16 }}> {console.log('куп')}
  56. <Alert
  57. message="Ошибка"
  58. description="Такой пользователь существует"
  59. type="error"
  60. />
  61. </Form.Item>}
  62. </Form>
  63. </Row>
  64. )
  65. };
  66. const mapStateToProps = state => ({
  67. auth: state.auth?.token || '',
  68. })
  69. const RegisterIn = connect(mapStateToProps, {getState: actionFullRegister})(Register)
  70. export default RegisterIn;