feat: add login

EGUI/lab3/db.json

@@ -1,207 +1,16 @@
 {
-  "posts": [
+  "users": [
     {
-      "mail": "",
+      "mail": "this.state",
-      "login": "",
+      "login": "this.state",
-      "blogTitle": "",
+      "blogTitle": "this.state",
-      "password": "",
+      "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
     }
   ]
 }

EGUI/lab3/src/routes/login.jsx

@@ -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 {
-    return (
+
-<Form>
+  constructor(props) {
-  <Form.Group className="mb-3" controlId="formLogin">
+    super(props);
-    <Form.Label>Login</Form.Label>
+    this.state = {
-    <Form.Control type="login" placeholder="Enter Login" />
+        login: "",
-  </Form.Group>
+        password: "",
-  <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>
-    );
   }
+  
+  render () {
+    return (
+      <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;
+    }
+  }
+}

EGUI/lab3/src/routes/register.jsx

@@ -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>
@@ -96,26 +101,57 @@ export default class Register extends React.Component {
   }
   
   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", {
+    if(this.state.password === undefined || this.state.password === "")
-        method: "POST",
+    {
-        headers: {
+      alert("Password cannot be empty! ");
-          "Content-Type": "application/json"
+      return;
-        },
+    }
-        body: JSON.stringify(this.state)
+    const currentDate = new Date();
-      }).then(data => console.log(data));
+    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);
+    });
+
+      
+  }
+
   
-    };
 }