Дорабатываем опросы в CRM Битрикс24

Дмитрий П.

Нашему заказчику потребовалась разработка функционала опросов для отдела кадров.

Бизнес-цель: проведение различных опросов сотрудников через корпоративный портал, проведение конкурсов на лучшие рисунки детей сотрудников.

Изначально мы решили дорабатывать стандартный модуль опросов корпоративного портала Bitrix24. В этом модуле были почти все нужные нам функции и имелся конструктор для создания новых опросов. Аналогичная разработка “с нуля” заняла бы больше 250 часов.

Вам может быть интересно:

Внедрение Битрикс24 Доработка Битрикс24

Пример опроса:

Доработанные опросы Битрикс24

Потребовались следующие доработки:

  1. Радио-кнопки. Выстроить радио-кнопки ответов в виде горизонтальной шкалы ответов. Это было требование заказчика, потому что у них в организации бумажный шаблон опросов имеет именно горизонтальную шкалу ответов и отходить от шаблона было нельзя.
  2. Валидация. Добавить валидацию текстовых и цифровых ответов. Банальная “Защита от дурака”, чтобы пользователи не могли вместо цифры ввести букву.
  3. Изображения. Добавить в качестве ответов изображения. Для конкурса детских рисунков. В конкурсе надо выбрать одно изображение из нескольких десятков.

Требования:

  1. Все изменения надо вносить таким образом, чтобы при обновлении версии Корпоративного портала изменения остались и контент-менеджер мог работать с новыми доработками без привлечения программиста.
  2. При анализе задачи надо рассматривать разные варианты решения проблемы. С использованием стандартного функционала Bitrix24 или без.

Анализ предстоящей работы

Стандартные возможности модуля опросов Bitrix24 имеют ограничения.

Настройки опросов Bitrix24

Если посмотрим на административную панель настроек, то видим ограниченные настройки для ответов.

Можно добавить Название ответа, Тип поля, Ширина, Высота, Параметры, Сорт, Цвет.

Давайте разберёмся, за что отвечают эти параметры. Для примера возьмём Тип поля text.

Так было изначально и заказчика не устраивало:

Стандартный вид радио-кнопок

Мы улучшили отображение и сделали горизонтальный дизайн. Как это выглядит, показано ниже. Сначала рассмотрим свойства:

Название ответа — слово, которое попадёт в тэг

<label>0 абсолютно не интересно</label>

Тип поля — параметр type тэга input ( type="radio" )

Ширина и высота для параметров тэга input типа text или text-area отвечают за ширину и высоту текстового поля.

Сорт — сортировка вывода ответов.

Цвет — цвет текста.

Параметры — самый интересный параметр. С помощью этого параметра в тэг input можно добавить любые дополнительные параметры. Один или несколько. Данный параметр можно использовать для валидации, добавления изображений или другой информации, при этом не меняя логики работы самого портала.

Улучшаем опросы в коробочной версии Битрикс24

Горизонтальная шкала в опросах

По умолчанию в Битрикс24 используется вертикальная шкала радио-кнопок в публичной части отображении опроса. Но одним из требований было настроить горизонтальную шкалу. Изменять стандартные стили нельзя, потому что при обновлении корпоративного портала данные изменения перезапишутся.

Но как же быть? Нам надо решить задачу. Если стили перезатрутся, то как добавить стили чтобы они остались?

Решение, которое мы придумали было следующее. JS проверяет, есть ли на странице класс для стандартных голосований и если внутри класса есть тэг <input type="radio" />

Если такой тэг имеется то JS изменяет стили, дополняя их красотой.

Подключается JS только на странице публичного вывода голосований и опросов.

Доработанный дизайн радио-кнопок

Минусы этого метода. Применяется для всех тэгов  <input type="radio" />, что не везде будет красиво выглядеть. И, к сожалению нельзя вынести в административный раздел настройку применения этого стиля, потому что это стандартные настройки и все изменения будут удалены при обновлении.

Валидация ответов

Стандартный функционал корпоративного портала вообще не подразумевает проверки введённых значений в ответах.

Но как же это реализовать, если в самой работе нет и намёков на проверку?

Решение пришло неожиданно, когда мы поняли за что отвечает поле Параметры в административном разделе. Параметры отвечают за атрибуты тэга input. В это поле можно ввести один или несколько атрибутов.

Настройка параметров

В частности, мы настроили валидацию на параметре placeholder="0-100". Это убивает сразу двух зайцев. Во первых задание этого параметра автоматически подставит в поле ответа нужную нам маску и адекватный человек воспользуется подсказкой и введёт корректные данные, а “защиту от дурака” нам подскажут введённые в этот параметр данные.

Мы добавили следующую проверку:

Если цифра одна, например (placeholder="5"), то при введении других данных, кроме этой цифры выдаст ошибку.

Если цифр несколько (диапазон от 0 до 100, прописан как placeholder="0-100"), то  при введении других данных, кроме цифр этого диапазона выдаст ошибку.

Если введены буквы (placeholder="Иванов И.И."),  то  при введении других данных, кроме букв выдаст ошибку.

Таким образом была добавлена очень гибкая настройка и базовая “защита от дурака”,  и не нарушена стандартная логика работы модуля опросов.

Изображения в качестве ответов в опросах Битрикс24

Как  добавить изображения в качестве ответов на вопрос? Зачем это понадобилось? Всё очень просто. У заказчика устраиваются конкурсы на лучшие детские рисунки. Рисунков много, а выбрать можно только один. При решении задачи нам частично помог наш же код из решения Радио-кнопок. Это было забавно и очень красиво вписывалось в функционал и дизайн.

Изображения в качестве ответов в опросах Битрикс24

Во первых в стандартном функционале нет возможности размещения изображений в ответы к вопросу. Как же быть в этом случае? Где контент-менеджеру добавить изображения? Напрашивалось решение привязать папку с изображениями к конкретному голосованию и выводить список этих изображений в публичном разделе, но в этом случае непонятно как привязать конкретный ответ к конкретному изображению, поэтому это решение признали не корректным.

И тут мы вспомнили о поле Параметры. Так как выбор одного значения из нескольких то input type radio нам также подходил. В поле параметры добавили ещё один параметр img=”1.jpg” значение этого параметра совпадало с изображением в определённой папке.

Как только техническая сторона вопроса была решена, мы столкнулись с некорректной работой стилей и опять пришлось через JS добавлять новые стили при применении параметра img в ответе.

В итоге получилось очень красивое голосование за фотографии на основании стандартного функционала. Почти идеальный конструктор :-).

Доработка опросов Битрикс24 — плюсы и минусы

Данные методы разработки могут быть применены и в других стандартных модулях корпоративного портала Bitrix24.

Плюсы:

  • уменьшение трудозатрат разработки
  • не затрагивает стандартный функционал обновлений Bitrix24
  • можно красиво реализовать многие пожелания заказчика

Минусы:

  • недостаточная гибкость настройки
  • нельзя изменить или отключить добавленный функционал без технического специалиста
  • применение новых стилей через проверку дом-дерева через JS

Бюджет доработок

Мы смогли реализовать все пожелания заказчика. Итоговый бюджет реализации составил 80 часов работы специалиста. Ставка часа на такие работы — 2 200 рублей. Заказчик работу принял и был доволен.

Зачастую правильно дорабатывать существующий функционал, а не писать свой код с нуля.

Доработка опросов Битрикс24 выгоднее, чем разработка функционала с нуля

ИНТЕРВОЛГА умеет дорабатывать стандартный функционал Битрикс24. Если у вас есть подобные задачи — обращайтесь.

Оцените статью
18.01.2018
Понравилась статья?
Поделитесь ссылкой с друзьями и коллегами!

Статьи по теме

Автоматизация процесса командировки в Битрикс24: как сэкономить на деловых поездкахЕсли сотрудники часто ездят в командировки, а бюджет на них исчисляется суммой с 6-7 нулями, то можно прилично экономить, автоматизировав процесс в Битрикс24 ...
«Как раньше» больше не работает — B2B-система продаж сейчасВ этой статье хотим поговорить с чем сейчас сталкивается оптовый бизнес (множеством вызовов и изменений, которые требуют адаптации, а также оптимизации процессо...
ИНТЕРВОЛГА — лучшее агентство года по внедрению CRMИНТЕРВОЛГА вновь стала победителем премии RUWARD, учрежденной одним из ключевых рейтинговых агентств на digital-рынке и первой в России AMaaS-платформой. 25 ...
Как учить разработке на Битрикс: наши 20 лет опытаВ статье рассказываем о нашей концепции обучения разработчиков, представляем обновленную Академию Битрикса и рассказываем о влиянии на результат матрицы компете...
Холдинговая структура компании в CRM Битрикс24: все сделки группы на одной странице Если вы используете Битрикс24 для продаж нескольким компаниям объединенным в холдинг, то можно сделать так, чтобы видеть иерархию продаж на уровне всей гру...
Функция b2b-платформы — отправка рекламаций в CRMОптовые покупатели — ключевой сегмент экономики торгово-производственного предприятия, и их удовлетворённость напрямую влияет на успех бизнеса. Новый функционал...
Мы работаем по одному из двух форматов:
  • аренда команды (от 2 человек, не менее 3 месяцев);
  • итерации с фиксированной ценой (1-3 месяца длительностью).
ИНТЕРВОЛГА предоставляет:
  • регулярные онлайн-планерки с заказчиком;
  • квалифицированных специалистов;
  • организованную команду (находятся в одном помещении, что упрощает решение рабочих вопросов);
  • полную прозрачность и регулярность отчетов о результатах.
Ключевые услуги:
  • нагруженный интернет-магазин;
  • личный кабинет;
  • оптовые продажи — B2B-платформа;
  • маркетплейс;
  • технический аудит сайта;
  • Битрикс24 — корпоративные HR-порталы;
  • Битрикс24 — построение CRM-системы;
  • Битрикс24 — личные кабинеты сотрудников;
  • Битрикс24 — аудит портала;
  • 1С — интеграция с другими системами;
  • 1С — доработка системы;
  • маркетинг — комплексное интернет-продвижение;
  • маркетинг — продвижение для B2B.
Хотите получать лучшие статьи от INTERVOLGA раз в месяц?
Подпишитесь на рассылку — спамить не будем