Olá, estou criando um um formulário para responder reclamações de clientes. A ideia é que tenha uma coluna que enquanto o local da resposta estiver vazio ela calcule a diferença entre a data atual e a data de registro (campo de um formulário) e se estiver respondido que ela apareça concluído.
No vídeo foi criado manualmente algumas linhas na tabela e a alteração do valor do imc ficou associada pela id desse td.
Criei a fomula para dizer os dias sem colocar tds manuais. Como procedo para alterar o fundo dessa célula?
segue js
var botaoAdd = document.querySelector("#add-registro");
botaoAdd.addEventListener("click", function(event){
event.preventDefault();
//captando dados do form
var form = document.querySelector("#form-add");
var numid = form.numid.value;
var dataRec = form.datarec.value;
var dataReg = form.datareg.value;
var tipo = form.tipo.value;
var origem = form.origem.value;
var rast = form.rastrfonte.value;
var escopo = form.escopo.value;
var setor = form.setor.value;
var unidade = form.unidade.value;
var area = form.area.value;
var perfil = form.perfil.value;
var grTeor = form.grteor.value;
var voc = form.voc.value;
var resposta = form.resposta.value;
var dataResp = form.dataresp.value;
var status = ((new Date() - new Date(form.datarec.value))/(1000*60*60*24))
// coluna status
if(form.resposta.value === '' ){
var status = parseInt((new Date() - new Date(form.datarec.value))/(1000*60*60*24));
}else{
var status = "concluído";
}
console.log(status);
//cria tr e td
var registroTr = document.createElement("tr");
var numidTd = document.createElement("td");
var dataRecTd = document.createElement("td");
var dataRegTd = document.createElement("td");
var tipoTd = document.createElement("td");
var origemTd =document.createElement("td");
var rastTd = document.createElement("td");
var escopoTd = document.createElement("td");
var setorTd = document.createElement("td");
var unidadeTd = document.createElement("td");
var areaTd = document.createElement("td");
var perfilTd = document.createElement("td");
var grTeorTd = document.createElement("td");
var vocTd = document.createElement("td");
var respostaTd = document.createElement("td");
var dataRespTd = document.createElement("td");
var statusTd = document.createElement("td");
numidTd.textContent = numid;
dataRecTd.textContent = dataRec;
dataRegTd.textContent = dataReg;
tipoTd.textContent = tipo;
origemTd.textContent = origem;
rastTd.textContent = rast;
escopoTd.textContent = escopo;
setorTd.textContent = setor;
unidadeTd.textContent = unidade;
areaTd.textContent = area;
perfilTd.textContent = perfil;
grTeorTd.textContent = grTeor;
vocTd.textContent = voc;
respostaTd.textContent = resposta;
dataRespTd.textContent = dataResp;
statusTd.textContent = status;
console.log(statusTd.textContent);
registroTr.appendChild(numidTd);
registroTr.appendChild(dataRecTd);
registroTr.appendChild(dataRegTd);
registroTr.appendChild(tipoTd);
registroTr.appendChild(origemTd);
registroTr.appendChild(rastTd);
registroTr.appendChild(escopoTd);
registroTr.appendChild(setorTd);
registroTr.appendChild(unidadeTd);
registroTr.appendChild(areaTd);
registroTr.appendChild(perfilTd);
registroTr.appendChild(grTeorTd);
registroTr.appendChild(vocTd);
registroTr.appendChild(respostaTd);
registroTr.appendChild(dataRespTd);
registroTr.appendChild(statusTd);
//acrescentando registro na tabela
var tabela = document.querySelector("#tabela-registro");
tabela.appendChild(registroTr);
});
segue html
<h2>Visualização Manifestações</h2>
<label for="filtrar-tabela">Filtre:</label>
<input type="text" name="filtro" id="filtrar-tabela" placeholder="Digite o nome do escopo">
<table>
<thead>
<tr>
<th>ID</th>
<th>Data Receb.</th>
<th>Data Reg.</th>
<th>Tipo</th>
<th>Origem</th>
<th>Rastreador</th>
<th>Escopo</th>
<th>Serviço Origem</th>
<th>Unidade</th>
<th>Área</th>
<th>Perfil</th>
<th>Grupo Teor</th>
<th>V. Cliente</th>
<th>Resposta</th>
<th>Data Resp.</th>
<th>Status</th>
<th>Ação</th>
</tr>
</thead>
<tbody id="tabela-registro">
</tbody>
</table>
</section>