kuhyx/WUT_Computer_Science
1
0
Fork 0
mirror of https://github.com/kuhyx/WUT_Computer_Science.git synced 2026-07-04 17:23:12 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: fetch data from json, block multiple login register

Browse Source
This commit is contained in:
PolishPigeon 2022-06-11 13:51:11 +02:00
parent cd60cc258a
commit 2d599a2b8e
2 changed files with 223 additions and 144 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

195
EGUI/lab3/data/db.json
View File

@ -1,170 +1,207 @@
{
"posts": [
{
"title": "JSON SERVER",
"author": "foo",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 1
},
{
"title": "REACT",
"author": "facebook",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 2
},
{
"title": "BOOTSTRAP",
"author": "css master",
"mail": "test@test",
"login": "test@test",
"blogTitle": "test@test",
"password": "test@test",
"id": 3
},
{
"title": "MEDIUM",
"author": "medium",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 4
},
{
"title": "test",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 5
},
{
"title": "test",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 6
},
{
"title": "test",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 7
},
{
"title": "test",
"mail": "test@test",
"login": "",
"blogTitle": "",
"password": "",
"id": 8
},
{
"title": "test",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 9
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 10
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 11
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 12
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 13
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 14
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 15
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 16
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 17
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 18
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 19
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 20
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 21
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 22
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 23
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 24
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 25
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 26
},
{
"title": "",
"author": "",
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 27
},
{
"mail": "",
"login": "",
"blogTitle": "",
"password": "",
"id": 28
},
{
"mail": "",
"login": "test@test",
"blogTitle": "",
"password": "",
"id": 29
},
{
"id": 30
},
{
"id": 31
},
{
"id": 32
},
{
"id": 33
},
{
"id": 34
},
{
"title": "test",
"author": "test",
"id": 35
},
{
"title": "test",
"author": "test",
"id": 36
},
{
"title": "test@test",
"author": "test",
"id": 37
}
]
}

172
EGUI/lab3/src/routes/register.jsx
View File

@ -7,73 +7,115 @@ import React from 'react';
export default class Register extends React.Component {
constructor(props) {
super(props);
this.state = {
inputValue: 'test'
};
}
constructor(props) {
super(props);
this.state = {
mail: "",
login: "",
blogTitle: "",
password: "",
};
}
render() {
return (
<div>
<div>
{ this.state.inputValue }
</div>
<Form>
<Form.Group className="mb-3" controlId="formBasicEmail">
<Form.Label>Email address</Form.Label>
<Form.Control type="email" placeholder="Enter email"
value={this.state.inputValue}
onChange={evt => this.updateInputValue(evt)}
/>
</Form.Group>
<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="formBlogTitle">
<Form.Label>Blog Title</Form.Label>
<Form.Control type="blogTitle" placeholder="Enter Blog Title" />
</Form.Group>
<Form.Group className="mb-3" controlId="formPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Enter Password" />
</Form.Group>
<Button variant="primary" type="submit" onClick={() => this.registerUser()}>
Submit
</Button>
</Form>
render() {
return (
<div>
<div>
{ this.state.mail }
</div>
);
}
<Form>
<Form.Group className="mb-3" controlId="formBasicEmail">
<Form.Label>Email address</Form.Label>
<Form.Control type="email" placeholder="Enter email"
value={this.state.mail}
onChange={evt => this.updateMail(evt)}
/>
</Form.Group>
<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="formBlogTitle">
<Form.Label>Blog Title</Form.Label>
<Form.Control type="blogTitle" placeholder="Enter Blog Title"
value={this.state.blogTitle}
onChange={evt => this.updateBlogTitle(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.registerUser()}>
Submit
</Button>
</Form>
</div>
);
}
updateInputValue(evt) {
const val = evt.target.value;
// ...
this.setState({
inputValue: val
});
}
updateMail(evt) {
const val = evt.target.value;
// ...
this.setState({
mail: val
});
}
registerUser() {
alert(this.state.inputValue);
console.log("anything");
// console.log(this.state.inputValue);
const test = {
title: this.state.inputValue,
author: "test"
};
fetch("http://localhost:8000/posts", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(test)
}).then(data => console.log(data));
};
updateLogin(evt) {
const val = evt.target.value;
// ...
this.setState({
login: val
});
}
updateBlogTitle(evt) {
const val = evt.target.value;
// ...
this.setState({
blogTitle: val
});
}
updatePassword(evt) {
const val = evt.target.value;
// ...
this.setState({
password: val
});
}
async registerUser() {
const fetchAddress = "http://localhost:8000/posts/?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);
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));
};
}