Em uma empresa que trabalhei, alguns dados importantes não estavam disponíveis no sistema centralizador de informações. Isso causava um problema para análise de dados, compartilhamento de informações e até mesmo auditorias. Na situação em questão, era necessário inserir todos os dados em menos de um dia. Só tinha um problema: minha funcão não era de desenvolvedor na empresa. De fato, isso dificultava um pouco, pois o acesso ao banco de dados ou a alguma api resolveria rapidamente este problema.

De qualquer forma, precisava ser feito e eu não podia deixar esse desafio passar sem nenhuma pitada de código (claro).

O fluxo de registro manual no sistema era assim:

1. Digitar o valor do registro no campo específico
2. Selecionar a data e hora daquele registro
3. Clicar no botão atualizar
4. Clicar no botão salvar
5. Esperar a boa vontade do sistema carregar novamente

A primeira etapa que fiz foi entender os padrões de registro e definir os requisitos:

• Os registros deveriam ser inseridos a cada 2 horas (de alguns anos anteriores)
• Construir um array com os valores para iterar
• Esperar a resposta do sistema entre cada registro
• Formato da data: dd/MM/YYYY HH:mm

Lembro que a primeira coisa que fiz foi verificar como eu iria preencher os campos de valor e de data e os botões de atualizar e salvar. Um inspecionar acabou resolvendo isso:

Campo	Id
Valor	#aha93_AppointmentValue
Data	#Filter_BaseHour
Botão atualizar	#btnRefreshBaseHour
Botão salvar	#btnManualInputSave

Na época eu achava isso espetacular...

Primeiramente, precisava formatar a data assim: dd/MM/YYYY HH:mm

Copiar
1function formatDate(date) {
2  var minutes = "" + date.getMinutes();
3  var hours = "" + date.getHours();
4  var month = "" + (date.getMonth() + 1);
5  var day = "" + date.getDate();
6  var year = date.getFullYear();
7  if (month.length < 2) month = "0" + month;
8  if (day.length < 2) day = "0" + day;
9  if (hours.length < 2) hours = "0" + hours;
10  if (minutes.length < 2) minutes = "0" + minutes;
11  return [day, month, year].join("/") + " " + [hours, minutes].join(":");
12}

🤔

O próximo passo era construir um Array contendo as datas a cada duas horas. Vou colocar como exemplo o intervalo de 01/01/2022 00:00 até 10/01/2022 00:00.

Copiar
1var date = new Date(2022, 1, 1, 00, 00);
2const finalDate = new Date(2022, 1, 10, 00, 00);
3const dateList = [];
4while (date < finalDate) {
5  dateList.push(formatDate(date));
6  date.setHours(date.getHours() + 2);
7}
8console.log(dateList);
9
10date.setHours(date.getHours + 2);

A lista dos valores das variáveis estava disponível em um arquivo Excel, então eu só precisei exportar como .CSV e meu array de valores estava pronto: [412, 345, 444 ...] Em seguida, eu criei a função para preencher os valores e clicar nos botões, e foi assim que dei o nome a ela:

Copiar
1preencherClicar = (data, valor) => {
2  formated = formatDate(data);
3  console.log(formated);
4  $("#Filter_BaseHour").val(formated);
5  $("#btnRefreshBaseHour").click();
6  $("#aha93_AppointmentValue").val(valor);
7  $("#btnManualInputSave").click();
8};

A partir daqui eu precisava juntar tudo isso em um loop de tempo para inserir os dados. A questão era que o sistema demovava para confirmar que os dados haviam sido inseridos, então, a cada clique no botão salvar, era necessário aguardar o retorno do sistema. O sistema demorava em média 3 segundos para confirmar, então eu dobrei o valor e defini como tempo de espera entre os ciclos.

Primeiro, defini a função que deveria ser executada em loop:

Copiar
1var index = 0;
2const timedLoop = () => {
3  if (index >= values.length) {
4    clearInterval(loop); // parar a execução da função loop
5  }
6  preencherClicar(dateList[i], vallues[i]);
7};

Depois coloquei em execução a cada 6 segundos:

Copiar
1const loop = setInterval(timedloop, 6000);

Depois de algum tempo, dados inseridos!

Uma nova perspectiva

Posteriormente, fui submetido a um desafio neste mesmo contexto, com o mesmo sistema. Então eu pensei que pudesse resolver de uma forma diferente, e até mais rapida.

Teclei F12 e fui verificar o que acontecia quando o botão salvar era clicado, e lá estava uma chamada para /SaveManualInputAppointment, do melhor jeito possível, uma lista de objetos.

Copiar
1[
2  {
3    AppointmentTimestamp: "", // Aquela mesma data que falamos anteriormente
4    AppointmentValue: "470",
5    Id: "", //
6    Name: "",
7    HasNoteValue: "",
8    RelationalDatabase: "",
9  },
10  ...,
11]

O fato de ser uma lista ([ ]) era importante porquê significava que eu poderia inserir muitos valores em uma única chamada.

Em seguida, imaginei que eu poderia ter problemas de autorização para poder usar esta API, e de fato, eu recebi um erro de usuário não autenticado. Maaas, se era um erro de autenticação, então era só fazer pelo próprio navegador com o meu usuário logado que funcionaria, certo?

Bom, novamente eu tinha os dados em csv e, desta vez, resolvi utilizar a capacidade de edição extrema do VS Code. Veja no gif:

Com os dados formatados da forma que eu precisava, bastava colocar os dados em uma variável data e executar a função fetch para inserir os dados no sistema.

Copiar
1fetch(".../SaveManualInputAppointment", {
2  method: "POST",
3  body: JSON.stringify(data),
4  headers: {
5    "Content-type": "application/json; charset=UTF-8",
6  },
7});