Добавление новых вкладок на главной странице шаблона Demomarket

Актуально для версии 20

Задача

Добавить дополнительную вкладку под слайдером на главной странице шаблона Demomarket.

Решение

1. Добавить новую языковую константу в файл /templates/demomarket/php/i18n/i18n.ru.php

'new_tab_0' => 'Новая вкладка 1',
'new_tab_1' => 'Новая вкладка 2',

1. В файл расширений шаблона /templates/demomarket/php/library/DemomarketPhpExtension.php добавить методы:

/**
 * Отображать ли одну из новых вкладок
 * @return bool
 * @throws publicException
 */
public function isShowTabNum($num) {
	return (bool) !$this->getSettingsValue('disable_tab_num_'.$num);
}

/**
 * Возвращает название вкладки одной из новых вкладок
 * @return false|string
 * @throws publicException
 */
public function getTabName($num) {
	return $this->getSettingsValue('tab_name_'.$num);
}

/**
 * Возвращает список товаров, у которых отмечено булевое поле с заданным строковым идентификатором.
 * Виртуальные копии не учитываются в выборке.
 *
 * @param string $catId путь или идентификатор раздела каталога
 * @param int $amount количество товара
 * @return iUmiHierarchyElement[]
 * @throws selectorException
 */
public function getNumTab($catId,$amount = null) {
	$amount = is_numeric($amount) ? $amount : self::MAX_BEST_OFFERS_COUNT;
	
	$products = new selector('pages');
	$products->types('object-type')->name('catalog', 'object');
	$products->where('hierarchy')->page($catId)->childs(3);
	$products->limit(0, $amount);
	$products->order('id')->rand();
	$products->group('obj_id');
	$products->option('load-all-props')->value(true);
	$products->option('no-length', true);
	return $products->result();
}

1. В директории /templates/demomarket/php/content/home/catalog создаем новый файл new_tab_items.phtml, в который помещаем следующий код:

<?php
/**
 * Вывод вкладки.
 *
 * @var umiTemplaterPHP|ViewPhpExtension|DemomarketPhpExtension $this
 * @var array $variables
 */
 
 list($variables, $numTab, $catName) = $variables;
?>

<div id="newTab_<?=$numTab?>" class="tab-pane fade in active">
	<div class="row">
		<?php foreach ($this->getNumTab($catName) as $product): ?>
			<?= $this->render($product, 'catalog/product/preview/index') ?>
		<?php endforeach; ?>
	</div>
</div>

1. В файле /templates/demomarket/php/content/home/catalog.phtml по аналогии с вкладками "Новинки" и "Лучшие предложения":

1) Получаем данные для вывода при помощи функции isShowNewTab

2) Получаем название новой вкладки из функции getNewTabName или из языковой константы 'new_tab'

3) Добавляем кнопку для переключения вкладки в список <ul class="nav nav-tabs">

4) Добавляем вывод самой вкладки в элемент <div class="tab-content">

В итоге должно получиться так:

<?php
/**
 * Каталог товаров на главной странице. Включает в себя текстовое поле и две вкладки:
 *   - Новинки
 *   - Лучшие предложения
 *
 * @var umiTemplaterPHP|ViewPhpExtension|DemomarketPhpExtension $this
 * @var array $variables
 */
 
$CatTabs = ['/shop/sport-i-turizm/','/shop/chasy/'];
$IsShowaTabs = [];
$NamesTabs = [];

$page = $variables['page'];

$isShowNewItems = $this->isShowNewItems();
$isShowBestOffers = $this->isShowBestProducts();

$newItemsTabName = $this->getNewItemsTabName() ?: $this->translate('new_items');
$bestItemsTabName = $this->getBestProductsTabName() ?: $this->translate('best_items');
// 1) Получаем данные для вывода при помощи функции isShowTabNum 
// 2) Получаем название новой вкладки из функции getTabName или из языковой константы 'new_tab'.
foreach ($CatTabs as $numTab => $CatTab) {
	$IsShowaTabs[$numTab] = $this->isShowTabNum($numTab);
	$NamesTabs[$numTab] = $this->getTabName($numTab) ?: $this->translate('new_tab'.$numTab);
}
?>

<div class="goods w100p">
	<div class="container">
		<div class="text-field"
		     umi:element-id="<?= $page->getId() ?>"
		     umi:field-name="field_under_slider"
		     umi:empty="<?= $this->translate('empty_page_content') ?>"
		>
			<?= $page->getValue('field_under_slider') ?>
		</div>
		<div class="row">
			<ul class="nav nav-tabs">
				<?php if ($isShowNewItems): ?>
					<li class="active">
						<a href="#newItems" data-toggle="tab" class="up">
							<?= $newItemsTabName ?>
						</a>
					</li>
				<?php endif; ?>

				<?php if ($isShowBestOffers): ?>
					<li class="<?= $this->getActiveClass(!$isShowNewItems) ?>">
						<a href="#bestItems" data-toggle="tab" class="up">
							<?= $bestItemsTabName ?>
						</a>
					</li>
				<?php endif; ?>
				<?php /* 3) Добавляем кнопку для переключения вкладки в список <ul class="nav nav-tabs">  */ ?>
				<?php foreach ($CatTabs as $numTab => $CatTab): ?>
					<?php if ($IsShowaTabs[$numTab]): ?>
						<li class="<?= $this->getActiveClass(!$isShowBestOffers) ?>">
							<a href="#newTab_<?= $numTab ?>" data-toggle="tab" class="up">
								<?= $NamesTabs[$numTab] ?>
							</a>
						</li>
					<?php endif; ?>
				<?php endforeach; ?>
			</ul>
		</div>

		<div class="tab-content">
			<?php if ($isShowNewItems): ?>
				<?= $this->render($variables, 'content/home/catalog/new_items') ?>
			<?php endif; ?>
			<?php if ($isShowBestOffers): ?>
				<?= $this->render([$variables, $isShowNewItems], 'content/home/catalog/best_items') ?>
			<?php endif; ?>
			<?php /* 4) Добавляем вывод самой вкладки в элемент <div class="tab-content"> */ ?>
			<?php foreach ($CatTabs as $numTab => $CatTab): ?>
				<?php if ($IsShowaTabs[$numTab]): ?>
					<?= $this->render([$variables, $numTab, $CatTabs[$numTab]], 'content/home/catalog/new_tab_items') ?>
				<?php endif; ?>
			<?php endforeach; ?>
		</div>
	</div>
</div>