Эрмитаж для компонента

В 1С-Битрикс управление сайтом есть замечательная возможность, которую очень ценят контент-менеджеры. Если вы используете свой собственный компонент, вам могут понадобится кнопки управления элементом в публичной части. Запрограммированный правильным образом сайт имеет возможность, при включенном режиме редактирования наведя курсор например на товар, выполнить действия:

Изменить
Удалить
Добавить

Если планируете поменять информацию, жмем изменить. При этом всплывет окошко со всеми теми же полями и вкладками, что и при обычном редактировании из админки, но нам уже не нужно искать соответствующий элемент инфоблока и идти по структуре каталога.

Программирование кнопок

Есть два способа добавить кнопки в компонент, способы нужно использовать в зависимости от ситуации.

При помощи AddIncludeAreaIcons () и AddIncludeAreaIcon ()

Основное отличие методов AddIncludeAreaIcons() и AddIncludeAreaIcon() заключается в том, что нет необходимости добавлять ID к обертке в файле template.php.

Метод AddIncludeAreaIcons() добавляет массив новых кнопок к тем кнопкам компонента, которые отображаются в области компонента в режиме редактирования сайта. Метод AddIncludeAreaIcon() добавляет новую кнопку к тем кнопкам компонента, которые отображаются в области компонента в режиме редактирования сайта.

AddIncludeAreaIcons многочисленное добавление кнопок

component.php// проверяем на нажатие кнопки "Режим правки"
if ($APPLICATION->GetShowIncludeAreas()) {
    // ссылки для экшенов и название кнопки
    $arButtons = CIBlock::GetPanelButtons(
        // идентификатор инфоблока, которому принадлежит элемент
        $arResult["IBLOCK_ID"],
        // идентификатор текущего элемента информационного блока
        $arResult["ID"],
        // идентификатор раздела инфоблока (при наличии)
        0,
        // массив, содержащий локализацию названий
        array("SECTION_BUTTONS" => false, "SESSID" => false)
    );

    // формируем массив с кнопками
    $buttons = [
        [
            'URL' => $arButtons["edit"]["add_element"]["ACTION"],
            'TITLE' => $arButtons["edit"]["add_element"]["TEXT"],
            'ICON' => $arButtons["edit"]["add_element"]["ICON"]
        ],
        [
            'URL' => $arButtons["edit"]["edit_element"]["ACTION"],
            'TITLE' => $arButtons["edit"]["edit_element"]["TEXT"],
            'ICON' => $arButtons["edit"]["edit_element"]["ICON"]
        ],
        [
            'URL' => $arButtons["edit"]["delete_element"]["ACTION"],
            'TITLE' => $arButtons["edit"]["delete_element"]["TEXT"],
            'ICON' => $arButtons["edit"]["delete_element"]["ICON"]
        ]
    ];

    // вызываем метод и передаем в него массив нужных кнопок
    $this->AddIncludeAreaIcons($buttons);
}

AddIncludeAreaIcon добавление одной кнопоки

component.php// проверяем на нажатие кнопки "Режим правки"
if ($APPLICATION->GetShowIncludeAreas()) {
    // ссылки для экшенов и название кнопки
    $arButtons = CIBlock::GetPanelButtons(
        // идентификатор инфоблока, которому принадлежит элемент
        $arResult["IBLOCK_ID"],
        // идентификатор текущего элемента информационного блока
        $arResult["ID"],
        // идентификатор раздела инфоблока (при наличии)
        0,
        // массив, содержащий локализацию названий
        array("SECTION_BUTTONS" => false, "SESSID" => false)
    );

    // формируем массив с кнопками
    $buttons = [
        'URL' => $arButtons["edit"]["add_element"]["ACTION"],
        'TITLE' => $arButtons["edit"]["add_element"]["TEXT"],
        'ICON' => $arButtons["edit"]["add_element"]["ICON"]
    ];

    // вызываем метод и передаем в него массив кнопки
    $this->AddIncludeAreaIcon($buttons);
}

Простое добавление

Задается id для DOM элемента в html через метод $this->GetEditAreaId($arElement["ID"]) в который параметром передается id инфоблока который в данном случае берем из массива $arElement["ID"]. DOM элемент является контейнером при отображении информации об элементе инфоблока на странице, например если это div:

template.php// проверка на администратора для вывода экшенов
if ($USER->IsAdmin() && $APPLICATION->GetShowIncludeAreas()) {
    echo '<div class="swiper-slide" id="' . $this->GetEditAreaId($arElement["ID"]) . '">';
} else {
    echo '<div class="swiper-slide">';
}

Для того чтобы добавить кнопки, нужно создать файл component_epilog.php и затем в этом файле нужно добавить экшены к вашим кнопкам.

component_epilog.php// Ссылки для экшенов и название кнопки
$arButtons = CIBlock::GetPanelButtons(
    // Идентификатор инфоблока, которому принадлежит элемент
    $arResult["IBLOCK_ID"],
    // Идентификатор текущего элемента информационного блока
    $arResult["ID"],
    // Идентификатор раздела инфоблока (при наличии)
    0,
    // Массив, содержащий локализацию названий
    array("SECTION_BUTTONS" => false, "SESSID" => false)
);
// Экшен изменения элемента
$this->AddEditAction(
    // Идентификатор текущего элемента информационного блока
    $arResult["ID"],
    // Ссылка из $arButtons на изменение эллемента
    $arButtons["edit"]["edit_element"]["ACTION_URL"],
    // Название кнопки
    $arButtons["edit"]["edit_element"]["TEXT"]
);
// Экшен добавления элемента
$this->AddEditAction(
    // Идентификатор текущего элемента информационного блока
    $arResult["ID"],
    // Ссылка из $arButtons на добавление эллемента
    $arButtons["edit"]["add_element"]["ACTION_URL"],
    // Название кнопки
    $arButtons["edit"]["add_element"]["TEXT"]
);
// Экшен удаления элемента
$this->AddDeleteAction(
    // Идентификатор текущего элемента информационного блока
    $arResult["ID"],
    // Ссылка из $arButtons на удаление эллемента
    $arButtons["edit"]["delete_element"]["ACTION_URL"],
    // Название кнопки
    $arButtons["edit"]["delete_element"]["TEXT"],
    array("CONFIRM" => "Удалить?")
);

Бывают случаи, когда элементы инфоблока образуются в цикле. Реальный пример, это обычная карусель выводимая из информационного блока. В этом случае единственный вариант получить у каждого элемента пропущеного через цикл кнопки управления, добавить код непосредственно в файл template.php, а вводные данные получить из массива $arResult:

template.php<? if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED !== true) die(); ?>
<section>
    <div class="container product_slider">
        <div class="swiper mySwiper4">
            <div class="swiper-wrapper">
                <? foreach ($arResult as $arElement) : ?>
                    <?
                    // ссылки для экшенов и название кнопки
                    $arButtons = CIBlock::GetPanelButtons(
                        // идентификатор инфоблока, которому принадлежит элемент
                        $arElement["IBLOCK_ID"],
                        // идентификатор текущего элемента информационного блока
                        $arElement["ID"],
                        // идентификатор раздела инфоблока (при наличии)
                        0,
                        // массив, содержащий локализацию названий
                        array("SECTION_BUTTONS" => false, "SESSID" => false)
                    );
                    // экшен изменения элемента
                    $this->AddEditAction(
                        // идентификатор текущего элемента информационного блока
                        $arElement["ID"],
                        // ссылка из $arButtons на изменение эллемента
                        $arButtons["edit"]["edit_element"]["ACTION_URL"],
                        // название кнопки
                        $arButtons["edit"]["edit_element"]["TEXT"]
                    );
                    // экшен добавления элемента
                    $this->AddEditAction(
                        // идентификатор текущего элемента информационного блока
                        $arElement["ID"],
                        // ссылка из $arButtons на изменение эллемента
                        $arButtons["edit"]["add_element"]["ACTION_URL"],
                        // название кнопки
                        $arButtons["edit"]["add_element"]["TEXT"]
                    );
                    // экшен удаления элемента
                    $this->AddDeleteAction(
                        // идентификатор текущего элемента информационного блока
                        $arElement["ID"],
                        // ссылка из $arButtons на изменение эллемента
                        $arButtons["edit"]["delete_element"]["ACTION_URL"],
                        // название кнопки
                        $arButtons["edit"]["delete_element"]["TEXT"],
                        array("CONFIRM" => "Удалить?")
                    ); ?>
                    <?
                    // проверка на администратора для вывода экшенов
                    if ($USER->IsAdmin() && $APPLICATION->GetShowIncludeAreas()) {
                        echo '<div class="swiper-slide" id="' . $this->GetEditAreaId($arElement["ID"]) . '">';
                    } else {
                        echo '<div class="swiper-slide">';
                    }
                    ?>
                    <div class="product">
                        <div class="item">
                            <div class="row">
                                <div class="col-8 title"><?= $arElement["PROPERTY_ID_2_ZAGOLOVOK_VALUE"] ?></div>
                                <div class="col-4 image"><img src="<?= "/local/templates/hmarketing/img/svg/icons/" . preg_replace('#[a-z]{3,4}$#', 'svg', $arElement["PREVIEW_PICTURE"]["ORIGINAL_NAME"], 1) ?>" alt="<?= $arElement["PREVIEW_PICTURE"]["DESCRIPTION"] ?>" width="40" height="40"></div>
                                <div class="col-12 tekst"><?= $arElement["PROPERTY_ID_2_TEXT_VALUE"] ?></div>
                                <div class="col-12 button">Узнать больше<span class="icon-arrow-right"></div>
                            </div>
                        </div>
                        <div class="hover swiper-lazy" data-background="<?= $arElement["PROPERTY_ID_2_KARTINKA_VALUE"]["SRC"] ?>">
                            <div class="row">
                                <div class="col-12 title"><?= $arElement["PROPERTY_ID_2_ZAGOLOVOKHOVER_VALUE"] ?></div>
                                <div class="col-12 tekst"><?= $arElement["PROPERTY_ID_2_TEXTHOVER_VALUE"] ?></div>
                                <div class="col-12 button"><a href="<?= $arElement["PROPERTY_ID_2_HREF_VALUE"] ?>">Жми подробнее... <span class="icon-arrow-right"></span></a></div>
                            </div>
                        </div>
                    </div>
                    <? echo '</div>'; ?>
                <? endforeach ?>
            </div>
            <div class="slider-nav">
                <div class="swiper-prev"></div>
                <div class="swiper-indicators"></div>
                <div class="swiper-next"></div>
            </div>
        </div>
</section>