Bitrix как встроить fias (кладр) в оформление заказа sale.order.ajax
- Содержание:
- 1. Какие возможности интеграции Kladr Api существуют?
- 2. Создание интеграции Kladr Api (кладр апи) в оформлении заказа на Битрикс
Какие возможности интеграции Kladr Api существуют?
В статье будет рассмотрен плагин на JS, с сайта кладр апи(Fias).
API кладра бесплатное, но также есть возможность и воспользоваться платным API. Для начала необходимо создать нужные поля.
Решение сделано для Аспро Максимум. Возможно подойдет и для любого шаблона.
Создание интеграции Kladr Api (кладр апи) в оформлении заказа на Битрикс
Здесь ниже представлена миграция, можно также создать самостоятельно поля в админке.
<?php
/**
* @author Shmakov Fedot
* @date 01.10.2022
* @see
*/
//отключаем статистику и прочее
defined('NO_AGENT_CHECK') || define('NO_AGENT_CHECK', true);
defined('NO_KEEP_STATISTIC') || define('NO_KEEP_STATISTIC', "Y");
defined('NO_AGENT_STATISTIC') || define('NO_AGENT_STATISTIC', "Y");
defined('NOT_CHECK_PERMISSIONS') || define('NOT_CHECK_PERMISSIONS', true);
//здесь от скрипта нужно расположить путь, до директории сайта, подлючить движок Битрикс
$_SERVER["DOCUMENT_ROOT"] = dirname(dirname(dirname(__FILE__))) . "/public";
require_once($_SERVER["DOCUMENT_ROOT"] . "/bitrix/modules/main/include/prolog_before.php");
if (!CModule::IncludeModule("iblock")) {
echo "Не удалось подключить модуль iblock\n";
die;
}
/**
* Создаём свойство заказа
*/
$aOrderProperties = array(
array(
"NAME" => "Улица",
"CODE" => "ADDRESS",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"MULTILINE" => "N",
"COLS" => "",
"ROWS" => "",
"SORT" => "95"
),
array(
"NAME" => "Улица",
"CODE" => "ADDRESS",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"MULTILINE" => "N",
"COLS" => "",
"ROWS" => "",
"SORT" => "95"
),
array(
"NAME" => "Дом",
"CODE" => "HOUSE",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"DESCRIPTION" => "Дом",
"REQUIED" => "Y",
"IS_ADDRESS" => "Y"
),
array(
"NAME" => "Дом",
"CODE" => "HOUSE",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"DESCRIPTION" => "Дом",
"REQUIED" => "Y",
"IS_ADDRESS" => "Y"
),
array(
"NAME" => "Корпус",
"CODE" => "HOUSING",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"DESCRIPTION" => "Корпус",
"IS_ADDRESS" => "Y"
),
array(
"NAME" => "Корпус",
"CODE" => "HOUSING",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"DESCRIPTION" => "Корпус",
"IS_ADDRESS" => "Y"
),
array(
"NAME" => "Квартира",
"CODE" => "APARTMENT",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"DESCRIPTION" => "Квартира",
"IS_ADDRESS" => "Y"
),
array(
"NAME" => "Квартира",
"CODE" => "APARTMENT",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"DESCRIPTION" => "Квартира",
"IS_ADDRESS" => "Y"
),
array(
"NAME" => "Город",
"CODE" => "CITY_NEW",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"DESCRIPTION" => "Город",
"IS_ADDRESS" => "Y",
"REQUIED" => "Y",
"SORT" => "90"
),
array(
"NAME" => "Город",
"CODE" => "CITY_NEW",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"DESCRIPTION" => "Город",
"IS_ADDRESS" => "Y",
"REQUIED" => "Y",
"SORT" => "90"
),
array(
"NAME" => "Улица",
"CODE" => "ADDRESS",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"MULTILINE" => "N",
"COLS" => "",
"ROWS" => "",
"DESCRIPTION" => "Улица",
"SORT" => "95",
"ACTIVE" => "N"
),
array(
"NAME" => "Улица",
"CODE" => "ADDRESS",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"MULTILINE" => "N",
"COLS" => "",
"ROWS" => "",
"DESCRIPTION" => "Улица",
"SORT" => "95",
"ACTIVE" => "N"
),
array(
"NAME" => "Улица",
"CODE" => "STREET",
"PERSON_TYPE_ID" => "1",
"PROPS_GROUP_ID" => "2",
"TYPE" => "TEXT",
"MULTILINE" => "N",
"COLS" => "",
"ROWS" => "",
"DESCRIPTION" => "Улица",
"SORT" => "95",
"IS_ADDRESS" => "Y",
"REQUIED" => "Y",
),
array(
"NAME" => "Улица",
"CODE" => "STREET",
"PERSON_TYPE_ID" => "2",
"PROPS_GROUP_ID" => "4",
"TYPE" => "TEXT",
"MULTILINE" => "N",
"COLS" => "",
"ROWS" => "",
"DESCRIPTION" => "Улица",
"SORT" => "95",
"IS_ADDRESS" => "Y",
"REQUIED" => "Y",
),
);
foreach ($aOrderProperties as $aFields) {
$aFilter = array(
"CODE" => $aFields["CODE"], "PERSON_TYPE_ID" => $aFields["PERSON_TYPE_ID"],
"PROPS_GROUP_ID" => $aFields["PROPS_GROUP_ID"],
);
$aSelect = array("ID");
$oDbRes = CSaleOrderProps::GetList(array(), $aFilter, false, false, $aSelect);
if ($aDbRes = $oDbRes->fetch()) {
if (CSaleOrderProps::Update($aDbRes["ID"], $aFields)) {
echo "\e[1;32m Успешно обновлено свойство заказа \"".$aFields["NAME"]."\" \e[0m\n";
} else {
echo "\e[1;31m Не удалось обновить свойство заказа \"".$aFields["NAME"]."\" \e[0m\n";
if ($oException = $APPLICATION->GetException()) {
echo "\e[1;31m Error: ".$oException->GetString()." \e[0m\n";
}
}
//echo "\e[1;33m Свойство заказа \"" . $aFields["NAME"] . "\" уже существует \e[0m\n";
} else {
if (CSaleOrderProps::Add($aFields)) {
echo "\e[1;32m Успешно добавлено свойство заказа \"" . $aFields["NAME"] . "\" \e[0m\n";
} else {
echo "\e[1;31m Не удалось добавить свойство заказа \"" . $aFields["NAME"] . "\" \e[0m\n";
if ($oException = $APPLICATION->GetException()) {
echo "\e[1;31m Error: " . $oException->GetString() . " \e[0m\n";
}
}
}
}
Здесь в своем компоненте sale.order.ajax, у меня называется шаблон v1, у вас может отличаться.
public/local/templates/ВАШ ШАБЛОН/components/bitrix/sale.order.ajax/v1/component_epilog.php
<? if (!defined('B_PROLOG_INCLUDED') || B_PROLOG_INCLUDED !== true) die();
$APPLICATION->SetAdditionalCSS($templateFolder . '/jquery.fias.min.css');
$APPLICATION->AddHeadScript($templateFolder . '/jquery.fias.min.js');
?>
public/local/templates/ВАШ ШАБЛОН/components/bitrix/sale.order.ajax/v1/jquery.fias.min.css
.kladr-error{color:#cb3e27}#kladr_autocomplete ul{position:absolute;display:block;margin:0;padding:0;border:1px solid #c4c4c4;background-color:#fff;z-index:9999;overflow-x:hidden;overflow-y:auto;min-width:200px;max-height:420px;color:#5c5e8d}#kladr_autocomplete li{display:list-item;list-style-type:none;margin:0;padding:6px 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#kladr_autocomplete li:hover{background-color:#f2f2f2;cursor:pointer}#kladr_autocomplete li.active{background-color:#e9e9e9}#kladr_autocomplete a{text-decoration:none}#kladr_autocomplete strong{font-weight:700}#kladr_autocomplete a,#kladr_autocomplete strong,#kladr_autocomplete small{font-family:Helvetica,Arial,sans-serif;font-size:14px}#kladr_autocomplete small{color:#AAA;font-size:12px}#kladr_autocomplete .spinner{position:absolute;display:block;margin:0;padding:0;width:16px;height:16px;background:url("./images/spinner.png") center center no-repeat;z-index:9999}
public/local/templates/ВАШ ШАБЛОН/components/bitrix/sale.order.ajax/v1/jquery.fias.min.js
Здесь стандартный код кладр , скачать можно на сайте kladr-api ru или в исходниках
public/local/templates/ВАШ ШАБЛОН/components/bitrix/sale.order.ajax/v1/order_ajax.js
//Здесь будут только измененные строчки кода, шаблон Аспро Максимум
//строчка 4408:
regionContent.appendChild(regionNode);
///4411:
propsNodeCol = BX.create('DIV', {props: {className: 'bx-soa-properties js-form-address'}});
propsIterator = this.propertyCollection.getIterator();
while (property = propsIterator())
{
@@ -7046,7 +7046,7 @@ BX.namespace('BX.Sale.OrderAjaxComponent');
}
else
{
//7049:
BX.addClass(propsItemNode, "form-group bx-soa-customer-field field");//field add
if (property.isRequired())
textHtml += '<span class="bx-authform-starrequired">*</span> ';
@@ -7315,7 +7315,7 @@ BX.namespace('BX.Sale.OrderAjaxComponent');
}
else
{
//7318:
propContainer = BX.create('DIV', {props: {className: 'soa-property-container field'}});
property.appendTo(propContainer);
propsItemNode.appendChild(propContainer);
this.alterProperty(property.getSettings(), propContainer);
@@ -7451,10 +7451,14 @@ BX.namespace('BX.Sale.OrderAjaxComponent');
textNode.id = 'soa-property-' + settings.ID;
//7452:
if (settings.IS_ADDRESS == 'Y')
textNode.setAttribute('autocomplete', 'address');
//7454:
if (settings.NAME === 'Улица' ){
textNode.setAttribute('data-id', 'address');
textNode.setAttribute('data-id', 'street');
}
if (settings.NAME === 'Город' ){
textNode.setAttribute('data-id', 'city');
}
if (settings.NAME === 'Дом' ){
textNode.setAttribute('data-id', 'building');
}
7463:
if (settings.IS_EMAIL == 'Y')
textNode.setAttribute('autocomplete', 'email');
@@ -8704,4 +8708,4 @@ BX.namespace('BX.Sale.OrderAjaxComponent');
}, this));
}
};
})();
public/local/templates/ВАШ ШАБЛОН/components/bitrix/sale.order.ajax/v1/script.js
$( document ).ready(function() {
window.kladrStartForCity = function(){
jQuery('input[data-id="city"]').focus();
jQuery('input[data-id="city"]').click();
jQuery('input[data-id="city"]').focus(function(){
$(this).select();
});
jQuery('input[data-id="street"]').click();
jQuery('input[data-id="street"]').focus(function(){
$(this).select();
});
jQuery('input[data-id="street"]').click();
}
window.kladrInit = function(){
let $city = $('input[data-id=city]'),
$street = $('input[data-id=street]'),
$building = $('input[data-id=building]');
jQuery.fias.token='ЗДЕСЬ ПЛАТНЫЙ ТОКЕН';
jQuery.fias.url='https://kladr-api.com/api.php';//для платного, бесплатный kladr-api.ru/api.php
$.fias.setDefault({
parentInput: '.js-form-address',
verify: true,
change: function (obj) {
if (obj) {
setLabel($(this), obj.type);
if(obj.parents){
$.fias.setValues(obj.parents, '.js-form-address');
}
}
},
});
$city.fias('type', $.fias.type.city);
$street.fias('type', $.fias.type.street);
$building.fias('type', $.fias.type.building);
// Включаем получение родительских объектов для населённых пунктов
//$district.fias('withParents', true);
$city.fias('withParents', true);
$street.fias('withParents', true);
// Отключаем проверку введённых данных для строений
$building.fias('verify', false);
function setLabel($input, text) {
text = text.charAt(0).toUpperCase() + text.substr(1).toLowerCase();
$input.parent().find('label').text(text);
}
}
//откладываем загрузку, не идеально конечно
setTimeout(function(){
window.kladrInit();
}, 3100);
//подстраховка
$('body').on('input','input[data-id=city]', function(e) {
e.preventDefault();
window.kladrInit();
});
//переключение между вкладками физ./ юр. лицо
$('body').on('click','#bx-soa-region .form-group .radio-inline', function(e) {
setTimeout(function(){
window.kladrInit();
}, 3100);
});
});
На этом интеграция кладр завершена. Успехов в освоении!
Комментарии находятся на модерации или не добавлены.
Для добавления комментариев необходимо зарегистрироваться и авторизоваться
Также возможно авторизоваться через Социальную сеть Вконтакте (VK)