Регионы
Библиотека компонентов
http://n2oapp.net/framework/config/schema/region-3.0
#
Базовые свойстваАтрибуты
Наименование | Тип | Описание |
---|---|---|
id | Строка | Идентификатор региона |
src | React компонент | Реализация региона |
class | CSS класс | CSS класс региона |
style | CSS свойство | Стиль региона |
#
<region>Простой регион
Пример
<region> <table/> <tabs/> <form/></region>
Тело
Список регионов
Список виджетов
#
<line>Регион с горизонтальным делителем
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
label | Строка | Заголовок региона | |
collapsible | true false | Возможность раскрытия и сворачивания региона | true |
has-separator | true false | Отображение горизонтального делителя | true |
expand | true false | Исходное раскрытие региона | true |
Пример
<line collapsible="true" label="Line"> <table/> <panel/> <form/></line>
Тело
Список регионов
Список виджетов
#
<panel>Регион в виде панелей
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
collapsible | true false | Возможность раскрытия и сворачивания панели | true |
title | Строка | Заголовок панели | |
header | true false | Наличие заголовка | true |
icon | CSS класс | Класс иконки | |
color | Строка | Цвет панели | |
open | true false | Исходное раскрытие панели | true |
footer-title | Строка | Заголовок для подвала региона | |
routable | true false | Восстановление активных панелей по URL | true |
active-param | Строка | Имя параметра активной панели в URL | Значение id |
Пример
<panel collapsible="true" class="bg-primary"> <form/> <line/> <table/></panel>
Тело
Список регионов
Список виджетов
#
<tabs>Регион в виде вкладок
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
always-refresh | true false | Обновление данных при переключении между вкладками | false |
lazy | true false | Ленивая загрузка вкладок | true |
hide-single-tab | true false | Скрытие единственной доступной вкладки и отображение только ее содержимого | false |
max-height | Строка | Максимальная высота содержимого вкладок | |
scrollbar | true false | Отображение полосы прокрутки | false |
routable | true false | Восстановление активных вкладок по URL | true |
active-param | Строка | Имя параметра активной вкладки в URL | Значение id |
datasource | Ссылка на источник данных | Идентификатор источника данных, из которого будет взято значение для active-tab-field-id | |
active-tab-field-id | Ссылка на поле выборки | Идентификатор поля, значение которого задает id активной вкладки |
Пример
<tabs always-refresh="true"> <tab> <!-- Первая вкладка --> ... </tab> <tab> <!-- Вторая вкладка --> ... </tab></tabs>
Тело
<tab> - Вкладка
#
<tab>Вкладка
Атрибуты
Наименование | Тип | Описание |
---|---|---|
id | Строка | Идентификатор вкладки |
name | Строка | Наименование вкладки |
Пример
<tab id="tab1" name="Вкладка"> <form/> <panel/> <table/></tab>
Тело
Список регионов
Список виджетов
#
<scrollspy>Регион с отслеживанием прокрутки
Атрибуты
Наименование | Тип | Описание | Значение по умолчанию |
---|---|---|---|
active | Строка | Активный элемент по умолчанию | |
title | Строка | Заголовок меню | |
placement | left right | Сторона расположения меню | left |
headlines | true false | Наличие разделительной строки между блоками | false |
routable | true false | Восстановление активного элемента по URL | true |
active-param | Строка | Имя параметра активного элемента меню в URL | Значение id |
Пример
<scrollspy active="mi1" title="regionTitle" placement="right" headlines="true" routable="false"> <menu-item> ... </menu-item> <sub-menu> ... </sub-menu></scrollspy>
Тело
<menu-item> - Список элементов меню
<sub-menu> - Список вложенных меню
#
<menu-item>Элемент меню
Атрибуты
Наименование | Тип | Описание |
---|---|---|
id | Строка | Идентификатор элемента меню |
title | Строка | Заголовок элемента меню |
Пример
<menu-item id="mi1" title="First item title in the list"> <table/> <form/></menu-item>
Тело
Список регионов
Список виджетов
#
<sub-menu>Вложенное меню
Атрибуты
Наименование | Тип | Описание |
---|---|---|
id | Строка | Идентификатор вложенного меню |
title | Строка | Заголовок вложенного меню |
Пример
<sub-menu id="mi3" title="Third item title in the list"> <menu-item> ... </menu-item> <menu-item> ... </menu-item></sub-menu>
Тело
<menu-item> - Список элементов меню
<sub-menu> - Список вложенных меню