Task 6679 | Доработал подробную страницу товара + вывел таблицу с рекомендациями через отдельный тип записями

dev_10_refactoring
Your Name 2 months ago
parent 830948cf05
commit 0253ba2472
  1. 6
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-desktop.css
  2. 155
      wp-content/themes/cosmopet/modules/shop/components/single-product/component-controller.php
  3. 384
      wp-content/themes/cosmopet/modules/shop/components/single-product/component-template.twig

@ -872,6 +872,12 @@ main{
display: flex;
align-items: center;
}
.detail__label-wrap {
display: flex;
flex-wrap: wrap;
gap: 5px;
align-items: center;
}
.detail__label .product-item-label__tag:last-child{
margin-left: auto;
}

@ -1,74 +1,105 @@
<?php
// add_filter('timber/context', function($context) {
// $context['test'] = 111111111;
// return $context;
// });
add_filter('timber/context', function($context) {
if (function_exists('is_product') && is_product()) {
$product_id = get_the_ID();
$product = wc_get_product($product_id);
if ($product) {
$attributes = [];
$product_attributes = $product->get_attributes();
if (!empty($product_attributes)) {
foreach ($product_attributes as $taxonomy => $attribute) {
if ($attribute->is_taxonomy()) {
$terms = wc_get_product_terms($product_id, $taxonomy, ['fields' => 'all']);
if (!empty($terms)) {
$attr_values = [];
foreach ($terms as $term) {
$attr_values[] = [
'name' => $term->name,
'slug' => $term->slug,
'term_id' => $term->term_id,
'link' => get_term_link($term->term_id, $taxonomy),
];
}
$attributes[wc_attribute_label($taxonomy)] = $attr_values;
}
} else {
$attributes[wc_attribute_label($taxonomy)] = $attribute->get_options();
}
}
}
$context['product_attributes'] = $attributes;
if ($product->is_type('variable')) {
$available_variations = $product->get_available_variations();
$variations_data = [];
// $product->is_type('variable')
$product;
$product_type;
$context_for_twig;
if (function_exists('is_product') && is_product()) {
$product_id = get_the_ID();
$product = wc_get_product($product_id);
$attributes = [];
$product_attributes = $product->get_attributes();
/* Получение категорий */
$tags = get_the_terms($product_id, 'product_cat');
if (!empty($tags) && !is_wp_error($tags)) {
foreach ($tags as $tag) {
$context_for_twig['product_tags'][] = $tag->name;
}
}
/* Получение атрибутов */
if (!empty($product_attributes)) {
foreach ($product_attributes as $taxonomy => $attribute) {
if ($attribute->is_taxonomy()) {
$terms = wc_get_product_terms($product_id, $taxonomy, ['fields' => 'all']);
// $tags = wc_get_product_terms( $product_id, 'pa_catalog_tags' );
foreach ($available_variations as $variation) {
$variation_id = $variation['variation_id'];
$variation_obj = wc_get_product($variation_id);
$variations_data[] = [
'variation_id' => $variation_id,
'price' => $variation_obj->get_price(),
'regular_price' => $variation_obj->get_regular_price(),
'sale_price' => $variation_obj->get_sale_price(),
'attributes' => $variation['attributes']
];
if (!empty($terms)) {
$attr_values = [];
foreach ($terms as $term) {
$attr_values[] = [
'name' => $term->name,
'slug' => $term->slug,
'term_id' => $term->term_id,
'link' => get_term_link($term->term_id, $taxonomy),
];
}
$attributes[wc_attribute_label($taxonomy)] = $attr_values;
if ($_GET["gp-test"]) {
// ?gp-test=1
echo '<pre>';
print_r($attr_values);
echo '</pre>';
}
}
$context['variations'] = $variations_data;
} else {
$attributes[wc_attribute_label($taxonomy)] = $attribute->get_options();
}
$meta_fields = [
'composition' => get_post_meta($product_id, '_composition', true),
'feeding_recommendations' => get_post_meta($product_id, '_feeding_recommendations', true),
'feeding_recommendations_table' => get_field('feeding_recommendations_table', $product_id),
}
}
$context_for_twig['product_attributes'] = $attributes;
'nutritional_value' => get_post_meta($product_id, '_nutritional_value', true),
'vitamins' => get_post_meta($product_id, '_vitamins', true),
'additives' => get_post_meta($product_id, '_additives', true),
'energy_value' => get_post_meta($product_id, '_energy_value', true),
'important' => get_post_meta($product_id, '_important', true),
];
/* Получение вариаций товара */
if ($product->is_type('variable')) {
$available_variations = $product->get_available_variations();
$variations_data = [];
foreach ($available_variations as $variation) {
$variation_id = $variation['variation_id'];
$variation_obj = wc_get_product($variation_id);
$context['product_meta'] = $meta_fields;
$variations_data[] = [
'variation_id' => $variation_id,
'price' => $variation_obj->get_price(),
'regular_price' => $variation_obj->get_regular_price(),
'sale_price' => $variation_obj->get_sale_price(),
'attributes' => $variation['attributes']
];
}
$context_for_twig['variations'] = $variations_data;
}
/* ACF-поля и мета-данные продукта */
$meta_fields = [
'composition' => get_post_meta($product_id, '_composition', true),
'feeding_recommendations' => get_post_meta($product_id, '_feeding_recommendations', true), // Ранее выводились HTML-полем «Рекомендации по кормлению»
'feeding_recommendations_table' => get_field('feeding_recommendations_table', get_post(get_field('p_tables_field', $product_id))) , // Таблица «Рекомендации по кормлению»
'nutritional_value' => get_post_meta($product_id, '_nutritional_value', true),
'vitamins' => get_post_meta($product_id, '_vitamins', true),
'additives' => get_post_meta($product_id, '_additives', true),
'energy_value' => get_post_meta($product_id, '_energy_value', true),
'important' => get_post_meta($product_id, '_important', true),
];
return $context;
});
$context_for_twig['product_meta'] = $meta_fields;
/* Товар оформляется по подписке? */
$context_for_twig['is_subscription'] = $product->is_type( array( 'subscription', 'subscription_variation', 'variable-subscription' )) ? true : false;
}
add_filter('timber/context', function ($context) use ($context_for_twig) {
return array_merge($context, $context_for_twig);
});

@ -1,13 +1,10 @@
{% set current_path = template_path ~ '/modules/shop/components/single-product' %}
{% set bodyClass = 'bg-white' %}
{% set mainClass = 'wrapper' %}
{% extends 'layout.twig' %}
{% set bodyClass = 'bg-white' %}
{% set mainClass = 'wrapper' %}
{% extends 'layout.twig' %}
{% block content %}
<div class="wrapper">
{% block content %}
<div class="wrapper">
<div class="breadcrumbs">
{% if wc_breadcrumbs %}
{% for crumb in wc_breadcrumbs %}
@ -33,29 +30,41 @@
</div>
<div class="detail__content">
{# Start | Теги = категории #}
<div class="detail__label">
{% if product_attributes.Flavor is defined and product_attributes.Flavor|length > 0 %}
<div class="detail__label-wrap">
{% for tag in product_tags %}
<div class="product-item-label__tag product-item-label__tag--black">
{{ tag }}
</div>
{% endfor %}
{% if product_attributes.Flavor is defined and product_attributes.Flavor|length > 0 %}
<div class="product-item-label__tag product-item-label__tag--black">
{{ product_attributes.Flavor[0].name }}
</div>
{% endif %}
{% if product_attributes.Вкус is defined and product_attributes.Вкус|length > 0 %}
<div class="product-item-label__tag product-item-label__tag--black">
{{ product_attributes.Flavor[0].name }}
<a href="{{ product_attributes.Вкус[0].link }}">{{ product_attributes.Вкус[0].name }}</a>
</div>
{% endif %}
{% if product_attributes.Вкус is defined and product_attributes.Вкус|length > 0 %}
<div class="product-item-label__tag product-item-label__tag--black">
<a href="{{ product_attributes.Вкус[0].link }}">{{ product_attributes.Вкус[0].name }}</a>
</div>
{% endif %}
{% endif %}
{% if product_attributes.Тег is defined and product_attributes.Тег|length > 0 %}
<div class="product-item-label__tag product-item-label__tag--title">
<a href="{{ product_attributes.Тег[0].link }}">{{ product_attributes.Тег[0].name }}</a>
</div>
{% if product_attributes.Тег is defined and product_attributes.Тег|length > 0 %}
<div class="product-item-label__tag product-item-label__tag--title">
<a href="{{ product_attributes.Тег[0].link }}">{{ product_attributes.Тег[0].name }}</a>
</div>
{% endif %}
{% if is_subscription %}
<div class="product-item-label__tag product-item-label__tag--sale">
{{ function('pll_e', 'Распродажа %') }}
</div>
{% endif %}
{% if product.is_on_sale() %}
<div class="product-item-label__tag product-item-label__tag--sale">
{{ function('pll_e', 'Распродажа %') }}
</div>
{% endif %}
</div>
</div>
{# End | Теги = категории #}
<h1 class="detail__title">
{{ product.get_title }}
</h1>
@ -73,22 +82,32 @@
<div class="swiper-pagination"></div>
</div>
<div class="detail__block-price">
<p class="detail-block-price__price">
{{ product.get_price }} {{ fn('get_woocommerce_currency_symbol') }}
</p>
{% if product.is_on_sale() %}
<div class="detail-block-price__sale">
<p class="detail-block-price-sale__text">
{{ product.get_regular_price }} {{ fn('get_woocommerce_currency_symbol') }}
</p>
<p class="detail-block-price-sale__perc">
{{ ((product.get_regular_price - product.get_price) / product.get_regular_price * 100)|round }}
{# Start | Цена для неподписочного товара #}
{% if product.get_price %}
<div class="detail__block-price">
{% if is_subscription %}
{% if product.get_regular_price %}
<div class="detail-block-price__sale">
<p class="detail-block-price-sale__text">
{{ product.get_regular_price }} {{ fn('get_woocommerce_currency_symbol') }}
</p>
<p class="detail-block-price-sale__perc">
{{ ((product.get_regular_price - product.get_price) / product.get_regular_price * 100)|round }}
</p>
</div>
{% else %}
не задана цена по подписке
{% endif %}
{% else %}
<p class="detail-block-price__price">
{{ product.get_price }} {{ fn('get_woocommerce_currency_symbol') }}
</p>
</div>
{% endif %}
</div>
{% endif %}
</div>
{% endif %}
{# End | Цена для неподписочного товара #}
{# Start | Кнопка добавить в корзину + варинанты подписки на товар #}
<form action="" class="detail-block__form" data-product-id="{{ product.id }}">
{% set collection = fn('wc_get_product_terms', product.id, 'pa_collection') %}
{% if collection %}
@ -113,11 +132,14 @@
</div>
{% endif %}
{% endif %}
</form>
{{ function('do_action', 'woocommerce_' ~ product.get_type() ~ '_add_to_cart') }}
{# End | Кнопка добавить в корзину + варинанты подписки на товар #}
{# Start | Табы с информацией #}
<div class="detail__toggle">
{# Start | Описание товара #}
<div class="toggle">
<p class="toggle__title">
{{ function('pll_e', 'ОПИСАНИЕ') }}
@ -130,7 +152,9 @@
</div>
</div>
</div>
{# End | Описание товара #}
{# Start | Состав товара #}
{% if product_meta.composition %}
<div class="toggle">
<p class="toggle__title">
@ -145,7 +169,9 @@
</div>
</div>
{% endif %}
{# End | Состав товара #}
{# Start | Рекомендации по кормлению #}
{% if product_meta.feeding_recommendations_table %}
<div class="toggle">
<p class="toggle__title">
@ -198,7 +224,8 @@
</div>
</div>
{% endif %}
{# End | Рекомендации по кормлению #}
{% if product_meta.nutritional_value or product_meta.vitamins or product_meta.additives or product_meta.energy_value %}
<div class="toggle">
<p class="toggle__title">
@ -246,10 +273,8 @@
</div>
</div>
{% endif %}
</div>
{# End | Табы с информацией #}
<div class="detail__warning">
<div class="detail-warning__content">
@ -259,156 +284,159 @@
</p>
</div>
</div>
</div>
<div class="product__main">
{% set recommended_products = function('get_field', 'recommended_products', product.id) %}
{% set related_products = recommended_products ? recommended_products : function('wc_get_related_products', product.id, 4) %}
{% if related_products %}
<div class="detail__wrapper-catalot">
<div class="detail__catalot">
<div class="detail-catalot__header">
<p class="detail-catalot__title">
{{ function('pll_e', 'вашему питомцу может понравиться') }}
</p>
<div class="detail-catalot__control">
<button class="detail-catalot-control__button prev">
<img src="{{ theme.uri }}/static/shop/img/svg/main/arrow-left.svg" alt="">
</button>
<div class="product__main">
{% set recommended_products = function('get_field', 'recommended_products', product.id) %}
{% set related_products = recommended_products ? recommended_products : function('wc_get_related_products', product.id, 4) %}
{% if related_products %}
<div class="detail__wrapper-catalot">
<div class="detail__catalot">
<div class="detail-catalot__header">
<p class="detail-catalot__title">
{{ function('pll_e', 'вашему питомцу может понравиться') }}
</p>
<div class="detail-catalot__control">
<button class="detail-catalot-control__button prev">
<img src="{{ theme.uri }}/static/shop/img/svg/main/arrow-left.svg" alt="">
</button>
<button class="detail-catalot-control__button next">
<img src="{{ theme.uri }}/static/shop/img/svg/main/arrow-right.svg" alt="">
</button>
<button class="detail-catalot-control__button next">
<img src="{{ theme.uri }}/static/shop/img/svg/main/arrow-right.svg" alt="">
</button>
</div>
</div>
</div>
<div class="detail-catalot__content swiper-wrapper">
{% for related_product in related_products %}
<div class="swiper-slide">
{% set post_id = related_product.ID is defined ? related_product.ID : related_product %}
{% set wc_product = fn('wc_get_product', post_id) %}
{% if wc_product %}
<div class="product__item">
<div class="product-item__label">
{% if wc_product.get_date_created|date('Y-m-d') >= criteria_for_new_product %}
<span href="#" class="product-item-label__tag product-item-label__tag--new">
{{ function('pll_e', 'Новинка') }}
</span>
{% endif %}
<div class="detail-catalot__content swiper-wrapper">
{% for related_product in related_products %}
<div class="swiper-slide">
{% set post_id = related_product.ID is defined ? related_product.ID : related_product %}
{% set wc_product = fn('wc_get_product', post_id) %}
{% if wc_product %}
<div class="product__item">
<div class="product-item__label">
{% if wc_product.get_date_created|date('Y-m-d') >= criteria_for_new_product %}
<span href="#" class="product-item-label__tag product-item-label__tag--new">
{{ function('pll_e', 'Новинка') }}
</span>
{% endif %}
{% if wc_product.is_on_sale() %}
<span href="#" class="product-item-label__tag product-item-label__tag--sale">
{{ function('pll_e', 'Распродажа %') }}
</span>
{% endif %}
</div>
<a href="{{ wc_product.get_permalink() }}" class="product-item__product-card">
<img src="{{ fn('wp_get_attachment_url', wc_product.get_image_id()) }}" alt="{{ wc_product.get_name() }}" class="product-item__images">
</a>
<div class="product-item__content-card">
<div class="compound">
{% set compound = fn('wc_get_product_terms', post_id, 'pa_compound') %}
{% for option in compound %}
{% set term = get_term(option) %}
<a href="/compound/{{ term.slug }}" class="compound__item">{{ term.name }}</a>
{% endfor %}
</div>
<a href="{{ wc_product.get_permalink() }}" class="product-item__title">{{ wc_product.get_name() }}</a>
<div class="product-item__price">
<p>{{ wc_product.get_price() }} {{ fn('get_woocommerce_currency_symbol') }}</p>
{% if is_subscription %}
<span href="#" class="product-item-label__tag product-item-label__tag--sale">
{{ function('pll_e', 'Распродажа %') }}
</span>
{% endif %}
</div>
<div class="product-item__bye">
<button class="button button--white button--100-perc open-overlay">
{{ function('pll_e', 'Купить') }}
</button>
</div>
</div>
<div class="product-item__overlay">
<div class="product-item-overlay__header">
<a href="{{ wc_product.get_permalink() }}" class="product-item__title">{{ wc_product.get_name() }}</a>
<ul class="product-item-overlay__tags">
{% set features = fn('wc_get_product_terms', post_id, 'pa_features') %}
{% for option in features %}
<a href="{{ wc_product.get_permalink() }}" class="product-item__product-card">
<img src="{{ fn('wp_get_attachment_url', wc_product.get_image_id()) }}" alt="{{ wc_product.get_name() }}" class="product-item__images">
</a>
<div class="product-item__content-card">
<div class="compound">
{% set compound = fn('wc_get_product_terms', post_id, 'pa_compound') %}
{% for option in compound %}
{% set term = get_term(option) %}
<li>{{ term.name }}</li>
<a href="/compound/{{ term.slug }}" class="compound__item">{{ term.name }}</a>
{% endfor %}
</ul>
</div>
<a href="{{ wc_product.get_permalink() }}" class="product-item__title">{{ wc_product.get_name() }}</a>
<div class="product-item__price">
<p>{{ wc_product.get_price() }} {{ fn('get_woocommerce_currency_symbol') }}</p>
</div>
<div class="product-item__bye">
<button class="button button--white button--100-perc open-overlay">
{{ function('pll_e', 'Купить') }}
</button>
</div>
</div>
<form class="product-item__form" method="post" action="/send-telegram.php">
<div class="product-item-overlay__input-block">
<div class="product-item-overlay__field">
<p class="product-item-overlay-field__title">Объем</p>
<div class="product-item__overlay">
<div class="product-item-overlay__header">
<a href="{{ wc_product.get_permalink() }}" class="product-item__title">{{ wc_product.get_name() }}</a>
<ul class="product-item-overlay__tags">
{% set features = fn('wc_get_product_terms', post_id, 'pa_features') %}
{% for option in features %}
{% set term = get_term(option) %}
<li>{{ term.name }}</li>
{% endfor %}
</ul>
</div>
<form class="product-item__form" method="post" action="/send-telegram.php">
<div class="product-item-overlay__input-block">
<div class="product-item-overlay__field">
<p class="product-item-overlay-field__title">Объем</p>
<div class="select">
{% set cur_weight = function('get_product_info', post_id, 'weight') %}
<input type="text" class="select__state" value="{{ cur_weight }}" readonly data-product_id="{{ post_id }}" data-product_price="{{ wc_product.get_price() }}">
<div class="state__block">
<ul class="state__content">
{% set collection = fn('wc_get_product_terms', post_id, 'pa_collection') %}
{% for option in collection %}
{% set term = get_term(option) %}
{% if term %}
{% set siblings = function('get_collection_siblings', term.term_id) %}
<div class="select">
{% set cur_weight = function('get_product_info', post_id, 'weight') %}
<input type="text" class="select__state" value="{{ cur_weight }}" readonly data-product_id="{{ post_id }}" data-product_price="{{ wc_product.get_price() }}">
<div class="state__block">
<ul class="state__content">
{% set collection = fn('wc_get_product_terms', post_id, 'pa_collection') %}
{% for option in collection %}
{% set term = get_term(option) %}
{% if term %}
{% set siblings = function('get_collection_siblings', term.term_id) %}
{% for sibling in siblings %}
{% set weight = function('get_product_info', sibling.ID, 'weight') %}
{% set class = '' %}
{% if weight == cur_weight %}
{% set class = 'active' %}
{% endif %}
<li>
<button class="state__button {{ class }}" data-product_id="{{ sibling.ID }}" data-product_price="{{ function('get_product_info', sibling.ID, 'price') }}">
{{ weight }}
</button>
</li>
{% endfor %}
{% endif %}
{% endfor %}
</ul>
{% for sibling in siblings %}
{% set weight = function('get_product_info', sibling.ID, 'weight') %}
{% set class = '' %}
{% if weight == cur_weight %}
{% set class = 'active' %}
{% endif %}
<li>
<button class="state__button {{ class }}" data-product_id="{{ sibling.ID }}" data-product_price="{{ function('get_product_info', sibling.ID, 'price') }}">
{{ weight }}
</button>
</li>
{% endfor %}
{% endif %}
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
<div class="product-item-overlay__field">
<p class="product-item-overlay-field__title">Количество</p>
<div class="product-item-overlay__field">
<p class="product-item-overlay-field__title">Количество</p>
<div class="counter">
<button class="counter__button minus">
<img src="{{ theme.uri }}/woocommerce/assets/img/svg/main/minus.svg" alt="">
</button>
<input type="text" class="counter__input" value="1">
<button class="counter__button plus">
<img src="{{ theme.uri }}/woocommerce/assets/img/svg/main/plus.svg" alt="">
</button>
<div class="counter">
<button class="counter__button minus">
<img src="{{ theme.uri }}/woocommerce/assets/img/svg/main/minus.svg" alt="">
</button>
<input type="text" class="counter__input" value="1">
<button class="counter__button plus">
<img src="{{ theme.uri }}/woocommerce/assets/img/svg/main/plus.svg" alt="">
</button>
</div>
</div>
</div>
</div>
<p class="product-item-overlay__price">
{{ wc_product.get_price() }}
</p>
<div class="product-item-overlay__block-button">
<div class="product-item-overlay__button">
{{ function('get_add_to_cart_button', post_id) }}
</div>
<div class="product-item-overlay__more_button">
<a class="to-know button--100-perc" href="{{ wc_product.get_permalink() }}">
<p>{{ function('pll_e', 'Подробнее') }}</p>
</a>
<p class="product-item-overlay__price">
{{ wc_product.get_price() }}
</p>
<div class="product-item-overlay__block-button">
<div class="product-item-overlay__button">
{{ function('get_add_to_cart_button', post_id) }}
</div>
<div class="product-item-overlay__more_button">
<a class="to-know button--100-perc" href="{{ wc_product.get_permalink() }}">
<p>{{ function('pll_e', 'Подробнее') }}</p>
</a>
</div>
</div>
</div>
</form>
</form>
</div>
</div>
</div>
{% endif %}
</div>
{% endfor %}
{% endif %}
</div>
{% endfor %}
</div>
</div>
</div>
</div>
{% endif %}
{% endif %}
</div>
</div>
</div>
<div class="gallery">
<button class="gallery__close gallery-button">
<img src="{{ theme.uri }}/static/shop/img/svg/main/black-x.svg" alt="">
@ -446,5 +474,5 @@
</div>
</div>
</div>
{% endblock %}
</div>
{% endblock %}
Loading…
Cancel
Save