Настроить приложение

Приложение при создании уже содержит страницу реестра и страницу записи с минимальным набором компонентов. Дальнейшая кастомизация выполняется в дизайнере интерфейсов с помощью no-code инструментов.

Настройка интерфейса приложения предполагает следующие действия:

1. Создание структуры приложения путем добавления всех необходимых страниц и других элементов.
2. Формирование структуры каждой страницы из вкладок, островов, колонок.
3. Добавление на страницу необходимых элементов:
   • полей и источников данных;
   • дашбордов;
   • кнопок и других компонентов.

Настроить страницу редактирования 

1. Откройте дизайнер системы, например, по кнопке в правом верхнем углу приложения.
2. Перейдите в раздел Установка и удаление приложений.
3. Откройте приложение “Финансовые компенсации” или создайте новое. Подробнее: Создать пользовательское приложение.
4. В блоке Страницы перейдите на страницу “Страница записи Финансовые компенсации”, созданную автоматически при добавлении приложения. Интерфейс страницы уже содержит минимальный набор компонентов. Каждый из элементов вы можете копировать, редактировать, переместить или удалить. В нашем случае, гибкий контейнер сохраним для дальнейшего добавления в него кнопок.
5. Добавьте кнопку “Сохранить”, по которой будет выполняться сохранение обновленных данных на странице.
   1. Перетащите при помощи курсора в гибкий контейнер кнопку.
   2. Откройте панель ее настроек, нажав значок шестеренки, который отобразится по клику на элемент.
   3. В поле Заголовок укажите “Сохранить”.
   4. В поле Стиль выберите “Акцент”.
   5. В поле Действие выберите ”Сохранить” (Рис.1).

      Рис. 1 — Добавление кнопки

      
6. Аналогичным образом добавьте кнопки Отменить и Закрыть. В гибкой строке вы можете добавлять сколько угодно элементов, которые будут размещаться друг за другом без четкой привязки к разметке.
7. Добавьте необходимое количество островов на страницу, перетянув их из библиотеки элементов. Внутри островов вы можете, например, поместить вкладки, группы и другие элементы, позволяющие структурно и визуально разграничить контент, как показано на Рис. 2.
   Рис. 2 — Настройка разметки

   

    

8. В первом острове разместите гибкую колонку для добавления других элементов, располагающихся друг под другом.
9. Добавьте элемент Надпись, например, с заголовком “Данные сотрудника”.
10. Разместите в острове следующие поля:
    1. Сотрудник (справочное) — определяет конкретного сотрудника, для которого будет выполняться начисление компенсации. На странице настройки поля укажите следующие данные:
       • Заголовок — введите значение “Сотрудник”. Данное поле определяет название соответствующего поля в приложении. Поле является обязательным для заполнения.
       • Код на английском — введите значение “UsrEmployee“. Данное поле определяет уникальное название, которое Creatio будет использовать для создания колонки в объекте.
       • Формат — выберите “Справочник”. Данное поле определяет формат отображения данных. Поле является обязательным для заполнения.
       • Описание — при необходимости добавьте информацию, которая будет отображаться как подсказка для пользователя в приложении.
       • Обязательное — определите обязательность заполнения поля при сохранении страницы редактирования в приложении. В данном случае необходимо выбрать вариант “На уровне приложения”.
       • Копировать данные при копировании записи — при установке признака данные такого поля будут копироваться при копировании записи.
       • Выбор объекта — выберите объект, из которого запрашивается информация для заполнения данных в поле. Поле является обязательным для заполнения.
       • Если необходимо, то сделайте поле нередактируемым, установив признак “Только чтение”, укажите заголовок на странице, если он должен отличаться от заголовка в системе, и проверьте, что источник данных поля указан правильно (Рис. 3).
         Рис. 3 — Добавление поля

         

          

    2. Аналогичным образом добавьте в остров и настройте другие поля:
       • Должность сотрудника (справочное);
       • Департамент (справочное);
       • Тип трудового договора (справочное);
       • Тип оплаты труда (справочное).
11. В отдельном острове аналогичным образом настройте разметку и добавьте элемент Показатель из группы Графики. Элемент должен отображать внутреннюю ставку сотрудника. Настройте отображение показателя, нажав значок шестеренки, который отобразится по клику на элемент.
    1. На панели настройки выберите желаемый цвет и стиль отображения графика — полноцветный или простой белый — в соответствующих полях, после чего нажмите кнопку Настроить график (Рис. 4).
       Рис. 4 — Переход к настройке графика

       
    2. На панели настройки графика заполните следующие поля:
       • Заголовок — название, которое будет отображаться на дашборде. Поле является обязательным для заполнения.
       • Цвет — вы можете изменить цвет, выбранный на предыдущем шаге. Поле является обязательным для заполнения.
       • Стиль — вы можете изменить стиль отображения, выбранный на предыдущем шаге. Поле является обязательным для заполнения.
       • Объект — выберите объект, данные которого необходимо отобразить на дашборде. Поле является обязательным для заполнения.
       • Функция — выберите функцию, по которой будет выполняться расчет данных указанного объекта. Поле является обязательным для заполнения.
       • Формат — укажите числовой формат отображения данных на дашборде.
       • Размер шрифта — выберите стандартный или крупный шрифт отображения данных на показателе.
    3. При необходимости настройте фильтрацию в группе полей Как отфильтровать. Например, в данном случае необходимо выводить внутреннюю ставку сотрудника в календарном году. Поэтому необходимо отфильтровать данные по колонке С, выбрав значение “Текущий год” (Рис. 5).
       Рис. 5 — Настройка графика

       
    4. Аналогичным образом настройте другие дашборды.
12. Примените изменения по кнопке Сохранить в левом верхнем углу дизайнера интерфейсов. Далее перейдите к настройке реестра приложения.

Настроить реестр 

1. В блоке Страницы перейдите на страницу “Финансовые компенсации list page”, созданную автоматически при добавлении приложения. Интерфейс страницы уже содержит минимальный набор компонентов. Каждый из элементов вы можете копировать, редактировать, перемещать или удалить. Например, гибкий контейнер с кнопкой “Добавить”, по которой выполняется добавление новой записи в раздел, сохраним для дальнейшего использования.
2. Добавьте кнопку “Сохранить”, по которой будет выполняться сохранение обновленных данных для расчета компенсаций в вашем приложении.
   1. Перетащите при помощи курсора в гибкий контейнер еще одну кнопку и расположите ее рядом с кнопкой “Добавить”.
   2. Откройте панель ее настроек, кликнув по значку шестеренки, который отобразится при наведении курсора на кнопку.
   3. В поле Заголовок укажите “Сохранить”.
   4. В поле Стиль выберите “Основной”.
   5. В поле Действие выберите ”Сохранить” (Рис. 6).

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

   Рис. 6 — Настройка кнопки

   
3. Настройте реестр раздела Финансовые компенсации:
4. Скройте добавленные автоматически колонки Дата создания и Создал по нажатию кнопки → Спрятать (Рис. 7).
   Рис. 7 — Скрытие колонки

   
5. Добавьте в реестр колонки Сотрудник, Должность сотрудника, Департамент и Период начисления. Для этого нажмите кнопку → отметьте нужные поля → нажмите Выбрать (Рис. 8).
   Рис. 8 — Добавление колонок

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