script.js

function adicionarTarefa(evt) {
  // Evita que a pagina seja recarregada ao enviar o formulario
  evt.preventDefault();

  // Obtem os valores dos inputs
  let descricao = document.getElementById("descricao-input");

  let data = document.getElementById("data-input");

  let feito = document.getElementById("feito-input");

  // Cria a nova tarefa e adiciona a lista
  let novaTarefa = {
    descricao: descricao.value,
    data: data.value,
    feito: feito.checked,
  };
  tarefas.push(novaTarefa);

  popularTabela();
}

function removeElemento(index) {
  // Remove o elemento na posicao index
  tarefas.splice(index, 1);

  // Apos a remocao, limpa a tabela e preenche novamente
  popularTabela();
}

function popularTabela() {
  // Referencia ao corpo da tabela
  let conteudo = document.getElementById("conteudo");

  // Limpa a tabela antes de popular
  conteudo.innerHTML = "";

  // Grava os elementos na memoria
  localStorage.setItem("tarefas", JSON.stringify(tarefas));

  // Popula a tabela
  for (let i = 0; i < tarefas.length; i++) {
    let tarefa = tarefas[i];

    let linha = document.createElement("tr");
    conteudo.appendChild(linha);

    let posicao = document.createElement("th");
    linha.appendChild(posicao);
    posicao.innerText = i + 1;

    let descricao = document.createElement("td");
    linha.appendChild(descricao);
    descricao.innerText = tarefa.descricao;

    let data = document.createElement("td");
    linha.appendChild(data);
    data.innerText = tarefa.data;

    let feito = document.createElement("td");
    linha.appendChild(feito);

    let input = document.createElement("input");
    input.type = "checkbox";
    input.checked = tarefa.feito;
    feito.appendChild(input);

    let acoes = document.createElement("td");
    linha.appendChild(acoes);

    let button = document.createElement("button");
    button.className = "btn btn-danger";
    button.innerText = "X";
    button.onclick = function () {
      removeElemento(i);
    };
    acoes.appendChild(button);
  }
}

// Adiciona a funcao criada ao formulario
let formulario = document.getElementById("formulario");
formulario.onsubmit = adicionarTarefa;

// Lista de tarefas a fazer recuperada da memoria do navegador
let tabelaSalva = localStorage.getItem("tarefas");

// Quando utilizamos o ||, pegamos a primeira opcao, se existir, ou a segunda opcao
let tarefas = JSON.parse(tabelaSalva) || [];

// Popula a tabela inicialmente
popularTabela();