Skip to main content

Регионы

Библиотека компонентов

http://n2oapp.net/framework/config/schema/region-3.0

Базовые свойства#

Атрибуты

НаименованиеТипОписание
idСтрокаИдентификатор региона
srcReact компонентРеализация региона
classCSS классCSS класс региона
styleCSS свойствоСтиль региона

<region>#

Простой регион

Пример

<region>  <table/>  <tabs/>  <form/></region>

Тело

Список регионов
Список виджетов

<line>#

Регион с горизонтальным делителем

Атрибуты

НаименованиеТипОписаниеЗначение по умолчанию
labelСтрокаЗаголовок региона
collapsibletrue falseВозможность раскрытия и сворачивания регионаtrue
has-separatortrue falseОтображение горизонтального делителяtrue
expandtrue falseИсходное раскрытие регионаtrue

Пример

<line collapsible="true" label="Line">  <table/>  <panel/>  <form/></line>

Тело

Список регионов
Список виджетов

<panel>#

Регион в виде панелей

Атрибуты

НаименованиеТипОписаниеЗначение по умолчанию
collapsibletrue falseВозможность раскрытия и сворачивания панелиtrue
titleСтрокаЗаголовок панели
headertrue falseНаличие заголовкаtrue
iconCSS классКласс иконки
colorСтрокаЦвет панели
opentrue falseИсходное раскрытие панелиtrue
footer-titleСтрокаЗаголовок для подвала региона
routabletrue falseВосстановление активных панелей по URLtrue
active-paramСтрокаИмя параметра активной панели в URLЗначение id

Пример

<panel collapsible="true" class="bg-primary">  <form/>  <line/>  <table/></panel>

Тело

Список регионов
Список виджетов

<tabs>#

Регион в виде вкладок

Атрибуты

НаименованиеТипОписаниеЗначение по умолчанию
always-refreshtrue falseОбновление данных при переключении между вкладкамиfalse
lazytrue falseЛенивая загрузка вкладокtrue
hide-single-tabtrue falseСкрытие единственной доступной вкладки и отображение только ее содержимогоfalse
max-heightСтрокаМаксимальная высота содержимого вкладок
scrollbartrue falseОтображение полосы прокруткиfalse
routabletrue falseВосстановление активных вкладок по URLtrue
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СтрокаЗаголовок меню
placementleft rightСторона расположения менюleft
headlinestrue falseНаличие разделительной строки между блокамиfalse
routabletrue falseВосстановление активного элемента по URLtrue
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> - Список вложенных меню