Загрузить файлы в «sk1/templates»

This commit is contained in:
Vladyslav Korzun 2025-04-13 21:03:51 +00:00
parent 9fbebfa43c
commit cea791ffe2

78
sk1/templates/index.html Normal file
View File

@ -0,0 +1,78 @@
<!DOCTYPE html>
<html lang="sk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Správa používateľov</title>
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
</head>
<body>
<div class="container">
<h1>Zoznam používateľov</h1>
<ul id="user-list">
{% for user in users %}
<li>
<img src="https://api.dicebear.com/8.x/initials/svg?seed={{ user[1] }}" alt="avatar" class="avatar">
<div class="user-info">
<strong>{{ user[1] }}</strong><br>
<small>Pridané: {{ user[2].strftime('%Y-%m-%d %H:%M:%S') }}</small>
</div>
<button class="delete-btn" onclick="deleteUser('{{ user[0] }}')">Odstrániť</button>
</li>
{% endfor %}
</ul>
<h2>Pridať používateľa</h2>
<input type="text" id="username" placeholder="Zadajte meno">
<button onclick="addUser()">Pridať</button>
<br><br>
<button onclick="showRandomUser()" class="random-btn">🎲 Náhodný používateľ</button>
<div id="random-user-display" style="margin-top:15px;"></div>
</div>
<script>
function addUser() {
const name = document.getElementById("username").value;
if (!name) {
alert("Zadajte meno!");
return;
}
fetch("/add_user", {
method: "POST",
body: new URLSearchParams({ name }),
headers: { "Content-Type": "application/x-www-form-urlencoded" }
})
.then(response => response.json())
.then(() => location.reload());
}
function deleteUser(id) {
fetch(`/delete_user/${id}`, { method: "POST" })
.then(response => response.json())
.then(() => location.reload());
}
function showRandomUser() {
fetch("/random_user")
.then(response => response.json())
.then(data => {
const display = document.getElementById("random-user-display");
if (data.error) {
display.innerHTML = `<p style="color:red;">${data.error}</p>`;
} else {
display.innerHTML = `
<div class="random-user-card">
<img src="https://api.dicebear.com/8.x/initials/svg?seed=${data.name}" class="avatar">
<strong>${data.name}</strong><br>
<small>Pridané: ${data.created_at}</small>
</div>`;
}
});
}
</script>
</body>
</html>