Настройка форм
Примечание
Функция доступна по запросу в поддержку: support@timetta.com.
Назначение
Настройка форм позволяет гибко управлять отображением элементов в карточках основных сущностей системы. Конфигурация задаётся в формате JSON и предоставляет следующие возможности:
- управление секциями: изменение структуры, заголовков и набора полей;
- точное позиционирование полей в сетке карточки;
- добавление текстовых подсказок для полей;
- стилизация элементов с помощью CSS-классов.
Примечание
Для доступа к настройке требуется набор прав для роли Администратор с активными правами для гранулы «Настройки менеджера объектов».
Использование
Чтобы изменить настройки формы:
- Перейдите в компоненту Менеджер сущностей.
- Найдите нужную сущность.
- Откройте вкладку Настройки формы:
В редакторе JSON доступны вспомогательные функции для работы с конфигурацией:
- Вставить системные настройки — заполняет поле редактора конфигурацией по умолчанию. Функция полезна для начала новой настройки или сброса изменений.
- Форматировать — автоматически приводит структуру конфигурации к читаемому виду, расставляя отступы и переносы строк.
Важно
Конфигурация в редакторе имеет приоритет над системными настройками. Если вы ранее вставили системные настройки и не меняли их, они останутся прежними, даже если стандартная конфигурация системы изменилась.
Чтобы получить актуальную версию формы, выполните одно из действий:
- очистите поле редактора JSON;
- нажмите «Вставить системные настройки» повторно.
Управление секциями
В карточке сущности поля сгруппированы по секциям для логической организации информации. Это упрощает навигацию для пользователей. Настройка форм позволяет адаптировать карточки, если стандартная компоновка не соответствует вашим рабочим процессам.
Возможности настройки секций:
- Переименование секции: измените значение свойства
header. - Скрытие заголовка: удалите свойство
header(секция станет статичной и потеряет возможность сворачиваться). - Перемещение секций: измените порядок объектов в JSON-массиве.
Настройки полей в секциях:
- Добавление полей: включите нужные поля в массив
fields. - Удаление полей: исключите ненужные поля из массива.
- Изменение порядка полей: расположите поля в массиве
fieldsв нужной последовательности. - Перемещение полей между секциями: перенесите поле из одной секции в другую.
Полный перечень полей доступен на вкладке Свойства карточки сущности в разделе Менеджер сущностей.
Важно
- Не удаляйте свойство
"type": "fields"— без него секция не отобразится. - Избегайте дублирования полей в массиве
fields— это приведёт к ошибке отображения карточки.
Пример конфигурации с двумя секциями, вторая секция не имеет свойства header:
[
{
"type": "fields",
"header": "Основное",
"fields": [
{
"name": "name",
},
{
"name": "manager"
},
{
"name": "description"
}
]
},
{
"type": "fields",
"fields": [
{
"name": "createdBy"
},
{
"name": "modifiedBy"
}
]
}
]
Настройка позиции полей
По умолчанию поля распределяются по двум колонкам: нечётные слева, чётные справа. В примере ниже поля createdBy и modifiedBy будут в левой колонке, а created и modified — в правой.
[
{
"type": "fields",
"header": "SYSTEM",
"fields": [
{
"name": "createdBy"
},
{
"name": "created"
},
{
"name": "modifiedBy"
},
{
"name": "modified"
}
]
},
]
Позицию можно указать точнее, задав для каждого поля свойство position, которое содержит несколько параметров:
row— номер строки (от 1 до N);column— позиция в колонке:1— левая колонка;1.5— правая половина левой колонки;2— правая колонка;2.5— правая половина правой колонки;
size— занимаемое место:0.5— половина колонки;1— целая колонка;1.5— полторы колонки;2— вся строка.
На иллюстрации показано, как свойства row, column и size определяют расположение поля:
В примере ниже поле corporateTaxRate займёт половину левой колонки в 3-й строке, а поле billingMode — всё оставшееся пространство в этой строке.
[
{
"type": "fields",
"header": "shared.groups.finance",
"fields": [
// ...
{
"name": "billingMode",
"position": {
"row": 3,
"column": 1.5,
"size": 1.5
},
},
// ...
{
"name": "corporateTaxRate",
"position": {
"row": 3,
"column": 1,
"size": 0.5
},
}
// ...
]
}
]
Добавление подсказок
Для любого поля можно добавить текстовую подсказку, добавив свойство hint с необходимым текстом.
[
{
"type": "fields",
"header": "Основное",
"fields": [
{
"name": "manager",
"hint": "Внимание: менеджер Кампании должен иметь доступ к клиентам!"
}
]
}
]
После этого подсказка отобразится в интерфейсе:
Стилизация с помощью CSS-классов
Вы можете стилизовать или выделить поле в карточке, добавив любой доступный класс из библиотеки Bootstrap. Для этого используется свойство className.
[
//...
{
"type": "fields",
"header": "shared2.groups.finance",
"fields": [
{
"name": "billingType",
"hint": "",
"className": "text-success"
},
{
"name": "currency",
"hint": "",
"className": "text-danger"
},
//...
]
},
//...
]
Так это выглядит в интерфейсе:
