Para começar…

Para começar baixe o arquivo do template product-detail.html e guarde no diretório ecommerce/views. Ao abrir o arquivo observe que o produtos exibidos estão ainda de modo estático como exemplo. Vamos modificar para que as informações sejam coletadas do banco de dados de modo dinâmico.

Primeiro acesse o arquivo site.php e acrescente a rota “products/:desurl” via get, $app->get(…)). Ele define uma rota para exibir os detalhes de um produto específico. Veja o exemplo a seguir:

PHP: site.php

Explicação detalhada linha por linha:

• L5 – $app->get(“/products/:desurl”, function($desurl){ … });: Esta linha define uma rota GET na aplicação.
  • /products/:desurl: é o padrão da URL que aciona esta rota.
  • /products/: é a parte estática da URL.
  • :desurl: é um parâmetro dinâmico, que representa a “URL descritiva” do produto. Por exemplo, /products/impressora-hp
  • :function($desurl){ … }: é uma função anônima que será executada quando esta rota for acessada. $desurl é o valor do parâmetro dinâmico, ou seja, “impressora-hp” no exemplo.
• L6 – $product = new Product();: Esta linha cria uma nova instância da classe Product. A classe Product representa um produto no sistema e contém métodos para recuperar e manipular informações do produto.
• L7 – $product->getFromURL($desurl);: Este método da classe Product é chamado para buscar as informações do produto no banco de dados, usando o valor de $desurl. A lógica dentro deste método inclui uma consulta ao banco de dados para encontrar o produto com a URL descritiva correspondente.
• L8 – $page = new Page();: Esta linha cria uma nova instância da classe Page. A classe Page é responsável por renderizar a página HTML que será exibida ao usuário.
• L9 – $page->setTpl(“product-detail”, [ … ]);: Este método da classe Page define o template (a estrutura HTML) que será usado para renderizar a página. O “product-detail” é o nome do arquivo de template. O segundo argumento é um array associativo que contém os dados que serão passados para o template.
• L10 – ‘product’ => $product->getValues(): Passa um array com os valores do produto (nome, descrição, preço, etc.) para o template.
• L11 – ‘categories’ => $product->getCategories(): Passa um array com as categorias do produto para o template.

Saída: A classe Page, ao ser renderizada, utilizará o template “product-detail” e os dados fornecidos para gerar a página HTML que será exibida no navegador do usuário.

Função getFromUrl()

Na linha 7 da rota “Detalhes do produto” a função getFromUrl() é acionada. Este método da classe Product é chamado para buscar as informações do produto no banco de dados, usando o valor de $desurl. Ela deve ser inserida dentro da classe Product. Veja como a seguir:

PHP: product.php (function getFromURL())

Veja a exeplicação linha por linha

• L5 – public function getFromURL($desurl):Esta é uma função pública, o que significa que pode ser chamada de qualquer lugar do código. Ela recebe um parâmetro $desurl, que representa uma URL amigável do produto.
• L7 – $sql = new Sql();: Uma nova instância da classe Sql é criada. Essa classe é responsável por interagir com o banco de dados.
• L8 – $rows = $sql->select(“SELECT * FROM tb_products WHERE desurl = :desurl LIMIT 1”, [‘:desurl’ => $desurl]);: A função select da classe Sql é chamada para executar uma consulta SQL.
  • A consulta SELECT * FROM tb_products WHERE desurl = :desurl LIMIT 1 busca todos os campos (*) da tabela tb_products onde a coluna desurl corresponde ao valor passado em $desurl.
  • O LIMIT 1: garante que apenas um registro seja retornado, mesmo que existam múltiplos registros correspondentes.
  • O segundo argumento para select é um array associativo que vincula o valor de ao parâmetro nomeado :desurl na consulta SQL, prevenindo injeção de SQL. O resultado da consulta é armazenado na variável $rows.
• L11 – $this->setData($rows[0]);: A função setData da classe atual é chamada, passando o primeiro elemento do array $rows (o registro do produto encontrado). A função setData é usada para definir os atributos do objeto atual com os dados do produto recuperados do banco de dados.

Neste ponto vamos verificar os links que estão relacionados aos nomes dos produtos estão funcionando. Acesse o arquivo index.html e altere a linha que contem o nome do produto para?

h2>a href=”/ecommerce/products/{$value.desurl}”>{$value.desproduct}/a>/h2>

Ao clicar no nome de um produto, o cliente é direcionado para a página de detalhes desse item, uma ação controlada por um link que aciona a rota de detalhes do produto. O conteúdo desta página é definido pelo template “product-detail”.

Além disso, os nomes dos produtos exibidos nas páginas de categorias, geradas pelo template “category.html”, também devem conter links que levam à mesma página de detalhes. Portanto, ambos os templates (“product-detail” e “category.html”) precisam ser configurados para garantir que os links funcionem corretamente e que as informações detalhadas do produto sejam exibidas de forma clara e completa para o cliente.

Para isso, o template “product-detail” deve ser editado seguindo a tabela de edição fornecida.

Exbição de categoriais no detalhes de produto.

Para a linha que indica as categorias em que o produto é relacionado temos em product-detail.html:

HTML: product-detail.html

Este código HTML é responsável por exibir as categorias associadas a um produto na página de detalhes do produto. Ele utiliza uma sintaxe de template, que sugere o uso de um motor de templates como o Smarty ou Twig, para inserir dados dinâmicos no HTML.

Análise do Código:

• L3 – <div class=”product-inner-category”>:
  Esta linha abre um elemento div com a classe CSS “product-inner-category”. Este div é usado para agrupar e estilizar as categorias do produto.
• L4 – <p>Categorias: {loop=”$categories”} … {/loop}</p>:
  Esta linha abre um elemento p (parágrafo) que exibe o texto “Categorias:”.
  • {loop=”$categories”} … {/loop}: é uma construção de loop do motor de templates.
  • $categories: é uma variável que contém um array de categorias, que foi passado da função da rota (como vimos anteriormente, $page->setTpl(“product-detail”, [ ‘categories’ => $product->getCategories() ]);). O código dentro do loop será executado para cada item (categoria) no array $categories.
  • < a href=”/ecommerce/category/{$value.idcategory}”>{$value.descategory}</a>:
    Esta linha cria um link () para a página da categoria. href=”/ecommerce/category/{$value.idcategory}” define o destino do link. /ecommerce/category/ é a parte estática da URL. {$value.idcategory} é um valor dinâmico, que é o ID da categoria atual no loop. O motor de template substitui isso pelo valor real do ID. {$value.descategory} é o texto do link, que é o nome (descrição) da categoria atual no loop. Novamente, o motor de template substitui isso pelo valor real. O ponto final fora do loop, dentro do elemento <p>, é usado para terminar o item “Categorias: …”.
• L5 – </div>:
  Esta linha fecha o elemento div que contém as categorias.

Análise do código linha por linha:

• L7 – $sql = new Sql();
  Esta linha cria uma nova instância da classe Sql. A classe Sql é uma classe personalizada que encapsula a lógica de conexão e execução de consultas SQL no banco de dados.
• L8 – return $sql->select(” … “, [ … ]);
  Esta linha chama o método select() da instância $sql e retorna o resultado da consulta. O método select() executa uma consulta SQL e retorna os resultados como um array associativo. Os dois argumentos passados para select() são: A string que contém a consulta SQL. Um array associativo que contém os parâmetros da consulta.
• L9 – SELECT * FROM tb_categories a INNER JOIN tb_categoriesproducts b ON a.idcategory = b.idcategory WHERE b.idproduct = :idproduct:
  • SELECT * FROM tb_categories a:
    Seleciona todas as colunas (*) da tabela tb_categories e a apelida de a.
  • INNER JOIN tb_categoriesproducts b ON a.idcategory = b.idcategory:
    Realiza um INNER JOIN (junção interna) com a tabela tb_categoriesproducts (apelidada de b). A junção é feita com base na condição a.idcategory = b.idcategory, ou seja, onde o idcategory em ambas as tabelas é igual. Isso relaciona as categorias com os produtos.
  • WHERE b.idproduct = :idproduct:
    Filtra os resultados para incluir apenas as categorias associadas ao produto com o idproduct especificado.
  • :idproduct: é um parâmetro nomeado.
• L11 – ‘:idproduct’ => $this->getidproduct():
  Este array associativo fornece os valores para os parâmetros nomeados na consulta SQL.
  • ‘:idproduct’
    é a chave, que corresponde ao parâmetro na consulta SQL.
  • $this->getidproduct()
    é o valor, que é obtido chamando o método getidproduct() da instância da classe Product. Este método retorna o ID do produto para o qual as categorias estão sendo buscadas.

Em resumo:
Este código executa uma consulta SQL que busca todas as categorias associadas a um produto específico. Ele faz isso usando um INNER JOIN entre as tabelas tb_categories e tb_categoriesproducts e filtra os resultados com base no idproduct do produto atual. A classe Sql é usada para simplificar a interação com o banco de dados, e os parâmetros da consulta são passados como um array associativo para evitar injeções de SQL.

Exibição da tela “Detalhes do Produto” proviniente do templete “Product-detail.html”.

Para Saber Mais…

• Classe Category.php