use now can login

client/src/App.tsx

@@ -8,29 +8,41 @@ import SignIn from "./Sing/Signin";
 import Create from "./Sing/create";
 
 class App extends React.Component {
- state:{data:{hello:string}}={
- data:{hello:'seyed'}
+ state={
+ id:0
  }
  constructor(props: any) {
  super(props);
+ this.getId = this.getId.bind(this);
  }
+ getId(){
+ let url :string= 'https://localhost:8000/person/check/'
+ axios.get(url)
+ .then(response => {
+ const userData = response.data;
+ console.log(userData)
+ this.setState({
+ id: userData.id,
+ });
+ })
+ .catch(error => {
+ console.error('Error:', error);
+ });
+ }
+ componentDidMount() {
+ this.getId()
+ }
 
- // componentDidMount() {
- // axios.get('https://localhost:8000/api/hello')
- // .then((response: { data: any; }) => {
- // this.setState({
- // data: response.data
- // });
- // });
- // }
-
- render() {
+ render() {
  return (
+ this.state.id === 0 ? <Router>
+ <Route render={(props) => <SignIn {...props} />}/>
+ </Router>:
  <Router>
  <Route path="/" exact component={Home} />
- <Route path="/profile" component={profile} />
+ <Route path="/profile/:id" component={profile} />
  <Route path="/setting" component={Setting}/>
- <Route path="/login" component={SignIn}/>
+ <Route path="/login" render={(props) => <SignIn {...props} />}/>
  <Route path="/create" component={Create}/>
  </Router>
 

client/src/Sing/Signin.tsx

@@ -1,7 +1,37 @@
 import React from "react";
 import { RouteComponentProps } from 'react-router-dom';
-interface Props extends RouteComponentProps {}
-class SignIn extends React.Component<Props>{
+import axios from "axios";
+interface SignInProps extends RouteComponentProps {
+
+}
+class SignIn extends React.Component<SignInProps>{
+ state = {
+ username: '',
+ password: '',
+ };
+ constructor(props:any) {
+ super(props);
+ this.handleChange = this.handleChange.bind(this);
+ this.handleSubmit = this.handleSubmit.bind(this);
+ }
+ handleChange(event:any) {
+ this.setState({[event.target.name]: event.target.value});
+ }
+ handleSubmit(event:any) {
+ event.preventDefault();
+
+ axios.post('https://localhost:8000/person/login', this.state)
+ .then(response => {
+ if (response.data.message !== undefined)
+ alert(response.data.message)
+ else
+ window.location.reload()
+ })
+ .catch(error => {
+ console.error(error);
+ });
+ }
+
  handleCreateClick = () => {
  this.props.history.push('/create');
  window.scrollTo(0, 0);
@@ -13,12 +43,12 @@ class SignIn extends React.Component<Props>{
  <h1 className={'fancy'}>login</h1>
  <h1 className={'butter'}>OXDgram</h1>
  <div className="style-input">
- <input type={'text'} placeholder={'username'}/>
+ <input type={'text'} placeholder={'username'} name={'username'} onChange={this.handleChange}/>
  </div>
  <div className="style-input">
- <input type={'password'} placeholder={'password'}/>
+ <input type={'password'} placeholder={'password'} name={'password'} onChange={this.handleChange}/>
  </div>
- <button className={'profile_follow'}>login</button>
+ <button className={'profile_follow'} onClick={this.handleSubmit}>login</button>
  <h2>OR</h2>
  <div className="container">
  <h1 className={'multi_color'} onClick={this.handleCreateClick}>create account</h1>