### Initialize and Use JavaScript/Node.js SDK for Bitrix24

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Shows how to initialize the JavaScript SDK within a Bitrix24 iframe application and perform actions like getting user info, creating tasks, and making batch requests. Requires npm installation.

```javascript
// Установка через npm
// npm install @bitrix24/b24jssdk

import { B24Frame, LoggerBrowser } from '@bitrix24/b24jssdk'

// Инициализация в iframe-приложении Bitrix24
const $logger = LoggerBrowser.build('MyApp', import.meta.env.DEV)
const $b24 = new B24Frame()

async function initApp() {
    try {
        await $b24.init()

        // Получение информации о текущем пользователе
        const currentUser = await $b24.callMethod('user.current')
        console.log('Текущий пользователь:', currentUser.data.result)

        // Создание задачи
        const taskResult = await $b24.callMethod('tasks.task.add', {
            fields: {
                TITLE: 'Новая задача из приложения',
                DESCRIPTION: 'Описание задачи',
                RESPONSIBLE_ID: currentUser.data.result.ID,
                DEADLINE: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString(),
                PRIORITY: 2
            }
        })
        console.log('Создана задача ID:', taskResult.data.result.task.id)

        // Batch-запрос для получения нескольких сущностей
        const batchResult = await $b24.callBatch({
            users: ['user.get', { filter: { ACTIVE: true } }],
            departments: ['department.get', {}],
            deals: ['crm.deal.list', { select: ['ID', 'TITLE', 'OPPORTUNITY'] }]
        })

        console.log('Пользователи:', batchResult.users.data.result)
        console.log('Отделы:', batchResult.departments.data.result)
        console.log('Сделки:', batchResult.deals.data.result)

    } catch (error) {
        $logger.error('Ошибка инициализации:', error)
    }
}

initApp()

```

--------------------------------

### Initialize and Use Python SDK for Bitrix24

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Shows how to initialize the Python SDK using a webhook URL and perform operations like listing CRM deals and adding contacts. Requires pip installation.

```python
# Установка через pip
# pip install b24pysdk

from b24pysdk import Bitrix24

# Инициализация через вебхук
b24 = Bitrix24(
    webhook='https://your-domain.bitrix24.ru/rest/1/your-webhook-token/'
)

# Получение списка сделок CRM
deals = b24.call('crm.deal.list', {
    'select': ['ID', 'TITLE', 'OPPORTUNITY', 'STAGE_ID', 'ASSIGNED_BY_ID'],
    'filter': {'>OPPORTUNITY': 10000},
    'order': {'OPPORTUNITY': 'DESC'}
})

for deal in deals.get('result', []):
    print(f"Сделка {deal['ID']}: {deal['TITLE']} - {deal['OPPORTUNITY']} руб.")

# Создание контакта
new_contact = b24.call('crm.contact.add', {
    'fields': {
        'NAME': 'Алексей',
        'LAST_NAME': 'Смирнов',
        'EMAIL': [{'VALUE': 'alexey@example.com', 'VALUE_TYPE': 'WORK'}],
        'PHONE': [{'VALUE': '+79009876543', 'VALUE_TYPE': 'MOBILE'}],
        'SOURCE_ID': 'WEBFORM'
    }
})
print(f"Создан контакт ID: {new_contact['result']}")

```

--------------------------------

### Initialize and Use PHP SDK for Bitrix24 CRM

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Demonstrates initializing the PHP SDK using a webhook URL and performing operations like listing contacts and creating leads. Ensure you have the SDK installed via Composer.

```php
<?php
// Установка через Composer
// composer require bitrix24/b24phpsdk

use Bitrix24\SDK\Core\Credentials\WebhookUrl;
use Bitrix24\SDK\Services\ServiceBuilderFactory;

// Инициализация SDK через вебхук
$webhookUrl = new WebhookUrl('https://your-domain.bitrix24.ru/rest/1/your-webhook-token/');
$serviceBuilder = ServiceBuilderFactory::createServiceBuilderFromWebhook($webhookUrl);

// Получение списка контактов CRM
$contacts = $serviceBuilder->getCRMScope()->contact()->list(
    select: ['ID', 'NAME', 'LAST_NAME', 'EMAIL', 'PHONE'],
    filter: ['>=DATE_CREATE' => '2024-01-01'],
    order: ['ID' => 'DESC'],
    start: 0
);

foreach ($contacts->getContacts() as $contact) {
    echo sprintf(
        "ID: %d, Имя: %s %s\n",
        $contact->ID,
        $contact->NAME,
        $contact->LAST_NAME
    );
}

// Создание нового лида
$result = $serviceBuilder->getCRMScope()->lead()->add([
    'TITLE' => 'Новый лид из интеграции',
    'NAME' => 'Иван',
    'LAST_NAME' => 'Петров',
    'EMAIL' => [['VALUE' => 'ivan@example.com', 'VALUE_TYPE' => 'WORK']],
    'PHONE' => [['VALUE' => '+79001234567', 'VALUE_TYPE' => 'MOBILE']],
    'SOURCE_ID' => 'WEB'
]);

echo "Создан лид с ID: " . $result->getId();

```

--------------------------------

### Configure Tailwind CSS with Bitrix24 Design Tokens

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Integrate Bitrix24 design tokens into your Tailwind CSS configuration for visually consistent interfaces. Install the package via npm.

```javascript
// tailwind.config.js
// npm install @bitrix24/b24style

import { b24StylePreset } from '@bitrix24/b24style'

export default {
  presets: [b24StylePreset],
  content: ['./src/**/*.{vue,js,ts,jsx,tsx}'],
  theme: {
    extend: {
      // Дополнительные настройки при необходимости
    }
  }
}
```

--------------------------------

### Use Bitrix24 Icons in Vue Applications

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Incorporate SVG icons from the Bitrix24 icon library into your Vue applications. Install via npm and import individual icons for use.

```vue
<!-- Установка через npm -->
<!-- npm install @bitrix24/b24icons -->

<template>
  <div class="icon-examples">
    <!-- Импорт отдельных иконок -->
    <IconSettings class="icon" />
    <IconUser class="icon" />
    <IconCalendar class="icon" />
    <IconTask class="icon" />
    <IconDeal class="icon" />

    <!-- Использование с кнопками -->
    <button class="btn-icon">
      <IconPlus />
      <span>Добавить</span>
    </button>

    <!-- Динамический размер и цвет -->
    <IconNotification
      :size="24"
      color="var(--b24-color-primary)"
    />
  </div>
</template>

<script setup>
import {
  IconSettings,
  IconUser,
  IconCalendar,
  IconTask,
  IconDeal,
  IconPlus,
  IconNotification
} from '@bitrix24/b24icons'
</script>

<style>
.icon {
  width: 20px;
  height: 20px;
  color: var(--b24-icon-color);
}

.btn-icon {
  display: flex;
  align-items: center;
  gap: 8px;
}
</style>
```

--------------------------------

### Apply Bitrix24 UI Classes for Styling

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Use utility classes from the Bitrix24 design system to style HTML elements, ensuring visual consistency with the Bitrix24 interface. Includes examples for text, buttons, and grid layouts.

```html
<!-- Использование классов Bitrix24 в разметке -->
<div class="bg-b24-primary text-b24-white p-b24-md rounded-b24">
  <h1 class="text-b24-heading font-b24-bold">Заголовок</h1>
  <p class="text-b24-secondary mt-b24-sm">Описание элемента</p>

  <button class="bg-b24-accent hover:bg-b24-accent-hover text-b24-white
                 px-b24-lg py-b24-sm rounded-b24-sm transition-b24">
    Действие
  </button>
</div>

<!-- Адаптивная сетка в стиле Bitrix24 -->
<div class="grid grid-cols-b24-3 gap-b24-md">
  <div class="bg-b24-surface shadow-b24-card p-b24-md">Карточка 1</div>
  <div class="bg-b24-surface shadow-b24-card p-b24-md">Карточка 2</div>
  <div class="bg-b24-surface shadow-b24-card p-b24-md">Карточка 3</div>
</div>
```

--------------------------------

### Integrate Bitrix24 UI Kit Components in Vue/Nuxt

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Utilize the Bitrix24 UI Kit (b24ui) for Vue/Nuxt applications to build web interfaces with reusable UI elements. Install via npm.

```vue
<!-- Установка через npm -->
<!-- npm install @bitrix24/b24ui -->

<template>
  <B24Layout>
    <B24Header title="Моё приложение" />

    <B24Content>
      <!-- Кнопки -->
      <B24Button
        variant="primary"
        @click="handleSave"
        :loading="isSaving"
      >
        Сохранить
      </B24Button>

      <B24Button variant="secondary" @click="handleCancel">
        Отмена
      </B24Button>

      <!-- Форма ввода -->
      <B24Input
        v-model="formData.title"
        label="Название"
        placeholder="Введите название"
        :error="errors.title"
      />

      <B24Select
        v-model="formData.status"
        label="Статус"
        :options="statusOptions"
      />

      <!-- Таблица данных -->
      <B24Table
        :columns="columns"
        :data="tableData"
        :loading="isLoading"
        @row-click="handleRowClick"
      />

      <!-- Модальное окно -->
      <B24Modal v-model="showModal" title="Подтверждение">
        <p>Вы уверены, что хотите выполнить это действие?</p>
        <template #footer>
          <B24Button @click="confirmAction">Подтвердить</B24Button>
          <B24Button variant="ghost" @click="showModal = false">Отмена</B24Button>
        </template>
      </B24Modal>
    </B24Content>
  </B24Layout>
</template>

<script setup>
import { ref, reactive } from 'vue'
import {
  B24Layout, B24Header, B24Content,
  B24Button, B24Input, B24Select,
  B24Table, B24Modal
} from '@bitrix24/b24ui'

const isSaving = ref(false)
const isLoading = ref(false)
const showModal = ref(false)

const formData = reactive({
  title: '',
  status: null
})

const statusOptions = [
  { value: 'new', label: 'Новый' },
  { value: 'in_progress', label: 'В работе' },
  { value: 'done', label: 'Завершён' }
]

const columns = [
  { key: 'id', label: 'ID' },
  { key: 'title', label: 'Название' },
  { key: 'status', label: 'Статус' }
]

const tableData = ref([])

async function handleSave() {
  isSaving.value = true
  // Логика сохранения
  isSaving.value = false
}
</script>
```

--------------------------------

### Minimal Bitrix24 REST API Integration with crest

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

This snippet demonstrates the basic setup and usage of the crest PHP library for interacting with the Bitrix24 REST API. Ensure crest.php is downloaded and the webhook URL is correctly configured.

```php
<?php
// Минимальная интеграция с crest
// Скачайте crest.php из репозитория https://github.com/bitrix-tools/crest

require_once 'crest.php';

// Настройка вебхука
define('C_REST_WEB_HOOK_URL', 'https://your-domain.bitrix24.ru/rest/1/your-webhook-token/');

// Простой вызов метода API
$userResult = CRest::call('user.current');
print_r($userResult);

// Получение списка лидов с фильтрацией
$leads = CRest::call('crm.lead.list', [
    'select' => ['ID', 'TITLE', 'STATUS_ID', 'OPPORTUNITY'],
    'filter' => ['STATUS_ID' => 'NEW'],
    'order' => ['ID' => 'DESC']
]);

foreach ($leads['result'] as $lead) {
    echo "Лид #{$lead['ID']}: {$lead['TITLE']}
";
}

// Batch-запрос для создания нескольких сущностей
$batchResult = CRest::callBatch([
    'lead1' => ['crm.lead.add', ['fields' => ['TITLE' => 'Лид 1', 'SOURCE_ID' => 'WEB']]],
    'lead2' => ['crm.lead.add', ['fields' => ['TITLE' => 'Лид 2', 'SOURCE_ID' => 'WEB']]],
    'deal1' => ['crm.deal.add', ['fields' => ['TITLE' => 'Сделка 1', 'STAGE_ID' => 'NEW']]]
]);

print_r($batchResult);
?>
```

--------------------------------

### Perform Batch Operations with Bitrix24 REST API

Source: https://context7.com/bitrix-tools/bitrix24-dev-hub/llms.txt

Use batch requests to execute multiple Bitrix24 REST API calls in a single request. This is useful for performing mass operations efficiently.

```python
batch_commands = {
    'contact1': ['crm.contact.add', {'fields': {'NAME': 'Контакт 1', 'LAST_NAME': 'Тест'}}],
    'contact2': ['crm.contact.add', {'fields': {'NAME': 'Контакт 2', 'LAST_NAME': 'Тест'}}],
    'contact3': ['crm.contact.add', {'fields': {'NAME': 'Контакт 3', 'LAST_NAME': 'Тест'}}]
}

batch_result = b24.call_batch(batch_commands)
print(f"Созданы контакты: {batch_result}")
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.