378 lines
16 KiB
PHP
378 lines
16 KiB
PHP
<?if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();
|
||
/** @var array $arParams */
|
||
/** @var array $arResult */
|
||
/** @global CMain $APPLICATION */
|
||
/** @global CUser $USER */
|
||
/** @global CDatabase $DB */
|
||
/** @var CBitrixComponentTemplate $this */
|
||
/** @var string $templateName */
|
||
/** @var string $templateFile */
|
||
/** @var string $templateFolder */
|
||
/** @var string $componentPath */
|
||
/** @var CBitrixComponent $component */
|
||
$this->setFrameMode(true);
|
||
?>
|
||
<?
|
||
$placemarks = [];
|
||
foreach($arResult['AGENCIES'] AS $agency)
|
||
{
|
||
$content = "";
|
||
$content .= !empty($agency['PROPERTIES']['PHONE']['VALUE']) ? "<p><b>Горячая линия:</b> ".$agency['PROPERTIES']['PHONE']['VALUE']."</p>" : "";
|
||
$content .= !empty($agency['PROPERTIES']['PHONE_CENTRAL']['VALUE']) ? "<p><b>Телефон центрального офиса:</b> ".$agency['PROPERTIES']['PHONE_CENTRAL']['VALUE']."</p>" : "";
|
||
$content .= !empty($agency['PROPERTIES']['ADDRESS']['VALUE']) ? "<p><b>Адрес:</b> ".$agency['PROPERTIES']['ADDRESS']['VALUE']."</p>" : "";
|
||
$content .= !empty($agency['PROPERTIES']['HOURS']['VALUE']) ? "<p><b>Часы работы:</b> ".$agency['PROPERTIES']['HOURS']['VALUE']."</p>" : "";
|
||
|
||
$coords = explode(",", $agency['PROPERTIES']['GEO']['VALUE']);
|
||
array_push($placemarks, [
|
||
"coords" => $coords,
|
||
"content" => $content,
|
||
]);
|
||
}
|
||
?>
|
||
<section data-page="about">
|
||
<div class="container">
|
||
<div id="contacts_top" class="title_wrapper mb35">
|
||
<div class="left">
|
||
<h1 class="section_title">Контакты</h1>
|
||
</div>
|
||
<div class="right sm-hidden">
|
||
<div id="choose_region">
|
||
<?/*
|
||
<p>Показываем представительства, которые обслуживают выбранный регион</p>
|
||
*/?>
|
||
<div class="form_field">
|
||
<? $APPLICATION->IncludeComponent(
|
||
"evolution:regions.list",
|
||
"select",
|
||
Array(
|
||
"ID" => "regions_select",
|
||
"CLASS" => "regions_select",
|
||
)
|
||
); ?>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="aside_container about">
|
||
<? $APPLICATION->IncludeComponent("bitrix:menu", "evolution.left.menu", Array(
|
||
"ALLOW_MULTI_SELECT" => "N", // Разрешить несколько активных пунктов одновременно
|
||
"CHILD_MENU_TYPE" => "left", // Тип меню для остальных уровней
|
||
"DELAY" => "N", // Откладывать выполнение шаблона меню
|
||
"MAX_LEVEL" => "1", // Уровень вложенности меню
|
||
"MENU_CACHE_GET_VARS" => array( // Значимые переменные запроса
|
||
0 => "",
|
||
),
|
||
"MENU_CACHE_TIME" => "3600", // Время кеширования (сек.)
|
||
"MENU_CACHE_TYPE" => "N", // Тип кеширования
|
||
"MENU_CACHE_USE_GROUPS" => "Y", // Учитывать права доступа
|
||
"ROOT_MENU_TYPE" => "left", // Тип меню для первого уровня
|
||
"USE_EXT" => "Y", // Подключать файлы с именами вида .тип_меню.menu_ext.php
|
||
),
|
||
false
|
||
);?>
|
||
<article>
|
||
<div id="choose_region">
|
||
<p>Показываем представительства, которые обслуживают выбранный регион</p>
|
||
<div class="form_field">
|
||
<? $APPLICATION->IncludeComponent(
|
||
"evolution:regions.list",
|
||
"select",
|
||
Array(
|
||
"ID" => "regions_select_mobile",
|
||
"CLASS" => "regions_select",
|
||
)
|
||
); ?>
|
||
</div>
|
||
</div>
|
||
<div class="tabs" id="officeViewToggle">
|
||
<div class="tab active" data-view="map">На карте</div>
|
||
<div class="tab" data-view="list">Списком</div>
|
||
</div>
|
||
<div id="map" class="visible"></div>
|
||
<script src="https://api-maps.yandex.ru/2.1/?apikey=e417e630-1f5b-4b07-8c7d-cb4d22dd1841&lang=ru_RU" type="text/javascript"></script>
|
||
<script>
|
||
<?/*
|
||
var offices = [
|
||
<? foreach($placemarks AS $placemark): ?>
|
||
<? if(!empty($arItem['PROPERTIES']['GEO_LAT']['VALUE']) && !empty($arItem['PROPERTIES']['GEO_LON']['VALUE'])): ?>
|
||
["<?= $arItem['NAME']; ?>", <?= $arItem['PROPERTIES']['GEO_LAT']['VALUE']; ?>, <?= $arItem['PROPERTIES']['GEO_LON']['VALUE']; ?>, 0, "<?= $arItem['DETAIL_PAGE_URL']; ?>", "<?= addslashes(trim(str_replace(Array("\r","\n"),Array("",""),$arItem['PROPERTIES']['ADDRESS']['~VALUE']['TEXT']))); ?>", "<?= !empty($arItem['PROPERTIES']['PHOTO_ICON']['SRC']) ? $arItem['PROPERTIES']['PHOTO_ICON']['SRC'] : ""; ?>"],
|
||
<? endif; ?>
|
||
<? endforeach; ?>
|
||
];
|
||
*/?>
|
||
|
||
ymaps.ready(init);
|
||
function init()
|
||
{
|
||
window.map = new ymaps.Map('map',
|
||
{
|
||
center: [<?= $placemarks[0]['coords'][0]; ?>, <?= $placemarks[0]['coords'][1]; ?>],
|
||
zoom: 9,
|
||
controls: []
|
||
});
|
||
|
||
// Создание макета балуна на основе Twitter Bootstrap.
|
||
MyBalloonLayout = ymaps.templateLayoutFactory.createClass(
|
||
'<div class="popover top">' +
|
||
'<a class="close" href="#">×</a>' +
|
||
'<div class="arrow"></div>' +
|
||
'<div class="popover-inner">' +
|
||
'$[[options.contentLayout observeSize minWidth=235 maxWidth=500 maxHeight=400]]' +
|
||
'</div>' +
|
||
'</div>', {
|
||
/**
|
||
* Строит экземпляр макета на основе шаблона и добавляет его в родительский HTML-элемент.
|
||
* @see https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/layout.templateBased.Base.xml#build
|
||
* @function
|
||
* @name build
|
||
*/
|
||
build: function () {
|
||
this.constructor.superclass.build.call(this);
|
||
|
||
this._$element = $('.popover', this.getParentElement());
|
||
|
||
this.applyElementOffset();
|
||
|
||
this._$element.find('.close')
|
||
.on('click', $.proxy(this.onCloseClick, this));
|
||
},
|
||
|
||
/**
|
||
* Удаляет содержимое макета из DOM.
|
||
* @see https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/layout.templateBased.Base.xml#clear
|
||
* @function
|
||
* @name clear
|
||
*/
|
||
clear: function () {
|
||
this._$element.find('.close')
|
||
.off('click');
|
||
|
||
this.constructor.superclass.clear.call(this);
|
||
},
|
||
|
||
/**
|
||
* Метод будет вызван системой шаблонов АПИ при изменении размеров вложенного макета.
|
||
* @see https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/IBalloonLayout.xml#event-userclose
|
||
* @function
|
||
* @name onSublayoutSizeChange
|
||
*/
|
||
onSublayoutSizeChange: function () {
|
||
MyBalloonLayout.superclass.onSublayoutSizeChange.apply(this, arguments);
|
||
|
||
if (!this._isElement(this._$element)) {
|
||
return;
|
||
}
|
||
|
||
this.applyElementOffset();
|
||
|
||
this.events.fire('shapechange');
|
||
},
|
||
|
||
/**
|
||
* Сдвигаем балун, чтобы "хвостик" указывал на точку привязки.
|
||
* @see https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/IBalloonLayout.xml#event-userclose
|
||
* @function
|
||
* @name applyElementOffset
|
||
*/
|
||
applyElementOffset: function () {
|
||
this._$element.css({
|
||
left: -(this._$element[0].offsetWidth / 2),
|
||
top: -(this._$element[0].offsetHeight + this._$element.find('.arrow')[0].offsetHeight)
|
||
});
|
||
},
|
||
|
||
/**
|
||
* Закрывает балун при клике на крестик, кидая событие "userclose" на макете.
|
||
* @see https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/IBalloonLayout.xml#event-userclose
|
||
* @function
|
||
* @name onCloseClick
|
||
*/
|
||
onCloseClick: function (e) {
|
||
e.preventDefault();
|
||
|
||
this.events.fire('userclose');
|
||
},
|
||
|
||
/**
|
||
* Используется для автопозиционирования (balloonAutoPan).
|
||
* @see https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/ILayout.xml#getClientBounds
|
||
* @function
|
||
* @name getClientBounds
|
||
* @returns {Number[][]} Координаты левого верхнего и правого нижнего углов шаблона относительно точки привязки.
|
||
*/
|
||
getShape: function () {
|
||
if (!this._isElement(this._$element)) {
|
||
return MyBalloonLayout.superclass.getShape.call(this);
|
||
}
|
||
|
||
var position = this._$element.position();
|
||
|
||
return new ymaps.shape.Rectangle(new ymaps.geometry.pixel.Rectangle([
|
||
[position.left, position.top], [
|
||
position.left + this._$element[0].offsetWidth,
|
||
position.top + this._$element[0].offsetHeight + this._$element.find('.arrow')[0].offsetHeight
|
||
]
|
||
]));
|
||
},
|
||
|
||
/**
|
||
* Проверяем наличие элемента (в ИЕ и Опере его еще может не быть).
|
||
* @function
|
||
* @private
|
||
* @name _isElement
|
||
* @param {jQuery} [element] Элемент.
|
||
* @returns {Boolean} Флаг наличия.
|
||
*/
|
||
_isElement: function (element) {
|
||
return element && element[0] && element.find('.arrow')[0];
|
||
}
|
||
});
|
||
var MyBalloonContentLayout = ymaps.templateLayoutFactory.createClass(
|
||
'<h3 class="popover-title">$[properties.balloonHeader]</h3>' +
|
||
'<div class="popover-content">$[properties.balloonContent]</div>'
|
||
);
|
||
|
||
let offices = [
|
||
<? foreach($placemarks AS $placemark): ?>
|
||
new ymaps.Placemark([<?= $placemark['coords'][0]; ?>, <?= $placemark['coords'][1]; ?>], {
|
||
balloonContent: '<?= $placemark['content']; ?>'
|
||
}, {
|
||
balloonShadow: false,
|
||
balloonLayout: MyBalloonLayout,
|
||
balloonContentLayout: MyBalloonContentLayout,
|
||
balloonPanelMaxMapArea: 0,
|
||
balloonOffset: [0, 29],
|
||
iconLayout: 'default#imageWithContent',
|
||
iconImageHref: '/images/pin.svg',
|
||
iconImageSize: [43, 54],
|
||
iconImageOffset: [-21, -54],
|
||
iconContentOffset: [15, 15]
|
||
}),
|
||
<? endforeach; ?>
|
||
];
|
||
/*
|
||
var objectManager = new ymaps.ObjectManager({
|
||
// Чтобы метки начали кластеризоваться, выставляем опцию.
|
||
clusterize: false,
|
||
// ObjectManager принимает те же опции, что и кластеризатор.
|
||
gridSize: 32,
|
||
clusterDisableClickZoom: true
|
||
});
|
||
*/
|
||
for(let i in offices)
|
||
{
|
||
window.map.geoObjects.add(offices[i]);
|
||
}
|
||
|
||
/*
|
||
objectManager.add({
|
||
);
|
||
*/
|
||
}
|
||
</script>
|
||
<div id="offices" class="dropdown_blocks_list offices_list">
|
||
<?
|
||
$agencies_column_left = [];
|
||
$agencies_column_right = [];
|
||
|
||
foreach($arResult['AGENCIES'] AS $k => $ag)
|
||
{
|
||
if($k % 2 == 0)
|
||
{
|
||
array_push($agencies_column_left, $ag);
|
||
}
|
||
else
|
||
{
|
||
array_push($agencies_column_right, $ag);
|
||
}
|
||
}
|
||
?>
|
||
<div class="column">
|
||
<? $c = 1; ?>
|
||
<? foreach($agencies_column_left AS $agency): ?>
|
||
<div class="dropdown_block <?= $c === 1 ? "open" : ""; ?>" id="region_<?= $agency['PROPERTIES']['REGION']['RELATED']['ID']; ?>" data-region="<?= $agency['PROPERTIES']['REGION']['RELATED']['ID']; ?>">
|
||
<div class="block_header">
|
||
<p><?= $agency['NAME']; ?></p>
|
||
<!--Центральный офис и Московский офис продаж-->
|
||
<button class="block_toggle"></button>
|
||
</div>
|
||
<div class="block_body">
|
||
<? if($agency['PROPERTIES']['PHONE']['VALUE'] != ""): ?>
|
||
<p class="i-phone"><b>Горячая линия:</b> <?= $agency['PROPERTIES']['PHONE']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['PHONE_CENTRAL']['VALUE'] != ""): ?>
|
||
<p class="i-phone-secondary"><b>Телефон центрального офиса:</b> <?= $agency['PROPERTIES']['PHONE_CENTRAL']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['ADDRESS']['VALUE'] != ""): ?>
|
||
<p class="i-address"><b>Адрес:</b> <?= $agency['PROPERTIES']['ADDRESS']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['HOURS']['VALUE'] != ""): ?>
|
||
<p class="i-worktime"><b>Часы работы:</b> <?= $agency['PROPERTIES']['HOURS']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<a style="cursor:pointer" class="contacts_show_office_on_map" data-geo="<?= $agency['PROPERTIES']['GEO']["VALUE"]; ?>">Показать на карте</a>
|
||
</div>
|
||
</div>
|
||
<? $c++; ?>
|
||
<? endforeach; ?>
|
||
</div>
|
||
|
||
<div class="column">
|
||
<? foreach($agencies_column_right AS $agency): ?>
|
||
<div class="dropdown_block" id="region_<?= $agency['PROPERTIES']['REGION']['RELATED']['ID']; ?>" data-region="<?= $agency['PROPERTIES']['REGION']['RELATED']['ID']; ?>">
|
||
<div class="block_header">
|
||
<p><?= $agency['NAME']; ?></p>
|
||
<!--Центральный офис и Московский офис продаж-->
|
||
<button class="block_toggle"></button>
|
||
</div>
|
||
<div class="block_body">
|
||
<? if($agency['PROPERTIES']['PHONE']['VALUE'] != ""): ?>
|
||
<p class="i-phone"><b>Горячая линия:</b> <?= $agency['PROPERTIES']['PHONE']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['PHONE_CENTRAL']['VALUE'] != ""): ?>
|
||
<p class="i-phone-secondary"><b>Телефон центрального офиса:</b> <?= $agency['PROPERTIES']['PHONE_CENTRAL']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['ADDRESS']['VALUE'] != ""): ?>
|
||
<p class="i-address"><b>Адрес:</b> <?= $agency['PROPERTIES']['ADDRESS']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['HOURS']['VALUE'] != ""): ?>
|
||
<p class="i-worktime"><b>Часы работы:</b> <?= $agency['PROPERTIES']['HOURS']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<a style="cursor:pointer" class="contacts_show_office_on_map" data-geo="<?= $agency['PROPERTIES']['GEO']["VALUE"]; ?>">Показать на карте</a>
|
||
</div>
|
||
</div>
|
||
<? endforeach; ?>
|
||
</div>
|
||
|
||
<div class="column sm-list">
|
||
<? $c = 1; ?>
|
||
<? foreach($arResult['AGENCIES'] AS $agency): ?>
|
||
<div class="dropdown_block <?= $c === 1 ? "open" : ""; ?>" id="region_<?= $agency['PROPERTIES']['REGION']['RELATED']['ID']; ?>">
|
||
<div class="block_header">
|
||
<p><?= $agency['NAME']; ?></p>
|
||
<!--Центральный офис и Московский офис продаж-->
|
||
<button class="block_toggle"></button>
|
||
</div>
|
||
<div class="block_body">
|
||
<? if($agency['PROPERTIES']['PHONE']['VALUE'] != ""): ?>
|
||
<p class="i-phone"><b>Горячая линия:</b> <?= $agency['PROPERTIES']['PHONE']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['PHONE_CENTRAL']['VALUE'] != ""): ?>
|
||
<p class="i-phone-secondary"><b>Телефон центрального офиса:</b> <?= $agency['PROPERTIES']['PHONE_CENTRAL']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['ADDRESS']['VALUE'] != ""): ?>
|
||
<p class="i-address"><b>Адрес:</b> <?= $agency['PROPERTIES']['ADDRESS']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<? if($agency['PROPERTIES']['HOURS']['VALUE'] != ""): ?>
|
||
<p class="i-worktime"><b>Часы работы:</b> <?= $agency['PROPERTIES']['HOURS']['VALUE']; ?></p>
|
||
<? endif; ?>
|
||
<a style="cursor:pointer" class="contacts_show_office_on_map" data-geo="<?= $agency['PROPERTIES']['GEO']["VALUE"]; ?>">Показать на карте</a>
|
||
</div>
|
||
</div>
|
||
<? $c++; ?>
|
||
<? endforeach; ?>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|