Renan Pereira
Renan Pereira04/11/2024 16:52
Compartilhe

Dá série Chat GPT não faz tudo, mas faz muito kkk

    Boa tarde galera!

    Bom, é inevitável nos livrarmos das inúmeras IA's que temos hoje, e claro que fazer uso não é nenhum pecado, pois as vezes precisamos criar algo rapidamente para ajudar no dia a dia, e foi isso que eu fiz. Segue exatamente como solicitei a ele:

    Preciso de um sistema em html, que controle minhas compras aqui na empresa. Quero poder escrever o item que foi pedido orçamento, qual empresa, valor e condição de pagamento, e quando sera entregue. Não só isso, inserir quando será a proxima compra. Quero que seja um sistema com campos a serem preenchidos e no final de tudo, gero um relatório em XLSX que será salvo localmente, para pasta download do google chrome.

    Olha que top ficou:

    image

    Segue codigo em html:

    <!DOCTYPE html>

    <html lang="pt-BR">

    <head>

      <meta charset="UTF-8">

      <meta name="viewport" content="width=device-width, initial-scale=1.0">

      <title>Controle de Compras</title>

      <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js"></script>

      <style>

        body { font-family: Arial, sans-serif; margin: 20px; }

        form { margin-bottom: 20px; }

        label { display: block; margin: 10px 0 5px; }

        input, select { padding: 8px; width: 100%; max-width: 300px; }

        table { width: 100%; border-collapse: collapse; margin-top: 20px; }

        th, td { padding: 10px; border: 1px solid #ddd; text-align: left; }

        th { background-color: #f4f4f4; }

      </style>

    </head>

    <body>

    <h1>Controle de Compras</h1>

    <form id="compraForm">

      <label>Item</label>

      <input type="text" id="item" required>

      <label>Empresa</label>

      <input type="text" id="empresa" required>

      <label>Valor (R$)</label>

      <input type="number" id="valor" required>

      <label>Condição de Pagamento</label>

      <input type="text" id="condicaoPagamento" required>

      <label>Data de Entrega</label>

      <input type="date" id="dataEntrega" required>

      <label>Próxima Compra</label>

      <input type="date" id="proximaCompra">

      <button type="button" onclick="adicionarCompra()">Adicionar Compra</button>

    </form>

    <table id="tabelaCompras">

      <thead>

        <tr>

          <th>Item</th>

          <th>Empresa</th>

          <th>Valor (R$)</th>

          <th>Condição de Pagamento</th>

          <th>Data de Entrega</th>

          <th>Próxima Compra</th>

        </tr>

      </thead>

      <tbody></tbody>

    </table>

    <button onclick="gerarRelatorio()">Gerar Relatório em XLSX</button>

    <script>

      const compras = [];

      function adicionarCompra() {

        const item = document.getElementById("item").value;

        const empresa = document.getElementById("empresa").value;

        const valor = document.getElementById("valor").value;

        const condicaoPagamento = document.getElementById("condicaoPagamento").value;

        const dataEntrega = document.getElementById("dataEntrega").value;

        const proximaCompra = document.getElementById("proximaCompra").value;

        const compra = { item, empresa, valor, condicaoPagamento, dataEntrega, proximaCompra };

        compras.push(compra);

        atualizarTabela();

        document.getElementById("compraForm").reset();

      }

      function atualizarTabela() {

        const tbody = document.getElementById("tabelaCompras").querySelector("tbody");

        tbody.innerHTML = "";

        compras.forEach((compra, index) => {

          const row = tbody.insertRow();

          row.insertCell(0).textContent = compra.item;

          row.insertCell(1).textContent = compra.empresa;

          row.insertCell(2).textContent = compra.valor;

          row.insertCell(3).textContent = compra.condicaoPagamento;

          row.insertCell(4).textContent = compra.dataEntrega;

          row.insertCell(5).textContent = compra.proximaCompra;

        });

      }

      function gerarRelatorio() {

        const ws_data = [

          ["Item", "Empresa", "Valor (R$)", "Condição de Pagamento", "Data de Entrega", "Próxima Compra"],

          ...compras.map(compra => [compra.item, compra.empresa, compra.valor, compra.condicaoPagamento, compra.dataEntrega, compra.proximaCompra])

        ];

        const wb = XLSX.utils.book_new();

        const ws = XLSX.utils.aoa_to_sheet(ws_data);

        XLSX.utils.book_append_sheet(wb, ws, "Compras");

        XLSX.writeFile(wb, "Relatorio_Compras.xlsx");

      }

    </script>

    </body>

    </html>

    Compartilhe
    Comentários (2)

    BA

    Brenda Araujo - 04/11/2024 22:03

    Quero aprender isso tbm

    BA

    Brenda Araujo - 04/11/2024 22:03

    Que massa Renato! 👏👏👏👏