Карточка звонка

Выберите инструмент для разработки с AI-агентом:

используйте Битрикс24 Вайбкод, чтобы создать приложение для Битрикс24 по описанию задачи без знания языков программирования. Агент напишет код и разместит приложение на сервере без ручной настройки хостинга
используйте MCP-сервер, чтобы разрабатывать интеграцию через REST API в своем проекте. Агент будет обращаться к официальной REST-документации

Карточка звонка состоит из областей: заголовок, текст статуса и кнопки оператора. Каждую область меняет своя команда, а набор кнопок зависит от состояния интерфейса — всего их двенадцать. От состояния зависит и то, какие события придут приложению.

Команды и события, которыми управляют карточкой, перечислены в обзоре раздела Управление карточкой звонка WebRTC-клиента: обзор команд и событий, порядок регистрации обработчика — на странице Сценарий встраивания WebRTC.

Общее описание

Рассмотрим карточку звонка:

sip_app1

Чтобы изменить заголовок карточки (область 1), вызовите команду CallCardSetCardTitle и передайте объект со свойством title.

BX24.placement.call('CallCardSetCardTitle', { title: 'Card Title' }, () => {
    // some code
});

Чтобы изменить текст в области 2, вызовите команду CallCardSetStatusText и передайте объект со свойством statusText.

BX24.placement.call('CallCardSetStatusText', { statusText: 'Status Text' }, () => {
    // some code
});

Всего у карточки звонка 12 состояний интерфейса. Получить их можно командой CallCardGetListUiStates. В функцию обратного вызова будет передан массив с доступными состояниями карточки звонка.

BX24.placement.call('CallCardGetListUiStates', {}, (data) => {
    console.log(data);
});

Переход на другое состояние карточки выполняет команда CallCardSetUiState: передайте ей объект со свойством uiState.

BX24.placement.call('CallCardSetUiState', { uiState: 'connected' }, () => {
    // some code
});

Чтобы обрабатывать нажатия оператором кнопок в карточке звонка, подпишитесь на соответствующие события — см. Обзор событий при работе с карточкой звонка WebRTC-клиента.

Состояния карточки

Состояние	Описание	Обрабатывается нажатие кнопок
incoming	Для принятия входящих звонков	Ответить - `BackgroundCallCard::answerButtonClick` Пропустить - `BackgroundCallCard::skipButtonClick`
transferIncoming	Для принятия перенаправленного входящего вызова	Ответить - `BackgroundCallCard::answerButtonClick` Пропустить - `BackgroundCallCard::skipButtonClick`
outgoing	Для показа карточки исходящего звонка	Позвонить - `BackgroundCallCard::makeCallButtonClick`
connectingIncoming	Для показа карточки в момент подключения к входящему звонку	Завершить - `BackgroundCallCard::hangupButtonClick`
connectingOutgoing	Для показа карточки в момент подключения к исходящему звонку	Завершить - `BackgroundCallCard::hangupButtonClick`
connected	Для показа после подключения к звонку	Завершить - `BackgroundCallCard::hangupButtonClick` Поставить на удержание - `BackgroundCallCard::holdButtonClick` Выключить микрофон - `BackgroundCallCard::muteButtonClick` Перенаправить на другого оператора - `BackgroundCallCard::transferButtonClick` Нажатие на кнопки цифровой клавиатуры - `BackgroundCallCard::dialpadButtonClick` Оценить качество связи - `BackgroundCallCard::qualityMeterClick`
transferring	Для подтверждения перенаправления звонка на другого оператора	Перенаправить - `BackgroundCallCard::completeTransferButtonClick` Вернуться к звонку - `BackgroundCallCard::cancelTransferButtonClick`
transferFailed	Если перенаправить звонок не получилось	Вернуться к звонку - `BackgroundCallCard::cancelTransferButtonClick`
transferConnected	Если перенаправление завершилось успешно и требуется выйти из карточки звонка	Завершить - `BackgroundCallCard::hangupButtonClick`
error	Если произошла некоторая ошибка	Закрыть - `BackgroundCallCard::closeButtonClick`
moneyError	Если на счету закончились деньги и требуется проинформировать об этом администратора Битрикс24	Уведомить администратора - `BackgroundCallCard::notifyAdminButtonClick` Закрыть - `BackgroundCallCard::closeButtonClick`
redial	Если абонент занят, дать возможность оператору повторно позвонить на этот номер, не скрывая карточку звонка	Перезвонить - `BackgroundCallCard::makeCallButtonClick`
Таймер в карточке звонка	По умолчанию, при переходе на состояние `connected` автоматически включается таймер звонка. Данное поведение можно отключить, передав помимо `uiState: 'connected'` еще свойство `disableAutoStartTimer` со значением `true`. При переходе же на другие состояния таймер будет останавливаться.