HS-Esslingen/swb6-it-sec
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

show tasks in a table

Browse source
This commit is contained in:
Florian Hoss 2022-04-06 14:24:01 +02:00
parent 9b4eb8f7aa
commit bea864d967
4 changed files with 15 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

15
Lab01/app/templates/tasks.tmpl
View file

@ -8,8 +8,8 @@
<body>
{{template "navbar" .}}
<div class="position-absolute top-50 start-50 translate-middle">
<div class="fs-3">{{ .title }}</div>
<div class="container">
<div class="fs-3 text-center mt-5">{{ .title }}</div>
<hr>
<div id="tasks"></div>
</div>
@ -21,6 +21,15 @@
function getAllTasks() {
axios.get("/tasks", axiosConfig).then((response) => {
const taskHeader = document.createElement("div");
taskHeader.classList.add('row', 'g-0', 'align-items-center', 'mb-1');
taskHeader.innerHTML = `
<div class="col-2 overflow-ellipsis text-end pe-4">ID</div>
<div class="col-6 overflow-ellipsis">Description</div>
<div class="col-2 overflow-ellipsis text-end">Done</div>
<hr class="mt-3 mb-2">
`;
tasksEl.appendChild(taskHeader);
const tasks = response.data.tasks;
[...tasks]
.forEach((task) => {
@ -29,7 +38,7 @@
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>
<div class="col-2 overflow-ellipsis text-end"><i class="bi ${task.Done ? "bi-check-circle" : "bi-circle"}"></i></div>
`;
tasksEl.appendChild(newTask);
});