const api = {
async buscarClientes() {
try {
const response = await fetch("http://localhost:3000/profile");
if (!response.ok) {
throw new Error(`Erro ao buscar clientes: ${response.statusText}`);
}
return response.json();
} catch (error) {
alert("Erro ao buscar cliente");
console.error(error); // Exibe o erro no console para depuração
throw error;
}
},
async criaCliente(nome, email) {
try {
const response = await fetch("http://localhost:3000/profile", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ nome, email }),
});
if (!response.ok) {
throw new Error(`Erro ao cadastrar cliente: ${response.statusText}`);
}
return await response.json();
} catch (error) {
alert("Erro ao cadastrar cliente");
console.error(error); // Exibe o erro no console para depuração
throw error;
}
}
};
const ui = {
async redenrizarClientes() {
const tabela = document.querySelector("[data-tabela]");
if (!tabela) return;
try {
const clientes = await api.buscarClientes();
tabela.innerHTML = "";
if (!Array.isArray(clientes) || clientes.length === 0) {
tabela.innerHTML = "<tr><td colspan='3'>Nenhum cliente encontrado.</td></tr>";
} else {
clientes.forEach(cliente => {
tabela.innerHTML += `
<tr>
<td class="td" data-td>${cliente.nome}</td>
<td>${cliente.email}</td>
<td>
<ul class="tabela__botoes-controle">
<li><a href="../telas/edita_cliente.html?id=${cliente.id}" class="botao-simples botao-simples--editar">Editar</a></li>
<li><button class="botao-simples botao-simples--excluir" data-id="${cliente.id}" type="button">Excluir</button></li>
</ul>
</td>
</tr>`;
});
}
} catch (error) {
alert("Erro ao carregar clientes.");
console.error(error); // Exibe o erro no console para depuração
}
}
};
document.addEventListener("DOMContentLoaded", async () => {
console.log("DOM completamente carregado!");
try {
// Buscar os clientes da API
const clientes = await api.buscarClientes();
// Verifique se há clientes na resposta
if (clientes && clientes.length > 0) {
const cliente = clientes[0]; // Exemplo de como pegar o primeiro cliente
// Preencher os campos com os dados
const nomeField = document.getElementById("nome")
const emailField = document.getElementById("email")
// Verifique se os campos existem antes de tentar modificar o valor
if (nomeField && emailField) {
nomeField.value = cliente.nome;
emailField.value = cliente.email;
} else {
console.error("Campos 'nome' e 'email' não encontrados no DOM.");
}
} else {
alert("Nenhum cliente encontrado.");
}
} catch (error) {
alert("Erro ao carregar os dados.");
console.error(error); // Exibe o erro no console para depuração
}
});
// Quando o DOM estiver carregado, carregue os dados
//document.addEventListener("DOMContentLoaded", async () => {
// try {
// const clientes = await api.buscarClientes();
// if (clientes && clientes.length > 0) {
// const cliente = clientes[0]; // Exemplo de como pegar o primeiro cliente
// document.getElementById("nome").value = cliente.nome;
// document.getElementById("email").value = cliente.email;
//} else {
// alert("Nenhum cliente encontrado.");
// }
//} catch (error) {
// alert("Erro ao carregar os dados.");
// console.error(error); // Exibe o erro no console para depuração
// }
//});
