fix login and show tasks

This commit is contained in:
Florian Hoss 2022-04-06 14:12:15 +02:00
parent 6ad423ae5c
commit 9b4eb8f7aa
2 changed files with 25 additions and 11 deletions

View file

@ -95,8 +95,11 @@
<script>
const button_logout = document.getElementById("button-logout");
const username = getCookie("username");
const myHeaders = new Headers();
myHeaders.append('username', username);
const axiosConfig = {
headers: {
username: username,
}
};
const errorToastEl = document.getElementById('errorToast');
const errorToastContent = document.getElementById('errorToastContent');
@ -142,14 +145,13 @@
}
async function userLoggedIn() {
const response = await fetch("/auth/user", {method: 'GET', headers: myHeaders});
const json = await response.json();
if (json.logged_in === true) {
const response = await axios.get("/auth/user", axiosConfig);
if (response.data.logged_in === true) {
document.getElementById("button-login").hidden = true;
button_logout.hidden = false;
document.getElementById("button-tasks").hidden = false;
}
return json.logged_in
return response.data.logged_in
}
async function logout() {

View file

@ -11,18 +11,30 @@
<div class="position-absolute top-50 start-50 translate-middle">
<div class="fs-3">{{ .title }}</div>
<hr>
<div id="tasks"></div>
</div>
{{template "scripts" .}}
<script>
userLoggedIn().then((loggedIn) => !loggedIn ? redirect("/view/login") : getAllTasks());
const tasksEl = document.getElementById("tasks");
async function getAllTasks() {
const response = await fetch("/tasks", {method: 'GET', headers: myHeaders});
const json = await response.json();
console.log(json);
function getAllTasks() {
axios.get("/tasks", axiosConfig).then((response) => {
const tasks = response.data.tasks;
[...tasks]
.forEach((task) => {
const newTask = document.createElement('div');
newTask.classList.add('row', 'g-0', 'align-items-center', 'mb-1');
newTask.innerHTML = `
<div class="col-2 overflow-ellipsis text-end pe-4">${task.ID}</div>
<div class="col-6 overflow-ellipsis">${task.Description}</div>
<div class="col-2 overflow-ellipsis text-end">${task.Done}</div>
`;
tasksEl.appendChild(newTask);
});
});
}
</script>
</body>
</html>