Was this article helpful?

Спасибо за вашу оценку!

Оставляя более подробный отзыв, вы помогаете нам улучшать документацию

Практикум. Обращение в техподдержку. Настройка визуалов

В Системе реализована возможность настройки реестра и визуалов типа объектов. Данный функционал позволяет полностью кастомизировать пользовательский интерфейс под различные задачи.

С использованием платформы GreenData можно:

  • Настраивать структуру отображения визуалов;

  • Настраивать структуру и настройки реестра объектов типа объекта;

  • Форматировать содержание объекта и реестра, в том числе используя условное форматирование;

  • Задавать правила отображения, логики поведения, блокировки и цветового оформления элементов на визуале.

Для настройки визуала предусмотрены элементы, которые нужно располагать в рабочей области используя принцип перетаскивания drag&drop.

Настройка визуалов включает в себя несколько этапов:

  1. Настройка структуры. На данном этапе проводится разметка областей и определяется, где будут располагаться элементы (атрибуты и виджеты);

  2. Размещение элементов. Размещение элементов интерфейса должно происходить только в заранее подготовленные области контейнеров: в их пространство помещаются атрибуты типа или системные элементы(виджеты);

  3. Настройка форматирования. На этом этапе проводится настройка отображения текста и цветового оформления;

  4. Настройка управления. На этом этапе реализуется настройка видимости и доступности элементов.

После сохранения настроек визуалов к ним можно вернуться позже и внести изменения. Для объектов одного типа может быть настроено несколько визуалов для различных групп пользователей и реализации различных бизнес-задач. Также количество настроек реестра для одного типа объекта неограниченно. Однако, если какие-то из визуалов не используются, рекомендуется удалить их для быстрой работы системы.

В рамках практикума необходимо настроить реестр обращений для клиентов:

image071

В рамках практикума необходимо настроить реестр обращений для сотрудников и руководителей:

image072

Также необходимо настроить визуал для обращений.

image002

Перед настройкой модуля «Настройка визуалов» необходимо предварительно реализовать настройки, описанные в главе «Объектная модель».

Настройки реестров типа объектов «Обращения в техподдержку»

Настройте реестры для сотрудников и клиентов системы обращений.

image071

image072

Реестр «Мои обращения»

Создайте реестр, который будет отображать обращения клиентов. Этот реестр смогут просматривать только клиенты.

Перейдите в реестр типа объектов «Обращение в техподдержку». Для этого на предметной области выберите тип объектов, перейдите в окно настроек типа объектов и нажмите на кнопку «Открыть реестр».

По умолчанию все реестры имеют базовые настойки. Для того чтобы изменить настройки реестра, на панели управления нажмите на кнопку настройки реестра image073.

В появившемся окне измените Наименование – «Мои обращения», в поле «Вид реестра» выберите «Легкий реестр».

image

В текущем модальном окне представлены опции для настройки внешнего вида реестра и отображаемых данных. На вкладке «Настройка колонок» можно определить колонки, которые нужно отобразить в реестре: список атрибутов типа объектов для отображения в колонках реестра находится слева, а выбранные для отображения колонки – справа. Для того чтобы перенести значения из одной в другую колонку, необходимо воспользоваться стрелками между ними. Для того чтобы настроить последовательность колонок в реестре, необходимо воспользоваться стрелками над колонкой

Расположите в поле «Колонки» следующие атрибуты:

  • Наименование;

  • Статус обращения;

  • Тип обращения;

  • Классификация обращения;

  • Краткое описание проблемы;

  • Исполнитель.

image075

Перейдите на вкладку «Панель управления» - на ней происходит настройка кнопок, отображаемых на панели управления. Отображаемые кнопки в реестре зависят от объекта, указанного в поле «Настройка кнопок панели управления в реестре». Добавьте новый экземпляр настроек, для этого раскройте панель дополнительных действий поля и выберите опцию «Добавить».

image076

Создайте новую настройку кнопок на панели управления реестра «Настройка кнопок панели управления в реестре «Мои обращения». Ниже на вкладке «Настройка кнопок панели управления» отображаются преднастроенные и пользовательские кнопки – по умолчанию они все активны и отображаются в реестрах.

Оставьте активными кнопки «Добавить», «Настройки» и «Обновить», а остальные – переведите в неактивное состояние, чтобы они были скрыты на панели управления.

image077

Сохраните настройки кнопок реестра и вернитесь к настройкам реестра.

На вкладке «Действия» можно изменить отображение кнопок действий с конкретным экземпляром типа в реестре. По умолчанию установлено три действия, которые нельзя удалить:

  • Редактировать;

  • Копировать;

  • Удалить.

При необходимости можно добавить другие действия. В этой вкладке оставьте все настройки без изменений.

На вкладке «Фильтрация» определяются правила для фильтрации записей. В этой вкладке оставьте все настройки без изменений.

На вкладке «Стили отображения» можно настроить отображение данных в реестре. В этой вкладке оставьте все настройки без изменений.

На вкладке «Поисковые фильтры» можно настроить специальную панель, при помощи которой пользователь сможет осуществить поиск и фильтрацию данных в реестре.

Сохраните настройки реестра по кнопке «Ок».

image071

Реестр «Все обращения»

Создайте реестр, который будет отображать обращения для сотрудников и руководителей техподдержки – только они смогут просматривать его.

Необходимо создать копию реестра «Мои обращения», для этого в реестре раскройте список реестров с помощью кнопки настройки и воспользуйтесь кнопкой «Копировать», расположенной в строке представления «Мои обращения».

image

Измените наименование на «Все обращения» и настройте колонки:

  • Наименование;

  • Статус обращения;

  • Тип обращения;

  • Классификация обращения;

  • Исполнитель;

  • Критичность;

  • Решено.

image079

На вкладках «Панель управления», «Действия», «Фильтрация» и «Стили отображения» оставьте все настройки без изменений.

Перейдите на вкладку «Поисковые фильтры» и активируйте переключатель «Включить поисковые фильтры». В появившихся полях установите значения:

  • Расположение поисковых фильтров – «Слева»;

  • Ширина виджета поисковых фильтров – «20.00%».

image

В поле «Настройка панели поиска» создайте группу фильтров.

image081

В модальном окне заполните поле Наименование – «Фильтры», а поле Состояние группы оставьте «Статична».

image

Сохраните настройки группы фильтров с помощью кнопки «Ок». После этого она появится в поле «Настройка панели поиска».

Добавьте атрибуты для фильтрации, для этого в поле «Доступные атрибуты» выберите атрибуты «Классификация обращения», «Критичность», «Тип обращения» и с помощью кнопки переместите в поле «Настройка панели поиска».

image083

Настройте визуализацию для добавленных атрибутов, для этого выберите атрибут и перейдите его настройке с помощью кнопки. В модальном окне в поле «Визуализация» измените значение на «Содержимое справочника в виде listbox». Аналогично настройте все добавленные атрибуты в группе «Фильтры».

image084

Добавьте еще одну группу фильтров «Ответственные», состояние – «Статична». В группу фильтров добавьте атрибуты «Инициатор» и «Исполнитель».

image

Сохраните настройки реестра.

image072

Настройка визуала «Обращение в техподдержку»

Работа пользователя с объектами происходит с помощью визуалов: для одного типа объектов могут быть настроены различные визуалы в зависимости от решаемых задач и доступа различных групп пользователей. Для того чтобы перейти к настройке визуала, создайте в реестре новый объект с помощью кнопки image. После создания экземпляра типа объектов система автоматически выбирает визуал родительского типа объектов или созданный ранее визуал.

image087

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

В режиме редактирования отображается панель «Элементы», из которого предлагается выполнить перенос различных элементов в пространство настраиваемой карточки.

image088

С помощью панели «Элементы» в структуре визуала могут быть размещены следующие элементы, используя принцип перетаскивания drag&drop:

  1. Атрибуты – список атрибутов типа объекта, визуал которого настраивается в данный момент времени;

  2. Шаблоны - готовые наборы структуры и элементов интерфейса, которые можно применить в качестве первоначальной настройки визуала. При дальнейшей настройке визуала добавленная структура и набор элементов могут быть изменены или дополнены необходимыми элементами;

  3. Виджеты - визуальные элементы для настройки интерфейса визуала, позволяющие получить оперативный доступ к тому или иному действию для решения отдельных задач, отобразить имеющиеся данные (атрибут или тип объектов) на визуале объекта;

  4. Разметка – визуальные элементы, представляющие из себя контейнеры, в которых располагаются другие элементы, необходимы для формирования разметки визуала. Настройка визуала экземпляра начинается с добавления элементов группировки на рабочую область визуала.

При необходимости настроить визуал в месте, где расположена панель элементов, можно воспользоваться кнопками управления или переместить панель, используя принцип перетаскивания drag&drop.

image

Внесенные изменения можно отменить, сохранить, а также сохранить с выходом из режима редактирования.

image

Разметка и размещение элементов визуала

Перейдите к настройке визуала типа объектов «Обращение в техподдержку».

Ранее визуал для этого типа объектов не настраивался, поэтому технический визуал (наследованный от типа-родителя) откроется в новом окне сразу в режиме редактирования. Размещение элементов интерфейса должно происходить только в заранее подготовленные области контейнеров – разметка «Ряд». Этот тип группировки является базовым, без него невозможно размещение других элементов на визуале. В этих контейнерах располагаются группировки «Группа атрибутов» и другие, а уже после этого в их пространство помещаются атрибуты. Все эти элементы для определения структуры собраны на панели элементов на вкладке «Разметка».

Удалите автоматически созданный визуал и настройте новый.

image091

В рабочую область разместите два ряда и в ряду посередине расположите группу атрибута. В группу атрибутов расположите еще два ряда. На панели «Элементы» актвируйте опцию «Правая панель», после чего разместите в ней ряд и группу атрибутов. Для обеих групп атрибутов на визуале настройте вид «Без имени».

image092

В пустом верхнем ряду слева разметите виджет «Статус-бар». Перейдите к его настройкам с помощью кнопки «Настройки» таким образом, чтобы он отображал текущее состояние обращения. Для этого в окне настройки в поле «Тип объекта для отображения статусов» выберите тип объектов «Состояние объекта». После этого заполните поле «Алгоритм для получения текущего статуса», для этого создайте новый алгоритм, воспользовавшись кнопкой рядом «Создать алгоритм».

image

Создайте алгоритм «Состояние обращения», в качестве базового типа объектов оставьте «Обращение в техподдержку». Алгоритм будет собирать значение атрибута «Статус обращения» и подсвечивать этапы в зависимости от него.

Чтобы заполнить формулу алгоритма вставьте атрибут «Статус обращения» с помощью функции attr.

image

Сохраните алгоритм и вернитесь к настройкам виджета.

Для дальнейшей настройки необходимо заполнить реестр типа объектов «Состояние объекта» необходимыми записями. Для этого в окне настройки виджета в поле «Тип объекта для отображения статусов» раскройте панель дополнительных действий и выберите опцию «Открыть реестр в новом окне». К реестру этого типа объектов можно перейти также из пункта меню «Документооборот» - «Состояния».

image

Заполните реестр следующими записями:

  • В работе [IN_PROCESS];

  • Согласование [APPROVE];

  • Доработка [REWORKING];

  • Закрыто [CLOSED].

После этого вернитесь на вкладку с настройками визуала.

В модальном окне настройки виджета выберите вид этапов «Точки» - предпросмотр виджета отобразится ниже.

После этого в нижней части добавьте 4 этапа:

  • Новый – Отобразить как «Новое»;

  • В работе;

  • Согласование;

  • Доработка;

  • Закрыто.

Сохраните настройки статус-бара и вернитесь к редактированию визуала. Сохраните визуал с помощью кнопки «Сохранить», чтобы зафиксировать промежуточный результат.

image096

Перейдите к настройке содержимого второго ряда слева. В группу атрибутов добавьте еще один ряд. В верхнем ряду разместите виджет «Управление вкладками». В нижнем ряду разместите элемент «Группу вкладок», после чего на ней же расположите вкладку. Измените наименование первой вкладки на «Основная информация», а следующей – «Комментарии», для этого установите курсор в поле, где есть значение «Вкладка», выделите его и впишите новое.

image097

Настройте виджет «Управление вкладками»: в поле «Группа вкладок» выберите «Новая группа вкладок», отключите опцию «Сокращать наименования вкладок» и активируйте «Горизонтальное выравнивание». Изменения настроек виджета будут отображены на визуале сразу.

image

Для того чтобы на странице не было дублирования вкладок, скройте отображение в настройках разметки «Группа вкладок», располагающейся в нижнем ряду группы атрибутов. Для этого активируйте опцию «Скрыть переключение вкладок» и «Скрыть рамки», а также отключите опцию «Полоса прокрутки».

image099

Сохраните настройки визуала.

Заполните содержимое вкладок. Выберите вкладку «Основная информация» и добавьте в нее еще два ряда, верхний разделите двумя колонками на три части, также разместив их с панели «Элементы».

image

В верхнем ряду в каждой колонке разместите по одному атрибуту слева направо:

  • Тип обращения [APPEAL_TYPE_ID];

  • Классификация обращения [PROBLEM_TYPE_ID];

  • Критичность [CRITICALNESS_ID].

В следующем ряду разместите атрибут «Краткое описание проблемы» [SHORT_DESCRIPTION].

image

В нижнем ряду разместите группу атрибутов типа «Свернута» и измените наименование на «Описание». В ряду группы атрибутов расположите атрибут «Описание» [ISSUE_DESCRIPTION].

image

На вкладке «Комментарии» разместите виджет «Комментарии к объекту».

image

В нижнем пустом ряду слева разместите виджет «Кнопка». Чтобы кнопка отображалась по центру, необходимо настроить выравнивание в колонке ряда. Для этого перейдите в настройки колонки и выберите выравнивание по центру, активировав соответствующие переключатели.

image

Создайте действие для кнопки, которое будет отправлять обращение на рассмотрение. Для этого в поле «Действие» раскройте панель дополнительных действий и выберите опцию «Добавить».

image

В модальном окне заполните следующие поля:

  • Наименование – Отправить обращение;

  • Идентификатор – SEND_ISSUE;

  • Модуль пользовательского интерфейса – Запустить бизнес-процесс (без выбора из списка доступных).

Алгоритм для действия будет настроен позже. Сохраните настройки кнопки и вернитесь к настройке визуала.

Перейдите к настройке панели справа. В группу атрибутов разместите 6 рядов – всего должно быть 7. В верхние 4 ряда разместите виджет «Заголовок по атрибуту».

image

Перейдите к настройке первого виджета «Заголовок по атрибуту» с помощью кнопки «Настройки». В модальном окне выберите атрибут с помощью кнопки «Выбрать атрибут»: активируйте переключатель «Показать атрибуты родительского типа» и выберите «Статус обращения».

image

После выбора атрибута в поле «Стиль наименования» выберите опцию «Очистить значение».

image

Аналогично в группе «Значение атрибута» очистите значение поля «Стиль значения».

image

Аналогично настройте остальные виджеты по следующим атрибутам:

  • Номер обращения;

  • Дата создания;

  • Время обработки обращения (мин.).

image

В следующих двух рядах разместите виджет «Информация о сотруднике».

image

Перейдите к настройке верхнего виджета. Заполните поля:

  • Заголовок – Инициатор;

  • Атрибут с сотрудником – Инициатор;

Активизируйте опцию «Показывать иконку чата», а в группе «Данные о сотруднике» очистите поля «Атрибут с телефоном сотрудника», «Атрибут с адресом почты сотрудника» и «Атрибут с подразделением сотрудника». Сохраните настройки виджета.

image

Аналогично настройте следующий виджет для отображения информации о Исполнителе.

image

В последнем ряду группы атрибутов разместите виджет «Подсказка».

image

Перейдите к настройке подсказки. В модальном окне выберите тип подсказки «Предупреждающая» и отключите опцию «Можно закрыть». Создайте алгоритм подсказки с помощью кнопки «Создать алгоритм».

image

Создайте новый алгоритм «Текст подсказки о невозможности редактирования», в качестве формулы алгоритма укажите:

"Объект нельзя редактировать. Обращение на рассмотрении"

image116

В пустом ряду правой панели разместите 2 виджета «Кнопка» и сделайте выравнивание по центру.

Для верхней кнопки создайте действие «Изменить критичность» [CHANGE_CRITICAL_BUTTON], в поле «Модуль пользовательского интерфейса» выберите «Запустить бизнес-процесс (без выбора из списка доступных)».

image

Для нижней кнопки создайте действие «Отменить» [CANCEL_BUTTON], в поле «Модуль пользовательского интерфейса» выберите «Запустить бизнес-процесс (без выбора из списка доступных)».

image

Сохраните настройки визуала с помощью кнопки «Сохранить».

image002

Настройка визуальных алгоритмов

В режиме редактирования можно задать различные параметры отображения атрибутов, подробнее о настройках атрибутов на визуале можно узнать на этой странице.

Настройте отображение атрибутов с помощью фронтовых алгоритмов.

Фронтовые – алгоритмы элементов визуала, с которыми взаимодействует пользователь. Они выполняются на клиентской части приложения.

К ним относятся:

  • Алгоритмы блокировок;

  • Алгоритмы видимости;

  • Алгоритмы подписей;

  • Алгоритмы фильтрации;

  • Алгоритмы форматирования подписей.

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

Каждый алгоритм может использоваться в Системе один или несколько раз.

Настройте подсветку атрибута «Критичность». Для этого раскройте опции атрибута и выберите «Подсветка атрибута».

image

Создайте новый алгоритм «Алгоритм подсветки критичности», в качестве базового типа объектов оставьте «Обращение в техподдержку». Алгоритм будет возвращать код цвета в зависимости от значения атрибута: Низкая – Зеленый, Средняя – Желтый, Высокая – Красный.

Заполните поле формулы алгоритма:

image

Воспользуйтесь следующими функциями:

Выполните следующую последовательность действий:

  1. Укажите условие, которое будет проверять значение атрибута «Критичность». Для этого укажите функцию if из раздела «Логико-арифметические»;

  2. В скобках функции укажите условие. Вставьте атрибут «Критичность» с помощью функции attr из раздела «Источники». После этого с помощью клавиатуры укажите знак равенства «=».

    image

  3. В качестве сравниваемого объекта укажите объект «Высокая» справочника «Критичность» с помощью функции dict из раздела «Источники»;

    image

  4. В качестве оператора к выполнению укажите красный цвет с помощью функции color из раздела «Источники», выбрав его на палитре – после этого код цвет а в формате HEX появится в строке алгоритма;

    image

  5. После функции if укажите функцию else if, чтобы добавить еще одно условие;

  6. Повторите шаги 2-4: укажите критичность «Средняя» и выберите желтый цвет;

  7. Повторите шаги 5-6: добавьте еще одно условие, укажите критичность «Низкая» и выберите зеленый цвет.

Сохраните алгоритм и вернитесь к настройке визуала.

Настройте алгоритм цвета для кнопки «Отменить», для этого воспользуйтесь кнопкой «Алгоритм цвета» в рабочей области кнопки.

image

Создайте алгоритм «Алгоритм цвета кнопки», который будет возвращать код цвета. Заполните поле формулы алгоритма с помощью функции color: выберите красный цвет из палитры.

image

Сохраните настройки алгоритма и вернитесь к настройке визуала. Сохраните визуал.