mirror of
https://github.com/kuhyx/WUT_Computer_Science.git
synced 2026-07-04 17:23:12 +02:00
feat: add login
This commit is contained in:
parent
264c1d4209
commit
3cdd5ca8b4
@ -1,207 +1,16 @@
|
||||
{
|
||||
"posts": [
|
||||
"users": [
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"mail": "this.state",
|
||||
"login": "this.state",
|
||||
"blogTitle": "this.state",
|
||||
"password": "1",
|
||||
"blogData": {
|
||||
"title": "this.state",
|
||||
"listOfItems": [],
|
||||
"dateTime": "12/6/2022 @ 21:35:32"
|
||||
},
|
||||
"id": 1
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 2
|
||||
},
|
||||
{
|
||||
"mail": "test@test",
|
||||
"login": "test@test",
|
||||
"blogTitle": "test@test",
|
||||
"password": "test@test",
|
||||
"id": 3
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 4
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 5
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 6
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 7
|
||||
},
|
||||
{
|
||||
"mail": "test@test",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 8
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 9
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 10
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 11
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 12
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 13
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 14
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 15
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 16
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 17
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 18
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 19
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 20
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 21
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 22
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 23
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 24
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 25
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 26
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 27
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 28
|
||||
},
|
||||
{
|
||||
"mail": "",
|
||||
"login": "test@test",
|
||||
"blogTitle": "",
|
||||
"password": "",
|
||||
"id": 29
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -2,21 +2,83 @@ import 'bootstrap/dist/css/bootstrap.min.css';
|
||||
|
||||
import Button from 'react-bootstrap/Button';
|
||||
import Form from 'react-bootstrap/Form';
|
||||
import React from 'react';
|
||||
|
||||
export default function Login() {
|
||||
export default class Login extends React.Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
login: "",
|
||||
password: "",
|
||||
};
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<Form>
|
||||
<Form.Group className="mb-3" controlId="formLogin">
|
||||
<Form.Label>Login</Form.Label>
|
||||
<Form.Control type="login" placeholder="Enter Login" />
|
||||
</Form.Group>
|
||||
<Form.Group className="mb-3" controlId="formBasicEmail">
|
||||
<Form.Label>Password</Form.Label>
|
||||
<Form.Control type="password" placeholder="Enter Password" />
|
||||
</Form.Group>
|
||||
<Button variant="primary" type="submit">
|
||||
Submit
|
||||
</Button>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
<Form>
|
||||
<Form.Group className="mb-3" controlId="formLogin">
|
||||
<Form.Label>Login</Form.Label>
|
||||
<Form.Control type="login" placeholder="Enter Login"
|
||||
value={this.state.login}
|
||||
onChange={evt => this.updateLogin(evt)}
|
||||
/>
|
||||
|
||||
</Form.Group>
|
||||
|
||||
<Form.Group className="mb-3" controlId="formPassword">
|
||||
<Form.Label>Password</Form.Label>
|
||||
<Form.Control type="password" placeholder="Enter Password"
|
||||
value={this.state.password}
|
||||
onChange={evt => this.updatePassword(evt)}
|
||||
/>
|
||||
</Form.Group>
|
||||
<Button variant="primary" type="submit" onClick={async () => this.loginUser()}>
|
||||
Submit
|
||||
</Button>
|
||||
</Form>
|
||||
)
|
||||
}
|
||||
|
||||
updateLogin(evt) {
|
||||
const val = evt.target.value;
|
||||
// ...
|
||||
this.setState({
|
||||
login: val
|
||||
});
|
||||
}
|
||||
|
||||
updatePassword(evt) {
|
||||
const val = evt.target.value;
|
||||
// ...
|
||||
this.setState({
|
||||
password: val
|
||||
});
|
||||
}
|
||||
|
||||
async loginUser() {
|
||||
const fetchAddress = "http://localhost:8000/users/?login=" + this.state.login;
|
||||
console.log(fetchAddress);
|
||||
let response = await fetch(fetchAddress,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
mode: `cors`,
|
||||
});
|
||||
|
||||
const allData = await response.json();
|
||||
console.log(JSON.stringify(allData));
|
||||
if(allData.length === 0)
|
||||
{
|
||||
alert("This login: \"" + this.state.login + "\" does not exist!");
|
||||
return;
|
||||
}
|
||||
if(allData[0].password !== this.state.password)
|
||||
{
|
||||
alert("Wrong password!");
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -14,15 +14,20 @@ export default class Register extends React.Component {
|
||||
login: "",
|
||||
blogTitle: "",
|
||||
password: "",
|
||||
blogData: {
|
||||
"title": "",
|
||||
"listOfItems":
|
||||
[
|
||||
],
|
||||
"dateTime": "",
|
||||
},
|
||||
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div>
|
||||
{ this.state.mail }
|
||||
</div>
|
||||
<Form>
|
||||
<Form.Group className="mb-3" controlId="formBasicEmail">
|
||||
<Form.Label>Email address</Form.Label>
|
||||
@ -94,28 +99,59 @@ export default class Register extends React.Component {
|
||||
password: val
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
async registerUser() {
|
||||
const fetchAddress = "http://localhost:8000/posts/?login=" + this.state.login;
|
||||
const fetchAddress = "http://localhost:8000/users/?login=" + this.state.login;
|
||||
// console.log(this.state.inputValue);
|
||||
const response = await fetch(fetchAddress,
|
||||
{
|
||||
method: "GET",
|
||||
});
|
||||
const allData = await response.json();
|
||||
console.log(allData.length);
|
||||
console.log(allData);
|
||||
if(allData.length !== 0)
|
||||
{
|
||||
alert("This login: \"" + this.state.login + "\" is already taken!");
|
||||
return;
|
||||
}
|
||||
await fetch("http://localhost:8000/posts", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify(this.state)
|
||||
}).then(data => console.log(data));
|
||||
}
|
||||
if(this.state.password === undefined || this.state.password === "")
|
||||
{
|
||||
alert("Password cannot be empty! ");
|
||||
return;
|
||||
}
|
||||
const currentDate = new Date();
|
||||
const dateTime = currentDate.getDate() + "/"
|
||||
+ (currentDate.getMonth()+1) + "/"
|
||||
+ currentDate.getFullYear() + " @ "
|
||||
+ currentDate.getHours() + ":"
|
||||
+ currentDate.getMinutes() + ":"
|
||||
+ currentDate.getSeconds();
|
||||
const blogData = {
|
||||
"title": this.state.blogTitle,
|
||||
"listOfItems":
|
||||
[
|
||||
],
|
||||
"dateTime": dateTime,
|
||||
};
|
||||
this.state.blogData = blogData;
|
||||
|
||||
await fetch("http://localhost:8000/users", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify(this.state),
|
||||
redirect: 'manual',
|
||||
}).then(response => response.json())
|
||||
.then(data => {
|
||||
console.log('Success:', data);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Error:', error);
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user