riseup-squad21/Squad-21/clinicApp/pages-visao-clinica/medicos/crud-medico.js

// document.addEventListener("DOMContentLoaded", () => {
//   const tabelaMedicos = document.getElementById("medicos-tabela");
//   const tbody = tabelaMedicos?.querySelector("tbody");
//   const searchInput = document.getElementById("search-input");
//   const filterType = document.getElementById("filter-type");
//   const searchButton = document.getElementById("search-button");

//   let pageAtual = 1;
//   const itensPorPagina = 10;
//   let carregando = false;
//   let buscaAtiva = false;
//   let termoBusca = "";
//   let tipoBusca = "geral";

//   const renderizarLote = (medicos) => {
//     medicos.forEach((medico) => {
//       const row = document.createElement("tr");
//       row.innerHTML = `
//         <td>${medico.nome || "-"}</td>
//         <td>${medico.telefone || "-"}</td>
//         <td>${medico.cpf || "-"}</td>
//         <td>${medico.status || "-"}</td>
//         <td>
//           <button class="btn btn-edit" data-id="${medico.id}">Editar</button>
//           <button class="btn btn-detail" data-id="${medico.id}">Detalhes</button>
//           <button class="btn btn-delete" data-id="${medico.id}">Excluir</button>
//         </td>
//       `;
//       tbody.appendChild(row);
//     });

//     adicionarEventos();
//   };

//   const carregarMedicosDaAPI = async () => {
//     if (carregando) return;
//     carregando = true;

//     try {
//       const response = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes?page=${pageAtual}&limit=${itensPorPagina}`);
//       const json = await response.json();
//       const novosMedicos = Array.isArray(json.data) ? json.data : [];

//       console.log(novosMedicos)

//       if (buscaAtiva && termoBusca.trim()) {
//         const termo = termoBusca.toLowerCase();
//         const filtrados = novosMedicos.filter((medico) => {
//           if (tipoBusca === "geral") {
//             return (
//               (medico.nome || "").toLowerCase().includes(termo) ||
//               (medico.telefone || "").toLowerCase().includes(termo) ||
//               (medico.status || "").toLowerCase().includes(termo) ||
//               (medico.email || "").toLowerCase().includes(termo) ||
//               (medico.cpf || "").toLowerCase().includes(termo)
//             );
//           } else {
//             return (medico[tipoBusca] || "").toLowerCase().includes(termo);
//           }
//         });

//         renderizarLote(filtrados);
//       } else {
//         renderizarLote(novosMedicos);
//       }

//       pageAtual++;
//     } catch (error) {
//       console.error("Erro ao carregar médicos da API:", error);
//     } finally {
//       carregando = false;
//     }
//   };

//   const aplicarFiltro = () => {
//     tbody.innerHTML = "";
//     pageAtual = 1;
//     buscaAtiva = true;
//     termoBusca = searchInput.value;
//     tipoBusca = filterType.value;
//     carregarMedicosDaAPI();
//   };

//   const adicionarEventos = () => {
//     document.querySelectorAll(".btn-edit").forEach((btn) => {
//       btn.addEventListener("click", (e) => {
//         const id = e.target.dataset.id;
//         window.location.href = `addMedico/addMedico.html?id=${id}`;
//       });
//     });

//     document.querySelectorAll(".btn-detail").forEach((btn) => {
//       btn.addEventListener("click", (e) => {
//         const id = e.target.dataset.id;
//         window.location.href = `addMedico/addMedico.html?mode=detalhes&id=${id}`;
//       });
//     });

//     document.querySelectorAll(".btn-delete").forEach((btn) => {
//       btn.addEventListener("click", async (e) => {
//         const id = e.target.dataset.id;
//         const confirmar = confirm("Tem certeza que deseja excluir este médico?");
//         if (!confirmar) return;

//         try {
//           const response = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${id}`, {
//             method: "DELETE"
//           });

//           if (response.ok) {
//             e.target.closest("tr").remove();
//             alert("Médico excluído com sucesso.");
//           } else {
//             alert("Erro ao excluir médico.");
//           }
//         } catch (error) {
//           console.error("Erro na exclusão:", error);
//           alert("Erro ao excluir médico.");
//         }
//       });
//     });
//   };

//   window.addEventListener("scroll", () => {
//     const { scrollTop, scrollHeight, clientHeight } = document.documentElement;
//     if (scrollTop + clientHeight >= scrollHeight - 5) {
//       carregarMedicosDaAPI();
//     }
//   });

//   searchButton.addEventListener("click", aplicarFiltro);
//   searchInput.addEventListener("keyup", (e) => {
//     if (e.key === "Enter") aplicarFiltro();
//   });

//   carregarMedicosDaAPI();
// });

document.addEventListener("DOMContentLoaded", () => {
  const tabelaMedicos = document.getElementById("medicos-tabela");
  const tbody = tabelaMedicos?.querySelector("tbody");
  const searchInput = document.getElementById("search-input");
  const filterType = document.getElementById("filter-type");
  const searchButton = document.getElementById("search-button");

  const token = "<token>"; // 🔐 Substitua pelo seu token real
  let pageAtual = 1;
  const itensPorPagina = 10;
  let carregando = false;
  let buscaAtiva = false;
  let termoBusca = "";
  let tipoBusca = "geral";

  const renderizarLote = (medicos) => {
    medicos.forEach((medico) => {
      const row = document.createElement("tr");
      row.innerHTML = `
        <td>${medico.nome || "-"}</td>
        <td>${medico.telefone || "-"}</td>
        <td>${medico.cpf || "-"}</td>
        <td>${medico.status || "-"}</td>
        <td>
          <button class="btn btn-edit" data-id="${medico.id}">Editar</button>
          <button class="btn btn-detail" data-id="${medico.id}">Detalhes</button>
          <button class="btn btn-delete" data-id="${medico.id}">Excluir</button>
        </td>
      `;
      tbody.appendChild(row);
    });

    adicionarEventos();
  };

  const carregarMedicosDaAPI = async () => {
    if (carregando) return;
    carregando = true;

    try {
      const response = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes?page=${pageAtual}&limit=${itensPorPagina}`);
      const json = await response.json();
      const novosMedicos = Array.isArray(json.data) ? json.data : [];

      if (buscaAtiva && termoBusca.trim()) {
        const termo = termoBusca.toLowerCase();
        const filtrados = novosMedicos.filter((medico) => {
          if (tipoBusca === "geral") {
            return (
              (medico.nome || "").toLowerCase().includes(termo) ||
              (medico.telefone || "").toLowerCase().includes(termo) ||
              (medico.status || "").toLowerCase().includes(termo) ||
              (medico.email || "").toLowerCase().includes(termo) ||
              (medico.cpf || "").toLowerCase().includes(termo)
            );
          } else {
            return (medico[tipoBusca] || "").toLowerCase().includes(termo);
          }
        });

        renderizarLote(filtrados);
      } else {
        renderizarLote(novosMedicos);
      }

      pageAtual++;
    } catch (error) {
      console.error("Erro ao carregar médicos da API:", error);
    } finally {
      carregando = false;
    }
  };

  const aplicarFiltro = () => {
    tbody.innerHTML = "";
    pageAtual = 1;
    buscaAtiva = true;
    termoBusca = searchInput.value;
    tipoBusca = filterType.value;
    carregarMedicosDaAPI();
  };

  // const adicionarEventos = () => {
  //   document.querySelectorAll(".btn-edit").forEach((btn) => {
  //     btn.addEventListener("click", (e) => {
  //       const id = e.target.dataset.id;
  //       window.location.href = `addMedico/addMedico.html?id=${id}`;
  //     });
  //   });

  //   document.querySelectorAll(".btn-detail").forEach((btn) => {
  //     btn.addEventListener("click", (e) => {
  //       const id = e.target.dataset.id;
  //       window.location.href = `addMedico/addMedico.html?mode=detalhes&id=${id}`;
  //     });
  //   });

  //   document.querySelectorAll(".btn-delete").forEach((btn) => {
  //     btn.addEventListener("click", async (e) => {
  //       const id = e.target.dataset.id;
  //       const confirmar = confirm("Tem certeza que deseja excluir este médico?");
  //       if (!confirmar) return;

  //       const myHeaders = new Headers();
  //       myHeaders.append("Authorization", `Bearer ${token}`);

  //       const requestOptions = {
  //         method: "DELETE",
  //         headers: myHeaders,
  //         redirect: "follow"
  //       };

  //       try {
  //         const response = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${id}`, requestOptions);
  //         if (response.ok) {
  //           e.target.closest("tr").remove();
  //           alert("Médico excluído com sucesso.");
  //         } else {
  //           alert("Erro ao excluir médico. Código: " + response.status);
  //         }
  //       } catch (error) {
  //         console.error("Erro na exclusão:", error);
  //         alert("Erro ao excluir médico.");
  //       }
  //     });
  //   });
  // };

  const adicionarEventos = () => {
    tbody.addEventListener("click", async (e) => {
      const btn = e.target;
      const id = btn.dataset.id;

      if (btn.classList.contains("btn-edit")) {
        window.location.href = `addMedico/addMedico.html?id=${id}`;
      }

      if (btn.classList.contains("btn-detail")) {
        window.location.href = `addMedico/addMedico.html?mode=detalhes&id=${id}`;
      }

      if (btn.classList.contains("btn-delete")) {
        if (btn.disabled) return; // evita múltiplos cliques
        const confirmar = confirm("Tem certeza que deseja excluir este médico?");
        if (!confirmar) return;

        btn.disabled = true;
        btn.textContent = "Excluindo...";

        const myHeaders = new Headers();
        myHeaders.append("Authorization", "Bearer <token>");

        const requestOptions = {
          method: "DELETE",
          headers: myHeaders,
          redirect: "follow"
        };

        try {
          const response = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${id}`, requestOptions);
          if (response.ok) {
            btn.closest("tr").remove();
            alert("Médico excluído com sucesso.");
          } else {
            alert("Erro ao excluir médico. Código: " + response.status);
          }
        } catch (error) {
          console.error("Erro na exclusão:", error);
          alert("Erro ao excluir médico.");
        } finally {
          btn.disabled = false;
          btn.textContent = "Excluir";
        }
      }
    });
  };

  window.addEventListener("scroll", () => {
    const { scrollTop, scrollHeight, clientHeight } = document.documentElement;
    if (scrollTop + clientHeight >= scrollHeight - 5) {
      carregarMedicosDaAPI();
    }
  });

  searchButton.addEventListener("click", aplicarFiltro);
  searchInput.addEventListener("keyup", (e) => {
    if (e.key === "Enter") aplicarFiltro();
  });

  carregarMedicosDaAPI();
});