task can be added

This commit is contained in:
Florian Hoss 2022-04-06 20:59:10 +02:00
parent 87e66f74bd
commit f73f862bcf
4 changed files with 64 additions and 15 deletions

View file

@ -30,9 +30,37 @@
</div>
{{template "scripts" .}}
{{template "formScripts" .}}
<script>
userLoggedIn().then((loggedIn) => !loggedIn ? redirect("/view/login") : getAllTasks());
const tasksEl = document.getElementById("tasks");
const descriptionInput = document.getElementById("description");
function submitForm(formData) {
axios.post("/tasks", formData, axiosConfig)
.then((response) => {
addTaskToTasks(response.data.task);
form.classList.remove('was-validated');
descriptionInput.value = "";
})
.catch((err) => {
showErrorToast(err.response.data.message);
});
}
function addTaskToTasks(task) {
const newTask = document.createElement('div');
newTask.classList.add('row', 'g-0', 'align-items-center', 'mb-1');
newTask.innerHTML = `
<div class="col-1 text-center">${task.ID}</div>
<div class="col-8">${task.Description}</div>
<div class="col-2 form-check form-switch d-flex justify-content-center">
<input class="text-center form-check-input" type="checkbox" ${task.Done && "checked"} role="switch" id="flexSwitchCheckDefault">
</div>
<button class="col-1 btn btn-danger"><i class="bi bi-trash"></i></button>
`;
tasksEl.appendChild(newTask);
}
function getAllTasks() {
axios.get("/tasks", axiosConfig).then((response) => {
@ -49,17 +77,7 @@
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-1 text-center">${task.ID}</div>
<div class="col-8">${task.Description}</div>
<div class="col-2 form-check form-switch d-flex justify-content-center">
<input class="text-center form-check-input" type="checkbox" ${task.Done && "checked"} role="switch" id="flexSwitchCheckDefault">
</div>
<button class="col-1 btn btn-danger"><i class="bi bi-trash"></i></button>
`;
tasksEl.appendChild(newTask);
addTaskToTasks(task);
});
});
}