Pular para o conteúdo
Categorias · Aplicações de Front-End

Twig Extension: f2_variant_list

Atualizado em

Esta twig extension tem o propósito de trazer uma listagem de produtos filtrada a partir dos parâmetros atribuídos a ela, esta deve funcionar em todas as partes do front-end.

Através dela é possível iterar até chegar ao objeto VariantDto, que é usado na construção do front de cada Variant de produto no arquivo: FlexyFtwoStoreBundle:Include:variant.html.twig

Para criar cada um destes itens, são usados os atributos de cada VariantDto:

Imagem do produto: variant.product.masterImage

Nome do item: variant.product.name

Preço final do item: variant.finalPrice

Parâmetros recomendados:

  • useSearchParameter

  • page [REQUIRED]

  • itemsPerPage [REQUIRED]

  • sortOrder

  • filter

  • shoppingStoreReferenceCode

  • category

  • showCustomVariants

  • showOnlyAvailable

  • showDescriptions

Para utilizar o Twig f2_variant_list é necessário que seguir este padrão:

f2_variant_list({
   parâmetro: 'valor',
})

Não é obrigatório enviar os parâmetros, porém isso trará produtos em ordem aleatória.

Parâmetros padrões quando não enviado nem um parâmetro:

  • useSearchParameter: true

  • page: 1

  • itemsPerPage: 15

  • sortOrder: category-asc

  • filter: null

  • showCustomVariants: true

  • shoppingStoreReferenceCode: null

  • category: { referenceCode: null, isShopping: null }

Retorno exemplo da função e caminho até o VariantDto :

{% set filters = {
      useSearchParameters: true,
      page: 5,
      itemsPerPage: 9, 
      sortOrder: 'name-asc' } % }  
{% set result = f2_variant_list(filters) %}

useSearchParameters: Este parâmetro é obrigatório para poder usar os parâmetros recomendados, ele foi criado pois temos que manter a compatibilidade com os parâmetros antigos.

Se este parâmetro não estiver sendo mandado ou estiver sendo mandado com valor 'false', o sistema irá ignorar parâmetros enviados, mesmo se mandados.

f2_variant_list( {
   useSearchParameters: true,
    //Outros parâmetros...
})

page: É utilizado para indicar a partir de qual página deve iniciar a busca.

Se a paginação ainda estiver ativa na pagina, o paginador mostrará que essa pesquisa de produtos se encontra na pagina escolhida por esse parâmetro.

Com o código padrão da Flexy o código pega a página atual na qual o usuário estiver (quando passada pela URL), porém pode ser uma página fixa dependendo da necessidade do cliente apenas adicionando o numero da página desejada.

f2_variant_list({
  useSearchParameters: true,
  page: app.request.get('page', 1),
})

itemsPerPage: É utilizado para definir a quantidade de produtos que devem ser trazidos por página.

O máximo de produtos por página é 100, se for mandado algum valor inválido ou acima do limite máximo a busca de produtos retornará vazia.

OBS: “itemsPerPage”(é necessário também enviar o parâmetro “page” junto ao “itemsPerPage“):

f2_variant_list({
   useSearchParameters: true,
   itemsPerPage: app.request.get('itemsPerPage', 12)
})

Esperamos que este material possa ter auxiliado no seu uso à plataforma Flexy, no entanto, caso ainda hajam dúvidas ou necessidades, por favor, entre em contato com nossa equipe de atendimento, que terá prazer em auxiliá-lo.