Cursos / Informática para Internet / Plataformas de aplicações Web / Aula

arrow_back Aula 11 - PetTopStore - Admin - Parte 3 (API)

Adicionar lista de vendas no Admin

Já que nossa API está pronta no projeto do admin, vamos criar como bônus uma listagem de vendas no admin.

Para isso você precisa inicialmente criar o arquivo routes/sales.js com o conteúdo:

const express = require('express');
const router = express.Router();
const knexConfig = require('../knexfile');
const knex = require('knex')(knexConfig);

router.get('/report', async(req, res) => {
  // obtem todas as vendas do banco de dados
  const sales = await knex.table('sales');

  // para cada venda obtida
  for (const sale of sales) {
    // adiciona os items da venda no objeto
    sale.items = await knex.table('items').where('sale_id', '=', sale.id);
    if (sale.employee_id !== null) {
      // caso existe um funcionário, buscar ele do banco e adiciona no objeto
      sale.employee = await knex.table('employees').where('id', '=', sale.employee_id).first();
    }
    if (sale.client_id !== null) {
      // caso existe um cliente, buscar ele do banco e adiciona no objeto
      sale.client = await knex.table('clients').where('id', '=', sale.client_id).first();
    }

    for (const item of sale.items) {
      // para cada item da venda adicionar no item o produto que ele se referencia
      item.product = await knex.table('products').where('id', '=', item.product_id).first();
    }
  }

  // renderizar o relatório de vendas passando a lista de vendas (sales)
  res.render('sales/report', { sales });
});

module.exports = router;

Existe somente uma rota nesse arquivo "/report" que vai buscar todas as vendas(sales) e adicionar nelas as suas relações com clients, employee, items e products através de outras consultas. Repare que os comentários no código retalham o processo.

Depois adicione em routes/index.js essa nova rota de sales, deixando o arquivo assim:

var express = require('express');
var router = express.Router();
var productsRouter = require('./products');
var salesRouter = require('./sales');

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', {
    title: 'Pet Top Store',
    employee: res.locals.employee
  });
});

router.use('/products', productsRouter);
router.use('/sales', salesRouter);

module.exports = router;

Crie a pasta views/sales e nela adicione o arquivo report.ejs com o seguinte conteúdo:

<h1>Relatório de vendas</h1>
<a href="/">Voltar</a>
<% for (const sale of sales) { %>
<div style="border: 1px solid gray; margin-bottom: 10px">
  <% if (sale.employee_id) { %>
    Funcionário: <%= sale.employee.name %><br/>
  <% } %>
  <% if (sale.client_id) { %>
    Cliente: <%= sale.client.name %><br/>
  <% } %>
  Items:
  <ul>
    <% for (const item of sale.items) { %>
      <li><%= item.product.name %></li>
    <% } %>
  </ul>
</div>
<% } %>

Crie um link para a listagem de vendas que criamos em views/index.ejs, deixando arquivo assim:

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
    <p>Logado como <%= employee.name %></p>
    <p>
      <a href="/auth/sign_out">Sair do sistema</a>
    </p>
    <a>
      <a href="/products">Gerenciar produtos</a>
    </a>
    |
    <a>
      <a href="/sales/report">Listagem de vendas</a>
    </a>
  </body>
</html>

Pronto. Agora você, logado como um administrador no admin pode ir para "http://localhost:3000/sales/report" (ou clicar em "Listagem de vendas") para ver uma simples listagem de todas as vendas criadas pela API, com o funcionário que a realizou, o cliente e os produtos da venda. A listagem deve ficar similar a essa: Descrição imagem


Versão 5.3 - Todos os Direitos reservados