basic frontend
This commit is contained in:
parent
e3117f1475
commit
49374c0e84
@ -24,7 +24,7 @@ func Listen(address string, path string) {
|
||||
apiAuth := api.Group("auth")
|
||||
{
|
||||
apiAuth.POST("register", auth.Register)
|
||||
apiAuth.GET("login", auth.Login)
|
||||
apiAuth.POST("login", auth.Login)
|
||||
}
|
||||
|
||||
apiAdmin := api.Group("admin").Use(auth.LoggedIn).Use(auth.IsAdmin)
|
||||
|
@ -1,17 +1,13 @@
|
||||
server {
|
||||
listen ${NGINX_PORT};
|
||||
|
||||
root /usr/share/nginx/html;
|
||||
|
||||
location / {
|
||||
root /usr/share/nginx/html;
|
||||
index index.html index.htm;
|
||||
index index.html;
|
||||
}
|
||||
|
||||
error_page 404 /404.html;
|
||||
|
||||
error_page 500 502 503 504 /50x.html;
|
||||
location = /50x.html {
|
||||
root /usr/share/nginx/html;
|
||||
}
|
||||
error_page 404 /404.html;
|
||||
|
||||
location ~ api\/?.* {
|
||||
proxy_pass http://backend:5000;
|
||||
|
@ -9,7 +9,7 @@ type User struct {
|
||||
}
|
||||
|
||||
type Task struct {
|
||||
ID int `db:"id"`
|
||||
ID int `db:"id" json:"id"`
|
||||
Description string `db:"description" form:"description" json:"description"`
|
||||
Points int `db:"points" form:"points" json:"points" validate:"required"`
|
||||
Recipient string `db:"recipient" form:"recipient" json:"recipient" validate:"required,len=6"`
|
||||
|
28
static/admin/add/index.html
Normal file
28
static/admin/add/index.html
Normal file
@ -0,0 +1,28 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Add task</title>
|
||||
<script src="/js/config.js"></script>
|
||||
<script src="/js/utils.js"></script>
|
||||
<script defer src="/js/add.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<form id="add_form">
|
||||
<label for="recipient">Recipient</label>
|
||||
<input type="text" id="recipient" name="recipient">
|
||||
<br>
|
||||
<label for="description">Description</label>
|
||||
<input type="text" id="description" name="description">
|
||||
<br>
|
||||
<label for="points">Points</label>
|
||||
<input type="number" value="0" id="points" name="points">
|
||||
<br>
|
||||
<input type="button" value="Add" onclick="add()">
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
12
static/admin/index.html
Normal file
12
static/admin/index.html
Normal file
@ -0,0 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Admin</title>
|
||||
</head>
|
||||
<body>
|
||||
<a href="add">Add task</a>
|
||||
<a href="list">List tasks</a>
|
||||
</body>
|
||||
</html>
|
37
static/admin/list/index.html
Normal file
37
static/admin/list/index.html
Normal file
@ -0,0 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>List tasks by Neptun</title>
|
||||
<script src="/js/config.js"></script>
|
||||
<script src="/js/utils.js"></script>
|
||||
<script defer src="/js/admin_list.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<input type="text" id="neptun">
|
||||
<br>
|
||||
<input type="button" value="List" onclick="list_tasks()">
|
||||
|
||||
<div>Sum: <span id="sum"></span></div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Description</th>
|
||||
<th>Issuer</th>
|
||||
<th>Points</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="list">
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
@ -1,11 +1,29 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="hu">
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>SZOE pontok</title>
|
||||
<title>Authentication</title>
|
||||
<script src="/js/config.js"></script>
|
||||
<script src="/js/utils.js"></script>
|
||||
<script defer src="/js/auth.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>SZOE pontok</h1>
|
||||
<form id="auth_form">
|
||||
<label for="neptun">Neptun</label>
|
||||
<input type="text" id="neptun" name="neptun">
|
||||
<br>
|
||||
<label for="email">Email</label>
|
||||
<input type="text" id="email" name="email">
|
||||
<br>
|
||||
<label for="password">Password</label>
|
||||
<input type="password" id="password" name="password">
|
||||
<br>
|
||||
<input type="button" value="Login" onclick="login()">
|
||||
<input type="button" value="Register" onclick="register()">
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
22
static/js/add.js
Normal file
22
static/js/add.js
Normal file
@ -0,0 +1,22 @@
|
||||
var add_form = document.getElementById("add_form");
|
||||
|
||||
function add() {
|
||||
fetch(`${config.apiBase}/admin/task/add`,
|
||||
{
|
||||
method: "POST",
|
||||
credentials: "same-origin",
|
||||
body: new FormData(add_form)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.status !== 200) {
|
||||
alert(data.error);
|
||||
console.log(data);
|
||||
} else {
|
||||
alert("task added");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
54
static/js/admin_list.js
Normal file
54
static/js/admin_list.js
Normal file
@ -0,0 +1,54 @@
|
||||
function list_tasks() {
|
||||
fetch(`${config.apiBase}/admin/task/list/${document.getElementById("neptun").value}`,
|
||||
{
|
||||
method: "GET",
|
||||
credentials: "same-origin",
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.status !== 200) {
|
||||
alert(data.error);
|
||||
console.log(data);
|
||||
} else {
|
||||
let sum = 0;
|
||||
|
||||
let table = document.getElementById("list");
|
||||
table.innerHTML = "";
|
||||
|
||||
data.tasks.forEach(task => {
|
||||
let row = table.insertRow();
|
||||
row.insertCell().innerText = task.description;
|
||||
row.insertCell().innerText = task.issuer;
|
||||
row.insertCell().innerText = task.points;
|
||||
row.insertCell().innerHTML = `<input type="button" value="Remove" onclick="remove(${task.id})">`;
|
||||
sum += task.points;
|
||||
});
|
||||
|
||||
document.getElementById("sum").innerText = sum;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
|
||||
function remove(id) {
|
||||
fetch(`${config.apiBase}/admin/task/remove/${id}`,
|
||||
{
|
||||
method: "POST",
|
||||
credentials: "same-origin",
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.status !== 200) {
|
||||
alert(data.error);
|
||||
console.log(data);
|
||||
} else {
|
||||
alert("removed");
|
||||
list_tasks();
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
43
static/js/auth.js
Normal file
43
static/js/auth.js
Normal file
@ -0,0 +1,43 @@
|
||||
var auth_form = document.getElementById("auth_form");
|
||||
|
||||
function login() {
|
||||
fetch(`${config.apiBase}/auth/login`,
|
||||
{
|
||||
method: "POST",
|
||||
credentials: "same-origin",
|
||||
body: new FormData(auth_form)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.status !== 200) {
|
||||
alert(data.error);
|
||||
console.log(data);
|
||||
} else {
|
||||
redirect("/list");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
|
||||
function register() {
|
||||
fetch(`${config.apiBase}/auth/register`,
|
||||
{
|
||||
method: "POST",
|
||||
credentials: "same-origin",
|
||||
body: new FormData(auth_form)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.status !== 200) {
|
||||
alert(data.error);
|
||||
console.log(data);
|
||||
} else {
|
||||
alert("succesful registration");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
3
static/js/config.js
Normal file
3
static/js/config.js
Normal file
@ -0,0 +1,3 @@
|
||||
const config = {
|
||||
apiBase: "/api"
|
||||
};
|
30
static/js/list.js
Normal file
30
static/js/list.js
Normal file
@ -0,0 +1,30 @@
|
||||
function list() {
|
||||
fetch(`${config.apiBase}/user/list`,
|
||||
{
|
||||
method: "GET",
|
||||
credentials: "same-origin",
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.status !== 200) {
|
||||
alert(data.error);
|
||||
console.log(data);
|
||||
} else {
|
||||
let sum = 0;
|
||||
data.tasks.forEach(task => {
|
||||
let row = document.getElementById("list").insertRow();
|
||||
row.insertCell().innerText = task.description;
|
||||
row.insertCell().innerText = task.issuer;
|
||||
row.insertCell().innerText = task.points;
|
||||
sum += task.points;
|
||||
});
|
||||
|
||||
document.getElementById("sum").innerText = sum;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
|
||||
list();
|
3
static/js/utils.js
Normal file
3
static/js/utils.js
Normal file
@ -0,0 +1,3 @@
|
||||
function redirect(path) {
|
||||
window.location.href = path;
|
||||
}
|
34
static/list/index.html
Normal file
34
static/list/index.html
Normal file
@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>List tasks</title>
|
||||
<script src="/js/config.js"></script>
|
||||
<script src="/js/utils.js"></script>
|
||||
<script defer src="/js/list.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<a href="/admin">Admin</a>
|
||||
|
||||
<div>Sum: <span id="sum"></span></div>
|
||||
|
||||
<table id="list">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Description</th>
|
||||
<th>Issuer</th>
|
||||
<th>Points</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user