Эти маленькие «печеньки» (файлы cookie) помогают сайту запомнить ваши настройки, например, язык или выбранные параметры. Так, при каждом новом посещении вы будете чувствовать себя как дома. Примите их, чтобы сделать сайт своим!
Соглашение на обработку персональных данных
Текст соглашения на обработку данных:
Настоящим в соответствии с Федеральным законом № 152-ФЗ «О персональных данных» от 27.07.2006 года Вы подтверждаете свое согласие на обработку ИП Башкатов К.Ю. персональных данных: сбор, систематизацию, накопление, хранение, уточнение (обновление, изменение), использование, передачу исключительно в целях продажи программного обеспечения на Ваше имя, как это описано ниже, блокирование, обезличивание, уничтожение.
ИП Башкатов К.Ю. гарантирует конфиденциальность получаемой информации. Обработка персональных данных осуществляется в целях эффективного исполнения заказов, договоров и иных обязательств, принятых ИП Башкатов К.Ю. в качестве обязательных к исполнению.
В случае необходимости предоставления Ваших персональных данных правообладателю, дистрибьютору или реселлеру программного обеспечения в целях регистрации программного обеспечения на ваше имя, вы даёте согласие на передачу ваших персональных данных. ИП Башкатов К.Ю. гарантирует, что правообладатель, дистрибьютор или реселлер программного обеспечения осуществляет защиту персональных данных на условиях, аналогичных изложенным в Политике конфиденциальности персональных данных.
Настоящее согласие распространяется на следующие Ваши персональные данные: фамилия, имя и отчество, адрес электронной почты, почтовый адрес доставки заказов, контактный телефон, платёжные реквизиты.
Компания имеет право отправлять Пользователю уведомления о новых продуктах и услугах, специальных предложениях и различных событиях. Пользователь может отказаться от получения сообщений, направив Компании письмо на адрес электронной почты info@o2it.ru с пометкой «Отказ от уведомлений».
Срок действия согласия является неограниченным. Вы можете в любой момент отозвать настоящее согласие, направив письменное уведомления на адрес: 195220, г. Санкт-Петербург, пр-т Непокорённых, 49к2, кв. 366
с пометкой «Отзыв согласия на обработку персональных данных».
Обращаем ваше внимание, что отзыв согласия на обработку персональных данных влечёт за собой удаление Вашей учётной записи с Интернет-сайта o2it.com, а также уничтожение записей, содержащих ваши персональные данные, в системах обработки персональных данных компании ИП Башкатов К.Ю., что может сделать невозможным пользование интернет-сервисами ИП Башкатов К.Ю..
Гарантирую, что представленная мной информация является полной, точной и достоверной, а также что при представлении информации не нарушаются действующее законодательство Российской Федерации, законные права и интересы третьих лиц. Вся представленная информация заполнена мною в отношении себя лично.
Настоящее согласие действует в течение всего периода хранения персональных данных, если иное не предусмотрено законодательством Российской Федерации.
Настоящим в соответствии с Федеральным законом № 152-ФЗ «О персональных данных» от 27.07.2006 года Вы подтверждаете свое согласие на обработку ИП Башкатов К.Ю. персональных данных: сбор, систематизацию, накопление, хранение, уточнение (обновление, изменение), использование, передачу исключительно в целях продажи программного обеспечения на Ваше имя, как это описано ниже, блокирование, обезличивание, уничтожение.
ИП Башкатов К.Ю. гарантирует конфиденциальность получаемой информации. Обработка персональных данных осуществляется в целях эффективного исполнения заказов, договоров и иных обязательств, принятых ИП Башкатов К.Ю. в качестве обязательных к исполнению.
В случае необходимости предоставления Ваших персональных данных правообладателю, дистрибьютору или реселлеру программного обеспечения в целях регистрации программного обеспечения на ваше имя, вы даёте согласие на передачу ваших персональных данных. ИП Башкатов К.Ю. гарантирует, что правообладатель, дистрибьютор или реселлер программного обеспечения осуществляет защиту персональных данных на условиях, аналогичных изложенным в Политике конфиденциальности персональных данных.
Настоящее согласие распространяется на следующие Ваши персональные данные: фамилия, имя и отчество, адрес электронной почты, почтовый адрес доставки заказов, контактный телефон, платёжные реквизиты.
Компания имеет право отправлять Пользователю уведомления о новых продуктах и услугах, специальных предложениях и различных событиях. Пользователь может отказаться от получения сообщений, направив Компании письмо на адрес электронной почты info@o2it.ru с пометкой «Отказ от уведомлений».
Срок действия согласия является неограниченным. Вы можете в любой момент отозвать настоящее согласие, направив письменное уведомления на адрес: 195220, г. Санкт-Петербург, пр-т Непокорённых, 49к2, кв. 366
с пометкой «Отзыв согласия на обработку персональных данных».
Обращаем ваше внимание, что отзыв согласия на обработку персональных данных влечёт за собой удаление Вашей учётной записи с Интернет-сайта o2it.com, а также уничтожение записей, содержащих ваши персональные данные, в системах обработки персональных данных компании ИП Башкатов К.Ю., что может сделать невозможным пользование интернет-сервисами ИП Башкатов К.Ю..
Гарантирую, что представленная мной информация является полной, точной и достоверной, а также что при представлении информации не нарушаются действующее законодательство Российской Федерации, законные права и интересы третьих лиц. Вся представленная информация заполнена мною в отношении себя лично.
Настоящее согласие действует в течение всего периода хранения персональных данных, если иное не предусмотрено законодательством Российской Федерации.
- Кастомизация карточки сделки через JavaScript для фокусировки внимания менеджеров
- Проблема: перегруженные карточки в проектных продажах
- Исследование: как Битрикс24 рендерит карточку сделки
- Техническое решение: JavaScript-скрипт в /local/js/
- Настройка карточки: поле-триггер и скрываемый раздел
- Результат: снижение когнитивной нагрузки
- Техническая реализация: от идеи до внедрения
- Ограничения и развитие решения
- Заключение
Кастомизация карточки сделки через JavaScript для фокусировки внимания менеджеров
В B2B-компаниях с проектными продажами менеджеры работают с карточками сделок, перегруженными полями. Особенно это касается проектов с госзаказами, где нужно анализировать конкурентную среду — но не в каждой сделке. Александр Федяков реализовал решение: раздел с полями о продукции конкурентов появляется в карточке только когда менеджер отмечает их присутствие в проекте. До этого момента блок скрыт, не отнимая внимание.
Решение работает через JavaScript-скрипт, который отслеживает состояние поля типа «да/нет» и управляет видимостью раздела через CSS-классы. Техническая реализация заняла несколько часов, но дала мгновенный эффект: карточки сделок стали чище, менеджеры фокусируются на актуальной информации.
Решение работает через JavaScript-скрипт, который отслеживает состояние поля типа «да/нет» и управляет видимостью раздела через CSS-классы. Техническая реализация заняла несколько часов, но дала мгновенный эффект: карточки сделок стали чище, менеджеры фокусируются на актуальной информации.
Проблема: перегруженные карточки в проектных продажах
В проектах с длительным циклом сделки карточка CRM накапливает десятки полей. Часть информации актуальна всегда — контакты заказчика, сумма контракта, стадия согласования. Другая часть нужна только в специфических ситуациях.
Продукция конкурента — типичный пример условной информации. В госзаказах и крупных проектах заказчик часто уже запроектировал оборудование конкурентов.
Менеджеру нужно знать:
Но эти поля не нужны в 60-70% сделок, где конкурентов в проекте нет. Раздел из 5-7 полей занимает место в карточке, менеджер каждый раз пролистывает его, тратя когнитивные ресурсы на игнорирование неактуальной информации.
«Когда менеджер работает с проектом и понимает, что здесь нет продукции конкурента, раздел не должен отнимать его внимание»
Продукция конкурента — типичный пример условной информации. В госзаказах и крупных проектах заказчик часто уже запроектировал оборудование конкурентов.
Менеджеру нужно знать:
- Какой бренд указан в проекте
- Технические характеристики конкурентного решения
- Возможность замены на собственную продукцию
- Аргументы для переговоров
Но эти поля не нужны в 60-70% сделок, где конкурентов в проекте нет. Раздел из 5-7 полей занимает место в карточке, менеджер каждый раз пролистывает его, тратя когнитивные ресурсы на игнорирование неактуальной информации.
«Когда менеджер работает с проектом и понимает, что здесь нет продукции конкурента, раздел не должен отнимать его внимание»
Исследование: как Битрикс24 рендерит карточку сделки
Стандартный Битрикс24 не предлагает условную видимость разделов через интерфейс. Можно скрыть отдельные поля через права доступа, но это статичное решение — поле либо видно всем, либо никому.
Александр начал с исследования HTML-структуры карточки сделки через инструменты разработчика браузера:
1. Открыл карточку сделки
2. Нашел в DOM-дереве раздел «Продукция конкурента»
3. Определил CSS-класс контейнера раздела
4. Протестировал прямо в консоли браузера: добавил `display: none` к классу
Раздел исчез. Это подтвердило гипотезу: управление видимостью через CSS работает, карточка не ломается.
Ключевое открытие: каждый раздел в карточке CRM обернут в `<div>` с уникальным классом. Битрикс24 генерирует классы на основе символьного кода раздела, что делает их стабильными между перезагрузками страницы. Оставалось решить: как переключать видимость динамически, в зависимости от значения поля.
Александр начал с исследования HTML-структуры карточки сделки через инструменты разработчика браузера:
1. Открыл карточку сделки
2. Нашел в DOM-дереве раздел «Продукция конкурента»
3. Определил CSS-класс контейнера раздела
4. Протестировал прямо в консоли браузера: добавил `display: none` к классу
Раздел исчез. Это подтвердило гипотезу: управление видимостью через CSS работает, карточка не ломается.
Ключевое открытие: каждый раздел в карточке CRM обернут в `<div>` с уникальным классом. Битрикс24 генерирует классы на основе символьного кода раздела, что делает их стабильными между перезагрузками страницы. Оставалось решить: как переключать видимость динамически, в зависимости от значения поля.
Техническое решение: JavaScript-скрипт в /local/js/
Решение реализовано через пользовательский JavaScript, который загружается на страницах карточек сделок.
Архитектура скрипта
Скрипт размещен в директории `/local/js/` — стандартное место для кастомных JS-файлов в Битрикс24 коробочной версии. Структура:
```
/local/js/
└── competitor_section/
└── script.js
```
Скрипт выполняет три функции:
1. Получение конфигурации
В коде прописаны два параметра:
2. Прослушивание состояния поля
Скрипт подписывается на событие изменения поля через API Битрикс24. Когда менеджер переключает чекбокс «Продукция конкурента запроектирована», срабатывает обработчик.
3. Управление видимостью раздела
В зависимости от значения поля:
Переключение происходит мгновенно, без перезагрузки страницы.
Логика работы
```javascript
// Псевдокод логики
if (поле_конкурент === 'Y') {
раздел.style.display = 'block';
} else {
раздел.style.display = 'none';
}
```
Скрипт инициализируется при загрузке карточки и проверяет текущее значение поля. Если сделка открывается со значением «Нет», раздел скрыт сразу. Если менеджер потом переключает на «Да», раздел плавно появляется.
Архитектура скрипта
Скрипт размещен в директории `/local/js/` — стандартное место для кастомных JS-файлов в Битрикс24 коробочной версии. Структура:
```
/local/js/
└── competitor_section/
└── script.js
```
Скрипт выполняет три функции:
1. Получение конфигурации
В коде прописаны два параметра:
- Символьный код поля типа «да/нет» (например, `UF_CRM_COMPETITOR_EXISTS`)
- CSS-класс раздела для скрытия (например, `.crm-entity-widget-content-block-competitor`)
2. Прослушивание состояния поля
Скрипт подписывается на событие изменения поля через API Битрикс24. Когда менеджер переключает чекбокс «Продукция конкурента запроектирована», срабатывает обработчик.
3. Управление видимостью раздела
В зависимости от значения поля:
- Да → удаляет `display: none`, раздел появляется
- Нет → добавляет `display: none`, раздел скрывается
Переключение происходит мгновенно, без перезагрузки страницы.
Логика работы
```javascript
// Псевдокод логики
if (поле_конкурент === 'Y') {
раздел.style.display = 'block';
} else {
раздел.style.display = 'none';
}
```
Скрипт инициализируется при загрузке карточки и проверяет текущее значение поля. Если сделка открывается со значением «Нет», раздел скрыт сразу. Если менеджер потом переключает на «Да», раздел плавно появляется.
Настройка карточки: поле-триггер и скрываемый раздел
Для работы решения нужны два элемента в карточке сделки.
Поле типа «да/нет»
Создано пользовательское поле:
- Название: «Продукция конкурента запроектирована»
- Тип: Да/Нет (чекбокс)
- Код: `UF_CRM_COMPETITOR_EXISTS`
- Расположение: в верхней части карточки, видно без прокрутки
Менеджер видит поле на каждой сделке. Когда он выясняет, что в проекте заказчика указано оборудование конкурентов, ставит галочку.
«Он отмечает, когда выясняет, что продукция конкурента запроектирована, и после этого появляется раздел»
Раздел с полями о конкурентах
Создан отдельный раздел в карточке сделки:
- Название: «Продукция конкурента»
- Поля внутри:
- Производитель (список)
- Модель оборудования (строка)
- Технические характеристики (текст)
- Возможность замены (список: да/нет/частично)
- Комментарий для переговоров (текст)
Раздел содержит 5-7 полей в зависимости от специфики компании. Все они относятся только к ситуации с конкурентами.
Связь элементов
Скрипт связывает поле и раздел:
Данные в полях раздела сохраняются даже когда блок скрыт. Если менеджер заполнил информацию, потом снял галочку, а через неделю поставил снова — данные на месте.
Поле типа «да/нет»
Создано пользовательское поле:
- Название: «Продукция конкурента запроектирована»
- Тип: Да/Нет (чекбокс)
- Код: `UF_CRM_COMPETITOR_EXISTS`
- Расположение: в верхней части карточки, видно без прокрутки
Менеджер видит поле на каждой сделке. Когда он выясняет, что в проекте заказчика указано оборудование конкурентов, ставит галочку.
«Он отмечает, когда выясняет, что продукция конкурента запроектирована, и после этого появляется раздел»
Раздел с полями о конкурентах
Создан отдельный раздел в карточке сделки:
- Название: «Продукция конкурента»
- Поля внутри:
- Производитель (список)
- Модель оборудования (строка)
- Технические характеристики (текст)
- Возможность замены (список: да/нет/частично)
- Комментарий для переговоров (текст)
Раздел содержит 5-7 полей в зависимости от специфики компании. Все они относятся только к ситуации с конкурентами.
Связь элементов
Скрипт связывает поле и раздел:
- Менеджер открывает карточку → скрипт проверяет значение поля
- Поле = «Нет» → раздел скрыт
- Менеджер ставит галочку → скрипт переключает `display: block`
- Раздел появляется, менеджер заполняет поля о конкурентах
- Если менеджер снимает галочку → раздел снова скрывается
Данные в полях раздела сохраняются даже когда блок скрыт. Если менеджер заполнил информацию, потом снял галочку, а через неделю поставил снова — данные на месте.
Результат: снижение когнитивной нагрузки
Решение дало эффект сразу после внедрения.
Чистота интерфейса
Карточки сделок стали компактнее. В 60−70% проектов, где конкурентов нет, менеджеры видят только релевантные поля. Раздел из 5−7 полей не занимает место, не требует прокрутки.
До внедрения: менеджер открывает карточку → видит раздел «Продукция конкурента» → мысленно отмечает «здесь конкурентов нет, пропускаю» → прокручивает дальше. Это микродействие, но оно повторяется десятки раз в день.
После внедрения: менеджер открывает карточку → раздела нет → сразу переходит к актуальным полям. Ноль отвлечений.
Фокус на актуальной информации
Когда конкуренты есть, раздел появляется в нужный момент. Менеджер переключил поле — сразу видит блок для заполнения. Не нужно искать поля в общей массе, они сгруппированы и выделены появлением.
Психологический эффект: появление раздела сигнализирует «это важно, заполни сейчас». Менеджер не откладывает заполнение, потому что контекст свежий — он только что выяснил информацию о конкурентах.
Применимость паттерна
Решение универсально для любых условных блоков информации:
— Работа с дилерами: раздел «Условия дилерского контракта» появляется только если клиент — дилер
— Лизинговые сделки: блок «Параметры лизинга» показывается когда выбрана оплата через лизинг
— Проекты с субподрядчиками: раздел «Субподряд» виден только если в проекте участвуют подрядчики
— Гарантийные случаи: поля о гарантии появляются если сделка связана с гарантийным обслуживанием
Принцип один: есть условие (поле да/нет или список) → есть зависимый раздел → скрипт управляет видимостью.
Чистота интерфейса
Карточки сделок стали компактнее. В 60−70% проектов, где конкурентов нет, менеджеры видят только релевантные поля. Раздел из 5−7 полей не занимает место, не требует прокрутки.
До внедрения: менеджер открывает карточку → видит раздел «Продукция конкурента» → мысленно отмечает «здесь конкурентов нет, пропускаю» → прокручивает дальше. Это микродействие, но оно повторяется десятки раз в день.
После внедрения: менеджер открывает карточку → раздела нет → сразу переходит к актуальным полям. Ноль отвлечений.
Фокус на актуальной информации
Когда конкуренты есть, раздел появляется в нужный момент. Менеджер переключил поле — сразу видит блок для заполнения. Не нужно искать поля в общей массе, они сгруппированы и выделены появлением.
Психологический эффект: появление раздела сигнализирует «это важно, заполни сейчас». Менеджер не откладывает заполнение, потому что контекст свежий — он только что выяснил информацию о конкурентах.
Применимость паттерна
Решение универсально для любых условных блоков информации:
— Работа с дилерами: раздел «Условия дилерского контракта» появляется только если клиент — дилер
— Лизинговые сделки: блок «Параметры лизинга» показывается когда выбрана оплата через лизинг
— Проекты с субподрядчиками: раздел «Субподряд» виден только если в проекте участвуют подрядчики
— Гарантийные случаи: поля о гарантии появляются если сделка связана с гарантийным обслуживанием
Принцип один: есть условие (поле да/нет или список) → есть зависимый раздел → скрипт управляет видимостью.
Техническая реализация: от идеи до внедрения
Весь процесс занял несколько часов.
Этап 1: Исследование (30 минут)
Результат: подтверждение технической возможности.
Этап 2: Написание скрипта (1 час)
Основная сложность: найти правильное событие API Битрикс24 для отслеживания изменения поля. Документация коробочной версии менее подробная, чем для облака, пришлось изучать исходники.
Этап 3: Интеграция (30 минут)
Решение работает в коробочной версии Битрикс24. Для облачной версии потребуется адаптация — скрипт нужно загружать через приложение или виджет.
Этап 4: Обучение команды (15 минут)
Менеджерам объяснили:
Адаптация прошла мгновенно, интерфейс интуитивен.
Этап 1: Исследование (30 минут)
- Открыл карточку сделки в браузере
- Через DevTools нашел HTML-структуру раздела
- Определил CSS-класс контейнера
- Протестировал `display: none` в консоли браузера
Результат: подтверждение технической возможности.
Этап 2: Написание скрипта (1 час)
- Создал файл `/local/js/competitor_section/script.js`
- Прописал логику прослушивания поля
- Добавил функцию переключения CSS-свойства
- Протестировал на тестовой сделке
Основная сложность: найти правильное событие API Битрикс24 для отслеживания изменения поля. Документация коробочной версии менее подробная, чем для облака, пришлось изучать исходники.
Этап 3: Интеграция (30 минут)
- Подключил скрипт к карточкам сделок через настройки CRM
- Прописал символьный код поля и класс раздела в конфигурацию
- Проверил работу на нескольких сделках
Решение работает в коробочной версии Битрикс24. Для облачной версии потребуется адаптация — скрипт нужно загружать через приложение или виджет.
Этап 4: Обучение команды (15 минут)
Менеджерам объяснили:
- Поле «Продукция конкурента запроектирована» управляет видимостью раздела
- Если конкурентов нет, оставляйте поле пустым — раздел не будет мешать
- Если конкуренты есть, ставьте галочку — появятся поля для заполнения
Адаптация прошла мгновенно, интерфейс интуитивен.
Ограничения и развитие решения
Решение работает стабильно, но имеет нюансы.
Зависимость от структуры DOM
Скрипт полагается на CSS-классы, которые генерирует Битрикс24. Если в новой версии платформы изменится структура HTML карточки, скрипт может перестать работать.
Минимизация риска: использовать не автогенерируемые классы, а добавлять кастомные data-атрибуты к разделам через PHP-шаблоны. Это требует доступа к серверу, но делает решение устойчивым к обновлениям.
Работа только в коробочной версии
Облачный Битрикс24 не позволяет загружать произвольные JS-файлы в `/local/js/`. Для облака нужно:
Это усложняет внедрение, но принцип остается тем же.
Расширение на другие условия
Текущая реализация работает с полем «да/нет». Можно расширить логику:
— Списки: показывать разные разделы в зависимости от выбранного значения (например, тип клиента → специфичные поля)
— Множественные условия: раздел появляется если выполнены два условия одновременно
— Каскадная видимость: раздел A появляется при условии 1, внутри него раздел B появляется при условии 2
Это требует более сложной логики в скрипте, но технически реализуемо.
Планы на развитие
Следующий шаг — применить паттерн к другим разделам карточки:
Цель: карточка сделки адаптируется под контекст, показывая только релевантную информацию.
Зависимость от структуры DOM
Скрипт полагается на CSS-классы, которые генерирует Битрикс24. Если в новой версии платформы изменится структура HTML карточки, скрипт может перестать работать.
Минимизация риска: использовать не автогенерируемые классы, а добавлять кастомные data-атрибуты к разделам через PHP-шаблоны. Это требует доступа к серверу, но делает решение устойчивым к обновлениям.
Работа только в коробочной версии
Облачный Битрикс24 не позволяет загружать произвольные JS-файлы в `/local/js/`. Для облака нужно:
- Создать локальное приложение
- Или использовать виджет с внедрением скрипта
- Или реализовать через REST API и внешний сервер
Это усложняет внедрение, но принцип остается тем же.
Расширение на другие условия
Текущая реализация работает с полем «да/нет». Можно расширить логику:
— Списки: показывать разные разделы в зависимости от выбранного значения (например, тип клиента → специфичные поля)
— Множественные условия: раздел появляется если выполнены два условия одновременно
— Каскадная видимость: раздел A появляется при условии 1, внутри него раздел B появляется при условии 2
Это требует более сложной логики в скрипте, но технически реализуемо.
Планы на развитие
Следующий шаг — применить паттерн к другим разделам карточки:
- Блок «Условия лизинга» для сделок с лизинговой оплатой
- Раздел «Параметры доставки» для клиентов из удаленных регионов
- Поля «Согласование с юристами» для контрактов выше определенной суммы
Цель: карточка сделки адаптируется под контекст, показывая только релевантную информацию.
Заключение
Динамическое скрытие разделов в карточке CRM решает проблему перегруженного интерфейса. Менеджеры фокусируются на актуальных полях, не тратят внимание на неактуальную информацию. Решение особенно эффективно в B2B-компаниях с проектными продажами, где карточки сделок содержат десятки полей для разных сценариев.
Техническая реализация через JavaScript занимает несколько часов, но требует доступа к файловой системе сервера (коробочная версия Битрикс24). Паттерн применим к любым условным блокам: лизинг, субподряд, гарантии, дилерские условия. Принцип универсален: поле-триггер управляет видимостью зависимого раздела, интерфейс адаптируется под контекст сделки.
Техническая реализация через JavaScript занимает несколько часов, но требует доступа к файловой системе сервера (коробочная версия Битрикс24). Паттерн применим к любым условным блокам: лизинг, субподряд, гарантии, дилерские условия. Принцип универсален: поле-триггер управляет видимостью зависимого раздела, интерфейс адаптируется под контекст сделки.
- Кастомизация карточки сделки через JavaScript для фокусировки внимания менеджеров
- Проблема: перегруженные карточки в проектных продажах
- Исследование: как Битрикс24 рендерит карточку сделки
- Техническое решение: JavaScript-скрипт в /local/js/
- Настройка карточки: поле-триггер и скрываемый раздел
- Результат: снижение когнитивной нагрузки
- Техническая реализация: от идеи до внедрения
- Ограничения и развитие решения
- Заключение
