188 lines
12 KiB
PHP
188 lines
12 KiB
PHP
<?php
|
|
|
|
$id = 'reviews-block-' . $block['id'];
|
|
if (!empty($block['anchor'])) {
|
|
$id = $block['anchor'];
|
|
}
|
|
|
|
$classes = 'block-reviews-block';
|
|
if (!empty($block['className'])) {
|
|
$classes .= ' ' . $block['className'];
|
|
}
|
|
if (!empty($block['align'])) {
|
|
$classes .= ' align' . $block['align'];
|
|
}
|
|
|
|
$heading = get_field('heading');
|
|
$slider_tabs = get_field('slider_tabs');
|
|
$slider_video_reviews = get_field('slider_video_reviews');
|
|
$rating = get_field('rating') ?: '5.0';
|
|
$stars = get_field('stars');
|
|
?>
|
|
|
|
<div class="reviews-block container mx-auto py-[90px]"
|
|
id="<?php echo esc_attr($id); ?>"
|
|
data-reviews-id="<?php echo esc_attr($id); ?>">
|
|
<div class="flex justify-between flex-wrap gap-[12px]">
|
|
<?php if ($heading) : ?>
|
|
<h2 class="text-[32px] font-bold mt-[24px]"><?php echo esc_html($heading); ?></h2>
|
|
<?php endif; ?>
|
|
|
|
<div class="flex gap-[10px] mt-[24px]">
|
|
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
|
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
|
<?php if (!empty($tab['tab_name'])) : ?>
|
|
<button class="tab-button grey-gradient-button rounded-[90px] py-[8px] px-[28px] cursor-pointer transition-all <?php echo $tab_index === 0 ? 'active' : ''; ?>"
|
|
data-tab="<?php echo $tab_index; ?>"
|
|
data-rating="<?php echo esc_attr($tab['rating'] ?? $rating); ?>"
|
|
data-stars="<?php echo esc_attr($tab['stars'] ?? $stars); ?>">
|
|
<?php echo esc_html($tab['tab_name']); ?>
|
|
</button>
|
|
<?php endif; ?>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
|
|
<?php if ($slider_video_reviews) : ?>
|
|
<button class="tab-button grey-gradient-button rounded-[90px] py-[8px] px-[28px] cursor-pointer transition-all"
|
|
data-tab="video">
|
|
Видеоотзывы
|
|
</button>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="rating-section mt-[24px] flex gap-[20px]">
|
|
<div class="flex flex-col gap-[6px]">
|
|
<div data-reviews="rating" class="flex gap-[4px] items-center">
|
|
<?php
|
|
for ($i = 0; $i < 5; $i++) {
|
|
?>
|
|
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<g clip-path="url(#clip0_2307_14938)">
|
|
<path d="M19.5654 9.6016C19.7579 9.41536 19.894 9.17868 19.9582 8.91867C20.0224 8.65866 20.012 8.38583 19.9283 8.13144C19.8465 7.87631 19.6944 7.64939 19.4896 7.4767C19.2847 7.30402 19.0354 7.19254 18.7701 7.15506L13.9275 6.45142C13.8259 6.43666 13.7294 6.39742 13.6464 6.33706C13.5634 6.27671 13.4963 6.19707 13.4509 6.105L11.2859 1.71734C11.1682 1.47672 10.9852 1.27411 10.7577 1.13273C10.5302 0.991358 10.2674 0.916931 9.99957 0.91798C9.73178 0.917006 9.46914 0.991469 9.24171 1.13284C9.01429 1.27421 8.83127 1.47678 8.71363 1.71734L6.54823 6.1054C6.45612 6.29243 6.2775 6.42178 6.07126 6.45182L1.22864 7.15547C0.963355 7.19294 0.713995 7.30442 0.509148 7.47711C0.304302 7.64979 0.152261 7.87671 0.0704546 8.13184C-0.0132531 8.38623 -0.0236151 8.65906 0.0405555 8.91907C0.104726 9.17908 0.240834 9.41576 0.43329 9.602L3.93709 13.0173C4.08647 13.1631 4.15496 13.3729 4.11971 13.578L3.29312 18.4006C3.25573 18.6055 3.26439 18.8161 3.31849 19.0173C3.37259 19.2184 3.47076 19.405 3.6059 19.5636C4.03281 20.071 4.7781 20.2255 5.37402 19.9124L9.70482 17.6352C9.79609 17.5887 9.8971 17.5644 9.99957 17.5644C10.102 17.5644 10.2031 17.5887 10.2943 17.6352L14.6255 19.9124C14.8309 20.0219 15.06 20.0793 15.2927 20.0794C15.716 20.0794 16.1173 19.8911 16.3932 19.5636C16.5284 19.4051 16.6266 19.2185 16.6807 19.0173C16.7348 18.8161 16.7434 18.6055 16.706 18.4006L15.879 13.578C15.8617 13.4767 15.8693 13.3728 15.9011 13.2751C15.9329 13.1774 15.988 13.0889 16.0616 13.0173L19.5654 9.6016Z"
|
|
fill="url(#paint0_linear_2307_14938)"/>
|
|
</g>
|
|
<defs>
|
|
<linearGradient id="paint0_linear_2307_14938" x1="-0.000976562" y1="10.4987"
|
|
x2="19.9997" y2="10.4987"
|
|
gradientUnits="userSpaceOnUse">
|
|
<stop offset="0.394231" stop-color="#FFD65A"/>
|
|
<stop offset="0.929023" stop-color="#FFE595"/>
|
|
</linearGradient>
|
|
<clipPath id="clip0_2307_14938">
|
|
<rect width="20" height="20" fill="white" transform="translate(0 0.5)"/>
|
|
</clipPath>
|
|
</defs>
|
|
</svg>
|
|
<?php
|
|
}
|
|
?>
|
|
<span class="ml-[8px] font-[600] text-[20px] leading-[115%]">5.0</span>
|
|
</div>
|
|
<div class="font-[500] ml-auto text-[16px] leading-[145%] text-[#6c6b6b]">
|
|
(
|
|
<span data-reviews="stars">
|
|
<?php
|
|
$star_count = $slider_tabs && !empty($slider_tabs['slider_tab'])
|
|
? ($slider_tabs['slider_tab'][0]['stars'] ?? $stars)
|
|
: $stars;
|
|
echo esc_html($star_count);
|
|
|
|
// Функция для правильных окончаний
|
|
$last_digit = $star_count % 10;
|
|
$last_two_digits = $star_count % 100;
|
|
|
|
if ($last_two_digits >= 11 && $last_two_digits <= 19) {
|
|
echo ' оценок';
|
|
} elseif ($last_digit == 1) {
|
|
echo ' оценка';
|
|
} elseif ($last_digit >= 2 && $last_digit <= 4) {
|
|
echo ' оценки';
|
|
} else {
|
|
echo ' оценок';
|
|
}
|
|
?>
|
|
</span>
|
|
)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
|
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
|
<div class="tab-content mt-[45px] <?php echo $tab_index === 0 ? 'block' : 'hidden'; ?>"
|
|
id="tab-<?php echo $tab_index; ?>">
|
|
|
|
<?php if (!empty($tab['slider_images'])) : ?>
|
|
<div class="swiper reviews-swiper" id="swiper-<?php echo $tab_index; ?>">
|
|
<div class="swiper-wrapper">
|
|
<?php foreach ($tab['slider_images'] as $img_index => $image) : ?>
|
|
<div class="swiper-slide max-w-[424px] cursor-pointer">
|
|
<a href="<?php echo esc_url($image['url']); ?>"
|
|
class="glightbox block w-full h-full relative"
|
|
data-gallery="reviews-<?php echo $tab_index; ?>">
|
|
<img src="<?php echo esc_url($image['url']); ?>"
|
|
alt="<?php echo esc_attr($image['alt']); ?>"
|
|
class="w-full h-full object-contain rounded-[12px]">
|
|
</a>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
<div class="swiper-scrollbar !static !mx-auto !cursor-grab mt-[45px] !w-full !p-0"></div>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
|
|
<?php if ($slider_video_reviews) : ?>
|
|
<div class="tab-content mt-[45px] hidden" id="tab-video">
|
|
<div class="video-reviews-grid flex flex-wrap gap-[24px]">
|
|
<?php foreach ($slider_video_reviews as $video_index => $video) : ?>
|
|
<?php if (!empty($video['slider_video_review'])) : ?>
|
|
<div class="video-review-item max-w-[424px] h-[358px] w-full bg-white rounded-[12px]">
|
|
<a href="<?php echo esc_url($video['slider_video_review']['url']); ?>"
|
|
class="glightbox hover:[&_svg]:fill-[#e21e24] p-[24px] !no-underline block w-full h-full relative"
|
|
data-gallery="reviews-video"
|
|
data-type="video">
|
|
<?php if (!empty($video['author']) || !empty($video['data_otzyva'])) : ?>
|
|
<div class="flex justify-between h-[46px] w-full items-center">
|
|
<?php if (!empty($video['author'])) : ?>
|
|
<div class="font-[600] text-[20px] leading-[115%]"><?php echo esc_html($video['author']); ?></div>
|
|
<?php endif; ?>
|
|
<?php if (!empty($video['data_otzyva'])) : ?>
|
|
<div class="font-[500] text-[14px] leading-[125%] text-[#6c6b6b]"><?php echo esc_html($video['data_otzyva']); ?></div>
|
|
<?php endif; ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
<div class="w-full h-[240px] mt-[24px] rounded-[12px] relative overflow-hidden">
|
|
<img src="<?php echo esc_url($video['slider_video_prereview']['url']); ?>"
|
|
alt="<?php echo esc_attr($video['slider_video_prereview']['alt'] ?: 'Превью видеоотзыва'); ?>"
|
|
class="w-full h-full object-cover">
|
|
|
|
<div class="absolute inset-0 flex items-center justify-center">
|
|
<svg class="transition-all" width="76" height="76" viewBox="0 0 76 76" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M0 38C0 17.0132 17.0132 0 38 0C58.9868 0 76 17.0132 76 38C76 58.9868 58.9868 76 38 76C17.0132 76 0 58.9868 0 38Z" fill="url(#paint0_linear_4086_3690)" fill-opacity="0.32" />
|
|
<path d="M38 0.379883C58.777 0.379883 75.6201 17.223 75.6201 38C75.6201 58.777 58.777 75.6201 38 75.6201C17.223 75.6201 0.379883 58.777 0.379883 38C0.379883 17.223 17.223 0.379883 38 0.379883Z" stroke="white" stroke-opacity="0.14" stroke-width="0.76" />
|
|
<path d="M49.5 35.4019C51.5 36.5566 51.5 39.4434 49.5 40.5981L34.5 49.2583C32.5 50.413 30 48.9697 30 46.6603L30 29.3397C30 27.0303 32.5 25.587 34.5 26.7417L49.5 35.4019Z" fill="white" />
|
|
<defs>
|
|
<linearGradient id="paint0_linear_4086_3690" x1="0" y1="38" x2="76" y2="38" gradientUnits="userSpaceOnUse">
|
|
<stop offset="0.394231" stop-color="#9D9994" />
|
|
<stop offset="0.929023" stop-color="#C5C5B9" />
|
|
</linearGradient>
|
|
</defs>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
</div>
|
|
<?php endif; ?>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|